/* Load first — matches AssessMap font stack */
@import url("https://fonts.googleapis.com/css2?family=Inter:ital,opsz,wght@0,14..32,400..700;1,14..32,400..700&display=swap");

:root {
  --font-app: "Inter", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

html {
  font-family: var(--font-app);
}

button,
input,
select,
textarea,
optgroup {
  font-family: inherit;
}
:root {
  --font-sans: var(--font-app, "Plus Jakarta Sans", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif);

  /* Schoolise brand palette (marketing / logo references) */
  --color-brand-50: #f5f2ed;
  --color-brand-100: #ebe6dc;
  --color-brand-500: #8a7d6e;
  --color-brand-600: #5c5346;
  --color-brand-700: #433a32;
  --color-brand-900: #2c2825;

  --schoolise-navy-dark: #2c2825;
  --schoolise-navy: #2c2825;
  --schoolise-blue: #5c5346;
  --schoolise-teal: #2d6a4f;
  --schoolise-sky: #8a7d6e;

  /* Warm app shell */
  --st-canvas: #f9f8f4;
  --st-bg-primary: #ffffff;
  --st-bg-secondary: #f3f0ea;
  --st-bg-tertiary: #ebe4d8;
  --st-border-secondary: #ddd8cf;
  --st-border-tertiary: #e8e4dc;
  --st-border-mid: #c9c0b4;
  --st-text-primary: #1c1917;
  --st-text-secondary: #57534e;
  --st-text-tertiary: #78716c;
  --st-accent: #5c5346;
  --st-accent-strong: #433a32;
  --st-accent-hover: #4a4238;
  --st-accent-soft: #8a7d6e;
  --st-nav-accent: #2d6a4f;
  --st-nav-accent-muted: rgba(45, 106, 79, 0.35);
  --st-badge-active-bg: #dcefd0;
  --st-badge-active-fg: #2f6212;
  --st-navy: #1c1917;
  --st-blue-dark: #5c5346;
  --st-teal: #2d6a4f;
  --st-radius-sm: 6px;
  --st-radius-md: 8px;
  --st-radius-lg: 12px;

  --color-surface: var(--st-canvas);
  --color-surface-raised: var(--st-bg-primary);
  --color-border: var(--st-border-tertiary);
  --color-border-strong: var(--st-border-secondary);

  --color-text: var(--st-text-primary);
  --color-text-muted: var(--st-text-secondary);
  --color-text-inverse: #ffffff;

  /* Auth — warm executive palette */
  --auth-page-bg: #f3efe8;
  --auth-card-border: #e8e2d9;
  --auth-heading: #2c2825;
  --auth-text: #3d3834;
  --auth-muted: #6b6560;
  --auth-accent: var(--st-accent);
  --auth-accent-hover: var(--st-accent-strong);
  --auth-accent-ring: rgba(92, 83, 70, 0.22);
  --auth-header-band: #c4b8a4;
  --auth-cta: var(--st-accent-strong);
  --auth-cta-hover: #352e28;
  --auth-cta-shadow: rgba(44, 40, 37, 0.24);

  /* Status colours — slightly richer */
  --color-success: #15803d;
  --color-success-bg: #dcfce7;
  --color-warning: #b45309;
  --color-warning-bg: #fef3c7;
  --color-danger: #b91c1c;
  --color-danger-bg: #fee2e2;
  --color-info: #5c5346;
  --color-info-bg: #ebe6dc;

  --radius-sm: var(--st-radius-sm);
  --radius-md: var(--st-radius-md);
  --radius-lg: var(--st-radius-lg);
  --radius-xl: 1.25rem;

  --shadow-sm: 0 1px 2px rgba(28, 25, 23, 0.06);
  --shadow-md: 0 8px 24px rgba(28, 25, 23, 0.08);

  --sidebar-width: 15.5rem;
  --topbar-height: 4rem;
  --content-max-width: min(1680px, 100%);

  --space-1: 0.25rem;
  --space-2: 0.5rem;
  --space-3: 0.75rem;
  --space-4: 1rem;
  --space-5: 1.25rem;
  --space-6: 1.5rem;
  --space-8: 2rem;
}

*,
*::before,
*::after {
  box-sizing: border-box;
}

html {
  font-size: 16px;
}

html:has(body.app-has-topbar) {
  font-size: 106.25%;
}

body {
  margin: 0;
  font-family: var(--font-sans);
  color: var(--color-text);
  background: var(--color-surface);
  line-height: 1.5;
  -webkit-font-smoothing: antialiased;
}

a {
  color: var(--st-accent-strong);
  text-decoration: none;
}

a:hover {
  color: var(--st-accent-hover);
}

button,
input,
select {
  font: inherit;
}

.visually-hidden {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

/* Primary actions */
.btn-primary,
input[type="submit"].btn-primary,
button.btn-primary,
.students-index__btn.students-index__btn--primary,
input[type="submit"].students-index__btn.students-index__btn--primary {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.35rem;
  box-sizing: border-box;
  min-height: 2.25rem;
  height: auto;
  padding: 0.55rem 1rem;
  border-radius: var(--st-radius-md);
  border: 0.5px solid var(--st-accent-strong);
  background: var(--st-accent);
  color: #fff;
  font-weight: 500;
  font-size: 0.8125rem;
  line-height: 1.25;
  font-family: inherit;
  text-decoration: none;
  white-space: nowrap;
  cursor: pointer;
  transition: background 0.15s ease, border-color 0.15s ease;
}

.btn-primary:hover,
input[type="submit"].btn-primary:hover,
button.btn-primary:hover,
.students-index__btn.students-index__btn--primary:hover,
input[type="submit"].students-index__btn.students-index__btn--primary:hover {
  background: var(--st-accent-hover);
  color: #fff;
}

input[type="submit"].btn-primary:disabled,
button.btn-primary:disabled {
  opacity: 0.5;
  cursor: not-allowed;
}
.app-body {
  min-height: 100vh;
}

/* Password field show/hide toggle */
.pw-field {
  position: relative;
  display: block;
}

.pw-field > input {
  width: 100%;
  padding-right: 2.75rem;
}

.pw-toggle {
  position: absolute;
  top: 0;
  right: 0;
  height: 100%;
  width: 2.75rem;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0;
  border: 0;
  background: transparent;
  color: var(--color-text-muted, #78716c);
  cursor: pointer;
}

.pw-toggle:hover {
  color: var(--st-accent, #5c5346);
}

.pw-toggle:focus-visible {
  outline: 2px solid var(--st-nav-accent, #2d6a4f);
  outline-offset: -2px;
  border-radius: var(--radius-sm, 6px);
}

.pw-toggle__icon {
  display: block;
}

.pw-toggle__icon--hide {
  display: none;
}

.pw-field.is-visible .pw-toggle__icon--show {
  display: none;
}

.pw-field.is-visible .pw-toggle__icon--hide {
  display: block;
}

.visually-hidden {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

/* =========================
   Horizontal topbar
   ========================= */

.topbar {
  position: sticky;
  top: 0;
  z-index: 1000;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: var(--space-4);
  padding: 0 var(--space-6);
  height: var(--topbar-height);
  background: var(--st-canvas);
  border-bottom: 1px solid var(--st-border-tertiary);
  overflow: visible;
}

.topbar-left {
  display: flex;
  align-items: center;
  gap: var(--space-8);
  min-width: 0;
}

.topbar-brand-row {
  display: flex;
  align-items: center;
  gap: var(--space-3);
  min-width: 0;
}

.topbar-brand {
  display: flex;
  align-items: center;
  gap: var(--space-3);
  min-width: 0;
}

.topbar-brand__link {
  display: flex;
  align-items: center;
  gap: var(--space-3);
  text-decoration: none;
  color: var(--color-text);
  min-width: 0;
}

.topbar-brand__logo {
  width: 2rem;
  height: 2rem;
  object-fit: contain;
  flex-shrink: 0;
}

.topbar-brand__name {
  font-weight: 700;
  font-size: 1.1rem;
  color: var(--st-accent);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.org-switcher__form {
  margin: 0;
}

.org-switcher__hidden-form {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
}

.org-switcher__select {
  border: 1px solid var(--color-border);
  border-radius: var(--radius-sm);
  padding: var(--space-2) var(--space-3);
  background: var(--color-surface-raised);
  font-weight: 600;
  font-size: 0.95rem;
  color: var(--auth-heading);
  max-width: 14rem;
  min-height: 44px;
  cursor: pointer;
}

.org-switcher__select:focus {
  outline: none;
  border-color: var(--color-brand-500);
  box-shadow: 0 0 0 2px var(--auth-accent-ring);
}

.demo-explore-banner {
  background: #eef6f1;
  border-bottom: 1px solid #b7d7c4;
  padding: var(--space-2) var(--space-4);
}

.demo-explore-banner__inner {
  max-width: var(--content-max-width);
  margin: 0 auto;
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: var(--space-3);
  font-size: 0.875rem;
}

.demo-explore-banner__exit {
  min-height: 44px;
  padding: 0.35rem 0.75rem;
  border: 1px solid #2d6a4f;
  border-radius: var(--radius-sm);
  background: var(--color-surface-raised);
  font-weight: 600;
  font-family: inherit;
  cursor: pointer;
}

@media (max-width: 640px) {
  .demo-explore-banner__inner {
    flex-direction: column;
    align-items: stretch;
  }

  .demo-explore-banner__exit {
    width: 100%;
  }

  .org-switcher__select {
    max-width: min(100%, 16rem);
  }
}

/* Main navigation */

.main-nav {
  display: flex;
  align-items: center;
  gap: var(--space-5);
}

.main-nav__divider {
  width: 1px;
  align-self: stretch;
  margin: var(--space-2) 0;
  background: var(--color-border);
}

.main-nav__group-label {
  display: none;
}

/* Grouped nav dropdowns (People / Teaching / Settings) */

.nav-group {
  position: relative;
  display: inline-flex;
  align-items: center;
}

.nav-group__trigger {
  display: inline-flex;
  align-items: center;
  gap: var(--space-1);
  background: none;
  border: none;
  cursor: pointer;
  font-family: inherit;
  font-size: 0.875rem;
  font-weight: 500;
  line-height: 1.2;
  color: var(--color-text-muted);
  padding: var(--space-3) var(--space-1);
  border-bottom: 2px solid transparent;
  transition: color 0.15s ease;
}

.nav-group__trigger:hover {
  color: var(--st-nav-accent);
}

.nav-group__trigger.active {
  color: var(--st-nav-accent);
  font-weight: 600;
}

.nav-group__chevron {
  display: inline-flex;
  align-items: center;
  opacity: 0.55;
  transition: transform 0.15s ease;
}

.nav-group.is-open .nav-group__chevron {
  transform: rotate(180deg);
}

.nav-group__menu {
  position: absolute;
  left: 0;
  top: calc(100% + 0.35rem);
  background: var(--color-surface-raised);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
  box-shadow: var(--shadow-md);
  min-width: 12rem;
  padding: var(--space-2) 0;
  margin: 0;
  display: none;
  z-index: 1000;
}

.nav-group.is-open .nav-group__menu,
.nav-group:hover .nav-group__menu {
  display: block;
}

.nav-group__menu .nav-link {
  display: block;
  box-sizing: border-box;
  width: 100%;
  padding: var(--space-2) var(--space-4);
  font-size: 0.85rem;
  border-bottom: none;
  color: var(--color-text);
}

.nav-group__menu .nav-link:hover {
  background: var(--color-surface);
  color: var(--auth-heading);
  text-decoration: none;
}

.nav-group__menu .nav-link.active {
  color: var(--st-nav-accent);
  font-weight: 600;
  text-decoration: none;
  border-bottom: none;
}

.nav-link {
  text-decoration: none;
  font-size: 0.875rem;
  color: var(--color-text-muted);
  padding: var(--space-3) var(--space-1);
  line-height: 1.2;
  font-weight: 500;
  border-bottom: 2px solid transparent;
  text-decoration-thickness: 2px;
  text-underline-offset: 5px;
  transition: color 0.15s ease, border-color 0.15s ease, text-decoration-color 0.15s ease;
}

.nav-link:hover {
  color: var(--st-nav-accent);
  text-decoration: underline;
  text-decoration-color: var(--st-nav-accent-muted);
}

.nav-link.active {
  color: var(--st-nav-accent);
  font-weight: 600;
  border-bottom-color: transparent;
  text-decoration: underline;
  text-decoration-color: var(--st-nav-accent);
}

.nav-link.is-disabled {
  opacity: 0.45;
  cursor: not-allowed;
}

/* User dropdown */

.user-nav {
  position: relative;
}

.user-trigger {
  background: none;
  border: none;
  cursor: pointer;
  font-size: 0.875rem;
  color: var(--auth-heading);
  display: flex;
  align-items: center;
  gap: var(--space-2);
  font-weight: 600;
  padding: var(--space-2) var(--space-3);
  border-radius: var(--radius-md);
}

.user-trigger:hover {
  background: var(--st-bg-secondary);
}

.user-trigger .chevron {
  display: inline-flex;
  align-items: center;
  opacity: 0.55;
}

.user-dropdown {
  position: absolute;
  right: 0;
  top: calc(100% + 0.35rem);
  background: var(--color-surface-raised);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
  box-shadow: var(--shadow-md);
  min-width: 12rem;
  padding: var(--space-2) 0;
  margin: 0;
  list-style: none;
  display: none;
  z-index: 1000;
}

.user-nav:hover .user-dropdown,
.user-nav:focus-within .user-dropdown {
  display: block;
}

.user-dropdown__meta {
  padding: var(--space-2) var(--space-4);
  display: flex;
  flex-direction: column;
  gap: 0.15rem;
}

.user-dropdown__org {
  font-weight: 600;
  font-size: 0.875rem;
  color: var(--auth-heading);
}

.user-dropdown__role {
  font-size: 0.8125rem;
  color: var(--color-text-muted);
  text-transform: capitalize;
}

.user-dropdown .divider {
  height: 0;
  margin: var(--space-2) 0;
  padding: 0;
  border: none;
  border-top: 1px solid var(--color-border);
  list-style: none;
}

/* Shared dropdown menu items (links + logout button) */
.user-dropdown li > a,
.logout-button {
  display: block;
  box-sizing: border-box;
  width: 100%;
  padding: var(--space-2) var(--space-4);
  font-family: inherit;
  font-size: 0.85rem;
  font-weight: 500;
  line-height: 1.4;
  color: var(--color-text);
  text-align: left;
  text-decoration: none;
  background: none;
  border: none;
  cursor: pointer;
}

.user-dropdown li > a:hover,
.logout-button:hover {
  background: var(--color-surface);
  color: var(--auth-heading);
}

.logout-form {
  margin: 0;
}

/* Mobile nav toggle */

.topbar-nav-toggle {
  display: none;
  border: 1px solid var(--color-border);
  background: var(--color-surface-raised);
  border-radius: var(--radius-sm);
  padding: var(--space-2) var(--space-3);
  cursor: pointer;
}

.topbar-nav-toggle__icon,
.topbar-nav-toggle__bar,
.topbar-nav-toggle__icon::before,
.topbar-nav-toggle__icon::after {
  display: block;
  width: 1.1rem;
  height: 2px;
  background: var(--auth-heading);
  border-radius: 2px;
  position: relative;
}

.topbar-nav-toggle__icon::before,
.topbar-nav-toggle__icon::after {
  content: "";
  position: absolute;
  left: 0;
}

.topbar-nav-toggle__icon::before {
  top: -6px;
}

.topbar-nav-toggle__icon::after {
  top: 6px;
}

/* Content */

.main-content {
  padding: clamp(0.75rem, 2vw, 2rem);
  background: var(--color-surface);
  min-height: calc(100vh - var(--topbar-height));
}

.app-content {
  max-width: var(--content-max-width);
  width: 100%;
  margin: 0 auto;
}

.app-footer {
  padding: 1rem 2rem;
  background: #f9f8f4;
  border-top: 1px solid #e8e4dc;
  font-size: 0.85rem;
  color: #64748b;
  box-sizing: border-box;
  width: 100%;
  max-width: 100%;
  flex-shrink: 0;
}

.footer-inner {
  max-width: min(1680px, calc(100vw - 2rem));
  margin: auto;
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-wrap: wrap;
  gap: 0.5rem 1rem;
}

.footer-left,
.footer-center,
.footer-right { min-width: 0; }

.footer-right {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: flex-end;
  gap: 0.35rem 0.5rem;
}

.footer-sep { color: #94a3b8; user-select: none; }

.footer-right a { text-decoration: none; color: #64748b; }
.footer-right a:hover { color: #5c5346; }

@media (max-width: 767px) {
  .app-footer { padding: 0.85rem 1rem; }
  .footer-inner { flex-direction: column; align-items: center; gap: 0.45rem; text-align: center; max-width: 100%; }
  .footer-left, .footer-center, .footer-right { width: 100%; text-align: center; }
  .footer-center { order: 3; font-size: 0.8rem; line-height: 1.4; }
  .footer-right { justify-content: center; gap: 0.35rem 0.65rem; }
  .footer-right a { line-height: 1.4; }
}

@media (max-width: 479px) {
  .app-footer { padding: 0.75rem 0.85rem; font-size: 0.8125rem; }
  .footer-sep { display: none; }
  .footer-right { flex-direction: column; gap: 0.35rem; }
}

/* Responsive */

@media (max-width: 1024px) {
  .topbar {
    padding: 0 var(--space-4);
    gap: var(--space-3);
  }

  .topbar-left {
    gap: var(--space-5);
  }

  .main-nav {
    gap: var(--space-4);
  }

  .main-content {
    padding: var(--space-5);
  }
}

@media (max-width: 900px) {
  .topbar {
    flex-wrap: wrap;
    height: auto;
    min-height: var(--topbar-height);
    padding: var(--space-3) var(--space-4);
    align-items: center;
  }

  .topbar-left {
    flex: 1 1 auto;
    min-width: 0;
    gap: var(--space-3);
    justify-content: space-between;
  }

  .topbar-brand-row {
    flex: 1;
    min-width: 0;
    justify-content: space-between;
  }

  .topbar-brand__name {
    max-width: 10rem;
  }

  .org-switcher__select {
    max-width: 11rem;
    font-size: 0.875rem;
  }

  .topbar-nav-toggle {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
  }

  .user-nav {
    flex-shrink: 0;
  }

  .user-trigger__name {
    max-width: 7rem;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .main-nav {
    display: none;
    flex-direction: column;
    align-items: stretch;
    gap: 0;
    width: 100%;
    order: 3;
    padding-top: var(--space-2);
  }

  .main-nav.is-open {
    display: flex;
  }

  .main-nav .nav-link {
    padding: var(--space-3) var(--space-2);
    border-bottom: 1px solid var(--color-border);
  }

  .main-nav .nav-link.active {
    border-bottom-color: var(--color-border);
    border-left: 3px solid var(--auth-header-band);
    padding-left: calc(var(--space-2) - 3px);
  }

  .main-nav__divider {
    display: none;
  }

  .main-nav__group-label {
    display: none;
  }

  /* Grouped dropdowns collapse into full-width accordions in the mobile menu. */
  .nav-group {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    width: 100%;
  }

  .nav-group__trigger {
    justify-content: space-between;
    width: 100%;
    padding: var(--space-3) var(--space-2);
    border-bottom: 1px solid var(--color-border);
    font-size: 0.72rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: var(--color-text-muted, #6b7280);
  }

  .nav-group__menu,
  .nav-group:hover .nav-group__menu {
    position: static;
    display: none;
    min-width: 0;
    border: none;
    border-radius: 0;
    box-shadow: none;
    padding: 0;
    background: transparent;
  }

  .nav-group.is-open .nav-group__menu {
    display: block;
  }

  .nav-group__menu .nav-link {
    padding: var(--space-3) var(--space-4);
    border-bottom: 1px solid var(--color-border);
  }

  .nav-group__menu .nav-link.active {
    border-left: 3px solid var(--auth-header-band);
    padding-left: calc(var(--space-4) - 3px);
  }
}

@media (max-width: 640px) {
  .topbar {
    padding: var(--space-3);
  }

  .main-content {
    padding: var(--space-4);
  }

  .topbar-brand__name {
    display: none;
  }

  .org-switcher__select {
    max-width: 9.5rem;
  }

  .user-trigger {
    padding: var(--space-2);
    font-size: 0.875rem;
  }
}
/* Flash messages (global) — matches AssessMap pattern */

.flash-container {
  position: fixed;
  top: 1rem;
  left: 50%;
  transform: translateX(-50%);
  z-index: 9998;
  width: 100%;
  max-width: 720px;
  padding: 0 1rem;
  pointer-events: none;
}

body.app-has-topbar .flash-container {
  top: calc(var(--topbar-height) + 0.5rem);
}

.flash {
  pointer-events: auto;
  margin-bottom: 0.75rem;
  padding: 0.75rem 1rem;
  border-radius: var(--radius-md);
  border: 0.5px solid var(--color-border);
  background: var(--color-surface-raised);
  color: var(--color-text-muted);
  font-size: 0.875rem;
  font-weight: 500;
  line-height: 1.45;
  text-align: center;
  animation: flashFadeOut 6s forwards;
  box-shadow: var(--shadow-md);
}

.flash-notice,
.flash-success {
  background: var(--color-success-bg);
  border-color: #bbf7d0;
  color: #14532d;
}

.flash-alert,
.flash-error {
  background: var(--color-danger-bg);
  border-color: #fecaca;
  color: #7f1d1d;
}

.flash-warning {
  background: var(--color-warning-bg);
  border-color: #fcd34d;
  color: #78350f;
}

.flash-container--static {
  position: static;
  transform: none;
  left: auto;
  width: auto;
  max-width: 1100px;
  margin: 0 auto 1rem;
  padding: 0 1rem;
  pointer-events: auto;
}

.flash-container--auth {
  max-width: 520px;
  margin-bottom: 0.75rem;
  padding: clamp(0.75rem, 2vw, 1rem) clamp(0.75rem, 3vw, 1.5rem) 0;
  box-sizing: border-box;
}

@keyframes flashFadeOut {
  0% {
    opacity: 0;
    transform: translateY(-10px);
  }

  10% {
    opacity: 1;
    transform: translateY(0);
  }

  70% {
    opacity: 1;
    transform: translateY(0);
  }

  100% {
    opacity: 0;
    transform: translateY(0);
    pointer-events: none;
    visibility: hidden;
  }
}

@media (max-width: 640px) {
  .flash-container--auth {
    padding: 0.65rem 0.85rem 0;
  }

  .flash-container--auth .flash {
    text-align: left;
    font-size: 0.8125rem;
  }
}
/* Hover tooltips for icon actions — use data-tooltip on any interactive icon control */

[data-tooltip] {
  position: relative;
}

[data-tooltip]::after {
  content: attr(data-tooltip);
  position: absolute;
  bottom: calc(100% + 0.45rem);
  left: 50%;
  transform: translateX(-50%);
  padding: 0.28rem 0.5rem;
  border-radius: 5px;
  background: var(--st-accent-strong, #433a32);
  color: #fff;
  font-size: 0.7rem;
  font-weight: 600;
  line-height: 1.3;
  white-space: nowrap;
  pointer-events: none;
  opacity: 0;
  visibility: hidden;
  z-index: 30;
  transition: opacity 0.12s ease, visibility 0.12s ease;
}

[data-tooltip]::before {
  content: "";
  position: absolute;
  bottom: calc(100% + 0.15rem);
  left: 50%;
  transform: translateX(-50%);
  border: 4px solid transparent;
  border-top-color: var(--st-accent-strong, #433a32);
  pointer-events: none;
  opacity: 0;
  visibility: hidden;
  z-index: 30;
  transition: opacity 0.12s ease, visibility 0.12s ease;
}

[data-tooltip]:hover::after,
[data-tooltip]:hover::before,
[data-tooltip]:focus-visible::after,
[data-tooltip]:focus-visible::before {
  opacity: 1;
  visibility: visible;
}

/* Top bar controls sit against the viewport edge — show tooltips below, not above */
.topbar [data-tooltip] {
  overflow: visible;
}

.topbar [data-tooltip]::after {
  bottom: auto;
  top: calc(100% + 0.5rem);
  padding: 0.4rem 0.7rem;
  font-size: 0.8125rem;
  font-weight: 600;
  line-height: 1.35;
  white-space: nowrap;
  box-shadow: 0 4px 14px rgba(28, 25, 23, 0.2);
  z-index: 1100;
}

.topbar [data-tooltip]::before {
  bottom: auto;
  top: calc(100% + 0.14rem);
  border-top-color: transparent;
  border-bottom-color: var(--st-accent-strong, #433a32);
  z-index: 1100;
}

/* Table action columns: show tooltips to the left to avoid clipping */
.cl-row-actions [data-tooltip]::after,
.sr-actions [data-tooltip]::after,
.contacts-index__actions [data-tooltip]::after,
.contact-card-actions [data-tooltip]::after,
.ar-actions [data-tooltip]::after,
.sr-room-table__actions [data-tooltip]::after {
  bottom: 50%;
  left: auto;
  right: calc(100% + 0.45rem);
  transform: translateY(50%);
}

.cl-row-actions [data-tooltip]::before,
.sr-actions [data-tooltip]::before,
.contacts-index__actions [data-tooltip]::before,
.contact-card-actions [data-tooltip]::before,
.ar-actions [data-tooltip]::before,
.sr-room-table__actions [data-tooltip]::before {
  bottom: 50%;
  left: auto;
  right: calc(100% + 0.15rem);
  transform: translateY(50%);
  border-top-color: transparent;
  border-left-color: var(--st-accent-strong, #433a32);
}

@media (max-width: 640px) {
  [data-tooltip]::after,
  [data-tooltip]::before {
    display: none;
  }
}
.dashboard {
  width: 100%;
  max-width: 1540px;
  margin: 0 auto;
  color: var(--color-text);
}

.dashboard__header {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: var(--space-6);
  margin-bottom: var(--space-6);
}

.dashboard__heading {
  min-width: 0;
}

.dashboard__date,
.dashboard-card__eyebrow {
  margin: 0 0 0.35rem;
  color: var(--st-nav-accent);
  font-size: 0.72rem;
  font-weight: 750;
  letter-spacing: 0.075em;
  text-transform: uppercase;
}

.dashboard__title {
  margin: 0;
  font-size: clamp(1.65rem, 2vw, 2.15rem);
  font-weight: 750;
  letter-spacing: -0.035em;
  line-height: 1.15;
}

.dashboard__subtitle {
  margin: 0.4rem 0 0;
  color: var(--color-text-muted);
  font-size: 0.925rem;
}

.dashboard__actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: var(--space-2);
}

.dashboard-action {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  min-height: 2.6rem;
  padding: 0.55rem 0.9rem;
  border: 1px solid transparent;
  border-radius: var(--radius-md);
  font-size: 0.82rem;
  font-weight: 700;
  line-height: 1;
  text-decoration: none;
  transition: border-color 160ms ease, background 160ms ease, transform 160ms ease;
}

.dashboard-action:hover {
  transform: translateY(-1px);
}

.dashboard-action svg {
  width: 1rem;
  height: 1rem;
  stroke-width: 1.9;
}

.dashboard-action--primary {
  background: var(--st-nav-accent);
  color: #fff;
  box-shadow: 0 5px 14px rgba(14, 96, 137, 0.18);
}

.dashboard-action--primary:hover {
  color: #fff;
  filter: brightness(0.96);
}

.dashboard-action--secondary {
  border-color: var(--st-border-secondary);
  background: var(--st-bg-primary);
  color: var(--color-text);
}

.dashboard-action--secondary:hover {
  border-color: var(--st-nav-accent);
  color: var(--st-nav-accent);
}

.dashboard__alerts {
  display: grid;
  gap: var(--space-3);
  margin-bottom: var(--space-5);
}

.dashboard__alerts:empty {
  display: none;
}

.dashboard-customise__panel {
  display: grid;
  grid-template-columns: minmax(15rem, 1fr) minmax(15rem, 1.4fr) auto;
  gap: 1rem;
  align-items: center;
  margin-bottom: var(--space-5);
  padding: 0.9rem 1rem;
  border: 1px solid #b9d1c2;
  border-radius: var(--radius-lg);
  background: #f2f7f3;
  box-shadow: var(--shadow-sm);
}

.dashboard-customise__panel[hidden] {
  display: none;
}

.dashboard-customise__panel h2 {
  margin: 0;
  font-size: 0.84rem;
}

.dashboard-customise__panel p {
  margin: 0.2rem 0 0;
  color: var(--color-text-muted);
  font-size: 0.7rem;
}

.dashboard-customise__hidden {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.4rem;
}

.dashboard-customise__hidden > span:first-child {
  color: var(--color-text-muted);
  font-size: 0.68rem;
  font-weight: 700;
}

.dashboard-customise__restore,
.dashboard-customise__reset {
  min-height: 1.9rem;
  padding: 0.32rem 0.6rem;
  border: 1px solid var(--st-border-secondary);
  border-radius: 999px;
  background: var(--st-bg-primary);
  color: var(--color-text);
  font-size: 0.67rem;
  font-weight: 700;
  cursor: pointer;
}

.dashboard-customise__restore:hover {
  border-color: #8fb39e;
  color: var(--st-nav-accent);
}

.dashboard-customise__none {
  display: none;
  color: var(--color-text-muted);
  font-size: 0.67rem;
}

.dashboard-customise__panel--empty .dashboard-customise__none {
  display: inline;
}

.dashboard-customise__panel-actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 0.65rem;
}

.dashboard-customise__reset {
  border-color: transparent;
  background: transparent;
  color: var(--color-text-muted);
}

.dashboard-customise__reset:hover {
  color: var(--st-nav-accent);
}

.dashboard-customise__status {
  min-width: 3rem;
  color: var(--color-text-muted);
  font-size: 0.65rem;
  text-align: right;
}

.dashboard-customise__status--error {
  color: var(--color-danger);
}

.dashboard__alerts .portal-announcements,
.dashboard__alerts .dashboard-reminders {
  margin: 0;
}

.dashboard__alerts .portal-announcements {
  border-color: #e7dcae;
  border-radius: var(--radius-lg);
  box-shadow: none;
}

.dashboard-summary {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  margin-bottom: var(--space-5);
  overflow: hidden;
  border: 1px solid var(--st-border-tertiary);
  border-radius: var(--radius-lg);
  background: var(--st-bg-primary);
  box-shadow: var(--shadow-sm);
}

.dashboard-summary__item {
  display: flex;
  align-items: center;
  gap: var(--space-3);
  min-width: 0;
  padding: 1rem 1.1rem;
  border-right: 1px solid var(--st-border-tertiary);
}

.dashboard-summary__item:last-child {
  border-right: 0;
}

.dashboard-summary__icon {
  display: grid;
  flex: 0 0 auto;
  place-items: center;
  width: 2.35rem;
  height: 2.35rem;
  border-radius: 0.7rem;
  background: #edf6fa;
  color: var(--st-nav-accent);
}

.dashboard-summary__icon--teachers {
  background: #f0f5ef;
  color: #52704e;
}

.dashboard-summary__icon--guardians {
  background: #f7f2fb;
  color: #775493;
}

.dashboard-summary__icon--classes {
  background: #fff4e8;
  color: #a15b1b;
}

.dashboard-summary__icon--courses {
  background: #f2f3f7;
  color: #596175;
}

.dashboard-summary__icon svg {
  width: 1.2rem;
  height: 1.2rem;
  stroke-width: 1.7;
}

.dashboard-summary__content {
  display: flex;
  min-width: 0;
  flex-direction: column;
}

.dashboard-summary__content strong {
  font-size: 1.2rem;
  line-height: 1.15;
}

.dashboard-summary__content span {
  overflow: hidden;
  color: var(--color-text-muted);
  font-size: 0.75rem;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.dashboard-layout {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--space-4);
  align-items: start;
}

.dashboard-card {
  position: relative;
  min-width: 0;
  overflow: hidden;
  border: 1px solid var(--st-border-tertiary);
  border-radius: var(--radius-lg);
  background: var(--st-bg-primary);
  box-shadow: var(--shadow-sm);
}

.dashboard-widget--wide {
  grid-column: 1 / -1;
}

.dashboard-widget[hidden] {
  display: none;
}

.dashboard-widget__controls {
  position: absolute;
  z-index: 3;
  top: 0.72rem;
  right: 0.72rem;
  display: none;
  align-items: center;
  gap: 0.2rem;
  padding: 0.2rem;
  border: 1px solid var(--st-border-secondary);
  border-radius: 0.55rem;
  background: var(--st-bg-primary);
  box-shadow: 0 3px 10px rgba(28, 25, 23, 0.08);
}

.dashboard--customising .dashboard-widget__controls {
  display: flex;
}

.dashboard--customising .dashboard-widget {
  outline: 1px dashed #8fb39e;
  outline-offset: 3px;
}

.dashboard--customising .dashboard-widget:hover {
  outline-color: var(--st-nav-accent);
}

.dashboard--customising .dashboard-card__header {
  padding-right: 9.5rem;
}

.dashboard--customising .dashboard-card__count,
.dashboard--customising .dashboard-card__total,
.dashboard--customising .dashboard-card__link {
  visibility: hidden;
}

.dashboard-widget--dragging {
  opacity: 0.55;
  outline: 2px solid var(--st-nav-accent) !important;
}

.dashboard-widget__control {
  display: grid;
  place-items: center;
  width: 1.75rem;
  height: 1.75rem;
  padding: 0;
  border: 0;
  border-radius: 0.35rem;
  background: transparent;
  color: var(--color-text-muted);
  font-size: 0.8rem;
  font-weight: 800;
  cursor: pointer;
}

.dashboard-widget__control:hover {
  background: var(--st-bg-secondary);
  color: var(--st-nav-accent);
}

.dashboard-widget__control svg {
  width: 0.9rem;
  height: 0.9rem;
  stroke-width: 2;
}

.dashboard-widget__drag-handle {
  cursor: grab;
}

.dashboard-widget__drag-handle:active {
  cursor: grabbing;
}

.dashboard-widget__control--hide:hover {
  color: var(--color-danger);
}

.dashboard-card__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-3);
  min-height: 4.15rem;
  padding: 0.85rem 1.15rem;
  border-bottom: 1px solid var(--st-border-tertiary);
}

.dashboard-card__header .dashboard-card__eyebrow {
  margin-bottom: 0.2rem;
  font-size: 0.65rem;
}

.dashboard-card__title {
  margin: 0;
  font-size: 0.94rem;
  font-weight: 720;
  letter-spacing: -0.01em;
}

.dashboard-card__count,
.dashboard-card__total,
.dashboard-work__count {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 1.75rem;
  height: 1.75rem;
  padding: 0 0.45rem;
  border-radius: 999px;
  background: #edf6fa;
  color: var(--st-nav-accent);
  font-size: 0.75rem;
  font-weight: 750;
}

.dashboard-card__total {
  background: var(--st-bg-secondary);
  color: var(--color-text-muted);
}

.dashboard-card__link {
  display: grid;
  place-items: center;
  width: 2rem;
  height: 2rem;
  border-radius: 50%;
  color: var(--color-text-muted);
}

.dashboard-card__link:hover {
  background: var(--st-bg-secondary);
  color: var(--st-nav-accent);
}

.dashboard-card__link svg {
  width: 1rem;
  height: 1rem;
  stroke-width: 2;
}

.dashboard-card__body {
  padding: 1rem 1.15rem;
}

.dashboard-card__body--flush {
  padding: 0;
}

.dashboard-schedule,
.dashboard-upcoming,
.dashboard-list,
.dashboard-reminders__list {
  margin: 0;
  padding: 0;
  list-style: none;
}

.dashboard-schedule__item {
  display: grid;
  grid-template-columns: 4.5rem 0.75rem minmax(0, 1fr) auto;
  gap: var(--space-3);
  align-items: center;
  min-height: 5.2rem;
  padding: 0.8rem 1.15rem;
  border-bottom: 1px solid var(--st-border-tertiary);
}

.dashboard-schedule__item:last-child {
  border-bottom: 0;
}

.dashboard-schedule__time {
  display: flex;
  flex-direction: column;
  color: var(--color-text-muted);
  font-size: 0.7rem;
}

.dashboard-schedule__time strong {
  color: var(--color-text);
  font-size: 0.8rem;
}

.dashboard-schedule__marker {
  position: relative;
  align-self: stretch;
  width: 1px;
  margin: 0 auto;
  background: var(--st-border-secondary);
}

.dashboard-schedule__marker::before {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 0.55rem;
  height: 0.55rem;
  border: 2px solid var(--st-bg-primary);
  border-radius: 50%;
  background: var(--st-nav-accent);
  box-shadow: 0 0 0 1px var(--st-nav-accent);
  content: "";
  transform: translate(-50%, -50%);
}

.dashboard-schedule__details {
  min-width: 0;
}

.dashboard-schedule__title,
.dashboard-upcoming__title,
.dashboard-list__title {
  display: block;
  overflow: hidden;
  color: var(--color-text);
  font-size: 0.85rem;
  font-weight: 700;
  line-height: 1.35;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.dashboard-schedule__meta {
  display: flex;
  flex-wrap: wrap;
  gap: 0.25rem 0.8rem;
  margin-top: 0.25rem;
  color: var(--color-text-muted);
  font-size: 0.72rem;
}

.status-pill {
  display: inline-flex;
  align-items: center;
  padding: 0.22rem 0.52rem;
  border-radius: 999px;
  font-size: 0.62rem;
  font-weight: 750;
  letter-spacing: 0.035em;
  text-transform: uppercase;
  white-space: nowrap;
}

.status-pill--scheduled {
  background: var(--color-info-bg);
  color: var(--color-info);
}

.status-pill--in_progress {
  background: var(--color-warning-bg);
  color: #8a5410;
}

.status-pill--completed {
  background: var(--color-success-bg);
  color: #24613b;
}

.status-pill--cancelled {
  background: var(--color-danger-bg);
  color: #8a3232;
}

.dashboard-upcoming {
  display: grid;
  gap: 0.15rem;
}

.dashboard-upcoming__item {
  display: grid;
  grid-template-columns: 2.65rem minmax(0, 1fr);
  gap: var(--space-3);
  align-items: center;
  padding: 0.65rem 0;
  border-bottom: 1px solid var(--st-border-tertiary);
}

.dashboard-upcoming__item:last-child {
  border-bottom: 0;
}

.dashboard-upcoming__date {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  width: 2.65rem;
  height: 2.65rem;
  border-radius: 0.65rem;
  background: var(--st-bg-secondary);
  color: var(--color-text-muted);
  font-size: 0.61rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  line-height: 1;
  text-transform: uppercase;
}

.dashboard-upcoming__date strong {
  margin-bottom: 0.18rem;
  color: var(--color-text);
  font-size: 0.95rem;
}

.dashboard-upcoming__time {
  display: block;
  margin-top: 0.18rem;
  color: var(--color-text-muted);
  font-size: 0.7rem;
}

.dashboard-attendance {
  display: grid;
  grid-template-columns: minmax(7.5rem, 0.8fr) minmax(7rem, 1fr);
  gap: 1rem;
  align-items: center;
}

.dashboard-attendance__donut {
  position: relative;
  width: min(100%, 8.5rem);
  aspect-ratio: 1;
  margin: 0 auto;
  border-radius: 50%;
  background: conic-gradient(
    #4b9b68 0 var(--attendance-present),
    #d36b67 var(--attendance-present) calc(var(--attendance-present) + var(--attendance-absent)),
    #d59a3a calc(var(--attendance-present) + var(--attendance-absent)) calc(var(--attendance-present) + var(--attendance-absent) + var(--attendance-late)),
    #6899bd calc(var(--attendance-present) + var(--attendance-absent) + var(--attendance-late)) 360deg
  );
}

.dashboard-attendance__donut--empty {
  background: var(--st-bg-tertiary);
}

.dashboard-attendance__donut::after {
  position: absolute;
  inset: 17%;
  border-radius: 50%;
  background: var(--st-bg-primary);
  box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.025);
  content: "";
}

.dashboard-attendance__centre {
  position: absolute;
  z-index: 1;
  inset: 24%;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  border-radius: 50%;
}

.dashboard-attendance__centre strong {
  font-size: 1.25rem;
  line-height: 1;
}

.dashboard-attendance__centre span {
  margin-top: 0.25rem;
  color: var(--color-text-muted);
  font-size: 0.62rem;
}

.dashboard-attendance__legend {
  display: grid;
  gap: 0.25rem;
}

.dashboard-attendance__item {
  display: grid;
  grid-template-columns: auto 1fr auto;
  align-items: center;
  gap: 0.5rem;
  min-width: 0;
  padding: 0.32rem 0;
}

.dashboard-attendance__dot {
  width: 0.5rem;
  height: 0.5rem;
  border-radius: 50%;
  background: #4b9b68;
}

.dashboard-attendance__item--absent .dashboard-attendance__dot {
  background: #d36b67;
}

.dashboard-attendance__item--late .dashboard-attendance__dot {
  background: #d59a3a;
}

.dashboard-attendance__item--excused .dashboard-attendance__dot {
  background: #6899bd;
}

.dashboard-attendance__item strong {
  font-size: 0.75rem;
  line-height: 1;
}

.dashboard-attendance__item > span:nth-child(2) {
  overflow: hidden;
  color: var(--color-text-muted);
  font-size: 0.7rem;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.dashboard-heatmap {
  min-width: 0;
}

.dashboard-heatmap__days,
.dashboard-heatmap__grid {
  display: grid;
  grid-template-columns: repeat(7, minmax(0, 1fr));
  gap: 0.34rem;
}

.dashboard-heatmap__days {
  margin-bottom: 0.35rem;
  color: var(--color-text-muted);
  font-size: 0.58rem;
  font-weight: 700;
  text-align: center;
}

.dashboard-heatmap__grid {
  grid-template-rows: repeat(4, 1fr);
}

.dashboard-heatmap__cell {
  display: block;
  width: 100%;
  aspect-ratio: 1;
  border: 1px solid rgba(45, 106, 79, 0.05);
  border-radius: 0.25rem;
  background: var(--st-bg-secondary);
}

.dashboard-heatmap__cell--1 {
  background: #dfece4;
}

.dashboard-heatmap__cell--2 {
  background: #bad4c4;
}

.dashboard-heatmap__cell--3 {
  background: #7fac91;
}

.dashboard-heatmap__cell--4 {
  background: var(--st-nav-accent);
}

.dashboard-heatmap__cell--today {
  outline: 2px solid var(--color-text);
  outline-offset: 1px;
}

.dashboard-heatmap__footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.4rem;
  margin-top: 0.7rem;
  color: var(--color-text-muted);
  font-size: 0.58rem;
}

.dashboard-heatmap__scale {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.22rem;
}

.dashboard-heatmap__scale .dashboard-heatmap__cell {
  width: 0.55rem;
  height: 0.55rem;
  aspect-ratio: auto;
}

.dashboard-work {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.dashboard-work__section {
  min-width: 0;
  padding: 1rem 1.15rem;
}

.dashboard-work__section + .dashboard-work__section {
  border-left: 1px solid var(--st-border-tertiary);
}

.dashboard-work__heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-2);
  margin-bottom: 0.75rem;
}

.dashboard-work__heading h3 {
  margin: 0;
  font-size: 0.75rem;
  font-weight: 750;
  letter-spacing: 0.045em;
  text-transform: uppercase;
}

.dashboard-work__link {
  display: inline-flex;
  align-items: center;
  gap: 0.15rem;
  color: var(--color-text-muted);
  font-size: 0.7rem;
  font-weight: 700;
  text-decoration: none;
}

.dashboard-work__link:hover {
  color: var(--st-nav-accent);
}

.dashboard-work__link svg {
  width: 0.8rem;
  height: 0.8rem;
  stroke-width: 2;
}

.dashboard-work__count {
  min-width: 1.4rem;
  height: 1.4rem;
  font-size: 0.65rem;
}

.dashboard-list {
  display: grid;
  gap: 0.65rem;
}

.dashboard-list li {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 0.6rem;
  align-items: start;
}

.dashboard-list__marker {
  width: 0.48rem;
  height: 0.48rem;
  margin-top: 0.35rem;
  border: 1px solid #75a3bd;
  border-radius: 50%;
  background: #eaf4f8;
}

.dashboard-list__marker--assessment {
  border-color: #b79a69;
  background: #fbf2df;
}

.dashboard-list__content {
  display: block;
  min-width: 0;
}

.dashboard-list__content > span {
  display: block;
  margin-top: 0.12rem;
  color: var(--color-text-muted);
  font-size: 0.68rem;
}

.dashboard-work__empty {
  margin: 0;
  color: var(--color-text-muted);
  font-size: 0.78rem;
}

.dashboard-work__section--chart {
  display: flex;
  min-height: 12rem;
  flex-direction: column;
}

.dashboard-week-chart {
  display: flex;
  min-height: 0;
  flex: 1;
  flex-direction: column;
}

.dashboard-week-chart__plot {
  display: grid;
  min-height: 7.5rem;
  flex: 1;
  grid-template-columns: repeat(7, minmax(0, 1fr));
  gap: 0.45rem;
  align-items: stretch;
}

.dashboard-week-chart__day {
  display: grid;
  min-width: 0;
  grid-template-rows: 1rem minmax(4.5rem, 1fr) 1rem;
  gap: 0.3rem;
  align-items: end;
  color: var(--color-text-muted);
  text-align: center;
}

.dashboard-week-chart__value {
  font-size: 0.65rem;
  font-weight: 700;
  line-height: 1;
}

.dashboard-week-chart__track {
  position: relative;
  display: block;
  height: 100%;
  min-height: 4.5rem;
  overflow: hidden;
  border-radius: 0.35rem 0.35rem 0.15rem 0.15rem;
  background:
    linear-gradient(to top, transparent calc(33.33% - 1px), var(--st-border-tertiary) 33.33%, transparent calc(33.33% + 1px)),
    linear-gradient(to top, transparent calc(66.66% - 1px), var(--st-border-tertiary) 66.66%, transparent calc(66.66% + 1px)),
    var(--st-bg-secondary);
}

.dashboard-week-chart__bar {
  position: absolute;
  right: 18%;
  bottom: 0;
  left: 18%;
  height: var(--dashboard-bar-height);
  min-height: 2px;
  border-radius: 0.3rem 0.3rem 0.12rem 0.12rem;
  background: #84ab96;
  transition: height 180ms ease, background 180ms ease;
}

.dashboard-week-chart__day--today .dashboard-week-chart__bar {
  background: var(--st-nav-accent);
  box-shadow: 0 -3px 10px rgba(45, 106, 79, 0.16);
}

.dashboard-week-chart__label {
  overflow: hidden;
  font-size: 0.62rem;
  font-weight: 650;
  line-height: 1;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.dashboard-week-chart__day--today .dashboard-week-chart__label,
.dashboard-week-chart__day--today .dashboard-week-chart__value {
  color: var(--st-nav-accent);
  font-weight: 800;
}

.dashboard-week-chart__caption {
  margin: 0.7rem 0 0;
  color: var(--color-text-muted);
  font-size: 0.67rem;
  line-height: 1.35;
}

.dashboard-hours {
  margin-top: 1rem;
  padding-top: 0.9rem;
  border-top: 1px solid var(--st-border-tertiary);
}

.dashboard-hours__heading,
.dashboard-hours__meta,
.dashboard-hours__footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.65rem;
}

.dashboard-hours__heading {
  margin-bottom: 0.7rem;
}

.dashboard-hours__heading h4 {
  margin: 0;
  font-size: 0.72rem;
  font-weight: 750;
}

.dashboard-hours__heading > span {
  color: var(--color-text-muted);
  font-size: 0.62rem;
}

.dashboard-hours__list {
  display: grid;
  gap: 0.72rem;
  margin: 0;
  padding: 0;
  list-style: none;
}

.dashboard-hours__title {
  overflow: hidden;
  color: var(--color-text);
  font-size: 0.7rem;
  font-weight: 700;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.dashboard-hours__meta > span,
.dashboard-hours__footer {
  color: var(--color-text-muted);
  font-size: 0.59rem;
}

.dashboard-hours__meta > span {
  flex: 0 0 auto;
}

.dashboard-hours__track {
  height: 0.42rem;
  margin: 0.3rem 0;
  overflow: hidden;
  border-radius: 999px;
  background: var(--st-bg-tertiary);
}

.dashboard-hours__track > span {
  display: block;
  width: var(--dashboard-hours-width);
  height: 100%;
  border-radius: inherit;
  background: #6f9e83;
}

.dashboard-hours__item--approaching .dashboard-hours__track > span {
  background: #d19a45;
}

.dashboard-hours__item--exceeded .dashboard-hours__track > span {
  background: #c86560;
}

.dashboard-hours__footer strong {
  color: var(--color-text);
  font-size: 0.62rem;
}

.dashboard-hours__item--approaching .dashboard-hours__footer strong {
  color: #9a641a;
}

.dashboard-hours__item--exceeded .dashboard-hours__footer strong {
  color: #a83e3a;
}

.dashboard-hours__empty {
  margin: 0;
  color: var(--color-text-muted);
  font-size: 0.68rem;
}

.dashboard-empty {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 12rem;
  flex-direction: column;
  gap: var(--space-2);
  padding: var(--space-5);
  color: var(--color-text-muted);
  text-align: center;
}

.dashboard-empty--compact {
  min-height: 8rem;
}

.dashboard-empty p {
  margin: 0;
  font-size: 0.8rem;
}

.dashboard-empty__icon {
  display: grid;
  place-items: center;
  width: 2.5rem;
  height: 2.5rem;
  border-radius: 50%;
  background: var(--st-bg-secondary);
}

.dashboard-empty__icon svg {
  width: 1.15rem;
  height: 1.15rem;
  stroke-width: 1.6;
}

.dashboard-reminders {
  overflow: hidden;
  border: 1px solid #ead3ad;
  border-radius: var(--radius-lg);
  background: #fffdf8;
}

.dashboard-reminders__header {
  display: flex;
  align-items: center;
  gap: 0.7rem;
  padding: 0.75rem 1rem;
  border-bottom: 1px solid #eee0c7;
  background: #fff9ed;
}

.dashboard-reminders__icon {
  display: grid;
  place-items: center;
  color: #9b671d;
}

.dashboard-reminders__icon svg {
  width: 1.15rem;
  height: 1.15rem;
  stroke-width: 1.8;
}

.dashboard-reminders__header > div {
  display: flex;
  align-items: center;
  gap: 0.5rem;
}

.dashboard-reminders__header h2 {
  margin: 0;
  color: #6e4c19;
  font-size: 0.82rem;
}

.dashboard-reminders__header > div > span {
  display: grid;
  place-items: center;
  min-width: 1.35rem;
  height: 1.35rem;
  border-radius: 999px;
  background: #f2dfba;
  color: #74501b;
  font-size: 0.65rem;
  font-weight: 750;
}

.dashboard-reminders__list li {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-4);
  padding: 0.8rem 1rem;
  border-bottom: 1px solid #f0e6d4;
}

.dashboard-reminders__list li:last-child {
  border-bottom: 0;
}

.dashboard-reminders__title {
  color: var(--color-text);
  font-size: 0.82rem;
  font-weight: 700;
}

.dashboard-reminders__list p {
  margin: 0.2rem 0 0;
  color: var(--color-text-muted);
  font-size: 0.72rem;
}

.dashboard-reminders__action {
  padding: 0.42rem 0.65rem;
  border: 1px solid #d9bd8c;
  border-radius: var(--radius-sm);
  background: #fff;
  color: #76501a;
  font-size: 0.7rem;
  font-weight: 700;
  cursor: pointer;
}

/* The student/guardian portal retains its own compact widget dashboard. */
.portal-dashboard .dashboard-grid {
  display: grid;
  grid-template-columns: repeat(12, 1fr);
  gap: var(--space-4);
}

.portal-dashboard .widget {
  grid-column: span 4;
  display: flex;
  min-height: 12rem;
  overflow: hidden;
  flex-direction: column;
  border: 1px solid var(--st-border-tertiary);
  border-radius: var(--radius-lg);
  background: var(--st-bg-primary);
  box-shadow: var(--shadow-sm);
}

.portal-dashboard .widget--wide {
  grid-column: span 8;
}

.portal-dashboard .widget__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-3);
  padding: var(--space-4) var(--space-5);
  border-bottom: 1px solid var(--st-border-tertiary);
  background: var(--st-bg-secondary);
}

.portal-dashboard .widget__title {
  margin: 0;
  font-size: 0.875rem;
  font-weight: 650;
}

.portal-dashboard .widget__badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 1.5rem;
  height: 1.5rem;
  padding: 0 var(--space-2);
  border-radius: 999px;
  background: var(--st-badge-active-bg);
  color: var(--st-badge-active-fg);
  font-size: 0.75rem;
  font-weight: 700;
}

.portal-dashboard .widget__body {
  padding: var(--space-4) var(--space-5);
  flex: 1;
}

.portal-dashboard .widget__empty {
  margin: 0;
  color: var(--color-text-muted);
  font-size: 0.875rem;
}

.portal-dashboard .lesson-list,
.portal-dashboard .compact-list {
  display: flex;
  margin: 0;
  padding: 0;
  flex-direction: column;
  gap: var(--space-3);
  list-style: none;
}

.portal-dashboard .lesson-list__item {
  display: grid;
  grid-template-columns: 4.5rem 1fr;
  gap: var(--space-3);
  align-items: center;
  padding-bottom: var(--space-3);
  border-bottom: 1px solid var(--color-border);
}

.portal-dashboard .lesson-list__item:last-child {
  padding-bottom: 0;
  border-bottom: 0;
}

.portal-dashboard .lesson-list__time {
  color: var(--st-nav-accent);
  font-size: 0.875rem;
  font-weight: 650;
}

.portal-dashboard .lesson-list__details {
  display: flex;
  flex-direction: column;
  gap: 0.125rem;
  font-size: 0.875rem;
}

.portal-dashboard .lesson-list__title {
  display: block;
  font-weight: 700;
}

.portal-dashboard .lesson-list__meta,
.portal-dashboard .compact-list__date {
  color: var(--color-text-muted);
  font-size: 0.8125rem;
}

.portal-dashboard .compact-list__item {
  display: flex;
  justify-content: space-between;
  gap: var(--space-3);
  font-size: 0.875rem;
}

.portal-dashboard .compact-list__label {
  font-weight: 500;
}

.portal-dashboard .compact-list__date {
  white-space: nowrap;
}

.portal-dashboard .stat-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: var(--space-3);
}

.portal-dashboard .stat-card {
  display: flex;
  padding: var(--space-4);
  flex-direction: column;
  gap: var(--space-1);
  border-radius: var(--radius-md);
  background: var(--st-bg-secondary);
}

.portal-dashboard .stat-card__value {
  font-size: 1.5rem;
  font-weight: 700;
  line-height: 1;
}

.portal-dashboard .stat-card__label {
  font-size: 0.75rem;
  font-weight: 650;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.portal-dashboard .stat-card--present {
  background: var(--color-success-bg);
  color: #14532d;
}

.portal-dashboard .stat-card--absent {
  background: var(--color-danger-bg);
  color: #7f1d1d;
}

.portal-dashboard .stat-card--late {
  background: var(--color-warning-bg);
  color: #92400e;
}

.portal-dashboard .stat-card--excused {
  background: var(--color-info-bg);
  color: var(--color-info);
}

.portal-dashboard .count-list {
  display: flex;
  margin: 0;
  flex-direction: column;
  gap: var(--space-2);
}

.portal-dashboard .count-list__row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: var(--space-2) 0;
  border-bottom: 1px solid var(--color-border);
  font-size: 0.875rem;
}

.portal-dashboard .count-list__row:last-child {
  border-bottom: 0;
}

.portal-dashboard .count-list__row dt {
  color: var(--color-text-muted);
}

.portal-dashboard .count-list__row dd {
  margin: 0;
  font-weight: 700;
}

.lesson-show .gs-card + .gs-card {
  margin-top: 1rem;
}

@media (max-width: 1100px) {
  .portal-dashboard .widget,
  .portal-dashboard .widget--wide {
    grid-column: span 6;
  }

  .dashboard-summary {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .dashboard-summary__item:nth-child(3) {
    border-right: 0;
  }

  .dashboard-summary__item:nth-child(n + 4) {
    border-top: 1px solid var(--st-border-tertiary);
  }

  .dashboard-customise__panel {
    grid-template-columns: 1fr;
  }

  .dashboard-customise__panel-actions {
    justify-content: flex-start;
  }
}

@media (max-width: 820px) {
  .dashboard__header {
    align-items: flex-start;
    flex-direction: column;
  }

  .dashboard__actions {
    justify-content: flex-start;
  }

  .dashboard-layout {
    grid-template-columns: 1fr;
  }

  .dashboard-widget--wide {
    grid-column: auto;
  }
}

@media (max-width: 620px) {
  .portal-dashboard .widget,
  .portal-dashboard .widget--wide {
    grid-column: span 12;
  }

  .portal-dashboard .lesson-list__item {
    grid-template-columns: 1fr;
  }

  .dashboard-summary {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .dashboard-summary__item {
    border-top: 1px solid var(--st-border-tertiary);
  }

  .dashboard-summary__item:nth-child(-n + 2) {
    border-top: 0;
  }

  .dashboard-summary__item:nth-child(odd) {
    border-right: 1px solid var(--st-border-tertiary);
  }

  .dashboard-summary__item:nth-child(even) {
    border-right: 0;
  }

  .dashboard-summary__item:last-child {
    grid-column: span 2;
    border-right: 0;
  }

  .dashboard-schedule__item {
    grid-template-columns: 3.9rem 0.65rem minmax(0, 1fr);
  }

  .dashboard-schedule__item .status-pill {
    display: none;
  }

  .dashboard-work {
    grid-template-columns: 1fr;
  }

  .dashboard-work__section + .dashboard-work__section {
    border-top: 1px solid var(--st-border-tertiary);
    border-left: 0;
  }

  .dashboard-reminders__list li {
    align-items: flex-start;
    flex-direction: column;
  }
}

@media (max-width: 420px) {
  .dashboard__actions,
  .dashboard-action {
    width: 100%;
  }

  .dashboard--customising .dashboard-card__header {
    min-height: 6.4rem;
    padding-top: 3.4rem;
    padding-right: 1.15rem;
  }

  .dashboard-widget__controls {
    right: auto;
    left: 0.72rem;
  }

  .dashboard-summary__item {
    padding: 0.8rem;
  }

  .dashboard-summary__icon {
    width: 2rem;
    height: 2rem;
  }

  .dashboard-schedule__item {
    grid-template-columns: 1fr;
    gap: 0.3rem;
  }

  .dashboard-schedule__time {
    flex-direction: row;
    gap: 0.35rem;
  }

  .dashboard-schedule__marker {
    display: none;
  }
}
/* =========================
   AUTH PAGES (LOGIN / SIGNUP)
   ========================= */

.auth-html,
html:has(body.auth-body) {
  min-height: 100%;
  min-height: 100dvh;
  height: auto;
  background-color: var(--auth-page-bg);
}

.auth-body {
  display: block;
  min-height: 100%;
  min-height: 100dvh;
  height: auto;
  background-color: var(--auth-page-bg);
  font-family: var(--font-sans);
  color: var(--auth-text);
}

.auth-container {
  width: 100%;
  max-width: 520px;
  margin: 0 auto;
  padding: clamp(2rem, 5vw, 3.5rem) 1.5rem clamp(2.5rem, 6vw, 4rem);
  box-sizing: border-box;
}

.auth-container--sign-in {
  max-width: 480px;
}

.auth-body .auth-card {
  background: #ffffff;
  border-radius: var(--radius-md);
  border: 1px solid var(--auth-card-border);
  border-top: 4px solid var(--auth-header-band);
  box-shadow: var(--shadow-md);
  padding: 2rem 2.25rem 2.25rem;
}

.auth-logo {
  --auth-logo-max-height: clamp(100px, 24vw, 180px);
  text-align: center;
  margin-bottom: 1.25rem;
}

.auth-logo--large {
  --auth-logo-max-height: clamp(120px, 32vw, 220px);
}

.auth-logo__img,
.auth-logo img {
  display: block;
  margin-inline: auto;
  max-width: 100%;
  width: auto;
  height: auto;
  max-height: var(--auth-logo-max-height);
  object-fit: contain;
}

.auth-page__title {
  text-align: center;
  font-size: 1.4rem;
  margin: 0 0 1.25rem;
  font-weight: 700;
  color: var(--auth-heading);
  letter-spacing: -0.02em;
  line-height: 1.3;
}

.auth-page__intro {
  margin: -0.65rem 0 1.15rem;
  text-align: center;
  font-size: 0.875rem;
  line-height: 1.5;
  color: var(--auth-muted);
}

.auth-field-hint {
  margin: -0.15rem 0 0.45rem;
  font-size: 0.8125rem;
  line-height: 1.45;
  color: var(--auth-muted);
}

.auth-body .auth-card label,
.auth-body .field label {
  display: block;
  font-size: 0.9375rem;
  font-weight: 600;
  color: var(--auth-heading);
  margin-bottom: 0.35rem;
}

.auth-body .field {
  margin-bottom: 0.85rem;
}

.auth-body .auth-card input[type="email"],
.auth-body .auth-card input[type="password"],
.auth-body .auth-card input[type="text"],
.auth-body .auth-card select {
  width: 100%;
  box-sizing: border-box;
  padding: 0.65rem 0.85rem;
  border-radius: var(--radius-md);
  border: 1px solid var(--auth-card-border);
  font-size: 0.95rem;
  line-height: 1.4;
  color: var(--auth-text);
  background: #fff;
}

.auth-body .auth-card input:focus,
.auth-body .auth-card select:focus {
  outline: none;
  border-color: var(--auth-accent);
  box-shadow: 0 0 0 2px var(--auth-accent-ring);
}

.auth-body .field--remember {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  margin-bottom: 1rem;
}

.auth-body .field--remember label {
  margin: 0;
  font-weight: 500;
  font-size: 0.875rem;
}

.auth-body .field--remember input[type="checkbox"] {
  width: auto;
}

.auth-body .field--hcaptcha {
  margin-top: 0.25rem;
  margin-bottom: 1rem;
}

.auth-body .hcaptcha-widget {
  min-height: 78px;
}

.auth-body .auth-card .actions input[type="submit"] {
  width: 100%;
  margin-top: 0.5rem;
  padding: 0.75rem;
  border: none;
  border-radius: var(--radius-md);
  background: var(--auth-cta);
  color: #ffffff;
  font-weight: 600;
  font-size: 0.9375rem;
  cursor: pointer;
  transition: background 0.15s ease;
}

.auth-body .auth-card .actions input[type="submit"]:hover {
  background: var(--auth-cta-hover);
}

.auth-links {
  margin-top: 1.25rem;
  text-align: center;
  font-size: 0.85rem;
}

.auth-links--stack {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.55rem;
}

.auth-links a {
  color: var(--auth-accent);
  font-weight: 500;
  text-decoration: none;
}

.auth-links a:hover {
  color: var(--auth-accent-hover);
  text-decoration: underline;
}

.auth-errors {
  background: var(--color-danger-bg);
  border: 1px solid #fecaca;
  color: #991b1b;
  padding: 0.75rem;
  border-radius: var(--radius-md);
  margin-bottom: 1rem;
  font-size: 0.85rem;
}

.auth-errors ul {
  margin: 0.5rem 0 0;
  padding-left: 1.25rem;
}

.auth-errors h2 {
  margin: 0;
  font-size: 0.9rem;
}

/* Sign-up: split brand panel + sectioned form */
.auth-body--signup {
  background-color: var(--auth-page-bg);
}

.auth-signup {
  display: grid;
  min-height: 100dvh;
  align-content: start;
  grid-template-columns: minmax(260px, 5fr) minmax(320px, 7fr);
  align-items: stretch;
  padding: clamp(1.25rem, 2.5vw, 1.75rem);
  box-sizing: border-box;
}

.auth-signup__brand {
  grid-column: 1;
  grid-row: 1;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-end;
  min-width: 0;
  overflow-x: clip;
  padding: clamp(1.25rem, 3vh, 2rem) clamp(0.85rem, 1.5vw, 1.15rem) 0 clamp(1.25rem, 3vw, 2rem);
  background: linear-gradient(165deg, var(--schoolise-navy-dark) 0%, var(--schoolise-blue) 52%, var(--schoolise-teal) 100%);
  color: #ffffff;
  border-radius: var(--radius-lg);
}

.auth-signup__brand-stack {
  display: flex;
  flex-direction: column;
  gap: 0;
  width: 100%;
  max-width: 100%;
  box-sizing: border-box;
}

.auth-signup__brand-divider {
  flex-shrink: 0;
  height: 1px;
  margin: 0.7rem 1.15rem;
  background: linear-gradient(
    90deg,
    transparent,
    rgba(255, 255, 255, 0.45) 18%,
    rgba(255, 255, 255, 0.45) 82%,
    transparent
  );
}

.auth-signup__logo-wrap {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  padding: 1.35rem 1.25rem;
  border-radius: var(--radius-lg);
  background: #ffffff;
  border: 1px solid rgba(255, 255, 255, 0.9);
  box-shadow: 0 8px 28px rgba(0, 0, 0, 0.22);
  box-sizing: border-box;
}

.auth-signup__logo {
  display: block;
  width: 100%;
  max-width: 100%;
  height: auto;
  object-fit: contain;
}

.auth-signup__benefits-wrap {
  width: 100%;
  padding: 1.2rem 1.35rem 1.25rem;
  border-radius: var(--radius-lg);
  background: rgba(255, 255, 255, 0.1);
  border: 1px solid rgba(255, 255, 255, 0.18);
  box-sizing: border-box;
}

.auth-signup__benefits-heading {
  margin: 0 0 0.95rem;
  font-size: 0.6875rem;
  font-weight: 700;
  letter-spacing: 0.11em;
  text-transform: uppercase;
  text-align: center;
  color: var(--schoolise-teal);
}

.auth-signup__benefits {
  list-style: none;
  padding: 0;
  margin: 0;
  width: 100%;
}

.auth-signup__benefits li {
  display: flex;
  align-items: flex-start;
  gap: 0.75rem;
  margin-bottom: 0.85rem;
  text-align: left;
}

.auth-signup__benefits li:last-child {
  margin-bottom: 0;
}

.auth-signup__benefit-marker {
  flex-shrink: 0;
  width: 1.4rem;
  height: 1.4rem;
  margin-top: 0.1rem;
  border-radius: 50%;
  background: var(--schoolise-teal);
  color: #ffffff;
  font-size: 0.72rem;
  font-weight: 700;
  line-height: 1.4rem;
  text-align: center;
}

.auth-signup__benefit-text {
  flex: 1;
  font-size: clamp(0.9375rem, 1.4vw, 1.0625rem);
  line-height: 1.45;
  font-weight: 500;
  color: rgba(255, 255, 255, 0.92);
}

.auth-signup__main {
  display: contents;
}

.auth-signup__card {
  grid-column: 2;
  grid-row: 1;
  align-self: start;
  width: 100%;
  max-width: 580px;
  justify-self: center;
  margin: 0;
  box-sizing: border-box;
}

.auth-body--signup .auth-signup__card.auth-card {
  background: #ffffff;
  border: 1px solid var(--auth-card-border);
  border-top: 4px solid var(--auth-header-band);
  border-radius: var(--radius-lg);
  padding: 1.75rem 1.75rem 1.35rem;
  box-shadow: var(--shadow-md);
}

.auth-signup__header {
  margin-bottom: 1rem;
}

.auth-signup__title {
  font-size: 1.35rem;
  font-weight: 700;
  color: var(--auth-heading);
  margin: 0 0 0.25rem;
  text-align: left;
  letter-spacing: -0.02em;
}

.auth-signup__subtitle {
  margin: 0;
  font-size: 0.9375rem;
  line-height: 1.5;
  font-weight: 500;
  color: var(--auth-muted);
}

.auth-signup-form .field {
  margin-bottom: 0.75rem;
}

.auth-signup-form label {
  display: block;
  font-size: 0.9375rem;
  font-weight: 600;
  color: var(--auth-heading);
  margin-bottom: 0.35rem;
}

.auth-signup-form__section {
  margin-bottom: 0;
  padding-bottom: 0.85rem;
  border-bottom: 1px solid var(--auth-card-border);
}

.auth-signup-form__section + .auth-signup-form__section {
  margin-top: 0.85rem;
}

.auth-signup-form__section:last-of-type {
  padding-bottom: 0;
  border-bottom: none;
}

.auth-signup-form__section-title {
  margin: 0 0 0.75rem;
  font-size: 0.75rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--schoolise-teal);
}

.auth-signup-form__row {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.55rem 0.85rem;
  margin-bottom: 0;
}

.auth-signup-form__row > .field {
  margin-bottom: 0;
}

.auth-signup-form__actions {
  margin-top: 0.85rem;
}

.auth-body--signup .auth-signup__card.auth-card .auth-signup-form__actions input[type="submit"] {
  background: var(--auth-cta);
  border: none;
  border-radius: var(--radius-md);
  box-shadow: 0 3px 14px var(--auth-cta-shadow);
  color: #ffffff;
  font-size: 1rem;
  font-weight: 700;
  padding: 0.85rem 1rem;
  width: 100%;
  cursor: pointer;
}

.auth-body--signup .auth-signup__card.auth-card .auth-signup-form__actions input[type="submit"]:hover {
  background: var(--auth-cta-hover);
}

.auth-signup__footer-link {
  margin-top: 1rem;
  padding-top: 0.85rem;
  border-top: 1px solid var(--auth-card-border);
  text-align: center;
}

@media (max-width: 960px) {
  .auth-signup {
    grid-template-columns: 1fr;
    padding: 1.35rem 1.25rem 1.25rem;
  }

  .auth-signup__brand {
    grid-column: 1;
    grid-row: 1;
    align-self: start;
    align-items: stretch;
    padding: clamp(1rem, 2.5vh, 1.5rem) 0 0;
  }

  .auth-signup__main {
    display: block;
    grid-column: 1;
    grid-row: 2;
    min-width: 0;
    margin-top: 0.85rem;
  }

  .auth-signup__card {
    grid-column: auto;
    grid-row: auto;
    max-width: none;
    justify-self: stretch;
  }

  .auth-signup__logo {
    max-width: min(100%, 440px);
    margin-inline: auto;
  }
}

@media (max-width: 540px) {
  .auth-signup-form__row {
    grid-template-columns: 1fr;
  }

  .auth-body .auth-card {
    padding: 1.5rem 1.25rem 1.5rem;
  }
}

/* =========================
   STAGING ACCESS GATE
   ========================= */

.staging-gate {
  position: fixed;
  inset: 0;
  z-index: 10000;
  display: grid;
  place-items: center;
  padding: 1.25rem;
}

.staging-gate__backdrop {
  position: absolute;
  inset: 0;
  background: rgba(42, 36, 31, 0.55);
  backdrop-filter: blur(2px);
}

.staging-gate__panel {
  position: relative;
  z-index: 1;
  width: min(100%, 400px);
  background: #ffffff;
  border-radius: var(--radius-md);
  border: 1px solid var(--auth-card-border);
  border-top: 4px solid var(--auth-header-band);
  box-shadow: var(--shadow-md);
  padding: 1.75rem 1.75rem 1.85rem;
}

.staging-gate__title {
  margin: 0 0 0.5rem;
  font-size: 1.25rem;
  font-weight: 700;
  color: var(--auth-heading);
  letter-spacing: -0.02em;
}

.staging-gate__desc {
  margin: 0 0 1.15rem;
  font-size: 0.9rem;
  line-height: 1.45;
  color: var(--auth-muted);
}

.staging-gate__error {
  margin: 0 0 1rem;
  padding: 0.65rem 0.75rem;
  border-radius: var(--radius-sm, 8px);
  background: #fdecea;
  color: #8a1f11;
  font-size: 0.875rem;
  font-weight: 600;
}

.staging-gate__form .field {
  margin-bottom: 1rem;
}

.staging-gate__form label {
  display: block;
  margin-bottom: 0.35rem;
  font-size: 0.875rem;
  font-weight: 600;
  color: var(--auth-heading);
}

.staging-gate__form input[type="password"] {
  width: 100%;
  box-sizing: border-box;
  padding: 0.7rem 0.85rem;
  border: 1px solid var(--auth-card-border);
  border-radius: var(--radius-sm, 8px);
  font-size: 1rem;
  font-family: inherit;
}

.staging-gate__form input[type="password"]:focus {
  outline: 2px solid color-mix(in srgb, var(--auth-header-band) 35%, transparent);
  border-color: var(--auth-header-band);
}

.staging-gate__submit {
  width: 100%;
  appearance: none;
  border: 0;
  border-radius: var(--radius-sm, 8px);
  padding: 0.75rem 1rem;
  font-size: 0.95rem;
  font-weight: 700;
  font-family: inherit;
  cursor: pointer;
  color: #fff;
  background: var(--auth-header-band);
}

.staging-gate__submit:hover {
  filter: brightness(0.95);
}

body.auth-body:has(.staging-gate) .auth-container,
body.auth-body:has(.staging-gate) .auth-signup {
  pointer-events: none;
  user-select: none;
}
/* Support requests (sr-*) — customer portal */

.bl-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.4rem;
  min-height: 2.75rem;
  padding: 0.5rem 0.9rem;
  border-radius: var(--radius-md);
  font-size: 0.875rem;
  font-weight: 600;
  font-family: inherit;
  text-decoration: none;
  cursor: pointer;
}

.bl-btn--ghost {
  border: 1px solid var(--color-border);
  background: var(--color-surface-raised);
  color: var(--color-text);
}

.bl-btn--ghost:hover {
  background: var(--color-surface);
}

.bl-card {
  background: var(--color-surface-raised);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-sm);
  overflow: hidden;
}

.bl-table-wrap {
  overflow-x: auto;
}

.bl-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 0.875rem;
}

.bl-table__th {
  text-align: left;
  padding: var(--space-3) var(--space-4);
  border-bottom: 1px solid var(--color-border);
  color: var(--color-text-muted);
  font-weight: 600;
  font-size: 0.6875rem;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  white-space: nowrap;
}

.bl-table__td {
  padding: var(--space-3) var(--space-4);
  border-bottom: 1px solid var(--color-border);
  vertical-align: middle;
}

.bl-table__row:hover .bl-table__td {
  background: var(--color-surface);
}

.bl-table__td--subject strong {
  font-weight: 600;
  color: var(--color-text);
}

.bl-table__td--muted {
  color: var(--color-text-muted);
  font-variant-numeric: tabular-nums;
}

.bl-table__td--nowrap {
  white-space: nowrap;
}

/* Page shell */
.sr-page {
  display: flex;
  flex-direction: column;
  gap: var(--space-5);
  max-width: var(--content-max-width);
}

.sr-page__header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: var(--space-4);
}

.sr-page__title-row {
  display: flex;
  align-items: center;
  gap: var(--space-3);
  min-width: 0;
}

.sr-page__title-row > div:last-child {
  min-width: 0;
}

.sr-page__icon {
  width: 2.75rem;
  height: 2.75rem;
  border-radius: var(--radius-md);
  background: linear-gradient(135deg, var(--color-brand-50) 0%, #eef5eb 100%);
  color: var(--schoolise-blue);
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  border: 1px solid var(--color-brand-100);
}

.sr-page__title {
  margin: 0 0 var(--space-1);
  font-size: 1.5rem;
  font-weight: 700;
  line-height: 1.25;
  color: var(--auth-heading);
  letter-spacing: -0.02em;
}

.sr-page__subtitle {
  margin: 0;
  font-size: 0.875rem;
  color: var(--color-text-muted);
  line-height: 1.45;
}

.sr-page__actions {
  display: flex;
  align-items: center;
  gap: var(--space-2);
  flex-shrink: 0;
}

.sr-empty {
  padding: var(--space-8) var(--space-5);
  text-align: center;
}

.sr-empty__text {
  margin: 0 0 var(--space-4);
  color: var(--color-text-muted);
  font-size: 0.875rem;
}

/* Filters */
.sr-filters {
  display: flex;
  gap: var(--space-3);
  flex-wrap: wrap;
}

.sr-filters__select {
  min-height: 2.5rem;
  padding: 0.45rem 2rem 0.45rem 0.75rem;
  border: 1px solid var(--color-border);
  border-radius: var(--radius-sm);
  font-size: 0.875rem;
  font-family: inherit;
  background: var(--color-surface-raised);
  color: var(--color-text);
  cursor: pointer;
  appearance: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='%2364748b' d='M6 8L1 3h10z'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 0.65rem center;
}

.sr-filters__select:focus {
  outline: none;
  border-color: var(--color-brand-500);
  box-shadow: 0 0 0 2px var(--auth-accent-ring);
}

.sr-sort-link {
  text-decoration: none;
  color: var(--schoolise-blue);
  font-weight: 700;
}

.sr-sort-link:hover {
  text-decoration: underline;
}

/* Status badges */
.sr-status {
  display: inline-block;
  font-size: 0.6875rem;
  font-weight: 700;
  padding: 0.2rem 0.6rem;
  border-radius: 999px;
  text-transform: uppercase;
  letter-spacing: 0.03em;
}

.sr-status--open {
  background: var(--color-success-bg);
  color: var(--color-success);
}

.sr-status--in_progress {
  background: var(--color-warning-bg);
  color: var(--color-warning);
}

.sr-status--resolved {
  background: #e0e7ff;
  color: #4338ca;
}

.sr-actions {
  display: flex;
  align-items: center;
  gap: 0.25rem;
  line-height: 0;
}

.sr-actions .cl-icon-btn--edit:hover {
  background: #eef2ff;
  color: #4f46e5;
  border-color: #c7d2fe;
}

/* Meta / body / thread */
.sr-meta-card {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-6);
  background: var(--color-surface);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
  padding: var(--space-4) var(--space-5);
}

.sr-meta-card__item {
  min-width: 6rem;
}

.sr-meta-card__label {
  font-size: 0.6875rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--color-text-muted);
  margin-bottom: var(--space-1);
}

.sr-meta-card__value {
  font-size: 0.875rem;
  font-weight: 600;
}

.sr-body-card {
  background: var(--color-surface-raised);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
  padding: var(--space-5);
}

.sr-body-card__pre {
  margin: 0;
  white-space: pre-wrap;
  font-family: inherit;
  font-size: 0.875rem;
  line-height: 1.65;
  color: var(--color-text);
}

.sr-attachments {
  margin-top: var(--space-1);
}

.sr-attachments__label,
.sr-section-label {
  font-size: 0.6875rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--color-text-muted);
  margin-bottom: var(--space-3);
}

.sr-attachments__list {
  margin: 0;
  padding-left: var(--space-5);
}

.sr-attachments__link {
  color: var(--schoolise-blue);
  font-weight: 500;
}

.sr-thread {
  margin-top: var(--space-2);
}

.sr-thread__empty {
  margin: 0 0 var(--space-4);
  color: var(--color-text-muted);
  font-size: 0.875rem;
}

.sr-thread__list {
  list-style: none;
  margin: 0 0 var(--space-4);
  padding: 0;
}

.sr-comment {
  padding: var(--space-4);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
  margin-bottom: var(--space-3);
  background: var(--color-surface-raised);
}

.sr-comment--support {
  background: var(--color-brand-50);
  border-color: var(--color-brand-100);
}

.sr-comment__meta {
  font-size: 0.8125rem;
  color: var(--color-text-muted);
  margin-bottom: var(--space-2);
}

.sr-comment__body {
  white-space: pre-wrap;
  font-size: 0.875rem;
  line-height: 1.55;
}

.sr-reply-card {
  padding: var(--space-5);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
  background: var(--color-surface-raised);
}

.sr-reply-card__title {
  font-weight: 700;
  font-size: 0.875rem;
  margin-bottom: var(--space-3);
}

.sr-reply-card__error {
  margin: 0 0 var(--space-3);
  padding: var(--space-3);
  background: var(--color-danger-bg);
  color: var(--color-danger);
  border-radius: var(--radius-sm);
  font-size: 0.875rem;
}

.sr-reply-card__field-label {
  display: block;
  font-size: 0.8125rem;
  font-weight: 600;
  margin-bottom: var(--space-2);
  color: var(--color-text);
}

.sr-reply-card__textarea {
  width: 100%;
  min-height: 7rem;
  padding: var(--space-3);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-sm);
  font-family: inherit;
  font-size: 0.875rem;
  line-height: 1.5;
  resize: vertical;
  margin-bottom: var(--space-3);
}

.sr-reply-card__textarea:focus {
  outline: none;
  border-color: var(--color-brand-500);
  box-shadow: 0 0 0 2px var(--auth-accent-ring);
}

/* Edit form */
.sr-edit-card {
  background: var(--color-surface-raised);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
  padding: var(--space-5);
  display: flex;
  flex-direction: column;
  gap: var(--space-4);
}

.sr-edit-card__row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--space-4);
}

.sr-edit-card__label {
  display: block;
  font-size: 0.8125rem;
  font-weight: 600;
  margin-bottom: var(--space-1);
}

.sr-edit-card__input,
.sr-edit-card__select,
.sr-edit-card__textarea {
  width: 100%;
  padding: var(--space-2) var(--space-3);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-sm);
  font-family: inherit;
  font-size: 0.875rem;
}

.sr-edit-card__input:focus,
.sr-edit-card__select:focus,
.sr-edit-card__textarea:focus {
  outline: none;
  border-color: var(--color-brand-500);
  box-shadow: 0 0 0 2px var(--auth-accent-ring);
}

.sr-edit-card__section-label {
  font-size: 0.6875rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--color-text-muted);
}

.sr-edit-card__no-attachments {
  margin: 0;
  color: var(--color-text-muted);
  font-size: 0.875rem;
}

.sr-edit-card__actions {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-3);
  align-items: center;
  padding-top: var(--space-2);
}

.sr-danger-zone {
  margin-top: var(--space-5);
  padding-top: var(--space-5);
  border-top: 1px solid var(--color-border);
}

.sr-danger-zone__btn {
  min-height: 2.75rem;
  padding: 0.5rem 1rem;
  border: 1px solid var(--color-danger);
  border-radius: var(--radius-sm);
  background: var(--color-danger-bg);
  color: var(--color-danger);
  font-weight: 600;
  font-family: inherit;
  cursor: pointer;
}

/* Support access card */
.sa-card {
  background: linear-gradient(180deg, var(--color-surface-raised) 0%, var(--color-surface) 100%);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
  padding: var(--space-5);
  box-shadow: var(--shadow-sm);
}

.sr-support-access-card__heading {
  margin: 0 0 var(--space-2);
  font-size: 1rem;
  font-weight: 700;
  color: var(--auth-heading);
}

.sa-card__intro {
  margin: 0 0 var(--space-4);
  color: var(--color-text-muted);
  font-size: 0.875rem;
  line-height: 1.55;
}

.sa-card__active-notice {
  margin: 0 0 var(--space-3);
  padding: var(--space-3);
  background: var(--color-warning-bg);
  border-radius: var(--radius-sm);
  font-size: 0.875rem;
  color: var(--color-text);
}

.sa-token-reveal {
  margin-bottom: var(--space-3);
}

.sa-token-reveal__notice {
  margin: 0 0 var(--space-2);
  font-size: 0.875rem;
  font-weight: 600;
  color: var(--color-warning);
}

.sa-token-reveal__code {
  display: block;
  padding: var(--space-3) var(--space-4);
  background: var(--color-surface-raised);
  border: 1px dashed var(--color-border-strong);
  border-radius: var(--radius-sm);
  word-break: break-all;
  font-size: 0.8125rem;
  font-family: ui-monospace, monospace;
  line-height: 1.5;
}

.sa-token-reveal__expiry {
  margin: var(--space-2) 0 0;
  font-size: 0.8125rem;
  color: var(--color-text-muted);
}

.support-access-actions {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-3);
  margin-top: var(--space-4);
}

.btn-support-revoke {
  min-height: 2.75rem;
  padding: 0.55rem 1rem;
  border: 1px solid var(--color-border-strong);
  border-radius: var(--radius-md);
  background: var(--color-surface-raised);
  font-weight: 600;
  font-family: inherit;
  cursor: pointer;
}

.btn-support-revoke:hover {
  background: var(--color-surface);
}

/* Support request form */
.support-request-new__error-list {
  margin: var(--space-2) 0 0;
  padding-left: var(--space-5);
}

.auth-errors {
  margin-bottom: var(--space-4);
  padding: var(--space-4);
  background: var(--color-danger-bg);
  border: 1px solid #fecaca;
  border-radius: var(--radius-md);
  color: var(--color-danger);
  font-size: 0.875rem;
}

.support-request-form__stack {
  display: flex;
  flex-direction: column;
  gap: var(--space-4);
}

.support-request-form__columns {
  display: grid;
  grid-template-columns: 1.2fr 1fr;
  gap: var(--space-4);
  align-items: start;
}

.support-request-form__summary-fields {
  display: grid;
  grid-template-columns: 1fr 12rem;
  gap: var(--space-4);
  align-items: end;
}

.support-request-form__card {
  background: var(--color-surface-raised);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
  padding: var(--space-5);
  box-shadow: var(--shadow-sm);
}

.support-request-form__card-title {
  margin: 0 0 var(--space-2);
  font-size: 1rem;
  font-weight: 700;
  color: var(--auth-heading);
}

.support-request-form__card-lead {
  margin: 0 0 var(--space-4);
  font-size: 0.875rem;
  color: var(--color-text-muted);
  line-height: 1.45;
}

.support-request-form .field label {
  display: block;
  font-size: 0.8125rem;
  font-weight: 600;
  margin-bottom: var(--space-1);
  color: var(--color-text);
}

.support-request-form__card select,
.support-request-form__card textarea,
.support-request-form__title-input {
  width: 100%;
  padding: var(--space-2) var(--space-3);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-sm);
  font-family: inherit;
  font-size: 0.875rem;
  background: var(--color-surface-raised);
}

.support-request-form__card select {
  appearance: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='%2364748b' d='M6 8L1 3h10z'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 0.75rem center;
  padding-right: 2.25rem;
}

.support-request-form__card textarea {
  resize: vertical;
  min-height: 11rem;
  line-height: 1.55;
}

.support-request-form__card select:focus,
.support-request-form__card textarea:focus,
.support-request-form__title-input:focus {
  outline: none;
  border-color: var(--color-brand-500);
  box-shadow: 0 0 0 2px var(--auth-accent-ring);
}

.support-request-form__hint {
  margin: var(--space-2) 0 0;
  font-size: 0.8125rem;
  color: var(--color-text-muted);
  line-height: 1.45;
}

.support-request-form__dropzone {
  border: 1.5px dashed var(--color-border-strong);
  border-radius: var(--radius-md);
  padding: var(--space-4) var(--space-5);
  cursor: pointer;
  background: var(--color-surface);
  position: relative;
  transition: border-color 0.15s ease, background 0.15s ease;
}

.support-request-form__dropzone:hover,
.support-request-form__dropzone.dropzone-active {
  border-color: var(--schoolise-teal);
  background: #f0fdfa;
}

.support-request-form__dropzone-inner {
  display: flex;
  align-items: center;
  gap: var(--space-4);
  flex-wrap: wrap;
  pointer-events: none;
}

.support-request-form__dropzone-icon {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 2.5rem;
  height: 2.5rem;
  border-radius: var(--radius-sm);
  background: var(--color-brand-50);
  color: var(--schoolise-blue);
  flex-shrink: 0;
}

.support-request-form__dropzone-copy {
  flex: 1;
  min-width: 8rem;
  text-align: left;
}

.support-request-form__dropzone-title {
  margin: 0;
  font-size: 0.875rem;
  font-weight: 600;
}

.support-request-form__dropzone-hint {
  margin: 0.15rem 0 0;
  font-size: 0.75rem;
  color: var(--color-text-muted);
}

.support-request-form__choose-btn {
  flex-shrink: 0;
  min-height: 2.25rem;
  padding: 0.4rem 0.9rem;
  border-radius: 999px;
  border: 1px solid var(--color-border);
  background: var(--color-surface-raised);
  font-size: 0.8125rem;
  font-weight: 600;
  font-family: inherit;
  cursor: pointer;
  pointer-events: auto;
}

.support-request-form__choose-btn:hover {
  background: var(--color-surface);
}

.support-request-form__file-input {
  position: absolute;
  inset: 0;
  opacity: 0;
  cursor: pointer;
  width: 100%;
  height: 100%;
}

.support-request-form__preview {
  margin-top: var(--space-3);
  font-size: 0.8125rem;
  color: var(--color-text-muted);
}

.support-request-form__actions {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-3);
  align-items: center;
  margin-top: var(--space-2);
}

.support-request-form__cancel {
  color: var(--color-text-muted);
  text-decoration: none;
  font-weight: 600;
  font-size: 0.875rem;
}

.support-request-form__cancel:hover {
  color: var(--color-text);
}

/* Impersonation banner */
.support-impersonation-banner {
  background: var(--color-warning-bg);
  border-bottom: 1px solid #fcd34d;
  padding: var(--space-2) var(--space-4);
}

.support-impersonation-banner__inner {
  max-width: var(--content-max-width);
  margin: 0 auto;
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: var(--space-3);
  font-size: 0.875rem;
}

.support-impersonation-banner__exit {
  min-height: 2.25rem;
  padding: 0.35rem 0.75rem;
  border: 1px solid var(--color-warning);
  border-radius: var(--radius-sm);
  background: var(--color-surface-raised);
  font-weight: 600;
  font-family: inherit;
  cursor: pointer;
}

/* Responsive */
@media (max-width: 900px) {
  .support-request-form__columns,
  .support-request-form__summary-fields,
  .sr-edit-card__row {
    grid-template-columns: 1fr;
  }

  .sr-page__header {
    flex-direction: column;
    align-items: stretch;
  }

  .sr-page__header > .btn-primary {
    width: 100%;
  }

  .sr-page__actions {
    width: 100%;
  }

  .sr-page__actions .btn-primary,
  .sr-page__actions .bl-btn {
    flex: 1 1 calc(50% - var(--space-1));
    justify-content: center;
  }

  .sr-page__title {
    font-size: 1.25rem;
  }

  .support-request-form__card {
    padding: var(--space-4);
  }
}

@media (max-width: 640px) {
  .bl-table--stacked thead {
    display: none;
  }

  .bl-table--stacked .bl-table__row {
    display: block;
    padding: var(--space-4);
    border-bottom: 1px solid var(--color-border);
  }

  .bl-table--stacked .bl-table__row:last-child .bl-table__td:last-child {
    border-bottom: none;
  }

  .bl-table--stacked .bl-table__td {
    display: grid;
    grid-template-columns: 6.5rem 1fr;
    gap: var(--space-2) var(--space-3);
    align-items: baseline;
    padding: var(--space-1) 0;
    border: none;
    text-align: left;
  }

  .bl-table--stacked .bl-table__td::before {
    content: attr(data-label);
    font-weight: 600;
    color: var(--color-text-muted);
    font-size: 0.6875rem;
    text-transform: uppercase;
    letter-spacing: 0.04em;
  }

  .bl-table--stacked .bl-table__td--subject strong {
    font-size: 0.875rem;
  }

  .sr-filters__select {
    flex: 1 1 calc(50% - var(--space-2));
    min-width: 0;
  }

  .support-access-actions .btn-primary,
  .support-access-actions .btn-support-revoke {
    width: 100%;
  }
}

@media (min-width: 901px) {
  .bl-table--stacked .bl-table__td[data-label="Actions"] .sr-actions {
    justify-content: flex-end;
  }
}
/* Kaminari pager (app/views/kaminari) — matches AssessMap pattern */

.kaminari-pager {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: 0.35rem 0.4rem;
  width: 100%;
  max-width: 100%;
  margin-top: 0;
  box-sizing: border-box;
}

.kaminari-pager__pages {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: 0.25rem 0.35rem;
  max-width: 100%;
}

.kaminari-pager__btn,
.kaminari-pager__page {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  box-sizing: border-box;
  min-width: 2.75rem;
  min-height: 2.75rem;
  padding: 0.4rem 0.65rem;
  border-radius: var(--st-radius-sm);
  border: 1px solid var(--st-border-tertiary);
  background: var(--st-bg-secondary);
  color: var(--st-accent);
  font-size: 0.875rem;
  font-weight: 500;
  line-height: 1.2;
  text-decoration: none;
  transition: background 0.12s ease, border-color 0.12s ease, color 0.12s ease;
}

a.kaminari-pager__btn:hover,
a.kaminari-pager__page:hover {
  background: var(--st-bg-tertiary);
  color: var(--st-accent-strong);
  border-color: var(--st-border-secondary);
}

.kaminari-pager__page--current {
  background: var(--st-accent);
  color: #fafaf9;
  font-weight: 600;
  border-color: var(--st-accent-strong);
}

.kaminari-pager__btn--disabled {
  background: var(--st-canvas);
  color: var(--st-text-tertiary);
  border-color: var(--st-border-tertiary);
  cursor: not-allowed;
}

.kaminari-pager__gap,
nav[role="navigation"] .page.gap {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 2.75rem;
  padding: 0 0.35rem;
  color: var(--color-text-muted);
  border: none;
  background: transparent;
  font-size: 0.875rem;
}

.students-index__pagination-bar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 1rem 1.25rem;
  background: var(--st-bg-primary);
  border: 0.5px solid var(--st-border-tertiary);
  border-top: none;
  border-radius: 0 0 var(--radius-lg) var(--radius-lg);
  flex-wrap: wrap;
  gap: 0.75rem;
  margin-top: 1rem;
}

.pagination-per-page-group {
  display: flex;
  align-items: center;
  gap: 0.5rem;
}

.pagination-per-page-form {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  margin: 0;
}

.pagination-per-page-select {
  min-height: 2.25rem;
  padding: 0.35rem 1.75rem 0.35rem 0.65rem;
  border: 0.5px solid var(--st-border-tertiary);
  border-radius: var(--st-radius-md);
  background: var(--st-bg-secondary);
  color: var(--st-text-primary);
  font-size: 0.8125rem;
  font-weight: 500;
  cursor: pointer;
}

.pagination-per-page-label {
  font-size: 0.8125rem;
  color: var(--color-text-muted);
  white-space: nowrap;
}

@media (max-width: 640px) {
  .students-index__pagination-bar {
    flex-direction: column;
    align-items: stretch;
    text-align: center;
  }

  .students-index__pagination-bar .kaminari-pager {
    justify-content: center;
  }

  .pagination-per-page-group {
    justify-content: center;
  }
}
/* Account page (ac-*) */

.ac-page {
  display: flex;
  flex-direction: column;
  gap: var(--space-5);
}

.ac-page__header {
  margin-bottom: var(--space-2);
}

.ac-page__title-row {
  display: flex;
  align-items: center;
  gap: var(--space-3);
}

.ac-page__icon {
  width: 2.75rem;
  height: 2.75rem;
  border-radius: var(--radius-md);
  background: linear-gradient(135deg, var(--color-brand-50) 0%, #eef5eb 100%);
  color: var(--schoolise-blue);
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  border: 1px solid var(--color-brand-100);
}

.ac-page__title {
  margin: 0 0 0.1rem;
  font-size: 1.35rem;
  font-weight: 700;
  color: var(--auth-heading);
  line-height: 1.25;
}

.ac-page__subtitle {
  margin: 0;
  font-size: 0.82rem;
  color: var(--color-text-muted);
}

.ac-error-banner {
  background: var(--color-danger-bg);
  border: 1px solid #fecaca;
  border-radius: var(--radius-md);
  padding: var(--space-3) var(--space-4);
  font-size: 0.85rem;
  color: var(--color-danger);
}

.ac-error-banner ul {
  margin: 0;
  padding-left: var(--space-5);
}

.ac-layout {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: var(--space-5);
  align-items: start;
}

.ac-left,
.ac-right {
  display: contents;
}

.ac-left > form {
  display: contents;
}

.ac-photo-card {
  min-width: 0;
}

.ac-card {
  background: var(--color-surface-raised);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
  overflow: hidden;
  min-width: 0;
  box-shadow: var(--shadow-sm);
}

.ac-card__header {
  display: flex;
  align-items: flex-start;
  gap: var(--space-3);
  padding: var(--space-4);
  border-bottom: 1px solid var(--color-border);
  background: var(--color-surface);
}

.ac-card__icon {
  width: 1.75rem;
  height: 1.75rem;
  border-radius: var(--radius-sm);
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}

.ac-card__icon--person {
  background: var(--color-brand-50);
  color: var(--schoolise-blue);
}

.ac-card__icon--lock {
  background: var(--color-warning-bg);
  color: var(--color-warning);
}

.ac-card__icon--photo {
  background: #ede9fe;
  color: #6d28d9;
}

.ac-card__title {
  font-size: 0.85rem;
  font-weight: 700;
  color: var(--auth-heading);
  line-height: 1.25;
}

.ac-card__subtitle {
  font-size: 0.72rem;
  color: var(--color-text-muted);
  margin-top: 0.1rem;
  line-height: 1.35;
}

.ac-card__body {
  padding: var(--space-4);
}

.ac-card__body .field {
  margin-bottom: var(--space-4);
}

.ac-card__body .field label {
  display: block;
  font-size: 0.72rem;
  font-weight: 700;
  margin-bottom: 0.3rem;
  color: var(--color-text-muted);
  text-transform: uppercase;
  letter-spacing: 0.06em;
}

.ac-card__body input[type="text"],
.ac-card__body input[type="email"],
.ac-card__body input[type="tel"],
.ac-card__body input[type="password"],
.ac-card__body select {
  width: 100%;
  padding: 0.5rem 0.65rem;
  border: 1px solid var(--color-border);
  border-radius: 7px;
  font-family: inherit;
  font-size: 0.9rem;
  background: var(--color-surface-raised);
}

.ac-card__body select {
  appearance: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='%2364748b' d='M6 8L1 3h10z'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 0.75rem center;
  padding-right: 2.25rem;
}

.ac-card__body input:focus,
.ac-card__body select:focus {
  outline: none;
  border-color: var(--color-brand-500);
  box-shadow: 0 0 0 2px var(--auth-accent-ring);
}

.ac-card__actions {
  margin-top: var(--space-2);
  display: flex;
  justify-content: flex-end;
}

.ac-hint {
  margin: var(--space-2) 0 0;
  font-size: 0.75rem;
  color: var(--color-text-muted);
  line-height: 1.45;
}

.ac-hint--password {
  margin-bottom: var(--space-4);
}

.ac-fields-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--space-4);
}

.ac-field-full {
  grid-column: 1 / -1;
}

.ac-photo-body {
  padding: var(--space-4);
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
}

.ac-photo-form,
.ac-photo-remove-form {
  width: 100%;
}

.ac-avatar {
  width: 5rem;
  height: 5rem;
  border-radius: 999px;
  background: var(--color-brand-50);
  color: var(--schoolise-blue);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.75rem;
  font-weight: 700;
  overflow: hidden;
  border: 2px solid var(--color-brand-100);
  margin: 0 auto var(--space-3);
  flex-shrink: 0;
}

.ac-avatar img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.ac-avatar-info {
  margin-bottom: var(--space-4);
  width: 100%;
}

.ac-avatar-name {
  font-size: 0.95rem;
  font-weight: 700;
  color: var(--auth-heading);
}

.ac-avatar-email {
  margin-top: 0.15rem;
  font-size: 0.78rem;
  color: var(--color-text-muted);
}

.ac-upload-zone {
  position: relative;
  width: 100%;
  border: 1.5px dashed var(--color-border-strong);
  border-radius: var(--radius-md);
  padding: var(--space-4);
  background: var(--color-surface);
  cursor: pointer;
  transition: border-color 0.15s ease, background 0.15s ease;
}

.ac-upload-zone:hover {
  border-color: var(--schoolise-teal);
  background: #f0fdfa;
}

.ac-upload-zone input[type="file"] {
  position: absolute;
  inset: 0;
  opacity: 0;
  cursor: pointer;
  width: 100%;
  height: 100%;
}

.ac-upload-zone__icon {
  color: var(--schoolise-blue);
  margin-bottom: var(--space-2);
}

.ac-upload-zone__label {
  font-size: 0.82rem;
  font-weight: 600;
}

.ac-upload-zone__hint {
  margin-top: var(--space-1);
  font-size: 0.72rem;
  color: var(--color-text-muted);
}

.ac-btn--block {
  width: 100%;
  margin-top: var(--space-3);
}

.ac-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.4rem;
  font-size: 0.875rem;
  font-weight: 600;
  font-family: inherit;
  text-decoration: none;
  white-space: nowrap;
}

.ac-btn--remove {
  width: 100%;
  min-height: 2.5rem;
  margin-top: var(--space-3);
  padding: 0.5rem 1rem;
  border: 1px solid #fca5a5;
  border-radius: var(--radius-sm);
  background: var(--color-surface-raised);
  color: var(--color-danger);
  cursor: pointer;
}

.ac-btn--remove:hover:not(:disabled) {
  background: var(--color-danger-bg);
  border-color: #f87171;
}

.ac-btn--remove:disabled {
  opacity: 0.45;
  cursor: not-allowed;
  border-color: var(--color-border);
  color: var(--color-text-muted);
}

@media (max-width: 900px) {
  .ac-layout {
    grid-template-columns: 1fr 1fr;
  }
}

@media (max-width: 640px) {
  .ac-layout {
    grid-template-columns: 1fr;
  }

  .ac-fields-grid {
    grid-template-columns: 1fr;
  }

  .ac-card__actions {
    justify-content: stretch;
  }

  .ac-card__actions .btn-primary {
    width: 100%;
  }
}
/* Settings hub and sub-pages (AssessMap-style stg-* / oe-* / sy-* patterns) */

.stg-page,
.oe-page,
.sy-page {
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
}

.stg-header,
.oe-page__header,
.sy-page__header {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  justify-content: space-between;
  gap: var(--space-3);
  margin-bottom: var(--space-5);
}

.stg-header__title-row,
.oe-page__title-row,
.sy-page__title-row {
  display: flex;
  gap: var(--space-3);
  align-items: flex-start;
}

.sy-page__title-row {
  align-items: center;
  min-width: 0;
}

.sy-page__title-row > div:last-child {
  min-width: 0;
}

.stg-header__icon,
.oe-page__icon {
  width: 2.5rem;
  height: 2.5rem;
  border-radius: var(--radius-md);
  background: var(--st-bg-secondary);
  color: var(--st-accent);
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}

.stg-header__title,
.oe-page__title,
.sy-page__title {
  margin: 0 0 0.1rem;
  font-size: 1.35rem;
  font-weight: 700;
  color: var(--auth-heading);
  line-height: 1.25;
}

.stg-header__subtitle,
.oe-page__subtitle,
.sy-page__subtitle {
  margin: 0;
  color: var(--color-text-muted);
  font-size: 0.82rem;
}

.stg-header__actions,
.sy-page__actions {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-2);
  align-items: center;
}

.stg-back-link {
  display: inline-flex;
  align-items: center;
  min-height: 2.75rem;
  padding: 0.5rem 0.75rem;
  font-size: 0.875rem;
  font-weight: 600;
  color: var(--color-text-muted);
  text-decoration: none;
  border-radius: var(--radius-sm);
}

.stg-back-link:hover {
  color: var(--schoolise-blue);
  background: var(--color-brand-50);
}

.stg-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--space-4);
}

@media (min-width: 700px) {
  .stg-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (min-width: 1024px) {
  .stg-grid {
    grid-template-columns: repeat(3, 1fr);
  }
}

.stg-card,
.oe-card,
.bl-card {
  background: var(--color-surface-raised);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
  overflow: hidden;
}

.stg-card__header {
  display: flex;
  align-items: center;
  gap: var(--space-2);
  padding: var(--space-3) var(--space-4);
  border-bottom: 1px solid var(--color-border);
  background: var(--color-surface);
}

.stg-card__icon {
  width: 1.75rem;
  height: 1.75rem;
  border-radius: var(--radius-sm);
  display: flex;
  align-items: center;
  justify-content: center;
}

.stg-card__icon--org { background: #ebe6dc; color: #5c5346; }
.stg-card__icon--people { background: #dcfce7; color: #15803d; }
.stg-card__icon--data { background: #fef3c7; color: #b45309; }

.stg-card__title {
  font-weight: 700;
  font-size: 0.78rem;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--color-text-muted);
}

.stg-card__body {
  padding: 0;
}

.stg-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-3);
  padding: var(--space-3) var(--space-4);
  text-decoration: none;
  color: inherit;
  border-bottom: 1px solid var(--color-border);
  min-height: 3.5rem;
}

.stg-row:last-child { border-bottom: none; }
.stg-row:hover { background: var(--color-brand-50); }

.stg-row--danger .stg-row__label { color: var(--color-danger); }

.stg-row__text { min-width: 0; }
.stg-row__label { display: block; font-weight: 600; font-size: 0.88rem; line-height: 1.3; }
.stg-row__desc { display: block; font-size: 0.78rem; color: var(--color-text-muted); margin-top: 0.1rem; line-height: 1.4; }
.stg-row__chevron { color: var(--color-text-muted); font-size: 1.25rem; flex-shrink: 0; }

.stg-hint {
  padding: var(--space-3) var(--space-4);
  font-size: 0.82rem;
  color: var(--color-text-muted);
  margin: 0;
}

.stg-error-banner {
  background: var(--color-danger-bg);
  border: 1px solid #fecaca;
  border-radius: var(--radius-sm);
  padding: var(--space-3);
  margin-bottom: var(--space-4);
}

.stg-error-banner ul { margin: 0; padding-left: 1.25rem; }

/* Organisation edit */
.org-edit-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--space-4);
}

@media (min-width: 900px) {
  .org-edit-grid {
    grid-template-columns: 1fr 1fr;
    align-items: start;
  }

  .org-edit-email-column {
    display: flex;
    flex-direction: column;
    gap: var(--space-4);
  }
}

.oe-card__header {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  padding: 0.9rem 1.25rem;
  border-bottom: 1px solid var(--color-border);
  background: #faf8f5;
}

.oe-card__icon {
  width: 30px;
  height: 30px;
  border-radius: 7px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}

.oe-card__icon--email { background: #eef2ff; color: #4f46e5; }
.oe-card__icon--smtp  { background: #fef3c7; color: #b45309; }

.oe-card__title { font-weight: 700; font-size: 0.88rem; line-height: 1.3; color: var(--color-text); margin: 0 0 0.1rem; }
.oe-card__subtitle { font-size: 0.78rem; color: var(--color-text-muted); margin: 0; }
.oe-card__body { padding: 1.25rem; }
.oe-card__intro { font-size: 0.9rem; color: var(--color-text-muted); margin: 0 0 var(--space-3); line-height: 1.5; }
.oe-card--narrow { max-width: 32rem; }

.oe-card__body .field { margin-bottom: var(--space-3); }
.oe-card__body label { display: block; font-weight: 600; font-size: 0.85rem; margin-bottom: 0.3rem; color: var(--color-text); }
.oe-card__body input[type="text"],
.oe-card__body input[type="email"],
.oe-card__body input[type="tel"],
.oe-card__body input[type="password"],
.oe-card__body input[type="number"],
.oe-card__body input[type="time"],
.oe-card__body select,
.oe-card__body textarea,
.oe-select,
.cd-input {
  width: 100%;
  padding: 0.55rem 0.75rem;
  border: 1px solid var(--color-border);
  border-radius: 7px;
  font-family: inherit;
  font-size: 0.9rem;
  background: var(--color-surface);
}

.oe-card__body textarea {
  min-height: 6rem;
  resize: vertical;
  line-height: 1.5;
}

.field--checkbox {
  display: flex;
  align-items: center;
  gap: 0.5rem;
}

.field--checkbox input { width: auto; }
.field--checkbox label { margin: 0; font-weight: 500; }

.oe-field__hint { font-size: 0.85rem; color: var(--color-text-muted); margin: 0.25rem 0 0.5rem; line-height: 1.4; }

.oe-card__hint {
  margin: 0 0 0.75rem;
  color: var(--color-text-muted);
  font-size: 0.85rem;
  line-height: 1.4;
}

.oe-field-row { display: grid; grid-template-columns: 1fr 1fr; gap: var(--space-3); }

/* SMTP: port + authentication row */
.oe-card__body .field--smtp-port-auth {
  display: grid;
  grid-template-columns: minmax(4.75rem, 6.5rem) minmax(0, 10.75rem);
  gap: 0.75rem 1.25rem;
  align-items: end;
}

@media (max-width: 420px) {
  .oe-card__body .field--smtp-port-auth {
    grid-template-columns: 1fr;
  }
}

.oe-card__body .field--smtp-port-auth .field--smtp-port label,
.oe-card__body .field--smtp-port-auth .field--smtp-auth label {
  font-size: 0.8rem;
  margin-bottom: 0.2rem;
}

.oe-card__body .field--smtp-port-auth .field--smtp-port,
.oe-card__body .field--smtp-port-auth .field--smtp-auth {
  margin-bottom: 0;
}

.oe-card__body .field--smtp-port-auth input.smtp-port-input[type="number"] {
  width: 100%;
  max-width: 6.5rem;
  box-sizing: border-box;
  padding: 0.5rem 0.45rem;
  border-radius: 7px;
  border: 1px solid var(--color-border);
  font-size: 0.9rem;
  font-variant-numeric: tabular-nums;
  text-align: center;
  background: var(--color-surface);
}

.oe-card__body .field--smtp-port-auth input.smtp-port-input[type="number"]:focus {
  outline: none;
  border-color: var(--color-brand-500);
  box-shadow: 0 0 0 2px var(--auth-accent-ring);
  background: var(--color-surface-raised);
}

.oe-card__body .field--smtp-port-auth select.smtp-auth-select {
  width: 100%;
  max-width: 10.75rem;
  padding: 0.42rem 1.75rem 0.42rem 0.65rem;
  border-radius: 7px;
  border: 1px solid var(--color-border);
  font-size: 0.8125rem;
  line-height: 1.35;
  background-color: var(--color-surface-raised);
  cursor: pointer;
  appearance: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='%2364748b' d='M6 8L1 3h10z'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 0.5rem center;
  box-sizing: border-box;
}

.oe-card__body .field--smtp-port-auth select.smtp-auth-select:focus {
  outline: none;
  border-color: var(--color-brand-500);
  box-shadow: 0 0 0 2px var(--auth-accent-ring);
}

.smtp-help-card {
  margin-top: 1.25rem;
  padding-top: 1rem;
  border-top: 1px solid var(--color-border);
  font-size: 0.875rem;
  color: var(--color-text-muted);
  line-height: 1.55;
}

.smtp-help-card__intro {
  margin: 0 0 0.65rem;
}

.smtp-help-card__hint {
  margin: 0;
  font-size: 0.8125rem;
  line-height: 1.5;
  color: var(--color-text-muted);
}

.smtp-help-card__hint code {
  font-size: 0.78em;
  padding: 0.08rem 0.28rem;
  border-radius: 4px;
  background: var(--color-surface);
  color: var(--color-text);
}

.smtp-help-card__support-link {
  font-weight: 500;
  color: var(--schoolise-blue);
  text-decoration: underline;
  text-underline-offset: 0.12em;
}

.smtp-help-card__support-link:hover {
  color: var(--auth-accent-hover);
}

.oe-smtp-verified {
  color: #15803d;
  font-size: 0.88rem;
  font-weight: 600;
  margin-bottom: var(--space-3);
}

.actions { margin-top: var(--space-4); }
.actions--inline { display: flex; flex-wrap: wrap; gap: var(--space-2); }

.btn-secondary {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.35rem;
  box-sizing: border-box;
  min-height: 2.25rem;
  padding: 0.55rem 1rem;
  border: 0.5px solid var(--color-border-strong);
  border-radius: var(--radius-md);
  background: var(--color-surface);
  color: var(--color-text);
  font-weight: 500;
  font-size: 0.8125rem;
  line-height: 1.25;
  font-family: inherit;
  text-decoration: none;
  white-space: nowrap;
  cursor: pointer;
}

.btn-secondary:hover {
  background: var(--color-surface-raised);
  border-color: var(--color-text-muted);
}

.btn-danger {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.35rem;
  box-sizing: border-box;
  min-height: 2.25rem;
  padding: 0.55rem 1rem;
  border: 0.5px solid #fca5a5;
  border-radius: var(--radius-md);
  background: var(--color-danger-bg);
  color: var(--color-danger);
  font-weight: 500;
  font-size: 0.8125rem;
  line-height: 1.25;
  font-family: inherit;
  text-decoration: none;
  white-space: nowrap;
  cursor: pointer;
}

.oe-logo-body { text-align: center; }
.oe-logo-preview { margin-bottom: var(--space-4); }
.oe-logo-preview img { max-width: 200px; border-radius: var(--radius-md); }
.oe-logo-remove { margin-top: var(--space-3); width: 100%; }

/* Tables */
.bl-table-wrap { overflow-x: auto; }
.bl-table { width: 100%; border-collapse: collapse; font-size: 0.875rem; }
.bl-table__th {
  text-align: left;
  padding: var(--space-2) var(--space-3);
  font-size: 0.72rem;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--color-text-muted);
  border-bottom: 1px solid var(--color-border);
  background: var(--color-surface);
}

.bl-table__th--right {
  text-align: right;
}
.bl-table__td { padding: var(--space-3); border-bottom: 1px solid var(--color-border); vertical-align: middle; }
.bl-table__row:last-child .bl-table__td { border-bottom: none; }

.sy-empty { padding: var(--space-5); text-align: center; color: var(--color-text-muted); }
.sy-action-link { font-weight: 600; color: var(--schoolise-blue); text-decoration: none; }
.sy-action-link--danger { color: var(--color-danger); }
.sy-year-link { font-weight: 600; color: var(--schoolise-blue); text-decoration: none; }
.sy-row--current { background: #f0f7f3; box-shadow: inset 3px 0 0 #2d6a4f; }
.sy-row__actions { text-align: right; white-space: nowrap; }

.sy-page__icon {
  width: 2.5rem;
  height: 2.5rem;
  border-radius: 0.625rem;
  background: #e6f4ed;
  color: #2d6a4f;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}

.sy-form-card {
  background: #fff;
  border: 1px solid #e8e4dc;
  border-radius: 0.625rem;
  padding: 1.5rem;
  max-width: 42rem;
  box-sizing: border-box;
}

.sy-form__errors {
  background: #fee2e2;
  border: 1px solid #fecaca;
  border-radius: 0.4375rem;
  padding: 0.75rem 1rem;
  margin-bottom: 1rem;
  font-size: 0.88rem;
  color: #991b1b;
}

.sy-form__errors ul {
  margin: 0;
  padding-left: 1.1rem;
}

.sy-form__field {
  margin-bottom: 1rem;
}

.sy-form__date-row > .sy-form__field {
  margin-bottom: 0;
}

.sy-form__label {
  display: block;
  font-weight: 600;
  font-size: 0.85rem;
  margin-bottom: 0.3rem;
  color: #2d2926;
}

.sy-form__input {
  width: 100%;
  box-sizing: border-box;
  padding: 0.55rem 0.75rem;
  border-radius: 0.4375rem;
  border: 1px solid #e8e4dc;
  background: #fff;
  font-size: 0.9rem;
  color: #1a1a1a;
  font-family: inherit;
  transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.sy-form__input:focus {
  outline: none;
  border-color: #2d6a4f;
  box-shadow: 0 0 0 3px rgba(45, 106, 79, 0.12);
}

.sy-form__input--name {
  max-width: 28rem;
}

.sy-form__date-row {
  display: flex;
  flex-wrap: wrap;
  gap: 1rem;
  margin-bottom: 1.25rem;
}

.sy-form__date-row > .sy-form__field {
  flex: 1 1 12rem;
  min-width: 0;
}

.sy-form-card .btn-primary,
.sy-form-card input[type="submit"].btn-primary {
  min-height: 2.75rem;
}

.sy-form-card select.sy-form__input {
  appearance: auto;
}

.sy-form__input--textarea {
  min-height: 6rem;
  resize: vertical;
  line-height: 1.5;
}

.sy-page__icon--sites {
  background: rgba(30, 58, 138, 0.1);
  color: var(--schoolise-blue, #5c5346);
}

.sr-form-page .sy-page__header {
  margin-bottom: 0;
}

/* Full-width form shell */
.sr-form-shell {
  width: 100%;
  background: var(--color-surface-raised, #fff);
  border: 1px solid var(--color-border, #e8e4dc);
  border-radius: var(--radius-md, 0.625rem);
  padding: 1.5rem 1.75rem;
  box-sizing: border-box;
}

.sr-form-layout {
  display: grid;
  grid-template-columns: 1fr;
  gap: 1.5rem 2rem;
}

.sr-form-layout--compact {
  max-width: 52rem;
}

.sr-form-layout__full {
  grid-column: 1 / -1;
}

.sr-form-section__title {
  margin: 0 0 1rem;
  padding-bottom: 0.55rem;
  border-bottom: 1px solid var(--color-border, #e8e4dc);
  font-size: 0.78rem;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--color-text-muted, #5b6b7c);
}

.sr-form__row {
  display: grid;
  grid-template-columns: 1fr;
  gap: 0.25rem;
}

.sr-form__actions {
  margin-top: 1.5rem;
  padding-top: 1.25rem;
  border-top: 1px solid var(--color-border, #e8e4dc);
}

.sr-form-shell .sy-form__field {
  margin-bottom: 1rem;
}

.sr-form-shell .sy-form__input {
  width: 100%;
  max-width: none;
  min-height: 2.5rem;
}

.sr-form-shell select.sy-form__input {
  appearance: auto;
  cursor: pointer;
}

.sr-form-shell .sy-form__input:focus {
  border-color: var(--schoolise-blue, #5c5346);
  box-shadow: 0 0 0 3px rgba(30, 58, 138, 0.12);
}

.sr-form-shell .sr-form__options {
  display: grid;
  gap: 0.35rem;
  margin: 0.25rem 0 1rem;
  padding: 0.85rem 1rem;
  background: var(--color-surface-muted, #f9f8f4);
  border: 1px solid var(--color-border, #e8e4dc);
  border-radius: var(--radius-sm, 8px);
}

.sr-form-shell .sr-form__checkbox {
  display: flex;
  align-items: center;
  gap: 0.55rem;
  margin: 0;
  min-height: 2.5rem;
  font-weight: 500;
  font-size: 0.9rem;
  cursor: pointer;
}

.sr-form-shell .sr-form__checkbox input[type="checkbox"] {
  width: 1.05rem;
  height: 1.05rem;
  flex-shrink: 0;
}

.sr-form-shell .sr-form__checkbox label,
.sr-form-shell .sr-form__checkbox span {
  margin: 0;
  font-weight: 500;
  font-size: 0.9rem;
}

.sr-form-shell .sr-form-context {
  margin: 0 0 1rem;
  padding: 0.65rem 0.85rem;
  background: var(--color-surface-muted, #f9f8f4);
  border-radius: var(--radius-sm, 8px);
  font-size: 0.88rem;
  color: var(--color-text-muted);
  line-height: 1.4;
}

.sr-form-shell .sr-features-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 0.35rem;
  padding: 0.85rem 1rem;
  background: var(--color-surface-muted, #f9f8f4);
  border-radius: var(--radius-sm, 8px);
  border: 1px solid var(--color-border, #e8e4dc);
}

.sr-form__label--visually-hidden {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

@media (min-width: 640px) {
  .sr-form__row {
    grid-template-columns: 1fr 1fr;
    gap: 1rem;
  }

  .sr-form-shell .sr-features-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (min-width: 900px) {
  .sr-form-layout {
    grid-template-columns: 1fr 1fr;
  }

  .sr-form-layout--room {
    grid-template-columns: 1.15fr 0.85fr;
  }

  .sr-form-shell .sr-features-grid {
    grid-template-columns: 1fr;
  }
}

@media (min-width: 1100px) {
  .sr-form-layout--room .sr-features-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

/* Teacher roles form (settings/academic_structure) */
.sy-page__icon--teacher-roles {
  background: rgba(30, 58, 138, 0.1);
  color: var(--schoolise-blue, #5c5346);
}

.tr-role-form-layout {
  align-items: start;
}

@media (min-width: 900px) {
  .tr-role-form-layout {
    grid-template-columns: minmax(0, 1.15fr) minmax(0, 0.85fr);
  }
}

.tr-role-form__main {
  min-width: 0;
}

.tr-role-form__aside {
  display: flex;
  flex-direction: column;
  gap: 1rem;
  min-width: 0;
}

.tr-role-form__panel {
  padding: 1rem 1.15rem;
  background: var(--color-surface-muted, #f9f8f4);
  border: 1px solid var(--color-border, #e8e4dc);
  border-radius: var(--radius-sm, 8px);
}

.tr-role-form__panel--tip {
  background: linear-gradient(180deg, rgba(30, 58, 138, 0.05) 0%, rgba(30, 58, 138, 0.02) 100%);
  border-color: rgba(30, 58, 138, 0.12);
}

.tr-role-form__panel-title {
  margin: 0 0 0.5rem;
  font-size: 0.78rem;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--color-text-muted, #5b6b7c);
}

.tr-role-form__panel-lead {
  margin: 0;
  font-size: 0.88rem;
  line-height: 1.5;
  color: var(--color-text-muted, #5b6b7c);
}

.tr-role-form__roles-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 0.65rem;
}

.tr-role-form__role-item {
  padding: 0.7rem 0.8rem;
  background: var(--color-surface-raised, #fff);
  border: 1px solid var(--color-border, #e8e4dc);
  border-radius: var(--radius-sm, 8px);
}

.tr-role-form__role-item--current {
  border-color: var(--schoolise-blue, #5c5346);
  box-shadow: 0 0 0 1px rgba(30, 58, 138, 0.15);
}

.tr-role-form__role-head {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.45rem;
  margin-bottom: 0.2rem;
}

.tr-role-form__role-head strong {
  font-size: 0.9rem;
  color: var(--color-text, #2d2926);
}

.tr-role-form__role-badge {
  display: inline-flex;
  align-items: center;
  min-height: 1.35rem;
  padding: 0 0.45rem;
  border-radius: 999px;
  font-size: 0.68rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  background: rgba(45, 106, 79, 0.12);
  color: #2d6a4f;
}

.tr-role-form__role-item p {
  margin: 0;
  font-size: 0.82rem;
  line-height: 1.45;
  color: var(--color-text-muted, #5b6b7c);
}

.tr-role-form__built-in-note {
  margin: 0 0 1rem;
  padding: 0.7rem 0.85rem;
  background: rgba(45, 106, 79, 0.08);
  border: 1px solid rgba(45, 106, 79, 0.18);
  border-radius: var(--radius-sm, 8px);
  font-size: 0.88rem;
  line-height: 1.45;
  color: #2d6a4f;
}

.tr-role-form__field-hint {
  margin: 0.35rem 0 0;
  font-size: 0.82rem;
  line-height: 1.4;
  color: var(--color-text-muted, #5b6b7c);
}

.tr-role-form__checkbox {
  display: flex;
  align-items: center;
  gap: 0.55rem;
  margin-top: 0.15rem;
}

.tr-role-form__checkbox-input {
  width: 1rem;
  height: 1rem;
  margin: 0;
  flex-shrink: 0;
  cursor: pointer;
}

.tr-role-form__checkbox-label {
  margin: 0;
  font-size: 0.9rem;
  font-weight: 500;
  line-height: 1.4;
  color: #2d2926;
  font-family: inherit;
  cursor: pointer;
}

.tr-role-form__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.65rem;
  align-items: center;
}

.tr-role-form__actions .btn-primary,
.tr-role-form__actions .students-index__btn {
  min-height: 2.75rem;
}

@media (max-width: 899px) {
  .tr-role-form__aside {
    order: -1;
  }
}

.sy-show__header {
  margin-bottom: 0;
}

.sy-show__toolbar {
  flex-direction: column;
  align-items: stretch;
  gap: 0.65rem;
}

.sy-show__toolbar-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  align-items: center;
}

.sy-show__toolbar .stg-back-link {
  align-self: flex-start;
}

.sy-show__toolbar-actions .students-index__btn {
  min-height: 2.75rem;
  height: auto;
  padding-top: 0.45rem;
  padding-bottom: 0.45rem;
}

@media (min-width: 640px) {
  .sy-show__toolbar {
    flex-direction: row;
    flex-wrap: wrap;
    align-items: center;
    justify-content: flex-end;
  }

  .sy-show__toolbar-actions {
    justify-content: flex-end;
  }
}

.sy-rollover-help {
  padding: 1.15rem 1.35rem;
  background: linear-gradient(180deg, rgba(30, 58, 138, 0.05) 0%, rgba(30, 58, 138, 0.02) 100%);
  border-color: rgba(30, 58, 138, 0.12);
}

.sy-rollover-help__title {
  margin: 0 0 0.65rem;
  font-size: 0.95rem;
  font-weight: 700;
  color: var(--schoolise-navy, #2c2825);
}

.sy-rollover-help__intro {
  margin: 0 0 1rem;
  font-size: 0.9rem;
  line-height: 1.55;
  color: var(--color-text-muted, #5b6b7c);
}

.sy-rollover-help__heading {
  margin: 0 0 0.45rem;
  font-size: 0.82rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--schoolise-blue, #5c5346);
}

.sy-rollover-help__text {
  margin: 0 0 0.85rem;
  font-size: 0.88rem;
  line-height: 1.55;
  color: var(--color-text-muted, #5b6b7c);
}

.sy-rollover-help__text:last-child {
  margin-bottom: 0;
}

.sy-rollover-wizard__header {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  justify-content: space-between;
  gap: 1rem;
}

.sy-rollover-wizard__nav {
  margin-bottom: 1rem;
  overflow-x: auto;
}

.sy-rollover-wizard__nav-list {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  list-style: none;
  margin: 0;
  padding: 0;
}

.sy-rollover-wizard__nav-item--current .sy-rollover-wizard__nav-link {
  background: var(--color-primary, #1f6feb);
  color: #fff;
}

.sy-rollover-wizard__nav-item--done .sy-rollover-wizard__nav-link {
  border-color: var(--color-success, #2da44e);
}

.sy-rollover-wizard__nav-link {
  display: inline-flex;
  align-items: center;
  min-height: 2.75rem;
  padding: 0.45rem 0.85rem;
  border: 1px solid var(--color-border, #d8dee4);
  border-radius: 999px;
  text-decoration: none;
  font-size: 0.88rem;
}

.sy-rollover-wizard__nav-link--disabled {
  opacity: 0.55;
}

.sy-rollover-wizard--new .sy-form-card {
  max-width: none;
}

.sy-rollover-wizard__layout {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1.5rem;
  align-items: stretch;
  width: 100%;
}

.sy-rollover-wizard__main,
.sy-rollover-wizard__aside {
  min-width: 0;
}

.sy-rollover-wizard__main {
  display: flex;
}

.sy-rollover-wizard__start-card {
  flex: 1;
  display: flex;
  flex-direction: column;
}

.sy-rollover-wizard__form {
  flex: 1;
  display: flex;
  flex-direction: column;
}

.sy-rollover-wizard__aside {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}

.sy-rollover-wizard__aside .sy-rollover-wizard__intro {
  margin: 0;
}

.sy-rollover-wizard__steps-preview {
  padding: 1.15rem 1.35rem;
}

.sy-rollover-wizard__steps-preview-title {
  margin: 0 0 0.75rem;
  font-size: 0.82rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--schoolise-blue, #5c5346);
}

.sy-rollover-wizard__steps-preview-list {
  margin: 0;
  padding-left: 1.15rem;
  display: flex;
  flex-direction: column;
  gap: 0.45rem;
  font-size: 0.88rem;
  line-height: 1.45;
  color: var(--color-text-muted, #5b6b7c);
}

.sy-rollover-wizard__resume--banner {
  width: 100%;
}

.sy-page__icon--rollover {
  background: rgba(45, 106, 79, 0.1);
  color: var(--schoolise-green, #2d6a4f);
}

.sy-rollover-wizard__resume-title {
  margin: 0 0 0.75rem;
  font-size: 0.78rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--color-text-muted);
}

.sy-rollover-wizard__resume-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}

.sy-rollover-wizard__resume-link {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 0.5rem;
  min-height: 2.75rem;
  padding: 0.65rem 0.85rem;
  border: 1px solid var(--color-border, #e8e4dc);
  border-radius: var(--radius-sm, 0.4375rem);
  text-decoration: none;
  color: var(--auth-heading, #2d2926);
  background: var(--color-surface, #faf9f7);
  transition: border-color 0.15s ease, background 0.15s ease;
}

.sy-rollover-wizard__resume-link:hover {
  border-color: var(--schoolise-green, #2d6a4f);
  background: rgba(45, 106, 79, 0.04);
}

.sy-rollover-wizard__resume-label {
  font-size: 0.9rem;
  font-weight: 600;
}

.sy-rollover-wizard__start-card .sy-rollover-wizard__intro {
  margin: 0 0 1.25rem;
  padding: 0.85rem 1rem;
  border-radius: var(--radius-sm, 0.4375rem);
  border: 1px solid #e8e4dc;
  background: #faf9f7;
  font-size: 0.88rem;
  line-height: 1.55;
  color: var(--color-text-muted, #5b6b7c);
}

.sy-rollover-wizard__target-fieldset {
  border: 0;
  margin: 0 0 1rem;
  padding: 0;
  min-width: 0;
}

.sy-rollover-wizard__target-fieldset > .sy-form__label {
  margin-bottom: 0.65rem;
}

.sy-rollover-wizard__target-option {
  margin-bottom: 0.65rem;
  padding: 0.85rem 1rem;
  border: 1px solid #e8e4dc;
  border-radius: var(--radius-sm, 0.4375rem);
  background: #fff;
  transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.sy-rollover-wizard__target-option:last-child {
  margin-bottom: 0;
}

.sy-rollover-wizard__target-option:has(.sy-rollover-wizard__target-radio:checked) {
  border-color: var(--schoolise-green, #2d6a4f);
  box-shadow: 0 0 0 3px rgba(45, 106, 79, 0.1);
}

.sy-rollover-wizard__target-radio {
  position: absolute;
  opacity: 0;
  pointer-events: none;
}

.sy-rollover-wizard__target-choice {
  display: flex;
  align-items: center;
  gap: 0.55rem;
  margin: 0;
  font-weight: 600;
  font-size: 0.9rem;
  color: var(--auth-heading, #2d2926);
  cursor: pointer;
}

.sy-rollover-wizard__target-choice::before {
  content: "";
  width: 1rem;
  height: 1rem;
  border-radius: 50%;
  border: 2px solid #c9c4bc;
  background: #fff;
  flex-shrink: 0;
  transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.sy-rollover-wizard__target-option:has(.sy-rollover-wizard__target-radio:checked) .sy-rollover-wizard__target-choice::before {
  border-color: var(--schoolise-green, #2d6a4f);
  box-shadow: inset 0 0 0 3px #fff, inset 0 0 0 6px var(--schoolise-green, #2d6a4f);
}

.sy-rollover-wizard__target-panel {
  display: none;
  margin-top: 0.85rem;
  padding-top: 0.85rem;
  border-top: 1px solid #ece8e0;
}

.sy-rollover-wizard__target-radio:checked ~ .sy-rollover-wizard__target-panel {
  display: block;
}

.sy-rollover-wizard__new-year-dates {
  margin-bottom: 0;
}

.sy-rollover-wizard__form-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem;
  margin-top: auto;
  padding-top: 1rem;
}

.sy-rollover-wizard__form-actions .btn-primary {
  min-height: 2.75rem;
}

.sy-rollover-wizard__step-card,
.sy-rollover-wizard__form-card,
.sy-rollover-wizard__resume {
  margin-bottom: 1rem;
}

.sy-rollover-wizard__step-title {
  margin: 0 0 0.5rem;
}

.sy-rollover-wizard__step-help,
.sy-rollover-wizard__intro {
  color: var(--color-text-muted, #5b6b7c);
  line-height: 1.55;
}

.sy-rollover-wizard__step-actions,
.sy-rollover-wizard__actions,
.sy-rollover-wizard__complete-actions,
.sy-rollover-wizard__secondary-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem;
  margin-top: 1.25rem;
}

.sy-rollover-wizard__summary-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(10rem, 1fr));
  gap: 0.75rem;
  margin: 1rem 0;
}

.sy-rollover-wizard__summary-card {
  padding: 0.85rem 1rem;
  border: 1px solid var(--color-border, #d8dee4);
  border-radius: 0.75rem;
  background: var(--color-surface-muted, #f6f8fa);
}

.sy-rollover-wizard__summary-count {
  margin: 0.35rem 0 0;
  font-size: 1.35rem;
  font-weight: 600;
}

.sy-rollover-wizard__alert {
  padding: 0.85rem 1rem;
  border-radius: 0.75rem;
  margin: 1rem 0;
}

.sy-rollover-wizard__alert--warning {
  background: #fff8e6;
  border: 1px solid #f0d78c;
}

.sy-rollover-wizard__alert--critical {
  background: #fff1f0;
  border: 1px solid #f5b5b1;
}

.sy-rollover-wizard__warning {
  display: block;
  color: #9a6700;
  font-size: 0.82rem;
}

.sy-rollover-wizard__row--critical {
  background: #fff8f7;
}

.sy-badge {
  display: inline-flex;
  align-items: center;
  padding: 0.2rem 0.55rem;
  border-radius: 999px;
  font-size: 0.78rem;
  font-weight: 600;
}

.sy-badge--draft,
.sy-badge--pending { background: #eef2f7; color: #4b5c6b; }
.sy-badge--in_progress,
.sy-badge--approved { background: #e8f2ff; color: #1f6feb; }
.sy-badge--completed,
.sy-badge--created,
.sy-badge--reused,
.sy-badge--mapped { background: #e8f7ec; color: #1a7f37; }
.sy-badge--cancelled,
.sy-badge--skipped { background: #f3f4f6; color: #6b7280; }
.sy-badge--failed,
.sy-badge--critical { background: #fde8e8; color: #c62828; }

@media (max-width: 900px) {
  .sy-rollover-wizard__layout {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 640px) {
  .sy-rollover-wizard__nav-list {
    flex-direction: column;
  }

  .sy-rollover-wizard__nav-link {
    width: 100%;
    justify-content: center;
  }

  .sy-rollover-wizard__resume-link {
    flex-direction: column;
    align-items: flex-start;
  }

  .sy-rollover-wizard__new-year-dates {
    flex-direction: column;
  }
}

.sy-show__periods-heading { margin: 0 0 var(--space-2); padding: var(--space-4) var(--space-4) 0; }
.sy-show__periods-empty { padding: var(--space-4); color: var(--color-text-muted); }

.cl-order-actions,
.cl-row-actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 0.25rem;
}

.cl-order-actions__form {
  margin: 0;
  display: inline-flex;
}

.cl-icon-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 28px;
  height: 28px;
  border-radius: 6px;
  border: 1px solid #e8e4dc;
  background: #fff;
  color: #555;
  text-decoration: none;
  cursor: pointer;
  padding: 0;
  margin: 0;
  line-height: 0;
  position: relative;
  transition: background 0.12s ease, color 0.12s ease, border-color 0.12s ease;
}

.cl-icon-btn:hover {
  background: #f0ece6;
  color: #1a1a1a;
  border-color: #ccc5b8;
}

.cl-icon-btn--disabled {
  opacity: 0.25;
  pointer-events: none;
  cursor: default;
}

.cl-icon-btn--edit:hover {
  background: #eef2ff;
  color: #4f46e5;
  border-color: #c7d2fe;
}

.cl-icon-btn--delete:hover {
  background: #fef2f2;
  color: #b91c1c;
  border-color: #fecaca;
}

.cl-icon-btn--deactivate:hover {
  background: #fef2f2;
  color: #b91c1c;
  border-color: #fecaca;
}

.cl-icon-btn--activate:hover {
  background: #ecfdf5;
  color: #047857;
  border-color: #a7f3d0;
}

.cl-icon-btn--rollover:hover {
  background: #f0f7f3;
  color: #2d6a4f;
  border-color: #b7d9c8;
}

/* Users */
.su-toolbar { margin-bottom: var(--space-4); display: flex; flex-direction: column; gap: var(--space-3); }
.su-search { width: 100%; max-width: 24rem; padding: var(--space-2) var(--space-3); border: 1px solid var(--color-border); border-radius: var(--radius-sm); }
.su-users-toolbar .students-index__search-wrap { flex: 1 1 12rem; max-width: 18rem; min-width: 10rem; }
.su-role-filters { display: flex; flex-wrap: wrap; gap: 0.5rem; margin-bottom: var(--space-4); }
.su-role-pill {
  padding: 0.35rem 0.75rem;
  border-radius: 999px;
  border: 1px solid var(--color-border);
  font-size: 0.8125rem;
  font-weight: 600;
  text-decoration: none;
  color: var(--color-text-muted);
}
.su-role-pill--active { background: var(--schoolise-blue); border-color: var(--schoolise-blue); color: #fff; }
.su-badge { font-size: 0.75rem; font-weight: 600; padding: 0.2rem 0.5rem; border-radius: 999px; background: #e2e8f0; }
.su-badge--active { background: #dcfce7; color: #166534; }
.su-badge--invited { background: #fef3c7; color: #92400e; }
.su-badge--inactive { background: #e2e8f0; color: #475569; }
.su-badge--suspended { background: #fee2e2; color: #991b1b; }
.su-badge--role { background: #e0edff; color: #1e40af; }
.su-badge--builtin { background: #ede9fe; color: #5b21b6; }
.su-badge--custom { background: #e2e8f0; color: #475569; }

/* Users & Access */
.su-filter-form { display: flex; }
.su-muted { color: var(--color-text-muted); font-size: 0.8125rem; margin-top: 0.15rem; }
.su-select {
  width: 100%;
  padding: var(--space-2) var(--space-3);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-sm);
  background: var(--color-surface-raised);
  font-family: inherit;
  font-size: 0.875rem;
  min-height: 2.75rem;
}
.su-select--sm { min-height: 2.25rem; width: auto; padding: 0.35rem 2rem 0.35rem 0.6rem; font-size: 0.8125rem; }
.su-input {
  width: 100%;
  padding: var(--space-2) var(--space-3);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-sm);
  background: var(--color-surface-raised);
  font-family: inherit;
  font-size: 0.875rem;
}
.su-form-card { padding: var(--space-4); margin-bottom: var(--space-4); }
.su-form { display: flex; flex-direction: column; gap: var(--space-4); }
.su-field { display: flex; flex-direction: column; gap: 0.35rem; margin-bottom: var(--space-4); }
.su-field:last-child { margin-bottom: 0; }
.su-label { font-weight: 600; font-size: 0.875rem; }
.su-field-hint { color: var(--color-text-muted); font-size: 0.8125rem; margin: 0; }
.su-form-actions { display: flex; flex-wrap: wrap; gap: var(--space-3); align-items: center; }

.bl-btn--primary { background: var(--schoolise-blue); color: #fff; border: 1px solid var(--schoolise-blue); }
.bl-btn--primary:hover { filter: brightness(0.95); }
.bl-btn--secondary { background: var(--color-surface-raised); color: var(--color-text); border: 1px solid var(--color-border); }
.bl-btn--secondary:hover { background: var(--color-surface); }
.bl-btn--danger { background: #fef2f2; color: #b91c1c; border: 1px solid #fecaca; }
.bl-btn--danger:hover { background: #fee2e2; }
.bl-link { color: var(--schoolise-blue); font-weight: 600; text-decoration: none; background: none; border: none; cursor: pointer; font-size: 0.875rem; font-family: inherit; padding: 0; }
.bl-link:hover { text-decoration: underline; }
.bl-link--danger { color: #b91c1c; margin-left: 0.75rem; }
.bl-alert { padding: var(--space-3); border-radius: var(--radius-sm); margin-bottom: var(--space-4); font-size: 0.875rem; }
.bl-alert--error { background: #fef2f2; color: #b91c1c; border: 1px solid #fecaca; }
.bl-alert--warning { background: #fffbeb; color: #92400e; border: 1px solid #fde68a; }
.bl-alert ul { margin: 0; padding-left: 1.1rem; }

/* Person (read-only) + staff summary */
.su-badge--staff { background: #ede9fe; color: #5b21b6; }

.su-person {
  margin-bottom: var(--space-4);
  padding-bottom: var(--space-4);
  border-bottom: 1px solid var(--color-border);
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
}
.su-person__label { font-weight: 600; font-size: 0.8125rem; color: var(--color-text-muted); text-transform: uppercase; letter-spacing: 0.03em; }
.su-person__name { font-weight: 700; font-size: 1rem; }
.su-person__email { color: var(--color-text-muted); font-size: 0.8125rem; }
.su-person__staff { display: flex; align-items: baseline; gap: 0.5rem; margin-top: 0.25rem; }
.su-person__staff-role { color: var(--color-text-muted); font-size: 0.8125rem; }

.su-staff-summary { margin-bottom: var(--space-4); }
.su-staff-summary__name { font-weight: 700; font-size: 1rem; }
.su-staff-summary__role { color: var(--color-text-muted); font-size: 0.8125rem; }

/* Student portal access (admin) */
.spa-page .su-person {
  margin-bottom: var(--space-3);
  padding-bottom: 0;
  border-bottom: 0;
}

.spa-page .su-form {
  gap: var(--space-3);
}

.spa-page .su-form .su-field {
  margin-bottom: 0;
}

.spa-student-credentials {
  display: flex;
  flex-direction: column;
  gap: var(--space-3);
  min-width: 0;
}

.spa-credential-password {
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
  font-size: 1rem;
  font-weight: 700;
  letter-spacing: 0.03em;
}

.spa-meta {
  display: grid;
  gap: 0.75rem;
  margin: 0 0 var(--space-4);
  padding: 0 0 var(--space-4);
  border-bottom: 1px solid var(--color-border);
}

.spa-meta__row {
  display: grid;
  grid-template-columns: minmax(8rem, 11rem) minmax(0, 1fr);
  gap: 0.5rem 1rem;
  align-items: baseline;
}

.spa-meta__row dt {
  margin: 0;
  color: var(--color-text-muted);
  font-size: 0.8125rem;
  font-weight: 600;
}

.spa-meta__row dd {
  margin: 0;
  font-size: 0.9375rem;
  min-width: 0;
  overflow-wrap: anywhere;
}

.spa-section {
  display: flex;
  flex-direction: column;
  gap: var(--space-3);
  margin-top: var(--space-4);
  padding-top: var(--space-4);
  border-top: 1px solid var(--color-border);
}

.spa-section:first-of-type {
  margin-top: 0;
  padding-top: 0;
  border-top: 0;
}

.spa-section__title {
  margin: 0;
  font-size: 1rem;
  font-weight: 700;
}

.spa-actions {
  align-items: stretch;
}

.spa-action-form {
  margin: 0;
  display: flex;
}

.spa-action-form .btn-primary,
.spa-action-form .btn-secondary,
.spa-action-form .btn-danger {
  width: 100%;
}

@media (min-width: 641px) {
  .spa-actions {
    align-items: center;
  }

  .spa-action-form {
    display: inline-flex;
  }

  .spa-action-form .btn-primary,
  .spa-action-form .btn-secondary,
  .spa-action-form .btn-danger {
    width: auto;
  }
}

@media (max-width: 640px) {
  .spa-meta__row {
    grid-template-columns: 1fr;
    gap: 0.2rem;
  }

  .spa-actions {
    flex-direction: column;
  }
}

/* Add user form */
.su-fieldset { border: 1px solid var(--color-border); border-radius: var(--radius-sm); padding: var(--space-4); margin: 0; display: flex; flex-direction: column; gap: var(--space-4); }
.su-legend { font-weight: 700; font-size: 0.9375rem; padding: 0 var(--space-2); }
.su-field-row { display: flex; flex-wrap: wrap; gap: var(--space-4); }
.su-field-row > .su-field { flex: 1 1 12rem; margin-bottom: 0; }
.su-checkbox-field { margin-bottom: 0; }
.su-checkbox { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.9375rem; }
.su-checkbox input[type="checkbox"] { width: 1rem; height: 1rem; }

.su-suggestion {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-3);
  align-items: center;
  justify-content: space-between;
  padding: var(--space-3);
  margin-bottom: var(--space-4);
  border: 1px solid #bfdbfe;
  background: #eff6ff;
  border-radius: var(--radius-sm);
}
.su-suggestion__body { display: flex; flex-direction: column; gap: 0.25rem; }
.su-suggestion__body p { margin: 0; font-size: 0.8125rem; color: var(--color-text-muted); }
.su-suggestion__contact { display: flex; flex-wrap: wrap; align-items: baseline; gap: 0.5rem; }
.su-suggestion__name { font-weight: 700; }
.su-suggestion__actions { display: flex; flex-wrap: wrap; gap: var(--space-2); }
.su-suggestion__actions form { margin: 0; }

/* Access roles index */
.ar-section {
  min-width: 0;
}
.ar-section + .ar-section {
  margin-top: var(--space-5);
}
.ar-section__header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: var(--space-3);
  margin-bottom: var(--space-3);
}
.ar-section__title {
  margin: 0;
  color: var(--color-text);
  font-size: 1.05rem;
}
.ar-section__hint {
  margin: 0.25rem 0 0;
  color: var(--color-text-muted);
  font-size: 0.85rem;
  line-height: 1.45;
}
.ar-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--space-3);
}
.ar-role-card {
  display: flex;
  flex-direction: column;
  gap: var(--space-2);
  padding: var(--space-4);
}
.ar-role-card__head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: var(--space-2);
}
.ar-role-card__title { display: flex; align-items: center; flex-wrap: wrap; gap: 0.5rem; min-width: 0; }
.ar-role-card__name { font-weight: 700; font-size: 1rem; }
.ar-role-card__desc { color: var(--color-text-muted); font-size: 0.875rem; margin: 0; }
.ar-role-card__footer {
  display: flex;
  margin-top: var(--space-2);
  padding-top: var(--space-3);
  border-top: 1px solid var(--color-border);
}
.ar-role-card__footer .btn-secondary {
  min-height: 44px;
}
.ar-role-card__meta {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.4rem;
  margin-top: auto;
  padding-top: var(--space-2);
  color: var(--color-text-muted);
  font-size: 0.8125rem;
}
.ar-meta-item strong { color: var(--color-text); }
.ar-meta-sep { color: var(--color-border); }
.ar-scope-chip {
  margin-left: auto;
  padding: 0.15rem 0.5rem;
  border-radius: 999px;
  background: #eff6ff;
  color: #1e40af;
  font-size: 0.7rem;
  font-weight: 600;
}

.ar-actions { display: flex; align-items: center; gap: 0.35rem; flex-shrink: 0; line-height: 0; }
.ar-actions__form { margin: 0; }
.ar-icon-btn {
  width: 44px;
  height: 44px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0;
  border-radius: var(--radius-sm);
  border: 1px solid var(--color-border);
  background: var(--color-surface);
  color: var(--color-text-muted);
  cursor: pointer;
  transition: background 0.12s ease, color 0.12s ease, border-color 0.12s ease;
}
.ar-icon-btn:hover {
  background: var(--color-surface-raised);
  color: var(--schoolise-blue);
  border-color: var(--schoolise-blue);
}
.ar-icon-btn--danger:hover {
  background: #fef2f2;
  color: #b91c1c;
  border-color: #fecaca;
}

.ar-empty {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: var(--space-3);
  padding: var(--space-6) var(--space-4);
}
.ar-empty__icon {
  width: 56px;
  height: 56px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  background: var(--color-surface-raised);
  color: var(--color-text-muted);
}
.ar-empty__text { color: var(--color-text-muted); margin: 0; }

@media (max-width: 640px) {
  .ar-grid { grid-template-columns: 1fr; }
}

.su-badge--system {
  background: #e0f2fe;
  color: #075985;
}

/* Portal role capability editor */
.ar-security-note {
  padding: var(--space-4);
  border-color: #bae6fd;
  background: #f0f9ff;
}
.ar-security-note__title {
  margin: 0 0 0.35rem;
  color: #0c4a6e;
  font-size: 0.95rem;
}
.ar-security-note p {
  margin: 0;
  color: #075985;
  font-size: 0.85rem;
  line-height: 1.5;
}
.ar-capability-groups {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--space-3);
  min-width: 0;
}
.ar-capability-group {
  min-width: 0;
  margin: 0;
  padding: var(--space-3);
}
.ar-capability-group__title {
  padding: 0 0.35rem;
  font-size: 0.95rem;
  font-weight: 700;
}
.ar-capability-list {
  display: flex;
  flex-direction: column;
}
.ar-capability-option {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-3);
  min-height: 4rem;
  padding: 0.65rem 0;
  border-top: 1px solid var(--color-border);
  cursor: pointer;
}
.ar-capability-option:first-child {
  border-top: 0;
}
.ar-capability-option__copy {
  display: flex;
  flex-direction: column;
  gap: 0.15rem;
  min-width: 0;
}
.ar-capability-option__label {
  font-size: 0.9rem;
  font-weight: 650;
}
.ar-capability-option__description {
  color: var(--color-text-muted);
  font-size: 0.8rem;
  line-height: 1.4;
  overflow-wrap: anywhere;
}
.ar-capability-switch {
  position: relative;
  display: inline-flex;
  flex: 0 0 auto;
  width: 2.75rem;
  height: 1.5rem;
}
.ar-capability-switch__input {
  position: absolute;
  width: 100%;
  height: 100%;
  margin: 0;
  opacity: 0;
  cursor: pointer;
}
.ar-capability-switch__visual {
  width: 100%;
  height: 100%;
  border-radius: 999px;
  background: #dc2626;
  box-shadow: inset 0 0 0 1px rgba(127, 29, 29, 0.2);
  pointer-events: none;
  transition: background 0.15s ease, box-shadow 0.15s ease;
}
.ar-capability-switch__visual::before {
  content: "";
  position: absolute;
  top: 0.2rem;
  left: 0.2rem;
  width: 1.1rem;
  height: 1.1rem;
  border-radius: 50%;
  background: #fff;
  transition: transform 0.15s ease;
}
.ar-capability-switch__input:checked + .ar-capability-switch__visual {
  background: #16a34a;
  box-shadow: inset 0 0 0 1px rgba(20, 83, 45, 0.2);
}
.ar-capability-switch__input:checked + .ar-capability-switch__visual::before {
  transform: translateX(1.25rem);
}
.ar-capability-switch__input:focus-visible + .ar-capability-switch__visual {
  outline: 3px solid var(--auth-accent-ring);
  outline-offset: 2px;
}
.ar-portal-form__actions {
  margin-top: var(--space-4);
}
.ar-portal-form__actions .btn-primary,
.ar-portal-form__actions .btn-secondary {
  min-height: 44px;
}

@media (min-width: 640px) {
  .ar-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (min-width: 900px) {
  .ar-capability-groups {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (min-width: 1100px) {
  .ar-grid:not(.ar-grid--system) {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

@media (max-width: 640px) {
  .stg-header__actions .btn-primary {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 44px;
  }
  .ar-role-card {
    min-width: 0;
  }
  .ar-role-card__head {
    align-items: center;
  }
  .ar-role-card__footer .btn-secondary,
  .ar-portal-form__actions .btn-primary,
  .ar-portal-form__actions .btn-secondary {
    width: 100%;
  }
}

/* Access role permission editor */
.ar-permissions { margin-top: var(--space-2); }
.ar-permissions__heading { font-size: 1rem; font-weight: 700; margin: 0 0 0.25rem; }
.ar-permissions__hint { color: var(--color-text-muted); font-size: 0.8125rem; margin: 0 0 var(--space-3); }
.ar-category { padding: var(--space-4); margin-bottom: var(--space-3); }
.ar-category__title { font-size: 0.9375rem; font-weight: 700; margin: 0 0 var(--space-3); }
.ar-permission-list { display: flex; flex-direction: column; gap: var(--space-2); }
.ar-permission {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: var(--space-3);
  padding: var(--space-2) 0;
  border-top: 1px solid var(--color-border);
}
.ar-permission:first-child { border-top: none; }
.ar-permission__toggle {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-3);
  min-width: 0;
  min-height: 44px;
  flex: 1;
  cursor: pointer;
}
.ar-permission__text { display: flex; flex-direction: column; gap: 0.1rem; min-width: 0; }
.ar-permission__label { font-weight: 600; font-size: 0.875rem; }
.ar-permission__desc { color: var(--color-text-muted); font-size: 0.8125rem; }
.ar-permission__scope { flex-shrink: 0; }
.ar-permission__scope-fixed { color: var(--color-text-muted); font-size: 0.8125rem; }

@media (max-width: 640px) {
  .ar-permission { flex-direction: column; }
  .ar-permission__scope { width: 100%; }
  .su-select--sm { width: 100%; }
}

/* Files */
.sf-storage-card {
  background: var(--color-surface-raised);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
  padding: var(--space-4);
  margin-bottom: var(--space-4);
}
.sf-storage-card__header { display: flex; flex-wrap: wrap; justify-content: space-between; gap: var(--space-2); margin-bottom: var(--space-3); font-size: 0.9rem; font-weight: 700; }
.sf-storage-bar { height: 0.5rem; background: #e2e8f0; border-radius: 999px; overflow: hidden; }
.sf-storage-bar__fill { height: 100%; border-radius: 999px; }
.sf-bulk-actions { padding: var(--space-3) var(--space-4); border-top: 1px solid var(--color-border); }

.sf-files-card__select-th {
  width: 2.75rem;
  text-align: center;
}
.sf-files-card__select-th input[type="checkbox"],
.sf-files-card .bl-table__td input[type="checkbox"] {
  width: 1.05rem;
  height: 1.05rem;
  cursor: pointer;
}
.sf-files-card__footer {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: var(--space-4);
  padding: var(--space-4) var(--space-4) var(--space-5);
  border-top: 1px solid var(--color-border);
  background: var(--color-surface, #f8fafc);
}
.sf-files-card__pager {
  display: flex;
  justify-content: center;
  width: 100%;
  padding-top: var(--space-1);
  padding-bottom: var(--space-2);
}
.sf-files-card__pager .kaminari-pager {
  gap: 0.5rem 0.55rem;
}
.sf-files-card__pager .kaminari-pager__pages {
  gap: 0.4rem 0.45rem;
}

.sf-category-filters {
  margin-bottom: var(--space-4);
}
.sf-category-filters__label {
  margin: 0 0 var(--space-2);
  font-size: 0.85rem;
  font-weight: 700;
  color: var(--color-text-muted, #64748b);
}
.sf-category-filters__chips {
  display: grid;
  gap: var(--space-2);
  grid-template-columns: 1fr;
}
.sf-category-chip {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: 0.15rem;
  min-height: 44px;
  padding: var(--space-3);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
  background: var(--color-surface-raised);
  cursor: pointer;
}
.sf-category-chip input {
  position: absolute;
  opacity: 0;
  pointer-events: none;
}
.sf-category-chip.is-active {
  border-color: var(--color-primary, #0f766e);
  box-shadow: inset 0 0 0 1px var(--color-primary, #0f766e);
}
.sf-category-chip__title {
  font-weight: 700;
  font-size: 0.95rem;
}
.sf-category-chip__meta {
  font-size: 0.8rem;
  color: var(--color-text-muted, #64748b);
}

.sf-delete-panel {
  margin-top: var(--space-4);
  padding: var(--space-4);
}
.sf-delete-panel__title {
  margin: 0 0 var(--space-1);
  font-size: 1.1rem;
}
.sf-delete-panel__subtitle {
  margin: 0 0 var(--space-4);
  color: var(--color-text-muted, #64748b);
  font-size: 0.9rem;
}
.sf-criteria-form__grid {
  display: grid;
  gap: var(--space-3);
  grid-template-columns: 1fr;
  margin-bottom: var(--space-4);
}
.sf-criteria-field label {
  display: block;
  margin-bottom: var(--space-1);
  font-weight: 600;
  font-size: 0.9rem;
}
.sf-criteria-field__inline {
  display: flex;
  align-items: center;
  gap: var(--space-2);
}
.sf-criteria-input {
  width: 6.5rem;
  min-height: 44px;
  padding: 0.5rem 0.75rem;
  border: 1px solid var(--color-border);
  border-radius: var(--radius-sm, 0.5rem);
}
.sf-criteria-uploader {
  border: 0;
  margin: 0 0 var(--space-4);
  padding: 0;
  min-inline-size: 0;
}
.sf-criteria-uploader legend {
  float: left;
  width: 100%;
  margin: 0 0 var(--space-2);
  padding: 0;
  font-weight: 700;
  font-size: 0.9rem;
}
.sf-criteria-uploader__options {
  clear: both;
  display: grid;
  gap: var(--space-2);
  grid-template-columns: 1fr;
}
.sf-criteria-uploader__option {
  display: flex;
  align-items: center;
  gap: 0.65rem;
  min-height: 44px;
  margin: 0;
  padding: 0.7rem 0.9rem;
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
  background: var(--color-surface-raised, #fff);
  cursor: pointer;
  transition: border-color 0.15s ease, box-shadow 0.15s ease;
}
.sf-criteria-uploader__option:has(.sf-criteria-uploader__radio:checked) {
  border-color: var(--schoolise-green, #2d6a4f);
  box-shadow: 0 0 0 3px rgba(45, 106, 79, 0.1);
}
.sf-criteria-uploader__radio {
  width: 1.05rem;
  height: 1.05rem;
  margin: 0;
  flex-shrink: 0;
  accent-color: var(--schoolise-green, #2d6a4f);
  cursor: pointer;
}
.sf-criteria-uploader__choice {
  font-size: 0.9rem;
  font-weight: 600;
  color: var(--color-text, #1e293b);
  line-height: 1.3;
}
.sf-criteria-form__actions {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-2);
}

@media (min-width: 640px) {
  .sf-category-filters__chips {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
  .sf-criteria-form__grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .sf-criteria-uploader__options {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .sf-files-card__footer {
    flex-direction: row;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-4);
    padding: var(--space-5) var(--space-4) calc(var(--space-5) + 0.25rem);
  }
  .sf-files-card__pager {
    flex: 1 1 auto;
    justify-content: center;
    padding-top: 0;
    padding-bottom: 0;
  }
}

/* Portal settings */
.portal-settings__stack { display: flex; flex-direction: column; gap: var(--space-3); margin-bottom: var(--space-4); }
.portal-setting-card {
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
  background: var(--color-surface-raised);
}
.portal-setting-card__inner {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-3);
  padding: var(--space-4);
}
.portal-setting-card__inner--stacked {
  align-items: stretch;
  flex-direction: column;
}
.portal-setting-card__title {
  font-size: 0.875rem;
  font-weight: 700;
  line-height: 1.3;
}
.portal-setting-card__hint { margin: 0.25rem 0 0; font-size: 0.8125rem; color: var(--color-text-muted); }
.portal-setting-card__mode-toggle { display: flex; align-items: center; gap: 0.75rem; }
.portal-setting-card__mode-label { font-size: 0.8125rem; font-weight: 600; color: var(--color-text-muted); }

.portal-calendar-preferences {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--space-3);
  width: 100%;
}

.portal-calendar-preferences__field {
  display: flex;
  flex-direction: column;
  gap: 0.4rem;
  min-width: 0;
}

.portal-calendar-preferences__field label {
  font-size: 0.8125rem;
  font-weight: 700;
  line-height: 1.3;
  color: var(--color-text);
}

.portal-calendar-preferences__select {
  width: 100%;
  min-height: 2.5rem;
  border: 1px solid var(--color-border);
  border-radius: var(--radius-sm);
  background: var(--color-surface);
  color: var(--color-text);
  padding: 0.45rem 0.65rem;
  font: inherit;
  font-size: 0.875rem;
  line-height: 1.3;
}

.portal-calendar-preferences__field--checkbox {
  grid-column: 1 / -1;
  gap: 0.25rem;
}

.portal-calendar-preferences__checkbox {
  display: inline-flex;
  align-items: center;
  gap: 0.65rem;
  min-height: 2.75rem;
  padding: 0.35rem 0;
  font-size: 0.875rem;
  font-weight: 600;
  line-height: 1.3;
  color: var(--color-text);
  cursor: pointer;
}

.portal-calendar-preferences__checkbox input[type="checkbox"] {
  width: 1.125rem;
  height: 1.125rem;
  margin: 0;
  flex-shrink: 0;
  accent-color: var(--color-primary);
}

.portal-calendar-preferences__field--checkbox .portal-setting-card__hint {
  margin: 0;
  padding-left: calc(1.125rem + 0.65rem);
}

.portal-calendar-preferences__section,
.portal-calendar-preferences__filters {
  grid-column: 1 / -1;
  border-top: 1px solid var(--color-border);
  padding-top: var(--space-3);
}

.portal-calendar-preferences__section-header,
.portal-calendar-preferences__filters-header {
  margin-bottom: var(--space-2);
}

.portal-calendar-preferences__section-header .portal-setting-card__title,
.portal-calendar-preferences__filters-header .portal-setting-card__title {
  font-size: 0.875rem;
  font-weight: 700;
  line-height: 1.3;
  color: var(--color-text);
}

.portal-calendar-preferences__section-header .portal-setting-card__hint,
.portal-calendar-preferences__filters-header .portal-setting-card__hint {
  margin: 0.35rem 0 0;
  font-size: 0.8125rem;
  line-height: 1.4;
  color: var(--color-text-muted);
}

.portal-calendar-preferences__filters-group + .portal-calendar-preferences__filters-group {
  margin-top: var(--space-3);
  padding-top: var(--space-3);
  border-top: 1px solid var(--color-border);
}

.portal-calendar-filters {
  display: grid;
  gap: 0.5rem;
}

.portal-calendar-filters__row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto auto;
  gap: 0.75rem;
  align-items: center;
  padding: 0.65rem 0.75rem;
  border: 1px solid var(--color-border);
  border-radius: var(--radius-sm);
  background: var(--color-surface);
}

.portal-calendar-filters__choice {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  min-width: 0;
  font-size: 0.875rem;
  font-weight: 600;
  line-height: 1.3;
}

.portal-calendar-filters__choice span {
  overflow-wrap: anywhere;
}

.portal-calendar-filters__status {
  color: var(--color-text-muted);
  font-size: 0.8125rem;
  line-height: 1.3;
  white-space: nowrap;
}

.portal-calendar-filters__actions {
  display: inline-flex;
  gap: 0.25rem;
}

.portal-calendar-filters__move {
  width: 2rem;
  height: 2rem;
  border: 1px solid var(--color-border);
  border-radius: var(--radius-sm);
  background: var(--color-surface-raised);
  color: var(--color-text);
  cursor: pointer;
  font-size: 0.875rem;
  line-height: 1;
}

.portal-calendar-filters__move:disabled {
  color: var(--color-text-muted);
  cursor: not-allowed;
  opacity: 0.45;
}

@media (max-width: 640px) {
  .portal-calendar-preferences {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 560px) {
  .portal-calendar-filters__row {
    grid-template-columns: minmax(0, 1fr) auto;
  }

  .portal-calendar-filters__status {
    grid-column: 1 / -1;
    grid-row: 2;
  }
}

.portal-switch { position: relative; display: inline-block; width: 2.75rem; height: 1.5rem; }
.portal-switch__input { opacity: 0; width: 0; height: 0; position: absolute; }
.portal-switch__visual {
  position: absolute;
  inset: 0;
  background: #cbd5e1;
  border-radius: 999px;
  transition: background 0.2s;
}
.portal-switch__visual::before {
  content: "";
  position: absolute;
  width: 1.125rem;
  height: 1.125rem;
  left: 0.2rem;
  top: 0.2rem;
  background: #fff;
  border-radius: 50%;
  transition: transform 0.2s;
}
.portal-switch__input:checked + .portal-switch__visual { background: var(--st-accent); }
.portal-switch__input:checked + .portal-switch__visual::before { transform: translateX(1.25rem); }

/* Confirm delete */
.cd-page { max-width: 580px; margin: 2.5rem auto; padding: 0 1rem; }
.cd-back { margin-bottom: var(--space-3); }
.cd-card { border: 1px solid var(--color-border); border-radius: var(--radius-md); overflow: hidden; background: var(--color-surface-raised); }
.cd-card__header { padding: var(--space-4); border-bottom: 1px solid var(--color-border); }
.cd-card__title { margin: 0; font-size: 1.25rem; }
.cd-card__org-name { margin: 0.25rem 0 0; color: var(--color-text-muted); }
.cd-card__body { padding: var(--space-4); }
.cd-intro { margin: 0 0 var(--space-3); }
.cd-list { margin: 0 0 var(--space-4); padding-left: 1.25rem; }
.cd-callout {
  background: #fef3c7;
  border: 1px solid #fde68a;
  border-radius: var(--radius-sm);
  padding: var(--space-3);
  font-size: 0.875rem;
  margin-bottom: var(--space-4);
}
.cd-confirm__label { margin-bottom: var(--space-3); }
.cd-delete-btn {
  width: 100%;
  min-height: 2.75rem;
  background: var(--color-danger);
  color: #fff;
  border: none;
  border-radius: var(--radius-sm);
  font-weight: 700;
  font-family: inherit;
  cursor: pointer;
}

@media (max-width: 640px) {
  .bl-table--stacked .bl-table__thead { display: none; }
  .bl-table--stacked .bl-table__row { display: block; border-bottom: 1px solid var(--color-border); padding: var(--space-3); }
  .bl-table--stacked .bl-table__td { display: flex; justify-content: space-between; gap: var(--space-2); padding: 0.35rem 0; border: none; }
  .bl-table--stacked .bl-table__td::before { content: attr(data-label); font-weight: 600; color: var(--color-text-muted); font-size: 0.75rem; }
  .oe-field-row { grid-template-columns: 1fr; }

  .sy-page {
    gap: 1rem;
  }

  .sy-page__header {
    flex-direction: column;
    align-items: stretch;
    gap: 0.75rem;
    margin-bottom: 0;
  }

  .sy-page__title {
    font-size: 1.2rem;
    word-break: break-word;
  }

  .sy-page__subtitle {
    line-height: 1.4;
  }

  .sy-page__title-row {
    align-items: flex-start;
  }

  .sy-show__toolbar {
    width: 100%;
  }

  .sy-show__toolbar-actions {
    flex-direction: column;
    align-items: stretch;
  }

  .sy-show__toolbar-actions .students-index__btn {
    width: 100%;
    justify-content: center;
    min-height: 44px;
  }

  .sy-form-card {
    padding: 1.15rem;
    max-width: 100%;
  }

  .sy-form__input--name {
    max-width: none;
  }

  .sy-form__date-row {
    flex-direction: column;
    gap: 0;
  }

  .sy-form__date-row > .sy-form__field {
    margin-bottom: 1rem;
  }

  .sy-form-card .btn-primary,
  .sy-form-card input[type="submit"].btn-primary {
    width: 100%;
  }

  .cl-row-actions,
  .cl-order-actions {
    justify-content: flex-start;
    flex-wrap: wrap;
  }

  .cl-icon-btn {
    width: 2.75rem;
    height: 2.75rem;
  }
}

/* Sites & Rooms */
.sr-page {
  gap: 1.5rem;
}

.sr-page__header-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--space-3);
}

.sr-page__toolbar {
  margin: 0;
}

.sr-page__toolbar .students-index__filters-form {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-3);
}

.sr-sites-list {
  display: flex;
  flex-direction: column;
  gap: 1.25rem;
}

.sr-empty-card {
  padding: 2.5rem 1.5rem;
  text-align: center;
}

.sr-empty-card__text {
  margin: 0;
  color: var(--color-text-muted);
  font-size: 0.95rem;
}

.sr-site-card {
  padding: 0;
  overflow: hidden;
}

.sr-site-card__header {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  justify-content: space-between;
  gap: var(--space-3);
  padding: 1.15rem 1.5rem;
  border-bottom: 1px solid var(--color-border-subtle, #e8edf3);
  background: linear-gradient(180deg, rgba(92, 83, 70, 0.06) 0%, transparent 100%);
}

.sr-site-card__title-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.5rem 0.75rem;
}

.sr-site-card__name {
  margin: 0;
  font-size: 1.05rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--schoolise-navy, #2c2825);
}

.sr-site-card__address {
  margin: 0.35rem 0 0;
  color: var(--color-text-muted, #5b6b7c);
  font-size: 0.92rem;
}

.sr-site-card__actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.65rem;
}

.sr-site-card__link {
  font-size: 0.88rem;
  font-weight: 600;
  color: var(--schoolise-blue, #5c5346);
  text-decoration: none;
  white-space: nowrap;
}

.sr-site-card__link:hover {
  text-decoration: underline;
}

.sr-site-card__body {
  padding: 1.25rem 1.5rem 1.5rem;
}

.sr-buildings-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 1.25rem;
}

.sr-building {
  min-width: 0;
  padding: 1rem 1.1rem;
  background: var(--color-surface-muted, #f9f8f4);
  border: 1px solid var(--color-border, #e8edf3);
  border-radius: var(--radius-sm, 8px);
}

.sr-building--unassigned {
  margin-top: 0.25rem;
}

.sr-building__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  margin-bottom: 0.75rem;
}

.sr-building__name {
  margin: 0;
  font-size: 0.92rem;
  font-weight: 700;
  color: var(--schoolise-navy, #2c2825);
}

.sr-building__edit {
  font-size: 0.82rem;
  font-weight: 600;
  color: var(--schoolise-blue, #5c5346);
  text-decoration: none;
  white-space: nowrap;
}

.sr-building__edit:hover {
  text-decoration: underline;
}

.sr-building__empty,
.sr-site-card__empty {
  margin: 0;
  color: var(--color-text-muted, #5b6b7c);
  font-size: 0.88rem;
}

.sr-room-table {
  margin: 0;
  background: var(--color-surface-raised, #fff);
  border-radius: var(--radius-sm, 8px);
  overflow: hidden;
}

.sr-room-table .bl-table__th {
  background: var(--color-surface, #fafbfc);
}

.sr-room-table .bl-table__td {
  font-size: 0.88rem;
}

.sr-room-table__actions {
  text-align: right;
  white-space: nowrap;
}

.sr-room-type {
  display: inline-block;
  padding: 0.15rem 0.5rem;
  border-radius: 999px;
  background: rgba(30, 58, 138, 0.08);
  color: var(--schoolise-blue, #5c5346);
  font-size: 0.78rem;
  font-weight: 600;
  white-space: nowrap;
}

.sr-form-context {
  margin: 0 0 1rem;
  color: var(--color-text-muted, #5b6b7c);
}

.sr-feature-check {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  font-size: 0.9rem;
  cursor: pointer;
  padding: 0.35rem 0;
  min-height: 2rem;
}

.sr-feature-check input[type="checkbox"] {
  width: 1.05rem;
  height: 1.05rem;
  flex-shrink: 0;
}

@media (min-width: 768px) {
  .sr-buildings-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (min-width: 1100px) {
  .sr-buildings-grid--multi {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

@media (max-width: 640px) {
  .sr-page__header-actions {
    width: 100%;
    justify-content: space-between;
  }

  .sr-site-card__header {
    flex-direction: column;
  }

  .sr-site-card__actions {
    width: 100%;
  }

  .sr-form-shell {
    padding: 1.15rem;
  }
}
/* Lesson recording settings */
.lesson-recording-settings-page .lesson-recording-settings__form {
  display: flex;
  flex-direction: column;
  gap: var(--space-3);
}

.lesson-recording-settings-page .lesson-recording-settings__card {
  margin-bottom: 0;
}

.lesson-recording-settings__card-header {
  justify-content: space-between;
}

.lesson-recording-settings__add-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  width: 2rem;
  height: 2rem;
  padding: 0;
  border: 1px solid var(--color-border);
  border-radius: 999px;
  background: #fff;
  color: var(--st-accent, #5c5346);
  cursor: pointer;
  transition: background 0.12s ease, border-color 0.12s ease, color 0.12s ease;
}

.lesson-recording-settings__add-btn:hover,
.lesson-recording-settings__add-btn:focus-visible {
  background: var(--st-bg-secondary, #f3f0ea);
  border-color: var(--st-accent, #5c5346);
  color: var(--st-accent-strong, #433a32);
  outline: 2px solid rgba(67, 58, 50, 0.18);
  outline-offset: 1px;
}

.lesson-recording-settings__subheader {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  padding: var(--space-3) var(--space-4) 0;
}

.lesson-recording-settings__subheader .lesson-recording-settings__subheading {
  padding: 0;
  margin: 0;
}

.lesson-recording-settings__section-body .stg-hint {
  border-bottom: 1px solid var(--color-border);
}

.lesson-recording-settings__table {
  padding: 0 var(--space-4) var(--space-3);
  overflow-x: auto;
}

.lesson-recording-settings__rows {
  display: flex;
  flex-direction: column;
}

.lesson-recording-settings-row {
  display: grid;
  gap: 0.65rem;
  align-items: center;
  padding: 0.75rem 0;
  border-bottom: 1px solid var(--color-border);
  min-width: 0;
}

.lesson-recording-settings-row:last-child {
  border-bottom: none;
}

.lesson-recording-settings-row--attendance {
  grid-template-columns: minmax(8rem, 2fr) minmax(4rem, 0.75fr) minmax(6rem, 1fr) minmax(6rem, 1fr) 3.5rem;
}

.lesson-recording-settings-row--indicator,
.lesson-recording-settings-row--system {
  grid-template-columns: minmax(0, 28rem) 3.5rem;
}

.lesson-recording-settings-row--scale {
  grid-template-columns: minmax(8rem, 2fr) minmax(4rem, 0.75fr) minmax(4.5rem, 0.75fr) 3.5rem;
}

.lesson-recording-settings-row--grade {
  grid-template-columns: minmax(6rem, 12rem) minmax(4.5rem, 0.75fr) 3.5rem;
}

.lesson-recording-settings-row--new {
  background: linear-gradient(180deg, rgba(45, 106, 79, 0.04) 0%, transparent 100%);
}

.lesson-recording-settings-row .sy-form__input {
  margin: 0;
  min-width: 0;
  min-height: 2.5rem;
  font-size: 0.875rem;
}

.lesson-recording-settings__active-cell {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 2.75rem;
}

.lesson-recording-settings__active-cell input[type="checkbox"] {
  width: 1rem;
  height: 1rem;
  margin: 0;
  cursor: pointer;
}

.lesson-recording-settings__remove-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 2rem;
  height: 2rem;
  padding: 0;
  border: 1px solid var(--color-border);
  border-radius: 999px;
  background: #fff;
  color: #78716c;
  font-size: 1.25rem;
  line-height: 1;
  cursor: pointer;
  transition: background 0.12s ease, border-color 0.12s ease, color 0.12s ease;
}

.lesson-recording-settings__remove-btn:hover,
.lesson-recording-settings__remove-btn:focus-visible {
  background: #fee2e2;
  border-color: #fca5a5;
  color: #b91c1c;
  outline: 2px solid rgba(185, 28, 28, 0.15);
  outline-offset: 1px;
}

.lesson-recording-settings__table-head {
  display: none;
}

.lesson-recording-settings__subheading {
  margin: 0;
  padding: var(--space-3) var(--space-4) 0;
  font-size: 0.875rem;
  font-weight: 700;
  color: var(--color-text);
}

.lesson-recording-settings__grade-group {
  border-top: 1px solid var(--color-border);
  margin-top: var(--space-2);
  padding-top: var(--space-2);
}

.lesson-recording-settings__grade-group .lesson-recording-settings__table {
  padding-top: 0.35rem;
}

.lesson-recording-settings__actions {
  display: flex;
  justify-content: flex-end;
  padding: var(--space-3) 0 var(--space-2);
}

.lesson-recording-settings__actions .btn-primary {
  min-height: 2.75rem;
}

@media (min-width: 768px) {
  .lesson-recording-settings__table-head {
    display: grid;
    gap: 0.65rem;
    align-items: end;
    padding: 0.85rem 0 0.35rem;
    border-bottom: 1px solid var(--color-border);
    font-size: 0.75rem;
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: var(--color-text-muted);
  }

  .lesson-recording-settings__table-head--attendance {
    grid-template-columns: minmax(8rem, 2fr) minmax(4rem, 0.75fr) minmax(6rem, 1fr) minmax(6rem, 1fr) 3.5rem;
  }

  .lesson-recording-settings__table-head--indicator {
    grid-template-columns: minmax(0, 28rem) 3.5rem;
  }

  .lesson-recording-settings__table-head--scale {
    grid-template-columns: minmax(8rem, 2fr) minmax(4rem, 0.75fr) minmax(4.5rem, 0.75fr) 3.5rem;
  }

  .lesson-recording-settings__table-head--grade {
    grid-template-columns: minmax(6rem, 12rem) minmax(4.5rem, 0.75fr) 3.5rem;
  }

  .lesson-recording-settings__table-head span:last-child {
    text-align: center;
  }
}

@media (max-width: 640px) {
  .lesson-recording-settings__table {
    padding-inline: var(--space-3);
  }

  .lesson-recording-settings-row,
  .lesson-recording-settings-row--attendance,
  .lesson-recording-settings-row--indicator,
  .lesson-recording-settings-row--scale,
  .lesson-recording-settings-row--grade,
  .lesson-recording-settings-row--system {
    grid-template-columns: 1fr;
    padding: 0.85rem 0;
  }

  .lesson-recording-settings__active-cell,
  .lesson-recording-settings__remove-btn {
    justify-content: flex-start;
    min-height: auto;
  }

  .lesson-recording-settings__subheading {
    padding-inline: var(--space-3);
  }
}

.groups-form__card--lesson-recording {
  margin-top: 0;
}

.groups-form__lesson-recording-header {
  margin-bottom: 1rem;
}

.groups-form__lesson-recording-toggles {
  display: grid;
  gap: 0.75rem;
  margin-bottom: 1.25rem;
}

.groups-form__toggle-row {
  display: flex;
  align-items: flex-start;
  gap: 0.85rem;
  padding: 0.85rem 1rem;
  border: 0.5px solid var(--st-border-tertiary, #e8e4dc);
  border-radius: var(--st-radius-md, 10px);
  background: var(--st-bg-secondary, #fafaf9);
  cursor: pointer;
}

.groups-form__toggle-input {
  margin-top: 0.2rem;
  width: 1rem;
  height: 1rem;
  flex-shrink: 0;
}

.groups-form__toggle-copy {
  display: flex;
  flex-direction: column;
  gap: 0.2rem;
  min-width: 0;
}

.groups-form__toggle-label {
  font-size: 0.9375rem;
  font-weight: 600;
  color: var(--st-text-primary, #1c1917);
}

.groups-form__toggle-hint {
  font-size: 0.8125rem;
  color: var(--st-text-secondary, #57534e);
  line-height: 1.45;
}

.groups-form__field--grading-system {
  margin-bottom: 0;
  padding-top: 0.25rem;
  border-top: 0.5px solid var(--st-border-tertiary, #e8e4dc);
}

@media (min-width: 768px) {
  .groups-form__lesson-recording-toggles {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}
.tag-settings-form, .tag-settings-list { padding: 1.5rem; }
.tag-settings-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(17rem, 1fr)); gap: 1rem; }.tag-settings-card { position: relative; display: flex; gap: .8rem; min-height: 8rem; padding: 1rem; border: 1px solid var(--color-border, #e8e4dc); border-radius: var(--radius-md, 10px); background: var(--color-surface-raised, #fff); box-shadow: 0 1px 2px rgba(45, 41, 38, .03); }.tag-settings-card__icon { display: grid; place-items: center; width: 2.25rem; height: 2.25rem; padding: 0; flex: 0 0 auto; border-radius: .6rem; }.tag-settings-card__body { min-width: 0; padding-right: 1.75rem; }.tag-settings-card__title-row { display: flex; align-items: center; gap: .5rem; }.tag-settings-card h2 { margin: 0; color: var(--color-text, #2d2926); font-size: .98rem; line-height: 1.35; }.tag-settings-card__status { color: var(--color-text-muted, #64748b); font-size: .75rem; }.tag-settings-card__description { margin: .35rem 0 0; color: var(--color-text-muted, #64748b); font-size: .82rem; line-height: 1.4; }.tag-settings-card__types { display: flex; flex-wrap: wrap; gap: .35rem; margin-top: .65rem; }.tag-settings-card__types span { display: inline-flex; align-items: center; min-height: 1.5rem; padding: .08rem .45rem; border: 1px solid #d9e5dd; border-radius: 999px; background: #f5faf7; color: #3c6250; font-size: .72rem; font-weight: 600; line-height: 1.25; }.tag-settings-card__edit { position: absolute; top: .75rem; right: .75rem; display: grid; place-items: center; width: 2rem; height: 2rem; border-radius: .45rem; color: var(--color-text-muted, #64748b); }.tag-settings-card__edit:hover { color: var(--st-nav-accent, #2d6a4f); background: #f1f7f3; }
.tag-settings-form__types { display: grid; gap: .5rem; border: 0; padding: 0; margin: 1rem 0; }
.tag-settings-form__types legend { font-weight: 600; margin-bottom: .5rem; }
.tag-chip { display: inline-flex; align-items: center; border-radius: 999px; padding: .2rem .55rem; font-size: .82rem; font-weight: 600; line-height: 1.25; }
.tag-chip--slate { background: #475569; color: #fff; }.tag-chip--blue { background: #2563eb; color: #fff; }.tag-chip--indigo { background: #4f46e5; color: #fff; }.tag-chip--green { background: #15803d; color: #fff; }.tag-chip--teal { background: #0f766e; color: #fff; }.tag-chip--amber { background: #b45309; color: #fff; }.tag-chip--orange { background: #c2410c; color: #fff; }.tag-chip--red { background: #dc2626; color: #fff; }.tag-chip--purple { background: #7e22ce; color: #fff; }.tag-chip--pink { background: #be185d; color: #fff; }
.tag-assignment { margin-top: 1rem; }.tag-assignment__chips, .tag-assignment__add { display: flex; flex-wrap: wrap; gap: .5rem; align-items: center; }.tag-assignment__chip { display: inline-flex; align-items: center; gap: .15rem; }.tag-assignment__remove { border: 0; background: transparent; color: #64748b; cursor: pointer; font-size: 1rem; line-height: 1; }.tag-assignment__add { margin-top: .65rem; }
.tag-settings-empty-card { min-height: 12rem; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: .75rem; border: 1px dashed var(--color-border, #d6d3d1); border-radius: var(--radius-lg, 12px); color: var(--color-text-muted, #64748b); background: var(--color-surface-raised, #fff); font-weight: 600; text-decoration: none; transition: border-color .15s ease, color .15s ease, background .15s ease; }.tag-settings-empty-card:hover { border-color: var(--st-nav-accent, #2d6a4f); color: var(--st-nav-accent, #2d6a4f); background: #f7fbf8; }.tag-settings-empty-card__icon { width: 2.5rem; height: 2.5rem; display: grid; place-items: center; border-radius: 50%; background: #e8f3ec; font-size: 1.65rem; font-weight: 400; line-height: 1; }
.tag-filter { display: flex; flex: 1 0 100%; width: 100%; align-items: center; flex-wrap: wrap; gap: .6rem; margin-top: .8rem; padding: .65rem .75rem; border: 1px solid var(--st-border-tertiary, #e8e4dc); border-radius: var(--st-radius-md, 8px); background: var(--st-bg-secondary, #faf9f7); box-sizing: border-box; }.tag-filter__label { color: var(--st-text-secondary, #5b6b7c); font-size: .72rem; font-weight: 700; text-transform: uppercase; letter-spacing: .06em; white-space: nowrap; }.tag-filter__choices { display: flex; flex-wrap: wrap; gap: .35rem; }.tag-filter__choice { position: relative; display: inline-flex; align-items: center; padding: .3rem .58rem; border: 1px solid transparent; border-radius: 999px; cursor: pointer; font-size: .76rem; font-weight: 650; transition: border-color .15s ease, background .15s ease, color .15s ease; }.tag-filter__choice input { position: absolute; opacity: 0; pointer-events: none; }.tag-filter__choice:has(input:not(:checked)) { background: #fff; color: var(--st-text-secondary, #5b6b7c); border-color: var(--st-border-secondary, #d6d3d1); }.tag-filter__choice:has(input:checked) { box-shadow: 0 1px 1px rgba(28, 25, 23, .12); }.tag-filter__match { display: inline-flex; align-items: center; overflow: hidden; margin-left: auto; border: 1px solid var(--st-border-secondary, #d6d3d1); border-radius: .45rem; background: #fff; }.tag-filter__match label { padding: .3rem .5rem; color: var(--st-text-secondary, #5b6b7c); font-size: .75rem; cursor: pointer; }.tag-filter__match label:has(input:checked) { background: #ebe8e2; color: var(--st-text-primary, #2d2926); font-weight: 700; }.tag-filter__match input { position: absolute; opacity: 0; }.tag-filter__apply { border: 0; border-radius: .45rem; padding: .42rem .72rem; background: var(--st-accent, #5c5346); color: #fff; font: inherit; font-size: .75rem; font-weight: 700; cursor: pointer; }.tag-filter__clear { color: var(--st-accent, #5c5346); font-size: .75rem; font-weight: 700; text-decoration: none; } @media (max-width: 720px) { .tag-filter__match { margin-left: 0; } }
.students-index__toolbar:has(.tag-filter) { align-items: flex-start; }.students-index__toolbar:has(.tag-filter) .students-index__view-toggle { margin-top: 0; }
.tag-settings-form__shell { max-width: 52rem; }.tag-settings-form__row { display: grid; grid-template-columns: minmax(0, 1fr) minmax(8rem, .38fr); gap: 1rem; }.tag-settings-form__hint { margin: -.25rem 0 1rem; color: var(--color-text-muted, #64748b); font-size: .88rem; }.tag-settings-form__types { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .75rem; padding: 0; border: 0; margin: 0; }.tag-settings-form__type { display: flex; gap: .65rem; align-items: flex-start; padding: .75rem; border: 1px solid var(--color-border, #e8e4dc); border-radius: var(--radius-sm, 7px); cursor: pointer; }.tag-settings-form__type:hover { border-color: var(--st-nav-accent, #2d6a4f); background: #f7fbf8; }.tag-settings-form__type input { margin-top: .2rem; }.tag-settings-form__type strong, .tag-settings-form__type small { display: block; }.tag-settings-form__type strong { font-size: .9rem; color: var(--color-text, #2d2926); }.tag-settings-form__type small { margin-top: .15rem; color: var(--color-text-muted, #64748b); font-size: .78rem; line-height: 1.35; } @media (max-width: 640px) { .tag-settings-form__row, .tag-settings-form__types { grid-template-columns: 1fr; } }
.tag-settings-form__footer { grid-column: 1 / -1; display: flex; align-items: center; justify-content: space-between; gap: 1rem; margin-top: .25rem; padding-top: 1.25rem; border-top: 1px solid var(--color-border, #e8e4dc); }.tag-settings-form__active { margin: 0; }.tag-settings-form__actions { display: flex; flex-wrap: wrap; align-items: center; justify-content: flex-end; gap: .65rem; margin: 0; padding: 0; border: 0; }.tag-settings-form__actions .btn-primary, .tag-settings-form__actions .students-index__btn { min-height: 2.75rem; }.tag-settings-form__actions .students-index__btn { display: inline-flex; align-items: center; justify-content: center; } @media (max-width: 640px) { .tag-settings-form__footer { align-items: stretch; flex-direction: column; }.tag-settings-form__actions { align-items: stretch; flex-direction: column; }.tag-settings-form__actions .btn-primary, .tag-settings-form__actions .students-index__btn { width: 100%; } }
.tag-colour-picker { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .45rem; }.tag-colour-picker__option { display: flex; align-items: center; gap: .45rem; min-height: 2.25rem; padding: .35rem .5rem; border: 1px solid var(--color-border, #e8e4dc); border-radius: var(--radius-sm, 7px); cursor: pointer; font-size: .84rem; color: var(--color-text, #2d2926); }.tag-colour-picker__option:has(input:checked) { border-color: var(--st-nav-accent, #2d6a4f); box-shadow: 0 0 0 2px rgba(45, 106, 79, .12); }.tag-colour-picker__input { position: absolute; opacity: 0; }.tag-colour-picker__swatch { width: 1.25rem; height: 1.25rem; padding: 0; flex: 0 0 auto; border: 1px solid rgba(0,0,0,.08); } @media (max-width: 640px) { .tag-colour-picker { grid-template-columns: 1fr; } }

/* Communication classification settings */
.portal-messaging-settings__form { display: grid; gap: var(--space-4); }
.portal-messaging-settings__card-header { align-items: flex-start; }
.portal-messaging-settings__card-header .stg-hint { margin: .3rem 0 0; }
.portal-messaging-settings__body { padding: var(--space-4); }
.portal-messaging-settings__classification-head, .portal-messaging-settings__classification-row { display: grid; grid-template-columns: minmax(14rem, 1fr) 9rem; gap: var(--space-3); align-items: center; }
.portal-messaging-settings__classification-head { padding: 0 var(--space-3) var(--space-2); color: var(--color-text-muted); font-size: .72rem; font-weight: 700; letter-spacing: .05em; text-transform: uppercase; }
.portal-messaging-settings__classification-row { padding: var(--space-3); border-top: 1px solid var(--color-border); }
.portal-messaging-settings__classification-name { min-width: 0; }
.portal-messaging-settings__badges { display: flex; flex-wrap: wrap; gap: .35rem; margin-top: .45rem; }
.portal-messaging-settings__badge { display: inline-flex; padding: .15rem .5rem; border-radius: 999px; background: var(--st-bg-secondary); color: var(--color-text-muted); font-size: .7rem; font-weight: 650; }
.portal-messaging-settings__badge--restricted { background: #fef2f2; color: #991b1b; }
.portal-messaging-settings__badge--standard { background: #f0fdf4; color: #166534; }
.portal-messaging-settings__active { display: flex; align-items: center; gap: .55rem; color: var(--color-text); font-size: .85rem; font-weight: 600; }
.portal-messaging-settings__active input { width: 1rem; height: 1rem; flex: 0 0 auto; }
.portal-messaging-settings__add { display: grid; grid-template-columns: minmax(12rem, .55fr) minmax(14rem, 1fr); gap: var(--space-4); align-items: end; margin-top: var(--space-3); padding: var(--space-4); border-radius: var(--radius-sm); background: var(--st-bg-secondary); }
.portal-messaging-settings__add .stg-hint { margin: .25rem 0 0; }
.portal-messaging-settings__actions { display: flex; justify-content: flex-end; gap: var(--space-2); }
.portal-messaging-settings__error { padding: var(--space-3) var(--space-4); border: 1px solid #fecaca; border-radius: var(--radius-sm); background: #fef2f2; color: #991b1b; }
@media (max-width: 720px) { .portal-messaging-settings__classification-head { display: none; }.portal-messaging-settings__classification-row, .portal-messaging-settings__add { grid-template-columns: 1fr; }.portal-messaging-settings__classification-row { align-items: start; } }

/* Learning reports organisation settings */
.learning-reports-settings {
  max-width: 56rem;
}

.learning-reports-settings__summary {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--space-3);
}

.learning-reports-settings__stat {
  display: flex;
  flex-direction: column;
  gap: 0.35rem;
  min-width: 0;
  padding: 1rem 1.1rem;
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
  background: var(--color-surface-raised);
}

.learning-reports-settings__stat-label {
  color: var(--color-text-muted);
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.05em;
  text-transform: uppercase;
}

.learning-reports-settings__stat-value {
  color: var(--auth-heading, #2d2926);
  font-size: 0.98rem;
  font-weight: 700;
  line-height: 1.35;
  word-break: break-word;
}

.learning-reports-settings__links {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.45rem 0.55rem;
  min-height: 1.5rem;
}

.learning-reports-settings__links .nav-link {
  font-size: 0.875rem;
  font-weight: 650;
}

.learning-reports-settings__form {
  display: grid;
  gap: var(--space-4);
}

.learning-reports-settings__card .stg-card__header {
  align-items: flex-start;
}

.learning-reports-settings__card .stg-hint {
  margin: 0.3rem 0 0;
}

.learning-reports-settings__body {
  display: grid;
  gap: var(--space-4);
  padding: var(--space-4);
}

.learning-reports-settings__enable {
  margin: 0;
}

.learning-reports-settings__grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--space-3);
}

.learning-reports-settings__grid .groups-form__field {
  margin: 0;
  min-width: 0;
}

.learning-reports-settings__grid .groups-form__input,
.learning-reports-settings__grid .groups-form__select,
.learning-reports-settings__grid .groups-form__textarea {
  width: 100%;
  max-width: 100%;
}

.learning-reports-settings__grid .stg-hint {
  margin: 0.35rem 0 0;
}

.learning-reports-settings__checks {
  display: grid;
  gap: 0.65rem;
}

.learning-reports-settings__checks--grid {
  grid-template-columns: 1fr;
}

.learning-reports-settings__check {
  display: flex;
  align-items: flex-start;
  gap: 0.7rem;
  min-height: 2.75rem;
  margin: 0;
  padding: 0.75rem 0.9rem;
  border: 1px solid var(--color-border);
  border-radius: var(--radius-sm);
  background: var(--st-bg-secondary, #fafaf9);
  cursor: pointer;
}

.learning-reports-settings__check input {
  width: 1rem;
  height: 1rem;
  margin-top: 0.15rem;
  flex: 0 0 auto;
}

.learning-reports-settings__check span {
  color: var(--color-text);
  font-size: 0.9rem;
  font-weight: 600;
  line-height: 1.4;
}

.learning-reports-settings__actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: var(--space-2);
  padding-top: 0.25rem;
}

.learning-reports-settings__actions .btn-primary,
.learning-reports-settings__actions .btn-secondary {
  min-height: 2.75rem;
}

.learning-reports-settings__preview-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--space-4);
}

.learning-reports-settings__preview-form {
  display: grid;
  gap: var(--space-3);
  min-width: 0;
  padding: 1rem;
  border: 1px solid var(--color-border);
  border-radius: var(--radius-sm);
  background: var(--st-bg-secondary, #fafaf9);
}

.learning-reports-settings__preview-form .groups-form__field {
  margin: 0;
}

.learning-reports-settings__preview-form .groups-form__select {
  width: 100%;
}

.learning-reports-settings__preview-form .btn-secondary {
  justify-self: start;
  min-height: 2.75rem;
}

@media (min-width: 640px) {
  .learning-reports-settings__summary {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .learning-reports-settings__stat--links {
    grid-column: 1 / -1;
  }

  .learning-reports-settings__checks--grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .learning-reports-settings__grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .learning-reports-settings__field--wide,
  .learning-reports-settings__grid--single .groups-form__field {
    grid-column: 1 / -1;
  }

  .learning-reports-settings__preview-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (min-width: 900px) {
  .learning-reports-settings__summary {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .learning-reports-settings__stat--links {
    grid-column: auto;
  }
}

@media (max-width: 640px) {
  .learning-reports-settings__actions {
    flex-direction: column-reverse;
    align-items: stretch;
  }

  .learning-reports-settings__actions .btn-primary,
  .learning-reports-settings__actions .btn-secondary,
  .learning-reports-settings__preview-form .btn-secondary {
    width: 100%;
    justify-self: stretch;
  }
}

/* Contact file categories */
.contact-file-categories__add-body {
  padding: var(--space-4);
}

.contact-file-categories__form-grid {
  display: grid;
  grid-template-columns: minmax(12rem, 1fr) 7.5rem auto;
  gap: 1rem;
  align-items: end;
}

.contact-file-categories__form-grid .sy-form__field {
  margin-bottom: 0;
  min-width: 0;
}

.contact-file-categories__form-grid .sy-form__input {
  width: 100%;
  max-width: none;
  box-sizing: border-box;
}

.contact-file-categories__active {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  min-height: 2.75rem;
  font-size: 0.88rem;
  font-weight: 500;
  color: var(--color-text);
  cursor: pointer;
}

.contact-file-categories__active input[type="checkbox"] {
  width: 1.05rem;
  height: 1.05rem;
  flex-shrink: 0;
}

.contact-file-categories__actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.75rem;
  margin-top: 1.25rem;
  padding-top: 1rem;
  border-top: 1px solid var(--color-border);
}

@media (max-width: 700px) {
  .contact-file-categories__form-grid {
    grid-template-columns: 1fr;
    align-items: stretch;
  }

  .contact-file-categories__active {
    min-height: 0;
  }

  .contact-file-categories__actions {
    flex-direction: column-reverse;
    align-items: stretch;
  }

  .contact-file-categories__actions .btn-primary,
  .contact-file-categories__actions .students-index__btn {
    width: 100%;
    justify-content: center;
  }
}
/*
 * Academic structure — courses and classes
 */

.groups-index__name-sub {
  margin-top: 0.15rem;
  font-size: 0.78rem;
  color: var(--color-text-muted);
  line-height: 1.35;
}

.groups-index__card-context {
  display: block;
  color: var(--color-text-muted);
  font-size: 0.82rem;
  line-height: 1.4;
}

.ac-page {
  max-width: 72rem;
  margin: 0 auto;
  padding: clamp(1rem, 3vw, 2rem);
}

.ac-hub-grid {
  display: grid;
  gap: 1rem;
  grid-template-columns: 1fr;
}

@media (min-width: 640px) {
  .ac-hub-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

.ac-card-list {
  display: grid;
  gap: 0.75rem;
}

.ac-course-card {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  padding: 1rem 1.25rem;
  border: 1px solid var(--st-border, #e2e8f0);
  border-radius: 0.75rem;
  background: #fff;
}

.ac-course-card__main {
  display: flex;
  align-items: center;
  gap: 0.875rem;
  min-width: 0;
}

.ac-course-card__swatch {
  width: 2.5rem;
  height: 2.5rem;
  border-radius: 0.5rem;
  flex-shrink: 0;
  background: var(--st-teal, #2d6a4f);
}

.ac-course-card__name {
  font-weight: 600;
  color: var(--st-navy, #1c1917);
}

.ac-course-card__meta {
  font-size: 0.875rem;
  color: var(--st-muted, #64748b);
}

.ac-course-card__actions {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  flex-shrink: 0;
}

.ac-year-levels {
  margin-top: 1.5rem;
  padding: 1.25rem;
  border: 1px solid var(--st-border, #e2e8f0);
  border-radius: 0.75rem;
  background: #fff;
}

.ac-year-levels-setup {
  min-width: 0;
}

.ac-year-levels-setup__main {
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 1.25rem;
}

.ac-year-levels-panels {
  display: flex;
  flex-direction: column;
  gap: 1.75rem;
  margin-top: 0.5rem;
  padding-top: 1.25rem;
  border-top: 1px solid var(--color-border, #e8e4dc);
}

.ac-year-levels-setup .ac-year-levels-empty {
  margin-top: 0.25rem;
}

.ac-year-levels-panel__header {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
  margin-bottom: 0.25rem;
}

.ac-year-levels-panel__header .sr-form-section__title {
  margin-bottom: 0.35rem;
  padding-bottom: 0;
  border-bottom: 0;
}

.ac-year-levels-panel__header .ac-year-levels__hint {
  margin-bottom: 0;
}

.ac-year-levels-panel__header .ac-year-levels__select-all {
  margin-top: 0.75rem;
}

.ac-year-levels-panel__header .ac-year-levels__toolbar {
  margin-top: 0.75rem;
}

.ac-year-levels__heading {
  font-size: 1rem;
  font-weight: 600;
  color: var(--st-navy, #1c1917);
  margin: 1.25rem 0 0.25rem;
}

.ac-year-levels__hint {
  font-size: 0.875rem;
  color: var(--st-muted, #64748b);
  margin: 0 0 1rem;
  line-height: 1.45;
}

.ac-year-levels__toolbar {
  margin: 0;
  flex-shrink: 0;
}

.ac-year-levels__select-all {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  min-height: 2.75rem;
  padding: 0.15rem 0.75rem 0.15rem 0.15rem;
  border: 1px solid var(--color-border, #e8e4dc);
  border-radius: 999px;
  background: var(--color-surface-muted, #f9f8f4);
  color: var(--color-text-muted, #5b6b7c);
  cursor: pointer;
  user-select: none;
}

.ac-year-levels__select-all .ac-year-level-row__check {
  width: 2.4rem;
  height: 2.4rem;
}

.ac-year-levels__select-all-label {
  font-size: 0.875rem;
  font-weight: 600;
  line-height: 1.2;
  padding-right: 0.35rem;
  white-space: nowrap;
}

.ac-year-levels-empty {
  padding: 1.5rem 1.25rem;
  border: 1px dashed var(--color-border, #e8e4dc);
  border-radius: var(--radius-md, 0.625rem);
  background: var(--color-surface-muted, #f9f8f4);
  text-align: center;
}

.ac-year-levels-empty__text,
.ac-year-levels-inline-empty p {
  margin: 0;
  font-size: 0.9375rem;
  line-height: 1.5;
  color: var(--color-text-muted, #5b6b7c);
}

.ac-year-levels-inline-empty {
  padding: 1rem 0.25rem 0.25rem;
}

.ac-year-levels__grid {
  display: grid;
  gap: 0.5rem 1.5rem;
  grid-template-columns: 1fr;
}

.ac-year-levels__rows {
  display: grid;
  grid-template-columns: 1fr;
  gap: 0.65rem;
  margin: 0.75rem 0 0;
}

.ac-year-levels__rows--custom {
  margin-bottom: 0.85rem;
}

.ac-year-levels__add-custom {
  margin-top: 0.25rem;
}

.ac-year-level-row {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  gap: 0.75rem;
  align-items: center;
  padding: 0.7rem 0.85rem;
  background: var(--color-surface-raised, #fff);
  border: 1px solid var(--color-border, #e8e4dc);
  border-radius: var(--radius-sm, 8px);
  min-width: 0;
}

.ac-year-level-row--custom {
  background: linear-gradient(180deg, rgba(30, 58, 138, 0.03) 0%, #fff 100%);
}

.ac-year-level-row--existing {
  background: var(--color-surface-muted, #f9f8f4);
}

.ac-year-level-row--existing .sy-form__input {
  opacity: 0.8;
  background: transparent;
}

.ac-year-level-row .sy-form__input {
  margin: 0;
  min-width: 0;
}

.ac-year-level-row__check {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 2.75rem;
  height: 2.75rem;
  margin: 0;
  cursor: pointer;
  flex-shrink: 0;
}

.ac-year-level-row__check input[type="checkbox"] {
  position: absolute;
  opacity: 0;
  inset: 0;
  margin: 0;
  cursor: pointer;
}

.ac-year-level-row__box {
  width: 1.15rem;
  height: 1.15rem;
  border: 1.5px solid var(--color-border-strong, #cfc8bb);
  border-radius: 0.3rem;
  background: #fff;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.7);
}

.ac-year-level-row__check input[type="checkbox"]:checked + .ac-year-level-row__box {
  border-color: var(--schoolise-blue, #5c5346);
  background: var(--schoolise-blue, #5c5346);
  box-shadow: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='%23fff' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='3.5 8.5 6.5 11.5 12.5 4.5'/%3E%3C/svg%3E");
  background-size: 0.85rem 0.85rem;
  background-repeat: no-repeat;
  background-position: center;
}

.ac-year-level-row__check input[type="checkbox"]:disabled + .ac-year-level-row__box {
  opacity: 0.45;
  cursor: not-allowed;
}

.ac-year-level-row__check input[type="checkbox"]:focus-visible + .ac-year-level-row__box {
  outline: 2px solid rgba(30, 58, 138, 0.35);
  outline-offset: 2px;
}

.ac-year-level-row__badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 2rem;
  padding: 0.2rem 0.55rem;
  border-radius: 999px;
  background: rgba(30, 58, 138, 0.08);
  color: var(--schoolise-blue, #5c5346);
  font-size: 0.75rem;
  font-weight: 700;
  letter-spacing: 0.02em;
  text-transform: uppercase;
}

.ac-year-level-row__position {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 1.75rem;
  height: 1.75rem;
  border-radius: 999px;
  background: var(--color-surface-muted, #f9f8f4);
  color: var(--color-text-muted, #5b6b7c);
  font-size: 0.75rem;
  font-weight: 700;
}

.ac-year-level-row__remove {
  white-space: nowrap;
}

.ac-checkbox-row {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  min-height: 2.75rem;
}

@media (min-width: 640px) {
  .ac-year-levels-panel__header {
    flex-direction: row;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
  }

  .ac-year-levels__grid {
    grid-template-columns: repeat(2, 1fr);
  }

  .ac-year-levels__rows {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .ac-year-levels__rows--custom {
    grid-template-columns: 1fr;
  }
}

@media (min-width: 900px) {
  .ac-year-levels__grid {
    grid-template-columns: repeat(3, 1fr);
  }
}

@media (max-width: 639px) {
  .ac-year-level-row,
  .ac-year-level-row--custom {
    grid-template-columns: auto minmax(0, 1fr);
  }

  .ac-year-level-row .ac-status-badge,
  .ac-year-level-row__position,
  .ac-year-level-row__remove {
    grid-column: 2;
    justify-self: start;
  }
}

.ac-filters {
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem;
  margin-bottom: 1.25rem;
}

.ac-filters .field {
  min-width: 10rem;
  flex: 1 1 10rem;
}

.ac-section {
  margin-bottom: 2rem;
}

.ac-section__title {
  font-size: 1.125rem;
  font-weight: 600;
  color: var(--st-navy, #1c1917);
  margin: 0 0 0.75rem;
}

.ac-section__subtitle {
  font-size: 0.9375rem;
  color: var(--st-muted, #64748b);
  margin: -0.25rem 0 1rem;
}

.ac-class-grid {
  display: grid;
  gap: 0.75rem;
  grid-template-columns: 1fr;
}

@media (min-width: 640px) {
  .ac-class-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

.ac-class-card {
  padding: 1rem 1.25rem;
  border: 1px solid var(--st-border, #e2e8f0);
  border-radius: 0.75rem;
  background: #fff;
  min-width: 0;
}

.ac-class-card__header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 1rem;
}

.ac-class-card__name {
  font-weight: 600;
  color: var(--st-navy, #1c1917);
  margin: 0;
}

.ac-class-card__name a {
  color: inherit;
  text-decoration: none;
}

.ac-class-card__name a:hover {
  color: var(--st-accent-strong, #433a32);
  text-decoration: underline;
}

.ac-class-card__meta {
  font-size: 0.875rem;
  color: var(--st-muted, #64748b);
  margin: 0.25rem 0 0;
}

.ac-class-card__stats {
  font-size: 0.875rem;
  color: var(--st-blue-dark, #5c5346);
  margin-top: 0.5rem;
}

.course-classes-tab__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  flex-wrap: wrap;
  margin-bottom: 1rem;
}

.course-classes-tab__header .cp-tab-heading {
  margin-bottom: 0;
}

.course-classes-tab__section {
  margin-bottom: 1.25rem;
}

.course-classes-tab__section:last-child {
  margin-bottom: 0;
}

.course-classes-tab__section-title {
  margin: 0 0 0.65rem;
  font-size: 0.8125rem;
  font-weight: 700;
  color: var(--st-text-secondary, #57534e);
  text-transform: uppercase;
  letter-spacing: 0.04em;
}

.course-classes-tab__empty {
  padding: 1.25rem 1rem;
  border: 1px dashed var(--st-border-secondary, #ddd8cf);
  border-radius: var(--st-radius-md, 8px);
  background: var(--st-bg-secondary, #f3f0ea);
}

.course-classes-tab__empty-hint {
  margin: 0.5rem 0 0;
  font-size: 0.875rem;
  color: var(--st-text-tertiary, #a8a29e);
  line-height: 1.45;
}

.ac-detail-grid {
  display: grid;
  gap: 1.5rem;
}

@media (min-width: 900px) {
  .ac-detail-grid {
    grid-template-columns: 2fr 1fr;
  }
}

.ac-detail-card {
  padding: 1.25rem;
  border: 1px solid var(--st-border, #e2e8f0);
  border-radius: 0.75rem;
  background: #fff;
}

.ac-detail-card h2 {
  font-size: 1rem;
  font-weight: 600;
  color: var(--st-navy, #1c1917);
  margin: 0 0 1rem;
}

.ac-person-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 0.75rem;
}

.ac-person-list__item {
  display: flex;
  justify-content: space-between;
  gap: 1rem;
  align-items: baseline;
  min-width: 0;
}

.ac-person-list__item > span:first-child {
  min-width: 0;
  overflow-wrap: anywhere;
}

.ac-person-list__name {
  font-weight: 500;
  color: var(--st-navy, #1c1917);
}

.ac-person-list__role {
  font-size: 0.875rem;
  color: var(--st-muted, #64748b);
}

.ac-form-section {
  margin-top: 1.5rem;
  padding-top: 1.5rem;
  border-top: 1px solid var(--st-border, #e2e8f0);
}

.ac-form-section__title {
  font-size: 1rem;
  font-weight: 600;
  margin: 0 0 1rem;
  color: var(--st-navy, #1c1917);
}

.ac-teacher-row {
  display: grid;
  gap: 0.75rem;
  grid-template-columns: 1fr;
  margin-bottom: 0.75rem;
}

@media (min-width: 640px) {
  .ac-teacher-row {
    grid-template-columns: 1fr 1fr auto;
    align-items: end;
  }
}

.ac-student-select {
  min-height: 12rem;
}

.ac-status-badge {
  display: inline-block;
  font-size: 0.75rem;
  font-weight: 600;
  padding: 0.125rem 0.5rem;
  border-radius: 999px;
}

.ac-status-badge--active {
  background: rgba(20, 184, 166, 0.15);
  color: #0f766e;
}

.ac-status-badge--inactive {
  background: rgba(100, 116, 139, 0.15);
  color: #475569;
}

.ac-status-badge--archived {
  background: rgba(148, 163, 184, 0.2);
  color: #64748b;
}

.groups-form__fieldset {
  margin: 0;
  padding: 0;
  border: 0;
}

.groups-form__checkbox-grid {
  display: grid;
  gap: 0.35rem 1rem;
  grid-template-columns: 1fr;
}

@media (min-width: 640px) {
  .groups-form__checkbox-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (min-width: 900px) {
  .groups-form__checkbox-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

.groups-form__checkbox-row {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  min-height: 2.75rem;
  font-size: 0.875rem;
  color: var(--st-text-primary, #1c1917);
}

.groups-form__checkbox-row input[type="checkbox"] {
  width: 1rem;
  height: 1rem;
  flex-shrink: 0;
}

.ac-form-grid {
  display: grid;
  gap: 1rem;
  grid-template-columns: 1fr;
}

@media (min-width: 640px) {
  .ac-form-grid--two {
    grid-template-columns: repeat(2, 1fr);
  }
}

.ac-teaching-fields[hidden] {
  display: none !important;
}

.ac-registration-fields[hidden] {
  display: none !important;
}

.ac-course-not-configured {
  padding: 0.75rem 1rem;
  border-radius: 0.5rem;
  background: rgba(239, 68, 68, 0.08);
  color: #b91c1c;
  font-size: 0.875rem;
  margin-top: 0.75rem;
}

.ws-page {
  max-width: 72rem;
}

.ws-breadcrumbs {
  margin-bottom: 1rem;
}

.ws-breadcrumbs__list {
  display: flex;
  flex-wrap: wrap;
  gap: 0.35rem 0.5rem;
  list-style: none;
  margin: 0;
  padding: 0;
  font-size: 0.875rem;
  color: var(--st-muted, #64748b);
}

.ws-breadcrumbs__item:not(:last-child)::after {
  content: "›";
  margin-left: 0.5rem;
  color: var(--st-muted, #94a3b8);
}

.ws-breadcrumbs__link {
  color: var(--st-blue-dark, #5c5346);
  text-decoration: none;
}

.ws-breadcrumbs__current {
  color: var(--st-navy, #1c1917);
  font-weight: 500;
}

.ws-tabs {
  margin: 1rem 0;
  overflow-x: auto;
}

.ws-tabs__list {
  display: flex;
  gap: 0.5rem;
  min-width: max-content;
}

.ws-tab-panel {
  padding: 1.25rem;
}

.ws-tab-panel__actions {
  margin-top: 1rem;
}

.ws-context {
  margin: 0 0 1rem;
  color: var(--st-muted, #64748b);
  font-size: 0.9375rem;
}

.ws-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem;
  align-items: center;
}

.ws-overview-grid {
  display: grid;
  gap: 1rem;
  grid-template-columns: 1fr;
}

@media (min-width: 900px) {
  .ws-overview-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

.ws-details,
.ws-stats {
  display: grid;
  gap: 0.75rem;
}

.ws-details dt,
.ws-stats dt {
  font-size: 0.8125rem;
  color: var(--st-muted, #64748b);
}

.ws-details dd,
.ws-stats dd {
  margin: 0;
  font-weight: 500;
  color: var(--st-navy, #1c1917);
}

.ws-empty {
  padding: 2rem 1rem;
  text-align: center;
}

.ws-empty__title {
  margin: 0 0 0.5rem;
  color: var(--st-navy, #1c1917);
}

.ws-empty__text {
  margin: 0;
  color: var(--st-muted, #64748b);
}

.btn-secondary {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 2.75rem;
  padding: 0.625rem 1rem;
  border-radius: 0.625rem;
  border: 1px solid var(--st-border, #e2e8f0);
  background: #fff;
  color: var(--st-navy, #1c1917);
  font-weight: 600;
  text-decoration: none;
}

/* Classes form — AssessMap-aligned groups/new layout */
.groups-form {
  padding: 1rem 1rem 2.5rem;
  margin-bottom: 0;
  background-color: var(--st-canvas);
  border-radius: var(--st-radius-lg, 12px);
}

.groups-form__layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 1.25rem;
  align-items: start;
}

.groups-form__layout--stacked {
  grid-template-columns: minmax(0, 1fr);
}

.groups-form__layout--single {
  grid-template-columns: minmax(0, 1fr);
}

.groups-form__card {
  width: 100%;
  max-width: none;
  box-sizing: border-box;
  background: var(--st-bg-primary, #fff);
  border: 0.5px solid var(--st-border-tertiary, #e8e4dc);
  border-radius: var(--st-radius-lg, 12px);
  padding: 1.5rem 1.5rem 1.75rem;
  box-shadow: 0 1px 2px rgba(28, 25, 23, 0.04);
}

.groups-form__card--members {
  padding: 0;
  overflow: hidden;
}

.groups-form__members-inner {
  padding: 1.25rem 1.5rem 1.35rem;
}

.groups-form__members-toolbar {
  display: flex;
  flex-direction: column;
  gap: 0.85rem;
  margin-bottom: 1rem;
}

.groups-form__members-controls {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.75rem 1rem;
}

.groups-form__field--search {
  flex: 1 1 14rem;
  min-width: 0;
  margin-bottom: 0;
}

.groups-form__select-all {
  display: inline-flex;
  align-items: center;
  gap: 0.45rem;
  min-height: 2.75rem;
  font-size: 0.8125rem;
  font-weight: 600;
  color: var(--st-text-secondary, #57534e);
  cursor: pointer;
  user-select: none;
}

.groups-form__select-all input {
  width: 1rem;
  height: 1rem;
}

.groups-form__card--members .groups-form__members-wrap {
  border: none;
  border-radius: 0;
  max-height: none;
  overflow: visible;
  background: transparent;
}

.groups-form__student-cards {
  display: grid;
  grid-template-columns: 1fr;
  gap: 0.65rem;
}

@media (min-width: 640px) {
  .groups-form__student-cards {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (min-width: 900px) {
  .groups-form__student-cards {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

@media (min-width: 1100px) {
  .groups-form__student-cards {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
}

.groups-form__student-card {
  display: flex;
  align-items: flex-start;
  gap: 0.65rem;
  min-width: 0;
  min-height: 3.25rem;
  padding: 0.75rem 0.85rem;
  border: 1px solid var(--st-border-secondary, #ddd8cf);
  border-radius: var(--st-radius-md, 8px);
  background: var(--st-bg-secondary, #f3f0ea);
  cursor: pointer;
  transition: border-color 0.12s, background 0.12s, box-shadow 0.12s;
}

.groups-form__student-card:hover {
  border-color: var(--st-border, #c9c2b6);
  background: #fff;
}

.groups-form__student-card.is-selected {
  border-color: var(--st-accent, #5c5346);
  background: #fff;
  box-shadow: 0 0 0 1px rgba(92, 83, 70, 0.18);
}

.groups-form__student-card-check {
  width: 1rem;
  height: 1rem;
  margin-top: 0.15rem;
  flex-shrink: 0;
}

.groups-form__student-card-body {
  display: flex;
  flex-direction: column;
  gap: 0.15rem;
  min-width: 0;
}

.groups-form__student-card-name {
  font-size: 0.875rem;
  font-weight: 600;
  color: var(--st-text-primary, #1c1917);
  line-height: 1.3;
  overflow-wrap: anywhere;
}

.groups-form__student-card-meta {
  font-size: 0.75rem;
  color: var(--st-text-tertiary, #a8a29e);
  line-height: 1.35;
}

.groups-form__students-empty {
  padding: 1.15rem 1rem;
  border: 1px dashed var(--st-border-secondary, #ddd8cf);
  border-radius: var(--st-radius-md, 8px);
  background: var(--st-bg-secondary, #f3f0ea);
}

.groups-form__students-empty-title {
  margin: 0;
  font-size: 0.875rem;
  font-weight: 700;
  color: var(--st-text-primary, #1c1917);
}

.groups-form__students-empty-text {
  margin: 0.35rem 0 0;
  font-size: 0.8125rem;
  color: var(--st-text-secondary, #57534e);
  line-height: 1.45;
}

.groups-form__field-row {
  display: grid;
  grid-template-columns: 1fr;
  gap: 0 1rem;
}

@media (min-width: 640px) {
  .groups-form__field-row {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}


.groups-form__errors,
.mt-manage-students .groups-form__errors {
  background: #fef2f2;
  border: 0.5px solid #fecaca;
  border-radius: var(--st-radius-md, 8px);
  padding: 1rem 1.15rem;
  margin-bottom: 1.25rem;
  color: #991b1b;
  font-size: 0.875rem;
}

.groups-form__errors ul,
.mt-manage-students .groups-form__errors ul {
  margin: 0;
  padding-left: 1.25rem;
}

.groups-form__section {
  margin-top: 0.5rem;
  padding-top: 1.25rem;
  border-top: 0.5px solid var(--st-border-tertiary, #e8e4dc);
}

.groups-form__section-title {
  margin: 0 0 1rem;
  font-size: 0.8125rem;
  font-weight: 700;
  color: var(--st-text-primary, #1c1917);
  letter-spacing: 0.01em;
}

.groups-form__field {
  margin-bottom: 1.35rem;
}

.groups-form__field label {
  display: block;
  font-size: 0.8125rem;
  font-weight: 600;
  color: var(--st-text-primary, #1c1917);
  margin-bottom: 0.4rem;
}

.groups-form__field-label {
  display: block;
  font-size: 0.8125rem;
  font-weight: 600;
  color: var(--st-text-primary, #1c1917);
  margin-bottom: 0.4rem;
}

.groups-form__static-type {
  margin: 0;
}

.groups-form__input,
.groups-form__select {
  display: block;
  max-width: 100%;
  height: 36px;
  padding: 0 0.75rem;
  border: 0.5px solid var(--st-border-secondary, #ddd8cf);
  border-radius: var(--st-radius-md, 8px);
  background: var(--st-bg-primary, #fff);
  color: var(--st-text-primary, #1c1917);
  font-size: 0.8125rem;
  box-sizing: border-box;
}

.groups-form__input {
  width: 100%;
}

textarea.groups-form__input,
.groups-form__textarea {
  width: 100%;
  height: auto;
  min-height: 7.5rem;
  padding: 0.65rem 0.75rem;
  line-height: 1.55;
  resize: vertical;
}

.groups-form__textarea--compact {
  min-height: 5.5rem;
}

.groups-form__select {
  width: min(220px, 100%);
  padding-right: 1.75rem;
  cursor: pointer;
  appearance: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%2394a3b8' stroke-width='2'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 0.5rem center;
}

.groups-form__select--wide {
  width: 100%;
}

.groups-form__input:focus,
textarea.groups-form__input:focus,
.groups-form__textarea:focus,
.groups-form__select:focus,
.groups-form__search:focus {
  outline: none;
  border-color: var(--st-accent, #5c5346);
  box-shadow: 0 0 0 2px rgba(92, 83, 70, 0.12);
}

.groups-form__input--invalid {
  border-color: #dc2626;
}

.groups-form__hint {
  margin-top: 0.35rem;
  font-size: 0.8125rem;
  color: var(--st-text-secondary, #57534e);
  line-height: 1.45;
}

.groups-form__section-lead {
  margin: -0.35rem 0 1rem;
}

.groups-form__type-description,
.groups-form__context-notice {
  margin: 0.5rem 0 0;
  padding: 0.65rem 0.8rem;
  font-size: 0.8125rem;
  line-height: 1.45;
  color: var(--st-text-secondary, #57534e);
  background: var(--st-bg-secondary, #faf8f5);
  border: 0.5px solid var(--st-border-tertiary, #e8e4dc);
  border-radius: var(--st-radius-md, 8px);
}

.groups-form__context-notice {
  margin-bottom: 1rem;
}

.groups-form__field--group-type {
  margin-bottom: 0.75rem;
}

.groups-form__teacher-row {
  display: grid;
  gap: 0.75rem;
}

.groups-form__teacher-row--managed {
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) auto;
  align-items: end;
  padding-bottom: 0.75rem;
  margin-bottom: 0.75rem;
  border-bottom: 0.5px solid var(--st-border-tertiary, #e8e4dc);
}

.groups-form__teacher-row--managed:last-child {
  border-bottom: none;
  margin-bottom: 0;
  padding-bottom: 0;
}

.groups-form__field--row-action {
  margin-bottom: 0;
}

.groups-form__remove-row {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 44px;
  padding: 0 0.65rem;
  border: none;
  background: transparent;
  color: #991b1b;
  font-size: 0.8125rem;
  font-weight: 600;
  cursor: pointer;
  font-family: inherit;
  white-space: nowrap;
}

.groups-form__remove-row:hover {
  color: #7f1d1d;
  text-decoration: underline;
}

.groups-form__inline-actions {
  margin-top: 0.5rem;
  margin-bottom: 1.25rem;
}

.groups-form__layout--narrow {
  grid-template-columns: minmax(0, 1fr);
  max-width: 40rem;
}

.groups-form__notice,
.mt-manage-students .groups-form__notice {
  margin-bottom: 0.85rem;
  padding: 0.85rem 1rem;
  border-radius: var(--st-radius-md, 8px);
  border: 0.5px solid var(--st-border-tertiary, #e8e4dc);
  background: var(--st-bg-secondary, #f3f0ea);
  font-size: 0.875rem;
  line-height: 1.5;
  color: var(--st-text-secondary, #57534e);
}

.groups-form__search {
  width: 100%;
  height: 36px;
  padding: 0 0.75rem;
  border: 0.5px solid var(--st-border-secondary, #ddd8cf);
  border-radius: var(--st-radius-md, 8px);
  background: var(--st-bg-primary, #fff);
  color: var(--st-text-primary, #1c1917);
  font-size: 0.8125rem;
  box-sizing: border-box;
}

.groups-form__members-wrap,
.mt-manage-students__table-wrap {
  width: 100%;
  max-height: 420px;
  overflow: auto;
  border: 0.5px solid var(--st-border-tertiary, #e8e4dc);
  border-radius: var(--st-radius-lg, 12px);
  background: var(--st-bg-primary, #fff);
  -webkit-overflow-scrolling: touch;
  box-sizing: border-box;
}

.mt-manage-students__panel .mt-manage-students__table-wrap {
  border: none;
  border-radius: 0;
  max-height: min(60vh, 36rem);
}

.groups-form table.data-table,
.mt-manage-students table.data-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 0.8125rem;
}

.groups-form table.data-table thead tr,
.mt-manage-students table.data-table thead tr {
  background: var(--st-bg-secondary, #f3f0ea);
  border-bottom: 0.5px solid var(--st-border-tertiary, #e8e4dc);
}

.groups-form table.data-table thead th,
.mt-manage-students table.data-table thead th {
  padding: 10px 12px;
  text-align: left;
  font-size: 0.6875rem;
  font-weight: 500;
  color: var(--st-text-secondary, #57534e);
  letter-spacing: 0.03em;
  vertical-align: middle;
}

.groups-form table.data-table thead th.groups-form__th--check,
.mt-manage-students table.data-table thead th.groups-form__th--check {
  width: 2.75rem;
  text-align: center;
}

.groups-form table.data-table tbody tr,
.mt-manage-students table.data-table tbody tr {
  border-bottom: 0.5px solid var(--st-border-tertiary, #e8e4dc);
}

.groups-form table.data-table tbody tr:hover,
.mt-manage-students table.data-table tbody tr:hover {
  background: var(--st-bg-secondary, #f3f0ea);
}

.groups-form table.data-table tbody td,
.mt-manage-students table.data-table tbody td {
  padding: 11px 12px;
  color: var(--st-text-primary, #1c1917);
  vertical-align: middle;
}

.groups-form table.data-table tbody td.groups-form__td--check,
.mt-manage-students table.data-table tbody td.groups-form__td--check {
  text-align: center;
}

.groups-form table.data-table input[type="checkbox"],
.mt-manage-students table.data-table input[type="checkbox"] {
  width: 15px;
  height: 15px;
  accent-color: var(--st-accent, #5c5346);
  cursor: pointer;
  vertical-align: middle;
}

.groups-form table.data-table .nav-link,
.mt-manage-students table.data-table .nav-link {
  display: inline;
  padding: 0;
  margin: 0;
  font-weight: 600;
  font-size: inherit;
  color: var(--st-text-primary, #1c1917);
  text-decoration: none;
}

.groups-form table.data-table .nav-link:hover,
.mt-manage-students table.data-table .nav-link:hover {
  color: var(--st-accent, #5c5346);
}

.groups-form__actions,
.mt-manage-students .groups-form__actions {
  margin-top: 2rem;
  display: flex;
  flex-wrap: wrap;
  gap: 0.65rem;
  align-items: center;
}

.groups-form__actions--stacked {
  margin-top: 0;
}

@media (max-width: 900px) {
  .groups-form__card--members .groups-form__members-wrap {
    max-height: none;
  }
}

@media (max-width: 640px) {
  .groups-form {
    padding: 0.85rem 0.85rem 2rem;
  }

  .groups-form__card {
    padding: 1.15rem 1rem 1.35rem;
  }

  .groups-form__members-inner {
    padding: 1rem 1rem 0.65rem;
  }

  .groups-form__actions {
    flex-direction: column;
    align-items: stretch;
  }

  .groups-form__actions .btn-primary,
  .groups-form__actions .students-index__btn {
    width: 100%;
    justify-content: center;
    min-height: 44px;
  }

  .groups-form__teacher-row--managed {
    grid-template-columns: minmax(0, 1fr);
  }

  .groups-form__field--row-action {
    margin-bottom: 0.5rem;
  }

  .groups-form__remove-row {
    width: 100%;
    justify-content: flex-start;
    padding-left: 0;
  }

  .groups-form__inline-actions .students-index__btn {
    width: 100%;
    justify-content: center;
  }
}

/* Classes show — AssessMap-aligned groups/:id layout */
.groups-show {
  padding: 1rem 1rem 2.5rem;
  margin-bottom: 0;
  background-color: var(--st-canvas);
  border-radius: var(--st-radius-lg, 12px);
}

.groups-show__header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 1rem;
  flex-wrap: wrap;
}

.groups-show__title {
  margin: 0 0 0.25rem;
  font-size: 1.75rem;
  font-weight: 600;
  color: var(--st-text-primary, #1c1917);
}

.groups-show__subtitle {
  margin: 0 0 0.35rem;
  color: var(--st-text-secondary, #57534e);
}

.groups-show__header-actions {
  display: flex;
  gap: 0.6rem;
  align-items: center;
  flex-wrap: wrap;
}

.groups-show__header .nav-link {
  color: var(--st-accent, #5c5346);
  font-weight: 600;
  text-decoration: none;
}

.groups-show__header .nav-link:hover {
  color: var(--st-accent-strong, #433a32);
}

.gs-page-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 220px);
  gap: 1.25rem;
  align-items: start;
  margin-top: 1rem;
}

.groups-show .auth-card.groups-show__main {
  padding: 0;
  border-radius: var(--st-radius-lg, 12px);
  border: 0.5px solid var(--st-border-tertiary, #e8e4dc);
  box-shadow: 0 4px 24px rgba(28, 25, 23, 0.06);
  overflow: hidden;
  min-width: 0;
  background: var(--st-bg-primary, #fff);
}

.groups-show .auth-card.groups-show__main:has(.lr-insights) {
  overflow: visible;
}

.groups-show .auth-card.groups-show__main:has(.lr-insights) .groups-show__body {
  overflow: visible;
}

.groups-show__tabs-bar {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem 1rem;
  padding: 0.85rem 1rem;
  border-bottom: 0.5px solid var(--st-border-tertiary, #e8e4dc);
  background: var(--st-bg-secondary, #f3f0ea);
}

.groups-show__tabs-bar .cp-tab {
  text-decoration: none;
  font-weight: 600;
  padding: 0.45rem 0.8rem;
  border-radius: var(--st-radius-sm, 6px);
  display: inline-block;
  font-size: 0.875rem;
  color: var(--st-text-secondary, #57534e);
  transition: background 0.12s, color 0.12s;
}

.groups-show__tabs-bar .cp-tab:hover {
  background: var(--st-border-tertiary, #e8e4dc);
  color: var(--st-text-primary, #1c1917);
}

.groups-show__tabs-bar .cp-tab--active {
  background: var(--st-bg-primary, #fff);
  color: var(--st-text-primary, #1c1917);
  font-weight: 700;
  box-shadow: 0 1px 3px rgba(28, 25, 23, 0.08);
}

.groups-show__tabs-bar .cp-tab--disabled {
  color: var(--st-text-tertiary, #a8a29e);
  cursor: not-allowed;
  pointer-events: none;
  opacity: 0.65;
}

.groups-show__body {
  padding: 1.1rem 1.25rem;
  min-width: 0;
}

.groups-show__body .ws-overview-grid {
  align-items: start;
}

.groups-show__body .gs-card + .gs-card {
  margin-top: 1rem;
}

.groups-show__body .ws-overview-grid > .gs-card + .gs-card {
  margin-top: 0;
}

.groups-show__body .nav-link {
  padding: 0;
  font-size: inherit;
  font-weight: 600;
  color: var(--st-accent, #5c5346);
  line-height: 1.35;
  text-decoration: none;
}

.groups-show__body .nav-link:hover {
  color: var(--st-accent-strong, #433a32);
}

.gs-sidebar {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
  min-width: 0;
  overflow: hidden;
}

.gs-card {
  background: var(--st-bg-primary, #fff);
  border: 1px solid var(--st-border-secondary, #ddd8cf);
  border-radius: var(--st-radius-md, 8px);
  padding: 1rem;
  overflow: hidden;
}

.gs-heading {
  font-size: 0.7rem;
  font-weight: 700;
  color: var(--st-text-tertiary, #a8a29e);
  text-transform: uppercase;
  letter-spacing: 0.05em;
  margin-bottom: 0.6rem;
}

.gs-tag-chip--warning {
  border-color: #d6a84b;
  background: #fff5d9;
  color: #76520b;
}

.gs-stat-row {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  gap: 0.75rem;
  padding: 0.3rem 0;
  border-bottom: 1px solid var(--st-border-tertiary, #e8e4dc);
  font-size: 0.82rem;
  min-width: 0;
}

.gs-stat-row:last-child {
  border-bottom: none;
}

.gs-stat-label {
  color: var(--st-text-secondary, #57534e);
  flex: 0 1 auto;
  min-width: 0;
}

.gs-stat-value {
  font-weight: 700;
  color: var(--st-text-primary, #1c1917);
  text-align: right;
  flex: 1 1 auto;
  min-width: 0;
  overflow-wrap: anywhere;
}

.gs-capable-teachers__empty {
  margin: 0;
}

.gs-capable-teachers-add {
  margin-top: 1rem;
  padding-top: 1rem;
  border-top: 1px solid var(--st-border-tertiary, #e8e4dc);
}

.gs-capable-teachers-add__form {
  display: grid;
  gap: 0.75rem;
}

.gs-capable-teachers-add__main {
  display: grid;
  gap: 0.75rem;
  min-width: 0;
}

.gs-capable-teachers-add__select {
  width: 100%;
  min-width: 0;
  min-height: 2.75rem;
  padding: 0.5rem 0.75rem;
  border-radius: var(--st-radius-sm, 6px);
  border: 1px solid var(--st-border-secondary, #ddd8cf);
  background: var(--st-bg-primary, #fff);
  color: var(--st-text-primary, #1c1917);
  font-size: 0.875rem;
}

.gs-capable-teachers-add__select:focus {
  border-color: var(--st-accent, #5c5346);
  box-shadow: 0 0 0 2px rgba(92, 83, 70, 0.12);
  outline: none;
}

.gs-capable-teachers-add__submit {
  min-height: 2.75rem;
  white-space: nowrap;
}

.gs-capable-teachers-add__preferred {
  min-width: 0;
}

.gs-capable-teachers-add__check {
  display: flex;
  align-items: flex-start;
  gap: 0.5rem;
  margin: 0;
  cursor: pointer;
}

.gs-capable-teachers-add__check input {
  margin-top: 0.2rem;
  flex-shrink: 0;
}

.gs-capable-teachers-add__check-copy {
  display: flex;
  flex-direction: column;
  gap: 0.15rem;
  min-width: 0;
  font-size: 0.8125rem;
  font-weight: 600;
  color: var(--st-text-secondary, #57534e);
}

.gs-capable-teachers-add__hint {
  font-size: 0.75rem;
  font-weight: 500;
  line-height: 1.4;
  color: var(--st-text-tertiary, #a8a29e);
}

@media (min-width: 640px) {
  .gs-capable-teachers-add__main {
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
  }
}

@media (max-width: 639px) {
  .gs-capable-teachers-add__submit {
    width: 100%;
  }
}

.gs-action-btn {
  display: flex;
  align-items: center;
  gap: 0.45rem;
  width: 100%;
  box-sizing: border-box;
  padding: 0.5rem 0.7rem;
  border-radius: var(--st-radius-sm, 6px);
  border: 1px solid var(--st-border-secondary, #ddd8cf);
  background: var(--st-bg-secondary, #f3f0ea);
  font-size: 0.8rem;
  font-weight: 500;
  color: var(--st-text-secondary, #57534e);
  cursor: pointer;
  text-align: left;
  text-decoration: none;
  margin-bottom: 0.4rem;
  overflow: hidden;
  white-space: nowrap;
  min-height: 44px;
}

.gs-action-btn:last-child {
  margin-bottom: 0;
}

.gs-action-btn:hover {
  background: var(--st-border-tertiary, #e8e4dc);
  color: var(--st-text-primary, #1c1917);
}

.gs-action-btn svg {
  opacity: 0.5;
  flex-shrink: 0;
}

.gs-action-btn--danger {
  color: #991b1b;
  border-color: #fecaca;
  background: #fef2f2;
}

.gs-action-btn--danger:hover {
  color: #7f1d1d;
  background: #fee2e2;
}

.gs-tag-chip {
  display: inline-flex;
  align-items: center;
  gap: 0.3rem;
  background: var(--st-bg-secondary, #f3f0ea);
  border: 1px solid var(--st-border-secondary, #ddd8cf);
  border-radius: 12px;
  padding: 2px 9px;
  font-size: 0.72rem;
  color: var(--st-text-tertiary, #a8a29e);
  font-weight: 500;
}

.gs-tag-chip--registration {
  background: #ede9fe;
  border-color: #c4b5fd;
  color: #5b21b6;
}

.gs-tag-chip--teaching {
  background: #e0f2fe;
  border-color: #7dd3fc;
  color: #075985;
}

.gs-tag-chip--link {
  text-decoration: none;
  color: var(--cs-accent-strong, #57534e);
}

.gs-tag-chip--link:hover {
  border-color: var(--cs-accent);
}

.gs-tags-wrap {
  display: flex;
  flex-wrap: wrap;
  gap: 0.4rem;
  align-items: center;
  margin-top: 0.35rem;
}

.groups-show .cp-badge {
  display: inline-block;
  padding: 0.15rem 0.5rem;
  border-radius: 999px;
  font-size: 0.6875rem;
  font-weight: 600;
  white-space: nowrap;
}

.groups-show .cp-badge--active {
  background: #dcfce7;
  color: #15803d;
}

.groups-show .cp-badge--closed {
  background: #fee2e2;
  color: #991b1b;
}

.groups-show .cp-badge--neutral {
  background: var(--st-bg-secondary, #f3f0ea);
  color: var(--st-text-secondary, #57534e);
  border: 0.5px solid var(--st-border-secondary, #ddd8cf);
}

.groups-show .cp-tab-empty {
  color: var(--st-text-secondary, #57534e);
  font-size: 0.9rem;
  margin: 0;
}

.gm-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  margin-bottom: 1rem;
  flex-wrap: wrap;
}

.gm-search-wrap {
  position: relative;
  flex: 1;
  min-width: min(100%, 12rem);
  max-width: 280px;
}

.gm-search-icon {
  position: absolute;
  left: 10px;
  top: 50%;
  transform: translateY(-50%);
  display: flex;
  color: var(--st-text-tertiary, #a8a29e);
  pointer-events: none;
}

.gm-search-wrap input.gm-search-input {
  width: 100%;
  height: 36px;
  padding: 0 0.75rem 0 2rem;
  border: 0.5px solid var(--st-border-secondary, #ddd8cf);
  border-radius: var(--st-radius-md, 8px);
  background: var(--st-bg-primary, #fff);
  color: var(--st-text-primary, #1c1917);
  font-size: 0.8125rem;
  box-sizing: border-box;
}

.gm-search-wrap input.gm-search-input:focus {
  outline: none;
  border-color: var(--st-accent, #5c5346);
  box-shadow: 0 0 0 2px rgba(92, 83, 70, 0.12);
}

.gm-add-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.4rem;
  min-height: 44px;
  padding: 0.42rem 0.9rem;
  border-radius: var(--st-radius-sm, 6px);
  border: none;
  background: var(--st-accent, #5c5346);
  color: #fff;
  font-size: 0.82rem;
  font-weight: 600;
  cursor: pointer;
  text-decoration: none;
  white-space: nowrap;
}

.gm-add-btn:hover {
  background: var(--st-accent-strong, #433a32);
  color: #fff;
}

/* Secondary, lighter add action anchored beneath a section's list */
.gm-section-actions {
  display: flex;
  margin-top: 0.6rem;
}

.gm-add-btn--ghost {
  background: transparent;
  color: var(--st-accent, #5c5346);
  border: 1px solid var(--st-border-secondary, #ddd8cf);
  font-weight: 600;
}

.gm-add-btn--ghost:hover {
  background: var(--st-bg-secondary, #f3f0ea);
  color: var(--st-accent, #5c5346);
}

.gm-section {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  margin: 1.25rem 0 0.6rem;
}

.gm-section:first-of-type {
  margin-top: 0;
}

.gm-section__title {
  font-size: 0.7rem;
  font-weight: 700;
  color: var(--st-text-tertiary, #a8a29e);
  text-transform: uppercase;
  letter-spacing: 0.06em;
  white-space: nowrap;
}

.gm-section__count {
  background: var(--st-bg-secondary, #f3f0ea);
  color: var(--st-text-tertiary, #a8a29e);
  border-radius: 10px;
  padding: 1px 7px;
  font-size: 0.7rem;
  font-weight: 600;
  border: 1px solid var(--st-border-secondary, #ddd8cf);
}

.gm-section__line {
  flex: 1;
  height: 1px;
  background: var(--st-border-secondary, #ddd8cf);
}

.gm-list {
  display: flex;
  flex-direction: column;
  gap: 2px;
}

.gm-row {
  display: grid;
  grid-template-columns: 36px minmax(0, 1fr) auto auto;
  align-items: center;
  gap: 0.75rem;
  padding: 0.6rem 0.75rem;
  border-radius: var(--st-radius-sm, 6px);
  border: 1px solid transparent;
  transition: background 0.12s, border-color 0.12s;
}

.gm-row:hover {
  background: var(--st-bg-secondary, #f3f0ea);
  border-color: var(--st-border-secondary, #ddd8cf);
}

.gm-avatar {
  width: 36px;
  height: 36px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: 700;
  font-size: 0.8rem;
  flex-shrink: 0;
  letter-spacing: 0.01em;
}

.gm-avatar--teacher {
  background: #ebe6dc;
  color: #5c5346;
}

.gm-avatar--student {
  background: #dcfce7;
  color: #166534;
}

.gm-info {
  min-width: 0;
}

.gm-name {
  font-weight: 600;
  font-size: 0.88rem;
  color: var(--st-text-primary, #1c1917);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

a.gm-name--link {
  display: block;
  text-decoration: none;
  padding: 0;
}

a.gm-name--link:hover {
  color: var(--st-accent, #5c5346);
  text-decoration: underline;
}

.gm-email {
  font-size: 0.75rem;
  color: var(--st-text-tertiary, #a8a29e);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  margin-top: 1px;
}

.gm-enrolment {
  font-size: 0.73rem;
  color: var(--st-text-tertiary, #a8a29e);
  white-space: nowrap;
}

@media (max-width: 1024px) {
  .gs-page-layout {
    grid-template-columns: minmax(0, 1fr);
  }
}

@media (max-width: 640px) {
  .groups-show {
    padding: 0.85rem 0.85rem 2rem;
  }

  .groups-show__header {
    flex-direction: column;
    align-items: stretch;
  }

  .groups-show__tabs-bar {
    gap: 0.35rem;
    padding: 0.75rem 0.85rem;
  }

  .groups-show__tabs-bar .cp-tab {
    font-size: 0.8125rem;
    padding: 0.4rem 0.65rem;
  }

  .gm-toolbar {
    flex-direction: column;
    align-items: stretch;
  }

  .gm-search-wrap {
    max-width: none;
  }

  .gm-add-btn {
    width: 100%;
  }

  .gm-row {
    grid-template-columns: 36px minmax(0, 1fr);
    grid-template-areas:
      "avatar info"
      "avatar meta";
  }

  .gm-row .gm-avatar {
    grid-area: avatar;
  }

  .gm-row .gm-info {
    grid-area: info;
  }

  .gm-row .gm-enrolment,
  .gm-row .cp-badge {
    grid-area: meta;
  }

  .gm-row .cp-badge--neutral {
    display: none;
  }
}

/* Manage teachers / students — full-width layout + sidebar */
.mt-manage-teachers__toolbar,
.mt-manage-students__toolbar {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 1rem;
  padding: 1rem 1.25rem;
  border-bottom: 0.5px solid var(--st-border-tertiary, #e8e4dc);
  background: var(--st-bg-secondary, #f3f0ea);
  flex-wrap: wrap;
}

.mt-manage-teachers__toolbar > div:first-child,
.mt-manage-students__toolbar > div:first-child {
  flex: 1 1 12rem;
  min-width: 0;
  max-width: 100%;
}

.mt-manage-teachers__section-title,
.mt-manage-students__section-title {
  margin: 0 0 0.25rem;
  font-size: 1rem;
  font-weight: 700;
  color: var(--st-text-primary, #1c1917);
}

.mt-manage-teachers__section-lead,
.mt-manage-students__section-lead {
  margin: 0;
  font-size: 0.8125rem;
  color: var(--st-text-secondary, #57534e);
  line-height: 1.45;
}

.mt-manage-teachers__subtitle-sep {
  color: var(--st-text-tertiary, #a8a29e);
  margin: 0 0.25rem;
}

.mt-manage-teachers .groups-show__header .nav-link,
.mt-manage-students .groups-show__header .nav-link {
  font-weight: 600;
}

.mt-manage-teachers__empty,
.mt-manage-students__empty {
  margin-bottom: 1rem;
  padding: 1rem 1.1rem;
  border-radius: var(--st-radius-md, 8px);
  border: 0.5px dashed var(--st-border-secondary, #ddd8cf);
  background: var(--st-bg-secondary, #f3f0ea);
}

.mt-manage-teachers__empty-title,
.mt-manage-students__empty-title {
  margin: 0 0 0.35rem;
  font-weight: 700;
  color: var(--st-text-primary, #1c1917);
}

.mt-manage-teachers__empty-text,
.mt-manage-students__empty-text {
  margin: 0;
  font-size: 0.875rem;
  color: var(--st-text-secondary, #57534e);
  line-height: 1.45;
}

.mt-teachers-table {
  border: 0.5px solid var(--st-border-tertiary, #e8e4dc);
  border-radius: var(--st-radius-md, 8px);
  overflow: hidden;
  background: var(--st-bg-primary, #fff);
}

.mt-teachers-table__head,
.mt-teachers-table__row {
  display: grid;
  grid-template-columns: minmax(0, 1.5fr) minmax(0, 1fr) minmax(5.5rem, auto);
  gap: 0.75rem 1rem;
  align-items: end;
  padding: 0.8rem 1rem;
}

.mt-teachers-table__head {
  background: var(--st-bg-secondary, #f3f0ea);
  border-bottom: 0.5px solid var(--st-border-tertiary, #e8e4dc);
  font-size: 0.6875rem;
  font-weight: 600;
  letter-spacing: 0.03em;
  color: var(--st-text-secondary, #57534e);
  text-transform: uppercase;
  align-items: center;
}

.mt-teachers-table__body .mt-teachers-table__row {
  border-bottom: 0.5px solid var(--st-border-tertiary, #e8e4dc);
}

.mt-teachers-table__body .mt-teachers-table__row:last-child {
  border-bottom: none;
}

.mt-teachers-table__body .mt-teachers-table__row:hover {
  background: rgba(243, 240, 234, 0.55);
}

.mt-teachers-table__cell.groups-form__field {
  margin-bottom: 0;
  min-width: 0;
}

.mt-teachers-table__cell--actions {
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
}

.mt-teachers-table__mobile-label {
  display: none;
  font-size: 0.75rem;
  font-weight: 600;
  color: var(--st-text-secondary, #57534e);
  margin-bottom: 0.35rem;
}

.mt-manage-teachers__actions,
.mt-manage-students__actions {
  margin-top: 1.25rem;
}

.mt-manage-teachers__roles-list {
  margin: 0;
  padding: 0;
  list-style: none;
  display: grid;
  gap: 0.75rem;
}

.mt-manage-teachers__roles-list li {
  display: grid;
  gap: 0.15rem;
  font-size: 0.8125rem;
  color: var(--st-text-secondary, #57534e);
  line-height: 1.4;
}

.mt-manage-teachers__roles-list strong {
  color: var(--st-text-primary, #1c1917);
  font-size: 0.8125rem;
}

@media (max-width: 640px) {
  .mt-manage-teachers__toolbar {
    flex-direction: column;
    align-items: stretch;
  }

  .mt-manage-teachers__toolbar .gm-add-btn {
    width: 100%;
    justify-content: center;
  }

  .mt-teachers-table__head {
    display: none;
  }

  .mt-teachers-table__row {
    grid-template-columns: minmax(0, 1fr);
    gap: 0.65rem;
    align-items: stretch;
  }

  .mt-teachers-table__mobile-label {
    display: block;
  }

  .mt-teachers-table__cell--actions {
    align-items: flex-start;
  }

  .groups-form__remove-row {
    padding-left: 0;
  }
}

/* Manage students — searchable membership table */
.mt-manage-students__panel {
  border: 0.5px solid var(--st-border-tertiary, #e8e4dc);
  border-radius: var(--st-radius-md, 8px);
  overflow: hidden;
  background: var(--st-bg-primary, #fff);
}

.mt-manage-students__panel-head {
  padding: 1rem 1.15rem;
  border-bottom: 0.5px solid var(--st-border-tertiary, #e8e4dc);
  background: var(--st-bg-secondary, #f3f0ea);
  display: flex;
  flex-direction: column;
  gap: 0.85rem;
}

.mt-manage-students__panel-head .groups-form__notice {
  margin-bottom: 0;
}

.mt-manage-students__panel-head .gm-search-wrap {
  max-width: none;
}

.mt-manage-students .groups-form__actions {
  margin-top: 1.25rem;
}

.mt-manage-students__tips-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 0.65rem;
}

.mt-manage-students__tips-list li {
  font-size: 0.8125rem;
  line-height: 1.45;
  color: var(--st-text-secondary, #57534e);
  padding-left: 0.9rem;
  position: relative;
}

.mt-manage-students__tips-list li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0.45rem;
  width: 0.3rem;
  height: 0.3rem;
  border-radius: 50%;
  background: var(--st-accent, #5c5346);
}

@media (max-width: 640px) {
  .mt-manage-students__panel .mt-manage-students__table-wrap {
    max-height: none;
  }

  .mt-manage-students table.data-table thead {
    display: none;
  }

  .mt-manage-students table.data-table tbody tr {
    display: grid;
    grid-template-columns: auto 1fr;
    gap: 0.35rem 0.75rem;
    padding: 0.85rem 0.75rem;
    border-bottom: 0.5px solid var(--st-border-tertiary, #e8e4dc);
  }

  .mt-manage-students table.data-table tbody td {
    border: none;
    padding: 0;
  }

  .mt-manage-students table.data-table .groups-form__td--check {
    grid-row: 1 / span 3;
    align-self: start;
    padding-top: 0.15rem;
  }

  .mt-manage-students table.data-table tbody td:not(.groups-form__td--check)::before {
    content: attr(data-label);
    display: block;
    font-size: 0.68rem;
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: var(--st-text-tertiary, #a8a29e);
    margin-bottom: 0.1rem;
  }
}

/* Registration class — Courses & Teachers */
.ct-toolbar {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  justify-content: space-between;
  gap: 1rem;
  margin-bottom: 1.25rem;
}

.ct-toolbar__copy {
  min-width: 0;
  flex: 1 1 14rem;
}

.ct-toolbar__title {
  margin: 0 0 0.25rem;
  font-size: 1rem;
  font-weight: 700;
  color: var(--st-text-primary, #1c1917);
}

.ct-toolbar__lead {
  margin: 0;
  font-size: 0.875rem;
  line-height: 1.5;
  color: var(--st-text-secondary, #57534e);
}

.groups-show__body .ct-table-wrap {
  margin-top: 0.25rem;
}

.groups-show__body .ct-table {
  min-width: 44rem;
}

.groups-show__body .ct-table .bl-table__th,
.groups-show__body .ct-table .bl-table__td {
  vertical-align: middle;
}

.groups-show__body .ct-table__th--narrow,
.groups-show__body .ct-table__td--narrow {
  white-space: nowrap;
  width: 1%;
}

.groups-show__body .ct-table__actions {
  min-width: 4.5rem;
}

.student-files-tab {
  display: grid;
  gap: 1.25rem;
}

.student-files-tab__header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 1rem;
}

.student-files-tab__count {
  flex: 0 0 auto;
  padding: 0.35rem 0.65rem;
  border-radius: 999px;
  background: var(--st-bg-secondary, #f3f0ea);
  color: var(--st-text-secondary, #57534e);
  font-size: 0.75rem;
  font-weight: 700;
}

.student-files-upload {
  overflow: hidden;
  border: 1px solid var(--st-border-secondary, #ddd8cf);
  border-radius: var(--st-radius-md, 8px);
  background: var(--st-bg-primary, #fff);
  box-shadow: 0 1px 2px rgba(28, 25, 23, 0.04);
}

.student-files-upload__header {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  padding: 0.9rem 1rem;
  border-bottom: 1px solid var(--st-border-tertiary, #ebe7df);
  background: var(--st-bg-secondary, #f8f6f2);
}

.student-files-upload__header h3,
.student-files-upload__header p {
  margin: 0;
}

.student-files-upload__header h3 {
  color: var(--st-text-primary, #292524);
  font-size: 0.9rem;
  font-weight: 700;
}

.student-files-upload__header p {
  margin-top: 0.15rem;
  color: var(--st-text-secondary, #57534e);
  font-size: 0.78rem;
}

.student-files-upload__icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
  width: 2.25rem;
  height: 2.25rem;
  border-radius: 0.55rem;
  background: rgba(45, 106, 79, 0.1);
  color: var(--st-accent, #2d6a4f);
}

.student-files-upload__form {
  padding: 1rem;
}

.student-files-upload__grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.9rem 1rem;
}

.student-files-upload__field {
  min-width: 0;
}

.student-files-upload__field--file,
.student-files-upload__field--description {
  grid-column: 1 / -1;
}

.student-files-upload__field label {
  display: block;
  margin-bottom: 0.35rem;
  color: var(--st-text-primary, #292524);
  font-size: 0.78rem;
  font-weight: 700;
}

.student-files-upload__input,
.student-files-upload__file-input {
  width: 100%;
  min-height: 2.65rem;
  box-sizing: border-box;
  border: 1px solid var(--st-border-secondary, #ddd8cf);
  border-radius: 0.5rem;
  background: var(--st-bg-primary, #fff);
  color: var(--st-text-primary, #292524);
  font: inherit;
  font-size: 0.85rem;
}

.student-files-upload__input {
  padding: 0.6rem 0.7rem;
}

.student-files-upload__input:focus,
.student-files-upload__file-input:focus {
  outline: none;
  border-color: var(--st-accent, #2d6a4f);
  box-shadow: 0 0 0 3px rgba(45, 106, 79, 0.11);
}

.student-files-upload__textarea {
  min-height: 4.5rem;
  resize: vertical;
}

.student-files-upload__file-input {
  padding: 0.28rem;
}

.student-files-upload__file-input::file-selector-button {
  min-height: 2rem;
  margin-right: 0.7rem;
  padding: 0 0.75rem;
  border: 0;
  border-radius: 0.35rem;
  background: var(--st-bg-secondary, #f3f0ea);
  color: var(--st-text-primary, #292524);
  font: inherit;
  font-size: 0.78rem;
  font-weight: 700;
  cursor: pointer;
}

.student-files-upload__field > span,
.student-files-upload__footer > span {
  color: var(--st-text-tertiary, #78716c);
  font-size: 0.72rem;
}

.student-files-upload__field > span {
  display: block;
  margin-top: 0.3rem;
}

.student-files-upload__footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  margin-top: 1rem;
  padding-top: 0.85rem;
  border-top: 1px solid var(--st-border-tertiary, #ebe7df);
}

.student-files-upload__footer .btn-primary {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
}

.student-files-filters {
  padding: 1rem;
  border: 1px solid var(--st-border-secondary, #ddd8cf);
  border-radius: var(--st-radius-md, 8px);
  background: var(--st-bg-secondary, #f8f6f2);
}

.student-files-filters__grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0.85rem 1rem;
}

.student-files-filters .groups-form__field {
  margin: 0;
}

.student-files-filters__actions {
  display: flex;
  align-items: center;
  gap: 0.65rem;
  margin-top: 1rem;
}

.performance-records-filters__grid {
  grid-template-columns: repeat(5, minmax(0, 1fr));
}

.performance-results {
  display: grid;
  gap: 1.1rem;
}

.performance-results__header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 1rem;
  padding-bottom: 1rem;
  border-bottom: 1px solid var(--st-border-tertiary, #e8e4dc);
}

.performance-results__title {
  margin: 0;
  color: var(--st-text-primary, #1c1917);
  font-size: 1.05rem;
}

.performance-results__lead {
  margin: 0.3rem 0 0;
  color: var(--st-text-secondary, #57534e);
  font-size: 0.8125rem;
  line-height: 1.5;
}

.performance-results__header .btn-primary {
  flex: 0 0 auto;
  min-height: 2.5rem;
}

.performance-results__filters {
  padding: 1rem;
  border: 1px solid var(--st-border-secondary, #ddd8cf);
  border-radius: var(--st-radius-md, 8px);
  background: var(--st-bg-secondary, #f8f6f2);
}

.performance-results__filters .groups-form__field {
  margin: 0;
}

.performance-results__filters .groups-form__select {
  width: 100%;
}

.performance-results__filter-actions {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  margin-top: 1rem;
}

.performance-results__grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.85rem;
}

.performance-results__add-button {
  display: inline-flex;
  align-items: center;
  gap: 0.45rem;
}

.performance-record-card {
  --performance-accent: #64748b;
  --performance-accent-soft: #f1f5f9;
  min-width: 0;
  display: flex;
  flex-direction: column;
  padding: 0;
  overflow: hidden;
  border-color: var(--st-border-secondary, #ddd8cf);
  border-top: 3px solid var(--performance-accent);
  background: var(--st-bg-primary, #fff);
}

.performance-record-card--exam,
.performance-record-card--mock_exam {
  --performance-accent: #7c3aed;
  --performance-accent-soft: #f5f3ff;
}

.performance-record-card--test,
.performance-record-card--written_assessment {
  --performance-accent: #2563eb;
  --performance-accent-soft: #eff6ff;
}

.performance-record-card--coursework {
  --performance-accent: #15803d;
  --performance-accent-soft: #f0fdf4;
}

.performance-record-card--other {
  --performance-accent: #b45309;
  --performance-accent-soft: #fffbeb;
}

.performance-record-card__header {
  min-width: 0;
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 0.75rem;
  padding: 1rem;
  border-bottom: 1px solid var(--st-border-tertiary, #e8e4dc);
  background: var(--st-bg-secondary, #f8f6f2);
}

.performance-record-card__heading {
  min-width: 0;
  display: flex;
  align-items: flex-start;
  gap: 0.65rem;
}

.performance-record-card__heading > div {
  min-width: 0;
}

.performance-record-card__type-icon {
  width: 2rem;
  height: 2rem;
  flex: 0 0 auto;
  display: grid;
  place-items: center;
  border-radius: 0.55rem;
  background: var(--performance-accent-soft);
  color: var(--performance-accent);
}

.performance-record-card__title {
  margin: 0;
  font-size: 0.95rem;
  overflow-wrap: anywhere;
}

.performance-record-card__title .nav-link {
  color: var(--st-text-primary, #1c1917);
}

.performance-record-card__title .nav-link:hover {
  color: var(--performance-accent);
}

.performance-record-card__meta {
  margin: 0.25rem 0 0;
  color: var(--performance-accent);
  font-size: 0.75rem;
  font-weight: 600;
}

.performance-record-card .status-pill--published {
  gap: 0.35rem;
  background: #dcfce7;
  color: #166534;
}

.performance-record-card .status-pill--draft {
  gap: 0.35rem;
  background: #f1f5f9;
  color: #475569;
}

.status-pill__dot {
  width: 0.4rem;
  height: 0.4rem;
  flex: 0 0 auto;
  border-radius: 50%;
  background: currentColor;
}

.performance-record-card__details {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0;
  margin: 0;
  padding: 0.25rem 1rem;
}

.performance-record-card__details > div {
  min-width: 0;
  padding: 0.7rem 0;
  border-bottom: 1px solid var(--st-border-tertiary, #e8e4dc);
}

.performance-record-card__details > div:nth-last-child(-n + 2) {
  border-bottom: 0;
}

.performance-record-card__details dt {
  color: var(--st-text-secondary, #57534e);
  font-size: 0.72rem;
  font-weight: 600;
}

.performance-record-card__details dd {
  margin: 0.2rem 0 0;
  color: var(--st-text-primary, #1c1917);
  font-size: 0.85rem;
  font-weight: 700;
  overflow-wrap: anywhere;
}

.performance-record-card__comment {
  margin: 0;
  padding: 0.85rem 1rem;
  border-top: 1px solid var(--st-border-tertiary, #e8e4dc);
  color: var(--st-text-secondary, #57534e);
  font-size: 0.8125rem;
  line-height: 1.5;
}

.performance-record-card__actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.45rem;
  margin-top: auto;
  padding: 0.8rem 1rem;
  border-top: 1px solid var(--st-border-tertiary, #e8e4dc);
  background: var(--st-bg-secondary, #f8f6f2);
}

.performance-record-action-form {
  margin: 0;
}

.performance-record-action {
  min-height: 2rem;
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  padding: 0.35rem 0.55rem;
  border: 1px solid var(--st-border-secondary, #ddd8cf);
  border-radius: 0.45rem;
  background: var(--st-bg-primary, #fff);
  color: var(--st-text-secondary, #57534e);
  font: inherit;
  font-size: 0.72rem;
  font-weight: 700;
  line-height: 1.2;
  text-decoration: none;
  cursor: pointer;
  transition: border-color 120ms ease, background-color 120ms ease, color 120ms ease;
}

.performance-record-action:hover {
  border-color: var(--performance-accent);
  background: var(--performance-accent-soft);
  color: var(--performance-accent);
}

.performance-record-action--student {
  color: #1d4ed8;
}

.performance-record-action--guardians {
  color: #7e22ce;
}

.performance-record-action--student.is-active {
  border-color: #bfdbfe;
  background: #eff6ff;
}

.performance-record-action--guardians.is-active {
  border-color: #e9d5ff;
  background: #faf5ff;
}

.performance-record-action--archive {
  margin-left: auto;
  color: #b91c1c;
}

.performance-record-action--archive:hover {
  border-color: #fecaca;
  background: #fef2f2;
  color: #991b1b;
}

.performance-results__table-wrap {
  overflow-x: auto;
  border: 1px solid var(--st-border-secondary, #ddd8cf);
  border-radius: var(--st-radius-md, 8px);
  background: var(--st-bg-primary, #fff);
}

.performance-results__table {
  min-width: 50rem;
}

.performance-results__table th,
.performance-results__table td {
  padding: 0.8rem 0.9rem;
  text-align: left;
  vertical-align: middle;
}

.performance-results__table tbody tr:last-child td {
  border-bottom: 0;
}

.performance-editor {
  width: 100%;
  max-width: 76rem;
  margin-inline: auto;
}

.performance-editor__header {
  align-items: flex-start;
  padding-bottom: 0.25rem;
}

.performance-editor__form {
  display: grid;
  gap: 1rem;
}

.performance-editor__form > .groups-form__errors {
  margin: 0;
}

.performance-editor__form > .groups-form__errors p {
  margin: 0.3rem 0 0;
}

.performance-editor__section {
  padding: 0;
  overflow: hidden;
}

.performance-editor__section-body {
  padding: 1.15rem;
}

.performance-editor__assessment-grid,
.performance-editor__result-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1rem;
}

.performance-editor__assessment-grid .groups-form__field,
.performance-editor__result-grid .groups-form__field,
.performance-editor__comments-grid .groups-form__field {
  margin-bottom: 0;
}

.performance-editor__assessment-grid .groups-form__input,
.performance-editor__assessment-grid .groups-form__select,
.performance-editor__result-grid .groups-form__input,
.performance-editor__result-grid .groups-form__select,
.performance-editor__comments-grid .groups-form__textarea {
  width: 100%;
  min-width: 0;
}

.performance-editor__comments-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1rem;
}

.performance-editor__field--wide {
  grid-column: 1 / -1;
}

.performance-editor__comments-grid .groups-form__textarea {
  min-height: 7.5rem;
  resize: vertical;
}

.performance-editor__actions {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  padding: 1rem 1.15rem;
  border: 1px solid var(--st-border-secondary, #ddd8cf);
  border-radius: var(--st-radius-md, 8px);
  background: var(--st-bg-secondary, #f8f6f2);
}

.performance-editor__actions-copy {
  display: grid;
  gap: 0.15rem;
}

.performance-editor__actions-copy strong {
  color: var(--st-text-primary, #1c1917);
  font-size: 0.82rem;
}

.performance-editor__actions-copy span {
  color: var(--st-text-secondary, #57534e);
  font-size: 0.75rem;
}

.performance-editor__action-buttons {
  display: flex;
  flex: 0 0 auto;
  gap: 0.65rem;
}

.performance-batch {
  max-width: 76rem;
  margin-inline: auto;
}

.performance-batch__header {
  align-items: flex-start;
  padding-bottom: 0.25rem;
}

.performance-batch__form {
  display: grid;
  gap: 1rem;
}

.performance-batch__card {
  padding: 0;
  overflow: hidden;
}

.performance-batch__section-heading {
  display: flex;
  align-items: flex-start;
  gap: 0.75rem;
  padding: 1rem 1.15rem;
  border-bottom: 1px solid var(--st-border-secondary, #ddd8cf);
  background: var(--st-bg-secondary, #f8f6f2);
}

.performance-batch__section-heading h2 {
  margin: 0;
  font-size: 1rem;
}

.performance-batch__section-heading p {
  margin: 0.2rem 0 0;
  color: var(--st-text-secondary, #57534e);
  font-size: 0.8rem;
}

.performance-batch__section-number {
  width: 1.8rem;
  height: 1.8rem;
  flex: 0 0 auto;
  display: grid;
  place-items: center;
  border-radius: 50%;
  background: var(--st-accent, #5c5346);
  color: #fff;
  font-size: 0.75rem;
  font-weight: 700;
}

.performance-batch__student-count {
  flex: 0 0 auto;
  margin-left: auto;
  padding: 0.3rem 0.6rem;
  border: 1px solid var(--st-border-secondary, #ddd8cf);
  border-radius: 999px;
  background: var(--st-bg-primary, #fff);
  color: var(--st-text-secondary, #57534e);
  font-size: 0.72rem;
  font-weight: 700;
}

.performance-batch__assessment-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0 1rem;
  padding: 1.15rem;
}

.performance-batch__assessment-grid .groups-form__field {
  margin-bottom: 1rem;
}

.performance-batch__assessment-grid .groups-form__select {
  width: 100%;
}

.performance-batch__field--wide {
  grid-column: span 2;
}

.performance-batch__publication {
  display: grid;
  grid-template-columns: minmax(12rem, 0.8fr) minmax(0, 1.5fr);
  gap: 1rem;
  align-items: center;
  margin: 0 1.15rem 1.15rem;
  padding: 0.9rem 1rem;
  border: 1px solid var(--st-border-secondary, #ddd8cf);
  border-radius: var(--st-radius-md, 8px);
  background: color-mix(in srgb, var(--st-accent, #5c5346) 5%, white);
}

.performance-batch__publication-copy {
  display: grid;
  gap: 0.2rem;
}

.performance-batch__publication-copy strong {
  color: var(--st-text-primary, #1c1917);
  font-size: 0.82rem;
}

.performance-batch__publication-copy span {
  color: var(--st-text-secondary, #57534e);
  font-size: 0.75rem;
  line-height: 1.4;
}

.performance-batch__publication-options {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem 1rem;
}

.performance-batch__publication-options label {
  min-height: 2.75rem;
  display: inline-flex;
  align-items: center;
  gap: 0.55rem;
  padding: 0.5rem 0.75rem;
  border: 1px solid var(--st-border-secondary, #ddd8cf);
  border-radius: var(--st-radius-md, 8px);
  background: var(--st-bg-primary, #fff);
  color: var(--st-text-primary, #1c1917);
  font-size: 0.82rem;
  cursor: pointer;
}

.performance-batch__publication input,
.performance-batch__student-card input[type="checkbox"] {
  width: 1rem;
  height: 1rem;
  margin: 0;
  accent-color: var(--st-accent, #5c5346);
}

.performance-batch__student-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1rem;
  padding: 1.15rem;
}

.performance-batch__student-card {
  min-width: 0;
  overflow: hidden;
  border: 1px solid var(--st-border-secondary, #ddd8cf);
  border-radius: var(--st-radius-md, 8px);
  background: var(--st-bg-primary, #fff);
  box-shadow: 0 1px 2px rgb(28 25 23 / 0.04);
}

.performance-batch__student-header {
  padding: 0.75rem 0.9rem;
  border-bottom: 1px solid var(--st-border-tertiary, #e8e4dc);
  background: var(--st-bg-secondary, #f8f6f2);
}

.performance-batch__student-toggle {
  display: flex;
  align-items: center;
  gap: 0.65rem;
  margin: 0;
  cursor: pointer;
}

.performance-batch__student-toggle > span:last-child {
  min-width: 0;
  display: grid;
  gap: 0.1rem;
}

.performance-batch__student-toggle strong {
  color: var(--st-text-primary, #1c1917);
  font-size: 0.85rem;
  overflow-wrap: anywhere;
}

.performance-batch__student-toggle small {
  color: var(--st-text-secondary, #57534e);
  font-size: 0.7rem;
}

.performance-batch__student-index {
  width: 1.7rem;
  height: 1.7rem;
  flex: 0 0 auto;
  display: grid;
  place-items: center;
  border-radius: 50%;
  background: var(--st-bg-primary, #fff);
  color: var(--st-text-secondary, #57534e);
  font-size: 0.7rem;
  font-weight: 700;
}

.performance-batch__student-body {
  padding: 0.9rem;
}

.performance-batch__student-fields {
  display: grid;
  grid-template-columns: 0.65fr 1.15fr 0.8fr;
  gap: 0.75rem;
}

.performance-batch__student-comments {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.75rem;
  padding-top: 0.75rem;
  border-top: 1px solid var(--st-border-tertiary, #e8e4dc);
}

.performance-batch__student-card .groups-form__field {
  margin-bottom: 0.75rem;
}

.performance-batch__student-card .groups-form__input,
.performance-batch__student-card .groups-form__select,
.performance-batch__student-card .groups-form__textarea {
  width: 100%;
  min-width: 0;
  margin: 0;
}

.performance-batch__student-card .groups-form__textarea {
  min-height: 5.5rem;
  resize: vertical;
}

.performance-batch__student-card .groups-form__hint {
  margin-bottom: 0;
  font-size: 0.7rem;
}

.performance-batch__actions {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  padding: 1rem 1.15rem;
  border: 1px solid var(--st-border-secondary, #ddd8cf);
  border-radius: var(--st-radius-md, 8px);
  background: var(--st-bg-secondary, #f8f6f2);
}

.performance-batch__actions > div:first-child {
  display: grid;
  gap: 0.15rem;
}

.performance-batch__actions strong {
  font-size: 0.82rem;
}

.performance-batch__actions span {
  color: var(--st-text-secondary, #57534e);
  font-size: 0.75rem;
}

.performance-batch__action-buttons {
  display: flex;
  flex: 0 0 auto;
  gap: 0.65rem;
}

.student-files-table-wrap {
  overflow-x: auto;
  border: 1px solid var(--st-border-secondary, #ddd8cf);
  border-radius: var(--st-radius-md, 8px);
  background: var(--st-bg-primary, #fff);
}

.student-files-table {
  min-width: 46rem;
}

.student-files-table--unified {
  min-width: 58rem;
}

.student-files-table .bl-table__th,
.student-files-table .bl-table__td {
  padding: 0.8rem 0.9rem;
  text-align: left;
  vertical-align: middle;
}

.student-files-table__student {
  color: var(--st-accent, #5c5346);
  font-weight: 700;
  text-decoration: none;
}

.student-files-table__file {
  display: grid;
  gap: 0.2rem;
}

.student-files-table__file > span,
.student-files-table__meta {
  color: var(--st-text-secondary, #57534e);
  font-size: 0.8125rem;
}

.student-files-table__source {
  min-width: 8.5rem;
}

.student-files-table__source > span {
  display: block;
}

.student-files-table__source > span + span {
  margin-top: 0.25rem;
  color: var(--st-text-tertiary, #78716c);
  font-size: 0.72rem;
}

.student-files-table__source-badge {
  width: fit-content;
  padding: 0.18rem 0.48rem;
  border-radius: 999px;
  font-size: 0.7rem;
  font-weight: 700;
  white-space: nowrap;
}

.student-files-table__source-badge--student {
  background: #eff6ff;
  color: #1d4ed8;
}

.student-files-table__source-badge--staff {
  background: #f0fdf4;
  color: #15803d;
}

.student-files-table__source-badge--resource {
  background: #faf5ff;
  color: #7e22ce;
}

.student-files-table__context {
  max-width: 13rem;
  color: var(--st-text-secondary, #57534e);
  font-size: 0.78rem;
}

.student-files-table__category {
  width: fit-content;
  margin-top: 0.2rem;
  padding: 0.15rem 0.45rem;
  border-radius: 999px;
  background: var(--st-bg-secondary, #f3f0ea);
  font-weight: 600;
}

.student-files-table__meta {
  white-space: nowrap;
}

.student-files-table__meta span + span::before {
  content: " · ";
}

.student-files-table__actions {
  width: 1%;
  text-align: right !important;
  white-space: nowrap;
}

.student-files-table__icon-action {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 2rem;
  height: 2rem;
  border: 1px solid var(--st-border-secondary, #ddd8cf);
  border-radius: 0.45rem;
  background: var(--st-bg-primary, #fff);
  color: var(--st-text-secondary, #57534e);
  text-decoration: none;
}

.student-files-table__icon-action:hover {
  border-color: var(--st-accent, #2d6a4f);
  background: var(--st-bg-secondary, #f8f6f2);
  color: var(--st-accent, #2d6a4f);
}

.student-files-table__action-group {
  display: inline-flex;
  gap: 0.35rem;
}

.student-files-table__action-form {
  display: inline-flex;
  margin: 0;
}

.student-files-table__icon-action--danger:hover {
  border-color: #dc2626;
  background: #fef2f2;
  color: #b91c1c;
}

.student-files-tab__empty {
  padding: 2rem 1rem;
  border: 1px dashed var(--st-border-secondary, #ddd8cf);
  border-radius: var(--st-radius-md, 8px);
  background: var(--st-bg-secondary, #f8f6f2);
  text-align: center;
}

.student-files-report-section {
  display: grid;
  gap: 0.8rem;
  padding-top: 1.25rem;
  border-top: 1px solid var(--st-border-secondary, #ddd8cf);
}

.student-files-report-section__header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 1rem;
}

.student-files-report-section__header h3 {
  margin: 0;
  font-size: 1rem;
}

.student-files-report-section__header p {
  margin: 0.25rem 0 0;
  color: var(--st-text-secondary, #57534e);
  font-size: 0.82rem;
}

.class-hours-card__header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 1.5rem;
  padding-bottom: 1.15rem;
  border-bottom: 0.5px solid var(--st-border-tertiary, #e8e4dc);
}

.groups-form__card--class-hours .groups-form__section-title {
  margin-bottom: 0.35rem;
  font-size: 1rem;
}

.class-hours-card__lead {
  margin: 0;
  color: var(--st-text-secondary, #57534e);
  font-size: 0.8125rem;
  line-height: 1.5;
}

.class-hours-summary {
  flex: 0 0 auto;
  min-width: 10.5rem;
  padding: 0.7rem 0.85rem;
  border: 0.5px solid var(--st-border-secondary, #ddd8cf);
  border-radius: var(--st-radius-md, 8px);
  background: var(--st-bg-secondary, #f8f6f2);
}

.class-hours-summary__label,
.class-hours-summary__value {
  display: block;
}

.class-hours-summary__label {
  color: var(--st-text-secondary, #57534e);
  font-size: 0.75rem;
  font-weight: 600;
}

.class-hours-summary__value {
  margin-top: 0.15rem;
  color: var(--st-text-primary, #1c1917);
  font-size: 1.05rem;
  line-height: 1.3;
}

.class-hours-thresholds {
  display: grid;
  gap: 1rem;
  margin-top: 1.15rem;
}

.class-hours-threshold {
  padding: 1.05rem;
  border: 0.5px solid var(--st-border-secondary, #ddd8cf);
  border-radius: var(--st-radius-md, 10px);
  background: var(--st-bg-primary, #fff);
}

.class-hours-threshold--new {
  border-style: dashed;
  background: var(--st-bg-secondary, #faf9f7);
}

.class-hours-threshold__header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 1rem;
  margin-bottom: 1rem;
}

.class-hours-threshold__title {
  margin: 0;
  color: var(--st-text-primary, #1c1917);
  font-size: 0.9375rem;
  font-weight: 700;
  line-height: 1.35;
}

.class-hours-threshold__description {
  margin: 0.2rem 0 0;
  color: var(--st-text-secondary, #57534e);
  font-size: 0.78rem;
  line-height: 1.45;
}

.class-hours-threshold__fields {
  display: grid;
  grid-template-columns: minmax(10rem, 0.7fr) minmax(11rem, 0.8fr) minmax(16rem, 1.4fr);
  align-items: end;
  gap: 0.9rem;
}

.class-hours-threshold__fields .groups-form__field,
.class-hours-threshold__toggle {
  margin: 0;
}

.class-hours-input-suffix {
  position: relative;
}

.class-hours-input-suffix .groups-form__input {
  padding-right: 3.7rem;
}

.class-hours-input-suffix > span {
  position: absolute;
  top: 50%;
  right: 0.75rem;
  transform: translateY(-50%);
  color: var(--st-text-secondary, #57534e);
  font-size: 0.75rem;
  pointer-events: none;
}

.class-hours-threshold__note {
  margin: 0.6rem 0 0;
  color: var(--st-text-secondary, #57534e);
  font-size: 0.75rem;
  line-height: 1.45;
}

.class-hours-threshold__toggle {
  margin-top: 0.9rem;
}

@media (max-width: 900px) {
  .student-files-filters__grid {
    grid-template-columns: 1fr 1fr;
  }

  .class-hours-threshold__fields {
    grid-template-columns: 1fr 1fr;
  }

  .class-hours-threshold__fields .groups-form__field:last-child {
    grid-column: 1 / -1;
  }
}

@media (max-width: 640px) {
  .student-files-tab__header,
  .class-hours-card__header {
    flex-direction: column;
  }

  .student-files-filters__grid,
  .student-files-upload__grid,
  .class-hours-threshold__fields {
    grid-template-columns: 1fr;
  }

  .student-files-upload__field--file,
  .student-files-upload__field--description {
    grid-column: auto;
  }

  .student-files-upload__footer {
    align-items: stretch;
    flex-direction: column;
  }

  .student-files-upload__footer .btn-primary {
    justify-content: center;
    width: 100%;
  }

  .class-hours-threshold__fields .groups-form__field:last-child {
    grid-column: auto;
  }

  .class-hours-summary {
    width: 100%;
    box-sizing: border-box;
  }
}

.ct-table__action-links {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 0.35rem;
}

.ct-table__action-icons {
  display: inline-flex;
  align-items: center;
  justify-content: flex-end;
  gap: 0.25rem;
  flex-wrap: wrap;
}

.ct-entity-link {
  color: var(--st-accent, #5c5346);
  font-weight: 600;
  text-decoration: none;
}

.ct-entity-link:hover {
  color: var(--st-accent-strong, #433a32);
  text-decoration: underline;
}

.ct-teacher-links {
  display: inline;
  line-height: 1.45;
}

.groups-show .cp-badge--warn {
  background: #fef3c7;
  color: #92400e;
  border: 0.5px solid #fcd34d;
}

.ct-action-link {
  font-size: 0.8125rem;
  font-weight: 600;
}

.ct-empty {
  padding: 2rem 1rem;
  text-align: center;
  border: 1px dashed var(--st-border-secondary);
  border-radius: var(--radius-md, 12px);
  background: var(--st-bg-secondary, #f8f6f2);
}

.ct-teaching-course {
  margin-bottom: 1.25rem;
  padding: 1rem 1.1rem;
  border: 0.5px solid var(--st-border-tertiary, #e8e4dc);
  border-radius: var(--st-radius-md, 8px);
  background: var(--st-bg-secondary, #f8f6f2);
}

.ct-teaching-course__label {
  margin: 0 0 0.25rem;
  font-size: 0.68rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--st-text-tertiary);
}

.ct-teaching-course__label + .ct-teaching-course__label {
  margin-top: 0.85rem;
}

.ct-teaching-course__value {
  margin: 0;
  font-size: 0.9375rem;
  font-weight: 600;
}

.ct-teaching-course__meta {
  margin: 0.2rem 0 0;
  font-size: 0.8125rem;
  color: var(--st-text-secondary);
}

.ct-teaching-course__empty {
  margin: 0;
  font-size: 0.875rem;
  color: var(--st-text-secondary);
}

.ct-empty__title {
  margin: 0 0 0.35rem;
  font-weight: 700;
}

.ct-empty__text {
  margin: 0 0 1rem;
  color: var(--st-text-secondary);
  font-size: 0.875rem;
}

.ct-empty__cta {
  display: inline-block;
}

.ct-warnings {
  margin-bottom: 1rem;
  padding: 0.75rem 1rem;
  border-radius: var(--radius-md, 12px);
  background: #fff7ed;
  border: 1px solid #fed7aa;
  color: #9a3412;
  font-size: 0.8125rem;
}

.ct-warnings p {
  margin: 0;
}

.ct-warnings p + p {
  margin-top: 0.35rem;
}

.ct-form-alert {
  margin-bottom: 1rem;
  padding: 0.85rem 1rem;
  border-radius: var(--st-radius-md, 8px);
  font-size: 0.875rem;
  line-height: 1.45;
  width: 100%;
  max-width: none;
  box-sizing: border-box;
}

.ct-form-alert--error {
  background: #fef2f2;
  border: 0.5px solid #fecaca;
  color: #991b1b;
}

.ct-form-alert--warning {
  background: #fff7ed;
  border: 0.5px solid #fed7aa;
  color: #9a3412;
}

.ct-form-alert__title {
  margin: 0 0 0.45rem;
  font-weight: 700;
  font-size: 0.875rem;
}

.ct-form-alert__list {
  margin: 0;
  padding-left: 1.15rem;
}

.ct-form-alert__list li + li {
  margin-top: 0.3rem;
}

.ct-edit-course-allocation .groups-show__body {
  padding-top: 1.25rem;
}

.ct-edit-course-allocation__hint {
  margin: 0 0 1rem;
  font-size: 0.8125rem;
  line-height: 1.45;
  color: var(--st-text-secondary, #57534e);
}

.ct-edit-course-allocation .mt-teachers-table {
  margin-top: 0.25rem;
}

.ct-edit-course-allocation .ct-form-alert:last-of-type {
  margin-bottom: 1.25rem;
}

.ct-additional-teachers {
  margin-top: 1rem;
}

.ct-additional-teachers__head {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  margin-bottom: 0.75rem;
}

.ct-additional-teachers__title {
  margin: 0;
  font-size: 0.875rem;
  font-weight: 700;
}

.ct-sync-block {
  margin-bottom: 1.25rem;
}

.ct-sync-block__title {
  margin: 0 0 0.5rem;
  font-size: 0.875rem;
  font-weight: 700;
}

.ct-sync-list {
  margin: 0;
  padding-left: 1.1rem;
  color: var(--st-text-secondary);
  font-size: 0.875rem;
}

.ct-sync-block--warning {
  padding: 0.85rem 1rem;
  border-radius: var(--st-radius-md, 8px);
  background: #fff7ed;
  border: 0.5px solid #fed7aa;
}

.ct-sync-block--warning .ct-sync-block__title,
.ct-sync-block--warning .ct-sync-block__lead,
.ct-sync-block--warning .ct-sync-list {
  color: #9a3412;
}

.ct-sync-block__lead {
  margin: 0 0 0.5rem;
  font-size: 0.8125rem;
  color: var(--st-text-secondary);
}

.ct-sync-list__note {
  display: block;
  margin-top: 0.2rem;
  font-size: 0.8125rem;
  color: #9a3412;
}

.groups-form__student-context {
  display: block;
  margin-top: 0.15rem;
  font-size: 0.75rem;
  color: var(--st-text-secondary);
  font-weight: 400;
}

.gs-warning,
.gs-capability-warning {
  margin: 0.25rem 0 0;
  font-size: 0.75rem;
  color: #9a3412;
  line-height: 1.35;
}

.gs-warning--inline,
.gs-capability-warning--inline {
  display: block;
  margin-top: 0.2rem;
}

.gs-warning__icon,
.gs-capability-warning__icon {
  margin-right: 0.2rem;
  color: #c2410c;
}

.gm-enrolment--mismatch {
  color: #9a3412;
  font-weight: 600;
}

.gm-row--warning .gm-enrolment {
  background: #fff7ed;
  border: 0.5px solid #fed7aa;
  border-radius: 4px;
  padding: 0.15rem 0.4rem;
}

.ct-form-page .groups-show__main {
  padding: 0;
}

/* Course allocation — add course to registration class */
.ct-allocation-form__section {
  margin-top: 1.75rem;
}

.ct-allocation-form__section:first-of-type {
  margin-top: 1.5rem;
}

.ct-allocation-form__section + .ct-allocation-form__section {
  margin-top: 2rem;
  padding-top: 1.5rem;
  border-top: 0.5px solid var(--st-border-tertiary, #e8e4dc);
}

.ct-allocation-form__section-title {
  margin: 0 0 0.85rem;
  font-size: 0.9375rem;
  font-weight: 700;
  color: var(--st-text-primary, #1c1917);
  letter-spacing: 0.01em;
}

.ct-allocation-form__locked-course {
  margin: 0 0 0.35rem;
  font-size: 1rem;
  font-weight: 700;
  color: var(--st-text-primary, #1c1917);
}

.ct-teacher-picker {
  margin-top: 0.75rem;
}

.ct-teacher-picker__card {
  background: var(--st-bg-secondary, #f3f0ea);
}

.ct-allocation-form__subsection-title {
  margin: 0;
  font-size: 0.8125rem;
  font-weight: 700;
  color: var(--st-text-primary, #1c1917);
}

.ct-allocation-form .groups-form__field {
  margin-bottom: 1rem;
  max-width: 36rem;
}

.ct-allocation-form .groups-form__field label {
  display: block;
  font-size: 0.8125rem;
  font-weight: 600;
  color: var(--st-text-primary, #1c1917);
  margin-bottom: 0.4rem;
}

.ct-allocation-form .groups-form__input,
.ct-allocation-form .groups-form__select {
  display: block;
  width: 100%;
  max-width: 100%;
  min-height: 40px;
  height: auto;
  padding: 0.45rem 0.75rem;
  border: 0.5px solid var(--st-border-secondary, #ddd8cf);
  border-radius: var(--st-radius-md, 8px);
  background: var(--st-bg-primary, #fff);
  color: var(--st-text-primary, #1c1917);
  font-size: 0.875rem;
  font-family: inherit;
  box-sizing: border-box;
}

.ct-allocation-form .groups-form__select {
  padding-right: 2rem;
  appearance: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%2394a3b8' stroke-width='2'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 0.65rem center;
}

.ct-allocation-form .groups-form__input:focus,
.ct-allocation-form .groups-form__select:focus {
  outline: none;
  border-color: var(--st-accent, #5c5346);
  box-shadow: 0 0 0 2px rgba(92, 83, 70, 0.12);
}

.ct-allocation-form .groups-form__hint {
  margin-top: 0.35rem;
  margin-bottom: 0;
  font-size: 0.8125rem;
  color: var(--st-text-secondary, #57534e);
  line-height: 1.45;
}

.ct-allocation-form__teachers-block {
  max-width: 48rem;
}

.ct-allocation-form__teachers-toolbar {
  margin-top: 0.25rem;
  margin-bottom: 0.75rem;
}

.ct-allocation-form__capability-hint {
  margin-top: 0.75rem;
}

.ct-allocation-form__actions {
  margin-top: 1.5rem;
}

.ct-allocation-form .mt-teachers-table__cell .groups-form__select {
  min-height: 36px;
}

@media (max-width: 640px) {
  .ct-allocation-form .groups-form__field {
    max-width: none;
  }

  .ct-allocation-form__teachers-block {
    max-width: none;
  }

  .ct-allocation-form__teachers-toolbar {
    flex-direction: column;
    align-items: stretch;
  }

  .ct-allocation-form__teachers-toolbar .gm-add-btn {
    width: 100%;
    justify-content: center;
  }

  .ct-allocation-form__actions {
    flex-direction: column;
    align-items: stretch;
  }

  .ct-allocation-form__actions .btn-primary,
  .ct-allocation-form__actions .students-index__btn {
    width: 100%;
    justify-content: center;
    min-height: 44px;
  }
}

@media (max-width: 640px) {
  .ct-table__action-links {
    align-items: flex-start;
  }
}

/* Classes & Groups — index scope tabs (segmented control) */
.groups-index__scope-tabs {
  display: inline-flex;
  flex-wrap: wrap;
  gap: 0.25rem;
  margin: 0 0 1rem;
  padding: 0.25rem;
  background: var(--st-bg-secondary, #f3f0ea);
  border: 0.5px solid var(--st-border-tertiary, #e8e4dc);
  border-radius: var(--st-radius-md, 8px);
  width: fit-content;
  max-width: 100%;
  box-sizing: border-box;
}

.groups-index__scope-tabs .cp-tab {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0.5rem 1rem;
  border-radius: var(--st-radius-sm, 6px);
  font-size: 0.8125rem;
  font-weight: 600;
  line-height: 1.25;
  text-decoration: none;
  color: var(--st-text-secondary, #57534e);
  white-space: nowrap;
  background: transparent;
  border: none;
  min-height: 36px;
  box-sizing: border-box;
  transition: background 0.12s ease, color 0.12s ease, box-shadow 0.12s ease;
}

.groups-index__scope-tabs .cp-tab:hover {
  color: var(--st-text-primary, #1c1917);
  background: rgba(255, 255, 255, 0.5);
}

.groups-index__scope-tabs .cp-tab:focus-visible {
  outline: 2px solid var(--st-accent, #5c5346);
  outline-offset: 2px;
}

.groups-index__scope-tabs .cp-tab--active {
  background: var(--st-bg-primary, #fff);
  color: var(--st-text-primary, #1c1917);
  font-weight: 700;
  box-shadow: 0 1px 3px rgba(28, 25, 23, 0.08);
}

.groups-index__scope-tabs .cp-tab--active:hover {
  background: var(--st-bg-primary, #fff);
  color: var(--st-text-primary, #1c1917);
}

.groups-index__name-cell {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.45rem;
}

.groups-index__type-badge {
  font-size: 0.65rem;
}

.groups-index__name-sub {
  font-size: 0.78rem;
  color: var(--st-text-secondary, #57534e);
  margin-top: 0.15rem;
}

/* Course setup wizard */
.course-setup-category {
  margin-top: 1.25rem;
  padding-top: 1rem;
  border-top: 1px solid var(--color-border, #e8e4dc);
}

.course-setup-category:first-child {
  margin-top: 0.5rem;
  padding-top: 0;
  border-top: 0;
}

.course-setup-category__header {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  margin-bottom: 0.75rem;
}

.course-setup-category__title {
  margin: 0;
  font-size: 0.95rem;
  font-weight: 700;
  color: var(--st-navy, #1c1917);
}

.course-setup-matrix__wrap {
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  margin: 1rem 0;
  border: 1px solid var(--color-border, #e8e4dc);
  border-radius: var(--radius-md, 0.625rem);
}

.course-setup-matrix__table {
  width: 100%;
  min-width: 40rem;
  margin: 0;
  border-collapse: separate;
  border-spacing: 0;
}

.course-setup-matrix__table th,
.course-setup-matrix__table td {
  padding: 0.65rem 0.75rem;
  vertical-align: middle;
  border-bottom: 1px solid var(--color-border, #e8e4dc);
}

.course-setup-matrix__course-col {
  position: sticky;
  left: 0;
  z-index: 1;
  min-width: 10rem;
  max-width: 14rem;
  background: var(--color-surface-raised, #fff);
  text-align: left;
  font-weight: 600;
}

.course-setup-matrix__code {
  margin-top: 0.2rem;
  font-size: 0.75rem;
  font-weight: 600;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--color-text-muted, #5b6b7c);
}

.course-setup-matrix__level-col {
  text-align: center;
  white-space: nowrap;
  font-size: 0.8125rem;
}

.course-setup-matrix__cell {
  text-align: center;
}

.course-setup-matrix__check {
  margin: 0 auto;
}

.course-setup-matrix__locked {
  display: inline-block;
  margin-left: 0.15rem;
  color: var(--color-text-muted, #5b6b7c);
  font-weight: 700;
}

.course-setup-matrix__actions-col {
  width: 5.5rem;
  text-align: center;
  white-space: nowrap;
}

.course-setup-matrix__row-actions {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.25rem;
}

.course-setup-matrix__row-actions .cl-icon-btn {
  min-width: 2.75rem;
  min-height: 2.75rem;
}

/* Teaching group profile */
.groups-show__profile-type {
  margin: 0 0 0.2rem;
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--st-text-tertiary, #a8a29e);
}

.groups-show__course-primary {
  margin: 0.15rem 0 0.35rem;
  font-size: 1.05rem;
  font-weight: 700;
  color: var(--st-text-primary, #1c1917);
}

.groups-show__registration-context {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 0.35rem 0.6rem;
  margin: 0 0 1rem;
  padding: 0.75rem 1rem;
  border: 0.5px solid var(--st-border-tertiary, #e8e4dc);
  border-radius: var(--st-radius-md, 8px);
  background: var(--st-bg-secondary, #f8f6f2);
  font-size: 0.875rem;
}

.groups-show__registration-context--mixed {
  color: var(--st-text-secondary, #57534e);
}

.groups-show__registration-context-label {
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.03em;
  text-transform: uppercase;
  color: var(--st-text-tertiary, #a8a29e);
}

.gs-stat-row--teacher .gs-stat-label {
  min-width: 0;
}

/* Courses & Teachers — course-first table */
.ct-table--course-first .ct-course-name {
  display: block;
  font-size: 0.9375rem;
}

.ct-teaching-group-secondary {
  margin: 0.25rem 0 0;
  font-size: 0.75rem;
  color: var(--st-text-secondary, #57534e);
}

.ct-teaching-group-secondary__link {
  font-size: 0.75rem;
  font-weight: 600;
}

.ct-action-link--secondary {
  opacity: 0.85;
}

.ct-action-link--button {
  background: none;
  border: none;
  padding: 0;
  cursor: pointer;
  font: inherit;
  text-align: right;
}

.ct-inline-form {
  display: inline;
}

@media (max-width: 1100px) {
  .performance-records-filters__grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .performance-results__grid {
    grid-template-columns: 1fr;
  }

  .performance-batch__student-grid {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 640px) {
  .performance-records-filters__grid {
    grid-template-columns: 1fr;
  }

  .performance-results__header,
  .performance-editor__header,
  .performance-batch__header {
    align-items: stretch;
    flex-direction: column;
  }

  .performance-results__header .btn-primary,
  .performance-editor__actions .btn-primary,
  .performance-editor__actions .btn-secondary,
  .performance-batch__actions .btn-primary,
  .performance-batch__actions .btn-secondary {
    width: 100%;
  }

  .performance-results__filter-actions,
  .performance-editor__actions,
  .performance-batch__actions {
    flex-direction: column;
    align-items: stretch;
  }

  .performance-editor__assessment-grid,
  .performance-editor__result-grid,
  .performance-editor__comments-grid,
  .performance-batch__assessment-grid,
  .performance-batch__student-fields,
  .performance-batch__student-comments,
  .performance-batch__publication {
    grid-template-columns: 1fr;
  }

  .performance-editor__field--wide,
  .performance-batch__field--wide {
    grid-column: auto;
  }

  .performance-batch__section-heading {
    flex-wrap: wrap;
  }

  .performance-batch__student-count {
    margin-left: 2.55rem;
  }

  .performance-batch__publication-options,
  .performance-editor__action-buttons,
  .performance-batch__action-buttons {
    align-items: stretch;
    flex-direction: column;
  }

  .performance-record-card__details {
    grid-template-columns: 1fr;
  }

  .performance-record-card__details > div:nth-last-child(-n + 2) {
    border-bottom: 1px solid var(--st-border-tertiary, #e8e4dc);
  }

  .performance-record-card__details > div:last-child {
    border-bottom: 0;
  }

  .performance-record-card__header {
    flex-direction: column;
  }

  .performance-record-card__actions {
    align-items: stretch;
    flex-direction: column;
  }

  .performance-record-action-form,
  .performance-record-action {
    width: 100%;
  }

  .performance-record-action {
    min-height: 2.25rem;
    justify-content: flex-start;
  }

  .performance-record-action--archive {
    margin-left: 0;
  }

  .performance-batch__publication-options label {
    width: 100%;
    box-sizing: border-box;
  }

  .groups-index__scope-tabs {
    display: flex;
    width: 100%;
  }

  .groups-index__scope-tabs .cp-tab {
    flex: 1 1 0;
    min-height: 44px;
    padding-inline: 0.65rem;
    text-align: center;
  }

  .ct-table__action-links {
    align-items: flex-start;
  }
}

/* Student Learning Reports tab */
.learning-reports-tab {
  display: grid;
  gap: 1.1rem;
}

.learning-reports-tab__header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 1rem;
  padding-bottom: 1rem;
  border-bottom: 1px solid var(--st-border-tertiary, #e8e4dc);
}

.learning-reports-tab__title {
  margin: 0;
  color: var(--st-text-primary, #1c1917);
  font-size: 1.05rem;
  font-weight: 700;
}

.learning-reports-tab__lead {
  margin: 0.3rem 0 0;
  color: var(--st-text-secondary, #57534e);
  font-size: 0.8125rem;
  line-height: 1.5;
}

.learning-reports-tab__actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: flex-end;
  gap: 0.55rem;
  flex: 0 0 auto;
}

.learning-reports-tab__action-btn {
  min-height: 2.5rem;
}

.learning-reports-status {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  padding: 1rem 1.1rem;
  border: 1px solid var(--st-border-secondary, #ddd8cf);
  border-radius: var(--st-radius-md, 8px);
  background: var(--st-bg-secondary, #f8f6f2);
}

.learning-reports-status--on {
  border-color: #bbf7d0;
  background: #f0fdf4;
}

.learning-reports-status--off {
  border-color: #e7e5e4;
  background: #fafaf9;
}

.learning-reports-status__label {
  display: block;
  margin-bottom: 0.2rem;
  color: var(--st-text-secondary, #57534e);
  font-size: 0.75rem;
  font-weight: 600;
  letter-spacing: 0.02em;
  text-transform: uppercase;
}

.learning-reports-status__value {
  display: block;
  color: var(--st-text-primary, #1c1917);
  font-size: 0.95rem;
  font-weight: 700;
}

.learning-reports-status__hint {
  margin: 0.35rem 0 0;
  color: var(--st-text-secondary, #57534e);
  font-size: 0.8125rem;
  line-height: 1.45;
}

.learning-reports-status__pill {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  min-height: 1.85rem;
  padding: 0.2rem 0.7rem;
  border-radius: 999px;
  font-size: 0.75rem;
  font-weight: 700;
}

.learning-reports-status--on .learning-reports-status__pill {
  color: #166534;
  background: #dcfce7;
}

.learning-reports-status--off .learning-reports-status__pill {
  color: #57534e;
  background: #e7e5e4;
}

.learning-reports-panel {
  padding: 1rem 1.1rem 1.15rem;
  border: 1px solid var(--st-border-secondary, #ddd8cf);
  border-radius: var(--st-radius-md, 8px);
  background: var(--st-bg-primary, #fff);
}

.learning-reports-panel__header {
  margin-bottom: 0.95rem;
}

.learning-reports-panel__header--history {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 1rem;
}

.learning-reports-panel__count {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 1.8rem;
  height: 1.8rem;
  padding: 0 0.45rem;
  border-radius: 999px;
  background: #edf4ef;
  color: var(--st-nav-accent, #2d6a4f);
  font-size: 0.72rem;
  font-weight: 750;
}

.learning-reports-panel__title {
  margin: 0;
  color: var(--st-text-primary, #1c1917);
  font-size: 0.95rem;
  font-weight: 700;
}

.learning-reports-panel__hint {
  margin: 0.3rem 0 0;
  color: var(--st-text-secondary, #57534e);
  font-size: 0.8125rem;
  line-height: 1.45;
}

.learning-reports-form__grid {
  display: grid;
  grid-template-columns: minmax(12rem, 16rem) minmax(0, 1fr);
  gap: 0.9rem 1rem;
}

.learning-reports-form__fields {
  display: grid;
  gap: 1rem;
}

.learning-reports-form__field--wide {
  grid-column: 1 / -1;
}

.learning-reports-form .groups-form__field {
  margin: 0;
}

.learning-reports-form .groups-form__select,
.learning-reports-form .groups-form__textarea {
  width: 100%;
}

.learning-reports-form__mode {
  max-width: 24rem;
}

.learning-reports-form__intro {
  padding: 1rem;
  border: 1px solid var(--st-border-tertiary, #e8e4dc);
  border-radius: var(--st-radius-md, 8px);
  background: var(--st-bg-secondary, #faf9f7);
}

.learning-reports-form__intro-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  margin-bottom: 0.35rem;
}

.learning-reports-form__intro-header .groups-form__field-label {
  margin: 0;
}

.learning-reports-form__optional {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  min-height: 1.45rem;
  padding: 0.1rem 0.5rem;
  border-radius: 999px;
  background: #ebe8e2;
  color: var(--st-text-secondary, #57534e);
  font-size: 0.68rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.learning-reports-form__intro-hint {
  margin: 0 0 0.7rem;
}

.learning-reports-form__textarea {
  display: block;
  width: 100%;
  min-height: 8.5rem;
  padding: 0.85rem 0.95rem;
  border: 1px solid var(--st-border-secondary, #ddd8cf);
  border-radius: var(--st-radius-md, 8px);
  background: var(--st-bg-primary, #fff);
  color: var(--st-text-primary, #1c1917);
  font: inherit;
  font-size: 0.9rem;
  line-height: 1.55;
  resize: vertical;
  box-sizing: border-box;
}

.learning-reports-form__textarea::placeholder {
  color: #a8a29e;
}

.learning-reports-form__textarea:focus {
  outline: none;
  border-color: var(--st-accent, #5c5346);
  box-shadow: 0 0 0 2px rgba(92, 83, 70, 0.12);
  background: #fff;
}

.learning-reports-form__footer {
  display: flex;
  justify-content: flex-start;
  margin-top: 1rem;
}

.learning-reports-form__footer .btn-primary {
  min-height: 2.5rem;
}

.learning-reports-form__preview-row {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  gap: 0.75rem 1rem;
}

.learning-reports-form__preview-student {
  flex: 1 1 14rem;
  min-width: 0;
  max-width: 24rem;
}

.learning-reports-form--preview .learning-reports-tab__action-btn {
  flex: 0 0 auto;
}

.learning-reports-table-wrap {
  max-width: 100%;
  margin: 0 -1.1rem -1.15rem;
  overflow-x: auto;
  border-top: 1px solid var(--st-border-tertiary, #e8e4dc);
  border-radius: 0 0 var(--st-radius-md, 8px) var(--st-radius-md, 8px);
}

.learning-reports-table {
  width: 100%;
  min-width: 47rem;
  border-collapse: collapse;
  background: var(--st-bg-primary, #fff);
}

.learning-reports-table th,
.learning-reports-table td {
  padding: 0.8rem 0.85rem;
  border-bottom: 1px solid var(--st-border-tertiary, #e8e4dc);
  color: var(--st-text-primary, #1c1917);
  font-size: 0.76rem;
  text-align: left;
  vertical-align: middle;
}

.learning-reports-table th {
  padding-top: 0.65rem;
  padding-bottom: 0.65rem;
  background: var(--st-bg-secondary, #f3f0ea);
  color: var(--st-text-secondary, #57534e);
  font-size: 0.66rem;
  font-weight: 750;
  letter-spacing: 0.045em;
  text-transform: uppercase;
  white-space: nowrap;
}

.learning-reports-table th:first-child,
.learning-reports-table td:first-child {
  padding-left: 1.1rem;
}

.learning-reports-table th:last-child,
.learning-reports-table td:last-child {
  padding-right: 1.1rem;
}

.learning-reports-table tbody tr {
  transition: background 150ms ease;
}

.learning-reports-table tbody tr:hover {
  background: #fcfbf8;
}

.learning-reports-table tbody tr:last-child td {
  border-bottom: 0;
}

.learning-reports-table__actions-col {
  width: 5.25rem;
}

.learning-reports-table__period {
  display: inline-flex;
  align-items: center;
  gap: 0.6rem;
  white-space: nowrap;
}

.learning-reports-table__period strong {
  font-size: 0.78rem;
  font-weight: 700;
}

.learning-reports-table__period-icon {
  display: grid;
  flex: 0 0 auto;
  place-items: center;
  width: 1.8rem;
  height: 1.8rem;
  border-radius: 0.45rem;
  background: #edf4ef;
  color: var(--st-nav-accent, #2d6a4f);
}

.learning-reports-table__period-icon svg,
.learning-reports-table__action svg {
  width: 0.95rem;
  height: 0.95rem;
  stroke-width: 1.8;
}

.learning-reports-table__type {
  color: var(--st-text-secondary, #57534e);
  font-weight: 600;
}

.learning-reports-table__version {
  display: inline-flex;
  align-items: center;
  min-height: 1.45rem;
  padding: 0.1rem 0.42rem;
  border: 1px solid var(--st-border-secondary, #ddd8cf);
  border-radius: 0.35rem;
  background: var(--st-bg-secondary, #f3f0ea);
  color: var(--st-text-secondary, #57534e);
  font-size: 0.68rem;
  font-weight: 700;
}

.learning-reports-table__generated {
  display: flex;
  flex-direction: column;
  line-height: 1.25;
  white-space: nowrap;
}

.learning-reports-table__generated strong {
  font-size: 0.73rem;
  font-weight: 650;
}

.learning-reports-table__generated span,
.learning-reports-table__muted {
  margin-top: 0.14rem;
  color: var(--st-text-secondary, #57534e);
  font-size: 0.65rem;
}

.learning-reports-table__actions {
  text-align: right !important;
  white-space: nowrap;
}

.learning-reports-table__actions-inner {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 0.35rem;
}

.learning-reports-table__action {
  display: inline-grid;
  place-items: center;
  width: 1.95rem;
  height: 1.95rem;
  border: 1px solid var(--st-border-secondary, #ddd8cf);
  border-radius: 0.45rem;
  background: var(--st-bg-primary, #fff);
  color: var(--st-text-secondary, #57534e);
  transition: border-color 150ms ease, background 150ms ease, color 150ms ease;
}

.learning-reports-table__action:hover {
  border-color: #aac6b5;
  background: #edf4ef;
  color: var(--st-nav-accent, #2d6a4f);
}

.learning-reports-table__action--danger:hover {
  border-color: #fecaca;
  background: #fef2f2;
  color: #b91c1c;
}

.learning-reports-badge {
  display: inline-flex;
  align-items: center;
  min-height: 1.55rem;
  padding: 0.1rem 0.55rem;
  border-radius: 999px;
  font-size: 0.72rem;
  font-weight: 700;
  color: #57534e;
  background: #e7e5e4;
}

.learning-reports-badge__dot {
  width: 0.38rem;
  height: 0.38rem;
  margin-right: 0.38rem;
  border-radius: 50%;
  background: currentColor;
  opacity: 0.7;
}

.learning-reports-badge--delivered,
.learning-reports-badge--generated {
  color: #166534;
  background: #dcfce7;
}

.learning-reports-badge--partially_delivered,
.learning-reports-badge--sending,
.learning-reports-badge--generating,
.learning-reports-badge--pending {
  color: #92400e;
  background: #fef3c7;
}

.learning-reports-badge--failed {
  color: #991b1b;
  background: #fee2e2;
}

.learning-reports-badge--skipped,
.learning-reports-badge--cancelled,
.learning-reports-badge--preview {
  color: #57534e;
  background: #f5f5f4;
}

@media (max-width: 900px) {
  .learning-reports-form__grid {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 640px) {
  .learning-reports-tab__header,
  .learning-reports-status {
    flex-direction: column;
    align-items: stretch;
  }

  .learning-reports-form__intro-header {
    align-items: flex-start;
    flex-direction: column;
    gap: 0.4rem;
  }

  .learning-reports-form__mode {
    max-width: none;
  }

  .learning-reports-form__preview-row {
    flex-direction: column;
    align-items: stretch;
  }

  .learning-reports-form__preview-student {
    max-width: none;
  }

  .learning-reports-form--preview .learning-reports-tab__action-btn {
    width: 100%;
  }

  .learning-reports-tab__actions {
    justify-content: stretch;
  }

  .learning-reports-tab__action-btn,
  .learning-reports-form__footer .btn-primary {
    width: 100%;
  }

  .learning-reports-status__pill {
    align-self: flex-start;
  }

  .learning-reports-panel--history {
    padding-bottom: 1.1rem;
  }

  .learning-reports-table-wrap {
    margin: 0;
    overflow: visible;
    border-top: 0;
    border-radius: 0;
  }

  .learning-reports-table,
  .learning-reports-table tbody,
  .learning-reports-table tr,
  .learning-reports-table td {
    display: block;
    width: 100%;
    min-width: 0;
  }

  .learning-reports-table thead {
    display: none;
  }

  .learning-reports-table tbody {
    display: grid;
    gap: 0.75rem;
  }

  .learning-reports-table tr {
    padding: 0.45rem 0.8rem;
    border: 1px solid var(--st-border-tertiary, #e8e4dc);
    border-radius: 0.7rem;
    background: var(--st-bg-primary, #fff);
    box-shadow: 0 1px 2px rgba(28, 25, 23, 0.04);
  }

  .learning-reports-table td,
  .learning-reports-table th:first-child,
  .learning-reports-table td:first-child,
  .learning-reports-table th:last-child,
  .learning-reports-table td:last-child {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 0.5rem 0;
    border: 0;
    text-align: right;
  }

  .learning-reports-table td::before {
    flex: 0 0 auto;
    color: var(--st-text-secondary, #57534e);
    content: attr(data-label);
    font-size: 0.67rem;
    font-weight: 700;
    text-align: left;
  }

  .learning-reports-table td:first-child {
    padding-bottom: 0.7rem;
    border-bottom: 1px solid var(--st-border-tertiary, #e8e4dc);
  }

  .learning-reports-table__period-icon {
    display: none;
  }

  .learning-reports-table__generated {
    align-items: flex-end;
  }

  .learning-reports-table__actions {
    padding-top: 0.65rem !important;
    border-top: 1px solid var(--st-border-tertiary, #e8e4dc) !important;
  }
}

/* Admin learning reports index */
.learning-reports-index {
  gap: 1.25rem;
}

.learning-reports-index > .stg-header {
  margin-bottom: 0;
}

.learning-reports-index__stats {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.75rem;
}

.learning-reports-index__stat {
  display: flex;
  flex-direction: column;
  gap: 0.35rem;
  min-width: 0;
  padding: 0.95rem 1rem;
  border: 1px solid var(--st-border-tertiary, #e8e4dc);
  border-radius: var(--st-radius-md, 8px);
  background: var(--color-surface-raised, #fff);
}

.learning-reports-index__stat-label {
  color: var(--st-text-secondary, #57534e);
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.05em;
  text-transform: uppercase;
}

.learning-reports-index__stat-value {
  color: var(--st-text-primary, #1c1917);
  font-size: 1.35rem;
  font-weight: 700;
  line-height: 1.2;
}

.learning-reports-index__stat--failed .learning-reports-index__stat-value {
  color: #b91c1c;
}

.learning-reports-index__stat--delivered .learning-reports-index__stat-value {
  color: #166534;
}

.learning-reports-index__stat--awaiting .learning-reports-index__stat-value {
  color: #b45309;
}

.learning-reports-index .learning-reports-status {
  margin: 0;
}

.learning-reports-index__toolbar {
  margin: 0 0 1rem;
  padding: 0.85rem;
  border: 1px solid var(--st-border-tertiary, #e8e4dc);
  border-radius: var(--st-radius-md, 8px);
  background: var(--st-bg-secondary, #faf9f7);
  box-sizing: border-box;
}

.learning-reports-index__filters {
  display: grid;
  gap: 0.9rem;
  margin: 0 0 1rem;
  padding: 1rem;
  border: 1px solid var(--st-border-tertiary, #e8e4dc);
  border-radius: var(--st-radius-md, 8px);
  background: var(--st-bg-secondary, #faf9f7);
  box-sizing: border-box;
}

.learning-reports-index__filters-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 0.75rem 1rem;
}

.learning-reports-index__filters .groups-form__field {
  margin: 0;
  min-width: 0;
}

.learning-reports-index__filters .groups-form__input,
.learning-reports-index__filters .groups-form__select {
  width: 100%;
  max-width: 100%;
  box-sizing: border-box;
}

.learning-reports-index__filters-footer {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  padding-top: 0.15rem;
}

.learning-reports-index__check {
  display: inline-flex;
  align-items: center;
  gap: 0.55rem;
  min-height: 2.5rem;
  margin: 0;
  color: var(--st-text-primary, #1c1917);
  font-size: 0.84rem;
  font-weight: 600;
  cursor: pointer;
}

.learning-reports-index__check input {
  width: 1rem;
  height: 1rem;
  flex: 0 0 auto;
}

.learning-reports-index__filters-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.55rem;
}

.learning-reports-index__toolbar .students-index__filters-form {
  width: 100%;
}

.learning-reports-index__toolbar .students-index__select {
  min-width: 0;
  flex: 1 1 10rem;
}

.learning-reports-index__filter-btn {
  min-height: 2.5rem;
}

.learning-reports-index__clear {
  display: inline-flex;
  align-items: center;
  min-height: 2.5rem;
  padding: 0 0.35rem;
  color: var(--st-text-secondary, #57534e);
  font-size: 0.8125rem;
  font-weight: 650;
  text-decoration: none;
}

.learning-reports-index__clear:hover {
  color: var(--st-nav-accent, #2d6a4f);
}

.learning-reports-table__student {
  display: block;
  min-width: 0;
}

.learning-reports-table__student strong,
.learning-reports-table__student-link {
  color: var(--st-text-primary, #1c1917);
  font-size: 0.9rem;
  font-weight: 700;
  text-decoration: none;
}

.learning-reports-table__student-link:hover {
  color: var(--st-nav-accent, #2d6a4f);
  text-decoration: underline;
}

.learning-reports-index__pagination {
  margin-top: 1rem;
  padding-top: 0.85rem;
  border-top: 1px solid var(--st-border-tertiary, #e8e4dc);
}

.learning-reports-index .cp-tab-empty {
  margin: 0.25rem 0 0;
}

@media (min-width: 640px) {
  .learning-reports-index__stats {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .learning-reports-index__filters-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (min-width: 900px) {
  .learning-reports-index__stats {
    grid-template-columns: repeat(5, minmax(0, 1fr));
  }

  .learning-reports-index__filters-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .learning-reports-index__toolbar .students-index__select {
    flex: 0 1 14rem;
  }
}

@media (max-width: 640px) {
  .learning-reports-index__toolbar .students-index__filters-form {
    flex-direction: column;
    align-items: stretch;
  }

  .learning-reports-index__toolbar .students-index__select,
  .learning-reports-index__filter-btn,
  .learning-reports-index__clear {
    width: 100%;
    justify-content: center;
  }

  .learning-reports-index__filters-footer {
    flex-direction: column;
    align-items: stretch;
  }

  .learning-reports-index__filters-actions {
    flex-direction: column;
    align-items: stretch;
  }

  .learning-reports-index__filters-actions .btn-secondary,
  .learning-reports-index__filters-actions .learning-reports-index__clear {
    width: 100%;
    justify-content: center;
  }

  .learning-reports-index .stg-header__actions .btn-secondary {
    width: 100%;
  }
}

/* Admin learning report show */
.learning-reports-show {
  gap: 1.25rem;
  max-width: 56rem;
}

.learning-reports-show > .stg-header {
  margin-bottom: 0;
}

.learning-reports-show__student-link {
  color: inherit;
  font-weight: 650;
  text-decoration: none;
}

.learning-reports-show__student-link:hover {
  color: var(--st-nav-accent, #2d6a4f);
  text-decoration: underline;
}

.learning-reports-show__summary {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.75rem;
}

.learning-reports-show__meta {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 0.45rem;
  min-width: 0;
  padding: 0.95rem 1rem;
  border: 1px solid var(--st-border-tertiary, #e8e4dc);
  border-radius: var(--st-radius-md, 8px);
  background: var(--color-surface-raised, #fff);
}

.learning-reports-show__meta-label {
  color: var(--st-text-secondary, #57534e);
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.05em;
  text-transform: uppercase;
}

.learning-reports-show__meta-value {
  color: var(--st-text-primary, #1c1917);
  font-size: 0.95rem;
  font-weight: 700;
  line-height: 1.35;
  word-break: break-word;
}

.learning-reports-show__meta-time {
  display: block;
  margin-top: 0.15rem;
  color: var(--st-text-secondary, #57534e);
  font-size: 0.8125rem;
  font-weight: 600;
}

.learning-reports-show__alerts {
  display: grid;
  gap: 0.65rem;
}

.learning-reports-show__alert {
  display: grid;
  gap: 0.25rem;
  padding: 0.85rem 1rem;
  border: 1px solid var(--st-border-tertiary, #e8e4dc);
  border-radius: var(--st-radius-md, 8px);
  font-size: 0.875rem;
  line-height: 1.45;
}

.learning-reports-show__alert strong {
  font-size: 0.75rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.learning-reports-show__alert--muted {
  background: #fafaf9;
  color: #57534e;
}

.learning-reports-show__alert--error {
  border-color: #fecaca;
  background: #fef2f2;
  color: #991b1b;
}

.learning-reports-show__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.55rem;
}

.learning-reports-show__actions .btn-primary,
.learning-reports-show__actions .btn-secondary,
.learning-reports-show__actions form {
  margin: 0;
}

.learning-reports-show__actions form {
  display: inline-flex;
}

.learning-reports-show__actions .btn-primary,
.learning-reports-show__actions .btn-secondary {
  min-height: 2.75rem;
}

.learning-reports-table__recipient {
  color: var(--st-text-primary, #1c1917);
  font-size: 0.9rem;
}

.learning-reports-table__email,
.learning-reports-table__reason {
  color: var(--st-text-secondary, #57534e);
  font-size: 0.84rem;
  line-height: 1.4;
  word-break: break-word;
}

.learning-reports-badge--delivery-sent {
  color: #166534;
  background: #dcfce7;
}

.learning-reports-badge--delivery-pending {
  color: #92400e;
  background: #fef3c7;
}

.learning-reports-badge--delivery-failed {
  color: #991b1b;
  background: #fee2e2;
}

.learning-reports-badge--delivery-skipped {
  color: #57534e;
  background: #f5f5f4;
}

@media (min-width: 900px) {
  .learning-reports-show__summary {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
}

@media (max-width: 640px) {
  .learning-reports-show__actions {
    flex-direction: column;
    align-items: stretch;
  }

  .learning-reports-show__actions form,
  .learning-reports-show__actions .btn-primary,
  .learning-reports-show__actions .btn-secondary {
    width: 100%;
  }

  .learning-reports-show__actions .btn-primary,
  .learning-reports-show__actions .btn-secondary {
    justify-content: center;
  }
}

@media (max-width: 720px) {
  .learning-reports-table--deliveries thead {
    display: none;
  }

  .learning-reports-table--deliveries,
  .learning-reports-table--deliveries tbody,
  .learning-reports-table--deliveries tr,
  .learning-reports-table--deliveries td {
    display: block;
    width: 100%;
  }

  .learning-reports-table--deliveries tr {
    padding: 0.85rem 1.1rem;
    border-bottom: 1px solid var(--st-border-tertiary, #e8e4dc);
  }

  .learning-reports-table--deliveries tr:last-child {
    border-bottom: 0;
  }

  .learning-reports-table--deliveries td {
    display: grid;
    grid-template-columns: minmax(6rem, 8rem) minmax(0, 1fr);
    gap: 0.5rem;
    padding: 0.35rem 0 !important;
    border: 0 !important;
  }

  .learning-reports-table--deliveries td::before {
    content: attr(data-label);
    color: var(--st-text-secondary, #57534e);
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
  }

  .learning-reports-table--deliveries td:first-child {
    padding-top: 0 !important;
  }
}
/* Teaching Allocation — bulk matrix + teaching-group cards */

.ta-page__header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: var(--space-4);
  flex-wrap: wrap;
}

.ta-page__title {
  font-size: 1.5rem;
  font-weight: 700;
  color: var(--color-text);
  margin: 0;
}

.ta-page__subtitle {
  margin: 0.25rem 0 0;
  color: var(--color-text-muted);
}

.ta-page__related {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem 0.85rem;
  margin-top: 0.75rem;
}

.ta-page__related-link {
  display: inline-flex;
  align-items: center;
  min-height: 2.5rem;
  font-size: 0.875rem;
  font-weight: 600;
  color: var(--st-nav-accent, var(--st-accent));
  text-decoration: none;
}

.ta-page__related-link:hover {
  text-decoration: underline;
}

.ta-matrix__link {
  color: inherit;
  text-decoration: none;
  font-weight: inherit;
}

.ta-matrix__link:hover {
  color: var(--st-nav-accent, var(--st-accent));
  text-decoration: underline;
}

/* Summary */
.alloc-summary {
  display: inline-flex;
  gap: var(--space-2);
  align-items: center;
  flex-wrap: wrap;
}

.alloc-summary__stat {
  font-size: 0.85rem;
  font-weight: 600;
  padding: var(--space-1) var(--space-3);
  border-radius: 999px;
  background: var(--st-bg-secondary);
  color: var(--color-text);
}

.alloc-summary__stat--unassigned {
  background: var(--color-warning-bg);
  color: var(--color-warning);
}

/* Flash placeholder */
.alloc-flash {
  margin: var(--space-3) 0 0;
}

.alloc-flash--error {
  padding: var(--space-3) var(--space-4);
  border-radius: var(--radius-md);
  background: var(--color-danger-bg);
  color: var(--color-danger);
  font-size: 0.9rem;
}

/* Tabs */
.ta-tabs {
  display: flex;
  gap: var(--space-2);
  border-bottom: 1px solid var(--color-border);
  margin: var(--space-5) 0 var(--space-4);
}

.ta-tab {
  padding: var(--space-3) var(--space-4);
  font-size: 0.9rem;
  font-weight: 600;
  color: var(--color-text-muted);
  text-decoration: none;
  border-bottom: 2px solid transparent;
  margin-bottom: -1px;
}

.ta-tab:hover {
  color: var(--st-nav-accent);
}

.ta-tab--active {
  color: var(--st-nav-accent);
  border-bottom-color: var(--st-nav-accent);
}

/* Filters */
.ta-filters {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-4);
  align-items: flex-end;
  margin-bottom: var(--space-5);
}

.ta-filters__field {
  display: flex;
  flex-direction: column;
  gap: var(--space-1);
  min-width: 0;
}

.ta-filters__label {
  font-size: 0.75rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--color-text-muted);
}

.ta-filters__select {
  padding: var(--space-2) var(--space-3);
  border: 1px solid var(--color-border-strong);
  border-radius: var(--radius-md);
  background: var(--color-surface-raised);
  font-size: 0.9rem;
  min-width: 12rem;
  max-width: 100%;
}

/* Matrix */
.ta-matrix-region {
  position: relative;
}

.ta-matrix-wrap {
  overflow-x: auto;
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
  background: var(--color-surface-raised);
}

.ta-matrix {
  border-collapse: collapse;
  width: 100%;
  min-width: 640px;
}

.ta-matrix th,
.ta-matrix td {
  border-bottom: 1px solid var(--color-border);
  border-right: 1px solid var(--color-border);
  vertical-align: top;
  text-align: left;
}

.ta-matrix__corner,
.ta-matrix__row-head {
  position: sticky;
  left: 0;
  z-index: 2;
  background: var(--st-bg-secondary);
  min-width: 9rem;
  padding: var(--space-3);
  font-weight: 600;
  color: var(--color-text);
}

.ta-matrix__corner {
  z-index: 3;
  display: flex;
  align-items: center;
  gap: var(--space-2);
}

.ta-matrix__col {
  padding: var(--space-3);
  font-size: 0.85rem;
  font-weight: 600;
  color: var(--color-text);
  background: var(--st-bg-secondary);
  white-space: nowrap;
}

/* Cell */
.alloc-cell {
  padding: var(--space-2);
  min-width: 10rem;
  position: relative;
}

.alloc-cell--unassigned {
  background: repeating-linear-gradient(
    45deg,
    transparent,
    transparent 8px,
    rgba(180, 83, 9, 0.04) 8px,
    rgba(180, 83, 9, 0.04) 16px
  );
}

.alloc-cell__inner {
  display: flex;
  flex-direction: column;
  gap: var(--space-2);
}

.alloc-cell__check {
  position: absolute;
  top: var(--space-1);
  right: var(--space-1);
}

.alloc-cell__teachers {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: var(--space-1);
}

.alloc-teacher {
  display: inline-flex;
  align-items: center;
  gap: var(--space-1);
  background: var(--st-badge-active-bg);
  color: var(--st-badge-active-fg);
  padding: 0.15rem 0.5rem;
  border-radius: 999px;
  font-size: 0.8rem;
  font-weight: 500;
  width: fit-content;
  max-width: 100%;
}

.alloc-teacher--focus {
  outline: 2px solid var(--st-nav-accent);
  outline-offset: 1px;
}

.alloc-teacher__name {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: inherit;
  text-decoration: none;
  font-weight: inherit;
}

a.alloc-teacher__name:hover {
  text-decoration: underline;
}

.alloc-teacher__form {
  display: inline;
  margin: 0;
}

.alloc-teacher__remove {
  border: none;
  background: none;
  cursor: pointer;
  color: inherit;
  font-size: 1rem;
  line-height: 1;
  padding: 0 0.1rem;
  opacity: 0.7;
}

.alloc-teacher__remove:hover {
  opacity: 1;
}

.alloc-cell__empty {
  font-size: 0.75rem;
}

/* Add popover */
.alloc-cell__add-wrap {
  position: relative;
}

.alloc-cell__add {
  border: 1px dashed var(--color-border-strong);
  background: none;
  color: var(--color-text-muted);
  border-radius: var(--radius-sm);
  font-size: 0.78rem;
  padding: 0.2rem 0.5rem;
  cursor: pointer;
}

.alloc-cell__add:hover {
  color: var(--st-nav-accent);
  border-color: var(--st-nav-accent);
}

.alloc-popover {
  position: fixed;
  z-index: 60;
  width: 15rem;
  max-width: 80vw;
  background: var(--color-surface-raised);
  border: 1px solid var(--color-border-strong);
  border-radius: var(--radius-md);
  box-shadow: var(--shadow-md);
  padding: var(--space-2);
}

.alloc-popover__search {
  width: 100%;
  box-sizing: border-box;
  padding: var(--space-2);
  border: 1px solid var(--color-border-strong);
  border-radius: var(--radius-sm);
  font-size: 0.85rem;
  margin-bottom: var(--space-2);
}

.alloc-popover__list {
  list-style: none;
  margin: 0;
  padding: 0;
  max-height: 12rem;
  overflow-y: auto;
}

.alloc-popover__option-btn {
  display: block;
  width: 100%;
  text-align: left;
  border: none;
  background: none;
  padding: var(--space-2);
  font-size: 0.85rem;
  cursor: pointer;
  border-radius: var(--radius-sm);
  color: var(--color-text);
}

.alloc-popover__option-btn:hover {
  background: var(--st-bg-secondary);
}

/* Bulk bar */
.ta-bulkbar {
  position: sticky;
  bottom: var(--space-4);
  margin-top: var(--space-4);
  display: flex;
  align-items: center;
  gap: var(--space-3);
  flex-wrap: wrap;
  padding: var(--space-3) var(--space-4);
  background: var(--st-navy);
  color: var(--color-text-inverse);
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-md);
}

.ta-bulkbar[hidden] {
  display: none;
}

.ta-bulkbar__count {
  font-weight: 700;
}

.ta-bulkbar__count::after {
  content: " selected";
  font-weight: 400;
  opacity: 0.8;
}

.ta-bulkbar__form {
  display: flex;
  gap: var(--space-2);
  align-items: center;
  margin: 0;
  flex-wrap: wrap;
}

.ta-bulkbar__select {
  padding: var(--space-2) var(--space-3);
  border-radius: var(--radius-md);
  border: 1px solid transparent;
  font-size: 0.9rem;
}

/* Teaching-group cards */
.ta-tg-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(15rem, 1fr));
  gap: var(--space-4);
}

.alloc-tg-card {
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
  background: var(--color-surface-raised);
  padding: var(--space-4);
  display: flex;
  flex-direction: column;
  gap: var(--space-3);
}

.alloc-tg-card--unassigned {
  border-style: dashed;
  border-color: var(--color-warning);
}

.alloc-tg-card__title {
  margin: 0;
  font-size: 1rem;
  font-weight: 700;
}

.alloc-tg-card__meta {
  margin: 0.15rem 0 0;
  font-size: 0.82rem;
  color: var(--color-text-muted);
}

.alloc-tg-card__body {
  display: flex;
  flex-direction: column;
  gap: var(--space-2);
}

/* Empty states */
.ta-empty {
  border: 1px dashed var(--color-border-strong);
  border-radius: var(--radius-lg);
  padding: var(--space-6);
  text-align: center;
  background: var(--color-surface-raised);
}

.ta-empty__title {
  font-weight: 700;
  margin: 0 0 var(--space-1);
}

.ta-empty__text {
  margin: 0;
  color: var(--color-text-muted);
}

@media (max-width: 640px) {
  .ta-page__header {
    flex-direction: column;
  }

  .ta-filters {
    flex-direction: column;
    align-items: stretch;
  }

  .ta-filters__select {
    min-width: 0;
    width: 100%;
  }

  .ta-bulkbar {
    flex-direction: column;
    align-items: stretch;
  }
}
.calendar-page {
  display: flex;
  flex-direction: column;
  gap: var(--space-4);
  --calendar-time-axis-width: 3.75rem;
  --calendar-hour-height: 5.625rem;
  --calendar-event-radius: 0.4rem;
  --calendar-event-padding: 0.4rem 0.5rem;
  --calendar-event-shadow: 0 1px 2px rgba(28, 25, 23, 0.12);
  --calendar-event-shadow-hover: 0 3px 8px rgba(28, 25, 23, 0.16);
}

.calendar-embed {
  --calendar-time-axis-width: 3.75rem;
  --calendar-hour-height: 5.625rem;
  --calendar-event-radius: 0.4rem;
  --calendar-event-padding: 0.4rem 0.5rem;
  --calendar-event-shadow: 0 1px 2px rgba(28, 25, 23, 0.12);
  --calendar-event-shadow-hover: 0 3px 8px rgba(28, 25, 23, 0.16);
}

.calendar-page__header {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  justify-content: space-between;
  gap: var(--space-4);
}

.calendar-page__title {
  margin: 0 0 var(--space-1);
  font-size: 1.75rem;
  font-weight: 700;
  letter-spacing: -0.02em;
}

.calendar-page__subtitle {
  margin: 0;
  font-size: 0.8125rem;
  line-height: 1.5;
  color: var(--color-text-muted);
}

.calendar-page__tabs-bar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-3);
}

.calendar-page__mode-tabs {
  margin: 0;
}

.calendar-page__schedule-action {
  flex-shrink: 0;
}

.calendar-page__actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: flex-end;
  gap: 0.65rem;
  flex-shrink: 0;
}

.calendar-export-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.35rem;
  box-sizing: border-box;
  min-height: 2.25rem;
  padding: 0.55rem 1rem;
  border: 0.5px solid var(--st-border-secondary);
  border-radius: var(--radius-md);
  background: var(--st-bg-primary);
  color: var(--st-text-primary);
  font: inherit;
  font-size: 0.8125rem;
  font-weight: 500;
  line-height: 1.25;
  text-decoration: none;
  white-space: nowrap;
  cursor: pointer;
}

.calendar-export-btn:hover {
  border-color: var(--st-border-mid);
  background: var(--st-bg-secondary);
}

.calendar-embed__toolbar {
  display: flex;
  justify-content: flex-end;
  margin-bottom: var(--space-3);
}

.calendar-embed__toolbar .calendar-export-btn {
  width: auto;
}

.day-grid__toolbar .calendar-export-btn {
  align-self: center;
  flex-shrink: 0;
}

.calendar-card {
  background: var(--color-surface-raised);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
}

.calendar-page__filters {
  padding: 0.85rem 1rem;
}

.calendar-page__filters .calendar-filters {
  justify-content: flex-start;
}

.calendar-filters {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  gap: 0.65rem 0.85rem;
}

.calendar-filters__field {
  display: flex;
  flex-direction: column;
  flex: 0 1 auto;
  min-width: 8.5rem;
  max-width: 12.5rem;
  gap: 0.3rem;
  font-size: 0.8125rem;
}

.calendar-filters__field > span {
  font-size: 0.75rem;
  font-weight: 600;
  color: var(--color-text-muted);
}

.calendar-filters__field select {
  width: 100%;
  min-height: 2.25rem;
  padding: 0.4rem 0.65rem;
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
  font-family: inherit;
  font-size: 0.8125rem;
  background: var(--color-surface);
  color: var(--color-text);
  box-sizing: border-box;
}

.calendar-page__surface .calendar-form__step select,
.calendar-page__surface .calendar-form__step input,
.calendar-modal__panel select,
.calendar-modal__panel input[type="text"],
.calendar-modal__panel input[type="date"],
.calendar-modal__panel input[type="time"],
.calendar-modal__panel input[type="number"] {
  width: 100%;
  min-height: 2.75rem;
  padding: 0.55rem 0.75rem;
  border: 1px solid var(--color-border);
  border-radius: 7px;
  font-family: inherit;
  font-size: 0.9rem;
  background: var(--color-surface);
  color: var(--color-text);
  box-sizing: border-box;
}

.calendar-page__surface {
  padding: var(--space-4);
  overflow-x: auto;
}

.calendar-page__surface [data-calendar-target="calendar"] {
  min-height: 36rem;
}

.calendar-page__surface .fc,
.calendar-embed .fc {
  --fc-border-color: var(--color-border);
  --fc-page-bg-color: var(--color-surface-raised);
  --fc-neutral-bg-color: var(--color-surface);
  --fc-today-bg-color: rgba(93, 74, 62, 0.06);
  --fc-button-bg-color: var(--color-surface);
  --fc-button-border-color: var(--color-border);
  --fc-button-text-color: var(--color-text);
  --fc-button-hover-bg-color: var(--color-surface);
  --fc-button-hover-border-color: #c8bfb3;
  --fc-button-hover-text-color: var(--color-text);
  --fc-button-active-bg-color: #5d4a3e;
  --fc-button-active-border-color: #5d4a3e;
  --fc-button-active-text-color: #fff;
  --fc-event-bg-color: #5d4a3e;
  --fc-event-border-color: #4a3b32;
  --fc-event-text-color: #fff;
  font-size: 0.875rem;
}

.calendar-page__surface .fc .fc-button,
.calendar-embed .fc .fc-button {
  min-height: 2.25rem;
  padding: 0.35rem 0.75rem;
  font-weight: 600;
  box-shadow: none;
  color: var(--fc-button-text-color);
}

.calendar-page__surface .fc .fc-button:hover,
.calendar-embed .fc .fc-button:hover {
  color: var(--fc-button-hover-text-color);
}

.calendar-page__surface .fc .fc-button-primary:not(:disabled).fc-button-active,
.calendar-page__surface .fc .fc-button-primary:not(:disabled):active,
.calendar-embed .fc .fc-button-primary:not(:disabled).fc-button-active,
.calendar-embed .fc .fc-button-primary:not(:disabled):active {
  background-color: var(--fc-button-active-bg-color);
  border-color: var(--fc-button-active-border-color);
  color: var(--fc-button-active-text-color);
}

.calendar-page__surface .fc .fc-header-toolbar,
.calendar-embed .fc .fc-header-toolbar {
  flex-wrap: wrap;
  gap: var(--space-2);
  margin-bottom: var(--space-3);
}

.calendar-page__surface .fc .fc-toolbar-chunk,
.calendar-embed .fc .fc-toolbar-chunk {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--space-2);
}

.calendar-page__surface .fc .fc-toolbar-title,
.calendar-embed .fc .fc-toolbar-title {
  font-size: 1.125rem;
  font-weight: 700;
  color: var(--color-text);
}

.calendar-page__surface .fc .fc-timegrid-slot,
.calendar-embed .fc .fc-timegrid-slot {
  height: var(--calendar-hour-height) !important;
  border-color: rgba(93, 74, 62, 0.1);
}

.calendar-page__surface .fc .fc-timegrid-slot-label-cushion,
.calendar-embed .fc .fc-timegrid-slot-label-cushion {
  font-size: 0.75rem;
  font-weight: 600;
  color: var(--color-text-muted);
  padding-right: 0.5rem;
}

.calendar-page__surface .fc .fc-timegrid-slot-label,
.calendar-embed .fc .fc-timegrid-slot-label {
  vertical-align: top;
}

.calendar-page__surface .fc .fc-timegrid-axis,
.calendar-embed .fc .fc-timegrid-axis {
  width: var(--calendar-time-axis-width, 3.75rem);
}

.calendar-page__surface .fc .fc-timegrid-event-harness,
.calendar-embed .fc .fc-timegrid-event-harness {
  margin-inline: 0.25rem;
}

.calendar-page__surface .fc .fc-timegrid-event,
.calendar-embed .fc .fc-timegrid-event {
  border-radius: var(--calendar-event-radius);
  border-width: 1px;
  border-style: solid;
  box-shadow: var(--calendar-event-shadow);
  overflow: hidden;
  transition: transform 0.12s ease, box-shadow 0.12s ease, filter 0.12s ease;
}

.calendar-page__surface .fc .fc-timegrid-event .fc-event-main,
.calendar-embed .fc .fc-timegrid-event .fc-event-main {
  padding: var(--calendar-event-padding);
  position: relative;
}

.calendar-page__surface .fc .fc-timegrid-event:hover,
.calendar-embed .fc .fc-timegrid-event:hover {
  transform: translateY(-1px);
  box-shadow: var(--calendar-event-shadow-hover);
  filter: brightness(0.97);
}

.calendar-page__surface .fc .fc-timegrid-event:focus-visible,
.calendar-embed .fc .fc-timegrid-event:focus-visible {
  outline: 2px solid #5d4a3e;
  outline-offset: 1px;
}

.calendar-lesson__line {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 0.75rem;
  line-height: 1.35;
  font-weight: 600;
  color: inherit;
}

.calendar-lesson__line--time {
  font-weight: 700;
  letter-spacing: 0.01em;
}

.calendar-lesson__line + .calendar-lesson__line {
  font-weight: 500;
  opacity: 0.94;
}

.calendar-lesson__conflict {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 1.25rem;
  min-height: 1.25rem;
  margin-top: 0.15rem;
  padding: 0 0.3rem;
  border-radius: 999px;
  font-size: 0.68rem;
  font-weight: 700;
  line-height: 1;
  background: color-mix(in srgb, #b45309 18%, transparent);
  color: inherit;
}

.calendar-lesson__conflict--high,
.calendar-lesson__conflict--critical {
  background: color-mix(in srgb, #b91c1c 22%, transparent);
}

.calendar-page__surface .fc .calendar-lesson--conflict,
.calendar-embed .fc .calendar-lesson--conflict {
  box-shadow: inset 0 0 0 1px color-mix(in srgb, #b45309 55%, transparent);
}

.calendar-event-popover__conflicts {
  padding: 0.75rem 0.85rem 0.25rem;
  max-width: min(22rem, calc(100vw - 2rem));
}

.calendar-event-popover__conflicts-title {
  margin: 0 0 0.4rem;
  font-size: 0.8rem;
  font-weight: 700;
}

.calendar-event-popover__conflicts-list {
  margin: 0;
  padding: 0;
  list-style: none;
  display: grid;
  gap: 0.55rem;
}

.calendar-event-popover__conflict {
  font-size: 0.75rem;
  line-height: 1.35;
}

.calendar-event-popover__conflict div {
  opacity: 0.9;
}

@media (max-width: 640px) {
  .calendar-event-popover__conflicts {
    max-width: calc(100vw - 1rem);
  }
}

.calendar-page__surface .fc .calendar-lesson--cancelled,
.calendar-embed .fc .calendar-lesson--cancelled {
  opacity: 0.78;
  box-shadow: none;
  filter: grayscale(0.25);
}

.calendar-page__surface .fc .calendar-lesson--cancelled .fc-event-main,
.calendar-embed .fc .calendar-lesson--cancelled .fc-event-main {
  text-decoration: line-through;
}

.calendar-page__surface .fc .calendar-lesson--cancelled:hover,
.calendar-embed .fc .calendar-lesson--cancelled:hover {
  transform: none;
  box-shadow: none;
  filter: grayscale(0.25);
}

.calendar-page__surface .fc .fc-daygrid-event .fc-event-resizer,
.calendar-embed .fc .fc-daygrid-event .fc-event-resizer {
  display: block !important;
  opacity: 1;
  z-index: 4;
  width: 10px;
  top: 0;
  bottom: 0;
}

.calendar-page__surface .fc .fc-daygrid-event .fc-event-resizer-start,
.calendar-embed .fc .fc-daygrid-event .fc-event-resizer-start {
  left: 0;
  cursor: ew-resize;
}

.calendar-page__surface .fc .fc-daygrid-event .fc-event-resizer-end,
.calendar-embed .fc .fc-daygrid-event .fc-event-resizer-end {
  right: 0;
  cursor: ew-resize;
}

.calendar-page__surface .fc .fc-daygrid-day-events,
.calendar-embed .fc .fc-daygrid-day-events {
  min-height: 1.75rem;
}

.calendar-page__surface .fc .fc-daygrid-event,
.calendar-embed .fc .fc-daygrid-event {
  border-radius: var(--calendar-event-radius);
  box-shadow: var(--calendar-event-shadow);
}

.calendar-page__surface .fc .fc-daygrid-event .fc-event-main,
.calendar-embed .fc .fc-daygrid-event .fc-event-main {
  padding: 0.35rem 0.5rem;
  position: relative;
}

.calendar-modal {
  position: fixed;
  inset: 0;
  z-index: 1100;
  display: flex;
  align-items: flex-start;
  justify-content: center;
  padding: calc(var(--topbar-height) + var(--space-4)) var(--space-4) var(--space-4);
  overflow-y: auto;
}

.calendar-modal[hidden] {
  display: none !important;
}

.calendar-modal__backdrop {
  position: absolute;
  inset: 0;
  background: rgba(15, 23, 42, 0.45);
}

.calendar-modal__panel {
  position: relative;
  z-index: 1;
  width: min(36rem, 100%);
  max-height: calc(100vh - var(--topbar-height) - 3rem);
  overflow: auto;
  padding: var(--space-4);
}

.calendar-modal__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-3);
  margin-bottom: var(--space-4);
}

.calendar-modal__header h2 {
  margin: 0;
  font-size: 1.125rem;
  font-weight: 700;
}

.calendar-modal__close {
  border: 0;
  background: transparent;
  font-size: 1.5rem;
  line-height: 1;
  cursor: pointer;
  color: var(--color-text-muted);
  min-width: 2.75rem;
  min-height: 2.75rem;
}

.calendar-form__step,
.calendar-form__row {
  margin-bottom: var(--space-4);
}

.calendar-form__checkbox {
  display: inline-flex;
  align-items: center;
  gap: 0.65rem;
  min-height: 2.75rem;
  margin-bottom: 0;
  font-weight: 600;
  cursor: pointer;
}

.calendar-form__checkbox input[type="checkbox"] {
  width: 1.125rem;
  height: 1.125rem;
  margin: 0;
  flex-shrink: 0;
}

.calendar-form__hint {
  margin: 0.35rem 0 0;
  font-size: 0.8125rem;
  color: var(--color-text-muted);
}

.calendar-modal__panel label {
  display: block;
  font-weight: 600;
  font-size: 0.85rem;
  margin-bottom: 0.3rem;
  color: var(--color-text);
}

.calendar-form__row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--space-3);
}

.calendar-form__row > label {
  margin-bottom: 0;
}

.calendar-form__inline-action {
  margin-top: var(--space-2);
  padding: 0;
  border: 0;
  background: transparent;
  font-size: 0.875rem;
}

.calendar-form__weekdays {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-2);
  border: 0;
  padding: 0;
  margin: 0 0 var(--space-3);
}

.calendar-form__weekdays label {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  font-weight: 500;
  margin: 0;
}

.calendar-form__weekdays input {
  width: auto;
  min-height: auto;
}

.calendar-form__summary {
  font-weight: 600;
  margin: var(--space-4) 0;
  color: var(--color-text-muted);
}

.calendar-modal__error {
  color: var(--color-danger, #b42318);
  margin-bottom: var(--space-3);
}

.calendar-page__warnings {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 0.75rem;
  margin: 0 0 1rem;
  padding: 0.85rem 1rem;
  border: 1px solid #f0c36d;
  border-radius: var(--radius-md, 0.625rem);
  background: #fff8e8;
  color: #7a4e00;
}

.calendar-page__warnings[hidden] {
  display: none;
}

.calendar-page__warnings-body {
  min-width: 0;
  flex: 1 1 auto;
}

.calendar-page__warnings-body strong {
  display: block;
  margin-bottom: 0.35rem;
  font-size: 0.92rem;
}

.calendar-page__warnings-body ul {
  margin: 0;
  padding-left: 1.1rem;
}

.calendar-page__warnings-body li {
  margin: 0.15rem 0;
  font-size: 0.9rem;
  line-height: 1.35;
}

.calendar-page__warnings-dismiss {
  flex-shrink: 0;
  border: 0;
  background: transparent;
  color: inherit;
  font-size: 1.35rem;
  line-height: 1;
  cursor: pointer;
  min-width: 2.5rem;
  min-height: 2.5rem;
}

@media (max-width: 640px) {
  .calendar-page__warnings {
    padding: 0.75rem 0.85rem;
  }
}

.calendar-modal__actions {
  display: flex;
  justify-content: flex-end;
  flex-wrap: wrap;
  gap: var(--space-3);
}

.calendar-modal__actions--split {
  justify-content: space-between;
  align-items: center;
}

.calendar-modal__actions-primary {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-3);
  margin-left: auto;
}

.calendar-edit__summary {
  margin: 0 0 var(--space-4);
  font-weight: 600;
  color: var(--color-text-muted);
}

.calendar-edit__cancel-lesson {
  border: 0;
  background: transparent;
  color: var(--color-danger, #b42318);
  font-weight: 600;
  cursor: pointer;
  padding: 0.5rem 0;
  min-height: 2.75rem;
}

.calendar-form__scope {
  border: 0;
  padding: 0;
  margin: 0 0 var(--space-4);
}

.calendar-form__scope legend {
  font-weight: 600;
  font-size: 0.85rem;
  margin-bottom: var(--space-2);
}

.calendar-form__scope-option {
  display: flex;
  align-items: center;
  gap: var(--space-2);
  font-weight: 500;
  margin-bottom: var(--space-2);
}

.calendar-form__scope-option input {
  width: auto;
  min-height: auto;
}

.calendar-event-popover {
  position: fixed;
  inset: 0;
  z-index: 1100;
  pointer-events: none;
}

.calendar-event-popover[hidden] {
  display: none !important;
}

.calendar-event-popover__backdrop {
  position: absolute;
  inset: 0;
  pointer-events: auto;
  background: transparent;
}

.calendar-event-popover__panel {
  position: fixed;
  z-index: 1;
  pointer-events: auto;
  width: min(18rem, calc(100vw - 2rem));
  padding: var(--space-4);
  border-radius: var(--radius-md, 0.5rem);
  background: var(--color-surface, #fff);
  border: 1px solid var(--color-border, #e2e8f0);
  box-shadow: 0 12px 32px rgba(15, 23, 42, 0.18);
}

.calendar-event-popover__actions {
  display: flex;
  flex-direction: column;
  gap: 0.15rem;
}

.calendar-event-popover__action {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 2.25rem;
  height: 2.25rem;
  padding: 0;
  border: 0;
  border-radius: calc(var(--radius-md) - 2px);
  background: transparent;
  color: var(--color-text);
  cursor: pointer;
}

.calendar-event-popover__action:hover {
  background: var(--color-surface-raised);
}

.calendar-event-popover__action--danger {
  color: var(--color-danger, #b42318);
}

.calendar-event-popover__action--danger:hover {
  background: var(--color-danger-bg, #fef2f2);
}

.calendar-event-popover__action svg {
  width: 1rem;
  height: 1rem;
}

.calendar-event-popover--toolbar .calendar-event-popover__panel {
  width: auto;
  padding: 0.2rem;
  border-radius: var(--radius-md);
}

.calendar-delete-modal__confirm {
  background: var(--color-danger, #b42318);
  border-color: var(--color-danger, #b42318);
}

.calendar-delete-modal__confirm:hover {
  background: #991b1b;
  border-color: #991b1b;
}

.calendar-delete-modal__panel h2 {
  margin: 0 0 var(--space-4);
  font-size: 1.125rem;
}

.calendar-embed .calendar-page__surface {
  margin-top: 0;
}

@media (max-width: 900px) {
  .calendar-filters__field {
    max-width: none;
    flex: 1 1 calc(33.333% - 0.6rem);
  }
}

@media (max-width: 640px) {
  .calendar-page__tabs-bar {
    align-items: stretch;
    flex-direction: column;
  }

  .calendar-page__mode-tabs,
  .calendar-page__schedule-action,
  .calendar-page__actions {
    width: 100%;
  }

  .calendar-page__actions {
    justify-content: stretch;
  }

  .calendar-page__actions .calendar-export-btn,
  .calendar-page__actions .calendar-page__schedule-action,
  .calendar-page__actions .calendar-page__daily-log-action {
    flex: 1 1 auto;
    width: 100%;
  }

  .calendar-embed__toolbar {
    justify-content: stretch;
  }

  .calendar-embed__toolbar .calendar-export-btn {
    width: 100%;
  }

  .day-grid__toolbar .calendar-export-btn {
    width: 100%;
  }

  .calendar-form__row {
    grid-template-columns: 1fr;
  }

  .calendar-filters__field {
    flex: 1 1 calc(50% - 0.5rem);
    max-width: none;
    min-width: 0;
  }

  .calendar-page__filters .calendar-filters {
    justify-content: stretch;
  }

  .calendar-page__surface [data-calendar-target="calendar"] {
    min-height: 28rem;
  }

  .calendar-modal {
    padding: 0;
    align-items: flex-end;
    overflow-y: visible;
  }

  .calendar-modal__panel {
    width: 100%;
    max-height: min(85vh, calc(100vh - var(--topbar-height) - var(--space-4)));
    border-bottom-left-radius: 0;
    border-bottom-right-radius: 0;
  }

  .calendar-modal__actions {
    flex-direction: column;
    align-items: stretch;
  }

  .calendar-modal__actions-primary {
    margin-left: 0;
    flex-direction: column;
  }

  .calendar-event-popover__panel {
    left: 50% !important;
    top: auto !important;
    bottom: var(--space-4);
    transform: translateX(-50%);
    width: calc(100vw - 2rem);
  }
}

.day-grid {
  --calendar-time-axis-width: 3.75rem;
  --calendar-hour-height: 5.625rem;
  --calendar-event-radius: 0.4rem;
  --calendar-event-padding: 0.4rem 0.5rem;
  --calendar-event-shadow: 0 1px 2px rgba(28, 25, 23, 0.12);
  --calendar-event-shadow-hover: 0 3px 8px rgba(28, 25, 23, 0.16);
  --day-grid-today-bg: rgba(93, 74, 62, 0.06);
  --day-grid-accent: var(--st-accent, #5c5346);
  --day-grid-hour-height: var(--calendar-hour-height, 5.625rem);
  --day-grid-resource-width: 18.5rem;
  --day-grid-content-width: calc(var(--calendar-time-axis-width) + var(--day-grid-resource-count, 1) * var(--day-grid-resource-width));
}

.day-grid__toolbar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem 1.25rem;
  padding: 0.85rem 1rem;
  border-bottom: 1px solid var(--color-border);
  background: var(--color-surface-raised);
}

.day-grid__toolbar-primary {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.75rem;
  min-width: 0;
}

.day-grid__date-nav-buttons {
  display: inline-flex;
  align-items: center;
  gap: 0.15rem;
  padding: 0.15rem;
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
  background: var(--color-surface);
  flex-shrink: 0;
}

.day-grid__nav-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 2.25rem;
  min-height: 2.25rem;
  padding: 0 0.5rem;
  border: none;
  border-radius: calc(var(--radius-md) - 2px);
  background: transparent;
  color: var(--color-text);
  font-size: 0.95rem;
  font-weight: 700;
  cursor: pointer;
  transition: background 0.12s ease, color 0.12s ease;
}

.day-grid__nav-btn:hover {
  background: rgba(93, 74, 62, 0.08);
}

.day-grid__nav-btn:focus-visible {
  outline: 2px solid #5d4a3e;
  outline-offset: 1px;
}

.day-grid__nav-btn--today {
  min-width: auto;
  padding: 0 0.7rem;
  font-size: 0.8125rem;
  font-weight: 600;
}

.day-grid__nav-btn--today.is-active {
  background: #5d4a3e;
  color: #fff;
}

.day-grid__nav-btn--today.is-active:hover {
  background: #4a3b32;
  color: #fff;
}

.day-grid__date-display {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.65rem;
  min-width: 0;
}

.day-grid__date-label {
  margin: 0;
  font-size: 0.875rem;
  font-weight: 600;
  color: var(--color-text);
  line-height: 1.3;
  white-space: nowrap;
}

.day-grid__date-input {
  width: 9.5rem;
  min-height: 2.25rem;
  padding: 0.4rem 0.65rem;
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
  font-family: inherit;
  font-size: 0.8125rem;
  background: var(--color-surface);
  color: var(--color-text);
  box-sizing: border-box;
}

.day-grid__filters {
  flex: 1 1 16rem;
  min-width: 0;
  justify-content: flex-end;
}

.day-grid__surface {
  padding: 1rem;
  background: var(--color-surface-raised);
}

.day-grid__scroll {
  display: flex;
  flex-direction: column;
  overflow: hidden;
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
  background: var(--color-surface);
  max-width: 100%;
  max-height: min(70vh, calc(100vh - var(--topbar-height) - 14rem));
}

.day-grid__header {
  display: grid;
  grid-template-columns: var(--day-grid-template, var(--calendar-time-axis-width) var(--day-grid-resource-width));
  flex-shrink: 0;
  z-index: 3;
  background: var(--st-bg-secondary, #f3f0ea);
  border-bottom: 1px solid var(--color-border);
  width: max-content;
  min-width: 100%;
  overflow-x: hidden;
  overflow-y: hidden;
}

.day-grid__allday {
  display: grid;
  grid-template-columns: var(--day-grid-template, var(--calendar-time-axis-width) var(--day-grid-resource-width));
  flex-shrink: 0;
  background: var(--color-surface);
  border-bottom: 1px solid var(--color-border);
  width: max-content;
  min-width: 100%;
  overflow-x: hidden;
  overflow-y: hidden;
}

.day-grid__allday-column {
  display: flex;
  flex-wrap: wrap;
  gap: 0.35rem;
  align-items: stretch;
  padding: 0.45rem 0.35rem;
  border-right: 1px solid var(--color-border);
  min-width: 0;
  min-height: 2.75rem;
  box-sizing: border-box;
}

.day-grid__allday-event {
  display: block;
  position: relative;
  flex: 1 1 8rem;
  min-width: 0;
  margin: 0;
  padding: 0.35rem 0.5rem;
  appearance: none;
  -webkit-appearance: none;
  border: 1px solid;
  border-radius: var(--calendar-event-radius, 0.4rem);
  overflow: hidden;
  text-align: left;
  cursor: pointer;
  font-size: 0.75rem;
  line-height: 1.35;
  box-shadow: var(--calendar-event-shadow, 0 1px 2px rgba(28, 25, 23, 0.12));
}

.day-grid__body-scroll {
  flex: 1;
  min-height: 0;
  overflow: auto;
  overscroll-behavior: contain;
  scroll-behavior: auto;
}

.day-grid__corner {
  position: sticky;
  left: 0;
  z-index: 4;
  padding: 0.65rem 0.5rem;
  border-right: 1px solid var(--color-border);
  background: var(--st-bg-secondary, #f3f0ea);
}

.day-grid__resource-head {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.45rem;
  padding: 0.65rem 0.75rem;
  font-weight: 600;
  font-size: 0.8125rem;
  line-height: 1.35;
  color: var(--color-text);
  border-right: 1px solid var(--color-border);
  min-width: 0;
  min-height: 2.75rem;
  overflow: hidden;
  box-sizing: border-box;
}

.day-grid__resource-label {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  min-width: 0;
}

.day-grid__resource-head--accented {
  background: linear-gradient(
    180deg,
    color-mix(in srgb, var(--day-grid-accent) 10%, var(--st-bg-secondary, #f3f0ea)) 0%,
    var(--st-bg-secondary, #f3f0ea) 100%
  );
}

.day-grid__resource-accent {
  width: 0.6rem;
  height: 0.6rem;
  border-radius: 999px;
  background: var(--day-grid-accent);
  color: var(--day-grid-accent-text);
  flex-shrink: 0;
  box-shadow: 0 0 0 1px rgba(28, 25, 23, 0.1);
}

.day-grid__body {
  display: grid;
  grid-template-columns: var(--day-grid-template, var(--calendar-time-axis-width) var(--day-grid-resource-width));
  position: relative;
  min-height: 32rem;
  width: max-content;
  min-width: 100%;
}

.day-grid__time-column {
  position: sticky;
  left: 0;
  z-index: 2;
  grid-column: 1;
  grid-row: 1;
  background: var(--color-surface);
  border-right: 1px solid var(--color-border);
}

.day-grid__time-label {
  position: absolute;
  left: 0;
  right: 0;
  padding: 0.2rem 0.5rem 0 0;
  font-size: 0.75rem;
  font-weight: 600;
  color: var(--color-text-muted);
  transform: none;
  text-align: right;
  line-height: 1;
}

.day-grid__column {
  position: relative;
  grid-row: 1;
  border-right: 1px solid var(--color-border);
  min-width: 0;
  min-height: 100%;
  background:
    repeating-linear-gradient(
      to bottom,
      transparent,
      transparent calc(var(--day-grid-hour-height, 60px) - 1px),
      rgba(93, 74, 62, 0.1) calc(var(--day-grid-hour-height, 60px) - 1px),
      rgba(93, 74, 62, 0.1) var(--day-grid-hour-height, 60px)
    );
}

.day-grid__hour-line {
  position: absolute;
  left: 0;
  right: 0;
  height: 1px;
  background: rgba(93, 74, 62, 0.1);
  pointer-events: none;
}

.day-grid__events-layer {
  position: absolute;
  inset: 0 0.25rem;
  z-index: 1;
}

.day-grid__event {
  position: absolute;
  box-sizing: border-box;
  margin: 0;
  padding: var(--calendar-event-padding, 0.4rem 0.5rem);
  appearance: none;
  -webkit-appearance: none;
  border-width: 1px;
  border-style: solid;
  border-radius: var(--calendar-event-radius, 0.4rem);
  overflow: hidden;
  text-align: left;
  cursor: pointer;
  font-size: 0.75rem;
  line-height: 1.35;
  touch-action: none;
  user-select: none;
  background-color: var(--day-grid-event-bg);
  border-color: var(--day-grid-event-border);
  color: var(--day-grid-event-text);
  box-shadow: var(--calendar-event-shadow, 0 1px 2px rgba(28, 25, 23, 0.12));
  transition: transform 0.12s ease, box-shadow 0.12s ease, filter 0.12s ease;
}

.day-grid--editable .day-grid__event:not(.day-grid__event--cancelled) {
  cursor: grab;
}

.day-grid--editable .day-grid__event:not(.day-grid__event--cancelled):has(.day-grid__event-resize-handle) {
  padding-bottom: 0.85rem;
}

.day-grid__event--dragging,
.day-grid__event--resizing {
  cursor: grabbing;
  z-index: 5;
  opacity: 0.96;
  box-shadow: var(--calendar-event-shadow-hover, 0 3px 8px rgba(28, 25, 23, 0.16));
}

.day-grid__event--resizing {
  cursor: ns-resize;
}

.day-grid__event-resize-handle {
  position: absolute;
  right: 0.35rem;
  bottom: 0.2rem;
  left: 0.35rem;
  height: 0.35rem;
  border-radius: 999px;
  cursor: ns-resize;
  touch-action: none;
}

.day-grid__event-resize-handle::after {
  content: "";
  position: absolute;
  left: 50%;
  top: 50%;
  width: 1.6rem;
  height: 0.12rem;
  border-radius: 999px;
  background: currentColor;
  opacity: 0.55;
  transform: translate(-50%, -50%);
}

.day-grid__column--drop-target {
  background-color: color-mix(in srgb, var(--st-accent, #5c5346) 8%, var(--color-surface));
}

.day-grid__event:hover {
  transform: translateY(-1px);
  box-shadow: var(--calendar-event-shadow-hover, 0 3px 8px rgba(28, 25, 23, 0.16));
  filter: brightness(0.97);
}

.day-grid__event:focus-visible {
  outline: 2px solid #5d4a3e;
  outline-offset: 1px;
}

.day-grid__event-line {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-weight: 600;
  color: inherit;
}

.day-grid__event-line--time {
  font-weight: 700;
  letter-spacing: 0.01em;
}

.day-grid__event-line + .day-grid__event-line {
  font-weight: 500;
  opacity: 0.94;
}

.day-grid__event--cancelled {
  opacity: 0.78;
  text-decoration: line-through;
  box-shadow: none;
  filter: grayscale(0.25);
}

.day-grid__event--cancelled:hover {
  transform: none;
  box-shadow: none;
  filter: grayscale(0.25);
}

.day-grid__event--cancelled,
.day-grid__event--cancelled:hover {
  background-color: var(--day-grid-event-bg) !important;
  border-color: var(--day-grid-event-border) !important;
  color: var(--day-grid-event-text) !important;
}

.day-grid__empty {
  grid-column: 1 / -1;
  padding: var(--space-6);
  text-align: center;
  color: var(--color-text-muted);
  font-size: 0.95rem;
}

.colour-palette-field__options {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(8.5rem, 1fr));
  gap: var(--space-2);
}

.colour-palette-field__options--inline {
  margin-top: var(--space-2);
}

.colour-palette-field__option {
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  min-height: 2.75rem;
  padding: 0.5rem 2rem 0.5rem 0.65rem;
  border: 1px solid var(--color-border, #e2e8f0);
  border-radius: var(--radius-md, 0.5rem);
  background: var(--color-surface, #fff);
  cursor: pointer;
  font-size: 0.875rem;
  transition: border-color 0.15s ease, box-shadow 0.15s ease, background-color 0.15s ease;
}

.colour-palette-field__option:hover {
  border-color: #9ab3a3;
  background: #f8fbf9;
}

.colour-palette-field__option:focus-within {
  outline: 2px solid rgba(45, 106, 79, 0.28);
  outline-offset: 2px;
}

.colour-palette-field__option:has(input:checked) {
  border-color: var(--st-nav-accent, #2d6a4f);
  background: #edf5f0;
  box-shadow: 0 0 0 1px var(--st-nav-accent, #2d6a4f);
  color: #214f3b;
  font-weight: 700;
}

.colour-palette-field__option:has(input:checked)::after {
  position: absolute;
  top: 50%;
  right: 0.65rem;
  content: "\2713";
  color: var(--st-nav-accent, #2d6a4f);
  font-size: 0.9rem;
  transform: translateY(-50%);
}

.colour-palette-field__option input {
  position: absolute;
  opacity: 0;
  pointer-events: none;
}

.colour-palette-field__swatch {
  width: 1.5rem;
  height: 1.5rem;
  flex: 0 0 auto;
  border-radius: 999px;
  border: 1px solid rgba(0, 0, 0, 0.12);
}

.colour-palette-field__swatch--auto {
  background: linear-gradient(135deg, #e5e7eb 50%, #9ca3af 50%);
}

.portal-settings__field--muted {
  opacity: 0.65;
}

.portal-settings__section-title {
  margin: 0 0 var(--space-3);
  font-size: 1rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.04em;
}

@media (max-width: 640px) {
  .day-grid {
    --day-grid-resource-width: 14rem;
  }

  .day-grid__scroll {
    max-height: min(62vh, calc(100vh - var(--topbar-height) - 18rem));
  }

  .day-grid__toolbar {
    flex-direction: column;
    align-items: stretch;
  }

  .day-grid__toolbar-primary {
    justify-content: space-between;
  }

  .day-grid__filters {
    justify-content: stretch;
  }
}
/* Lesson records and daily log */

.daily-log__header {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  justify-content: space-between;
  gap: 1rem;
}

.lesson-record-form__student-grid-wrap { overflow-x: auto; margin-top: 1rem; }
.lesson-record-form__student-grid { min-width: 900px; }
.lesson-record-form__student-grid .bl-table__th,
.lesson-record-form__student-grid .bl-table__td { text-align: left; }
.lesson-record-form__student-grid .bl-table__th { white-space: nowrap; }
.lesson-record-form__student-grid .groups-form__select { min-width: 8rem; width: 100%; }
.lesson-record-grid__col-attendance { width: 8.5rem; }
.lesson-record-grid__col-progress { width: 9.5rem; min-width: 9.5rem; }
.lesson-record-grid__col-grade { width: 6.5rem; min-width: 6.5rem; }
.lesson-record-grid__col-note { min-width: 10rem; }
.lesson-record-form__student-entry-heading { display: flex; gap: 1rem; justify-content: space-between; align-items: start; }

.daily-log__card {
  overflow: hidden;
}

.daily-log__body {
  padding-top: 0.25rem;
}

.daily-log-records__toolbar {
  margin-bottom: 1rem;
}

.lesson-records-pdf-export__controls {
  display: flex;
  justify-content: flex-end;
  margin-bottom: 0.75rem;
}

.lesson-record-page__header-actions .lesson-records-pdf-export__controls {
  margin-bottom: 0;
}

.daily-log-records__filters-card {
  width: 100%;
  flex: 1 0 100%;
  gap: 0.75rem 1rem;
}

.daily-log-records__filters.students-index__filters-form {
  min-width: 0;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(10.5rem, 1fr));
  gap: 0.75rem 1rem;
  align-items: end;
  margin: 0;
}

.staff-profile-lesson-records {
  margin-top: 0.25rem;
}

.staff-profile-lesson-records .daily-log-records__toolbar {
  margin-bottom: 1rem;
}

.student-profile-lesson-records {
  margin-top: 0.25rem;
}

.student-profile-lesson-records .daily-log-records__toolbar {
  margin-bottom: 1rem;
}

.student-profile-lesson-records .daily-log-records__filters-card {
  padding: 0.9rem 1rem;
  border: 1px solid var(--st-border-tertiary, #e8e4dc);
  border-radius: var(--st-radius-md, 8px);
  background: var(--st-bg-secondary, #f8f6f2);
}

.student-profile-lesson-records .lesson-records-index__stat {
  position: relative;
  overflow: hidden;
}

.student-profile-lesson-records .lesson-records-index__stat::before {
  content: "";
  position: absolute;
  inset: 0 auto 0 0;
  width: 0.25rem;
  background: currentColor;
}

.student-profile-lesson-records .lesson-records-index__stat--hours {
  border-color: #dbeafe;
  background: #f8fbff;
  color: #64748b;
}

.student-profile-lesson-records .lesson-records-index__stat--records {
  border-color: #dcfce7;
  background: #f7fdf9;
  color: #78716c;
}

.student-profile-lesson-records .lesson-records-index__stat-label {
  color: var(--st-text-tertiary, #a8a29e);
  opacity: 1;
}

.student-profile-lesson-records .lesson-records-index__stat-value {
  color: var(--st-text-primary, #1c1917);
  font-size: 1.15rem;
}

.student-profile-lesson-records .daily-log-records__table-wrap {
  border-color: var(--st-border-secondary, #ddd8cf);
  box-shadow: 0 1px 3px rgb(28 25 23 / 0.04);
}

.student-profile-lesson-records .lesson-records-index__date,
.student-profile-lesson-records .lesson-records-index__duration {
  display: inline-flex;
  align-items: center;
  font-size: 0.75rem;
  font-weight: 700;
}

.student-profile-lesson-records .lesson-records-index__date {
  color: #475569;
}

.student-profile-lesson-records .lesson-records-index__duration {
  color: inherit;
}


.daily-log-records__date-input {
  min-height: 2.5rem;
}

.daily-log-records__filters-actions {
  display: flex;
  align-self: end;
  margin-bottom: 1.35rem;
}

.daily-log-records__apply {
  width: auto;
  min-width: 8.5rem;
  min-height: 2.5rem;
  white-space: nowrap;
}

.daily-log-records__summary {
  margin-bottom: 1rem;
}

.daily-log-records__table-wrap {
  margin: 0 -0.15rem;
}

.daily-log-records__entity-link {
  display: inline-block;
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  vertical-align: top;
}

.daily-log-records__title-cell {
  max-width: 16rem;
  min-width: 9rem;
}

.daily-log-records__title-text {
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  overflow: hidden;
  word-break: break-word;
  line-height: 1.35;
}

.daily-log-records__actions {
  justify-content: flex-end;
}

.daily-log-records__footer {
  margin-top: 1.25rem;
}

.daily-log-records__empty {
  padding: 2rem 1rem;
  text-align: center;
}

.daily-log-records__empty-text {
  margin: 0;
  color: var(--st-text-secondary, #57534e);
}

.lesson-record-page__header {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  justify-content: space-between;
  gap: 1rem;
}

.lesson-record-page__header-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem;
  align-items: center;
}

.lesson-record-show__lead {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.35rem;
}

.lesson-record-show__lead-separator {
  color: var(--st-text-tertiary, #a8a29e);
}

.lesson-record-show__tags {
  margin-top: 0.65rem;
}

.lesson-record-show__main {
  overflow: hidden;
}

.lesson-record-show__section--internal {
  background: var(--st-bg-secondary, #f3f0ea);
}

.lesson-record-show__prose {
  font-size: 0.9375rem;
  line-height: 1.65;
  color: var(--st-text-primary, #1c1917);
}

.lesson-record-show__prose h1,
.lesson-record-show__prose h2,
.lesson-record-show__prose h3 {
  margin: 0 0 0.5rem;
  font-size: 1rem;
  line-height: 1.35;
}

.lesson-record-show__prose ul,
.lesson-record-show__prose ol {
  margin: 0.5rem 0 0.85rem;
  padding-left: 1.35rem;
}

.lesson-record-show__prose li + li {
  margin-top: 0.25rem;
}

.lesson-record-show__body {
  white-space: normal;
}

.lesson-record-show__body p {
  margin: 0 0 0.85rem;
}

.lesson-record-show__body p:last-child {
  margin-bottom: 0;
}

.lesson-record-show__attachments {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  margin: 0;
  padding: 0;
  list-style: none;
}

.lesson-record-show__attachment-link {
  display: flex;
  align-items: center;
  gap: 0.65rem;
  padding: 0.7rem 0.85rem;
  border: 0.5px solid var(--st-border-tertiary, #e8e4dc);
  border-radius: var(--st-radius-md, 10px);
  background: var(--st-bg-secondary, #f3f0ea);
  text-decoration: none;
  transition: border-color 0.15s ease, background-color 0.15s ease;
}

.lesson-record-show__attachment-link:hover {
  border-color: var(--st-border-mid, #d6d3d1);
  background: var(--st-bg-primary, #fff);
}

.lesson-record-show__attachment-icon {
  display: inline-flex;
  flex-shrink: 0;
  align-items: center;
  justify-content: center;
  width: 2rem;
  height: 2rem;
  border-radius: var(--st-radius-sm, 8px);
  background: var(--st-bg-primary, #fff);
  color: var(--st-text-secondary, #57534e);
}

.lesson-record-show__attachment-name {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 0.875rem;
  font-weight: 500;
}

.lesson-record-show__audit-card .gs-heading {
  margin-bottom: 0.35rem;
}

.lesson-record-show__audit {
  margin: 0.5rem 0 0;
  color: var(--st-text-secondary, #57534e);
  font-size: 0.875rem;
  line-height: 1.45;
}

.lesson-record-show__audit:first-of-type {
  margin-top: 0;
}

.lesson-record-page__layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(220px, 280px);
  gap: 1rem;
  align-items: start;
}

.lesson-records-index__summary {
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem;
  margin-bottom: 1rem;
}

.lesson-records-tab {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}

.lesson-records-tab__header {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  justify-content: space-between;
  gap: 1rem;
}

.lesson-records-tab__intro {
  flex: 1 1 16rem;
  min-width: 0;
}

.lesson-records-tab__intro .cp-tab-heading {
  margin-bottom: 0.35rem;
}

.lesson-records-tab__intro .cp-tab-lead {
  margin: 0;
}

.lesson-records-tab__actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: flex-end;
  gap: 0.5rem;
}

.groups-show__body .lesson-records-index__table-wrap {
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}

@media (max-width: 640px) {
  .lesson-records-tab__actions {
    width: 100%;
  }

  .lesson-records-tab__actions .btn-primary,
  .lesson-records-tab__actions .calendar-export-btn {
    width: 100%;
    min-height: 2.75rem;
  }
}

.lesson-records-index__stat {
  display: flex;
  flex-direction: column;
  gap: 0.2rem;
  min-width: 10rem;
  padding: 0.85rem 1rem;
  border: 0.5px solid var(--st-border-tertiary, #e8e4dc);
  border-radius: var(--st-radius-lg, 12px);
  background: var(--st-bg-primary, #fff);
  box-shadow: 0 1px 2px rgba(28, 25, 23, 0.04);
}

.lesson-records-index__stat-label {
  font-size: 0.75rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--st-text-tertiary, #a8a29e);
}

.lesson-records-index__stat-value {
  font-size: 1.05rem;
  font-weight: 700;
  color: var(--st-text-primary, #1c1917);
}

.lesson-records-index__card {
  overflow: hidden;
}

.lesson-records-index__body {
  padding-top: 0.25rem;
}

.lesson-records-index__table-wrap {
  margin: 0 -0.15rem;
}

.lesson-records-index__table .bl-table__th,
.lesson-records-index__table .bl-table__td {
  font-size: 0.8125rem;
}

.lesson-records-index__title-cell {
  max-width: 14rem;
}

.lesson-records-index__files-cell {
  min-width: 8rem;
}

.lesson-records-index__file-link {
  display: inline-block;
  font-size: 0.8125rem;
  line-height: 1.4;
  word-break: break-word;
}

.lesson-records-index__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.35rem;
  justify-content: flex-end;
}

.lesson-records-index__table .contacts-index__icon-btn {
  min-width: 2.75rem;
  min-height: 2.75rem;
}

.lesson-records-index__footer {
  margin-top: 1.25rem;
  padding-top: 1rem;
  border-top: 0.5px solid var(--st-border-tertiary, #e8e4dc);
}

.lesson-records-index__empty {
  padding: 2rem 1rem;
  text-align: center;
}

.lesson-records-index__empty-text {
  margin: 0 0 1rem;
  color: var(--st-text-secondary, #57534e);
}

.lesson-record-context {
  margin-bottom: 1rem;
  padding: 1rem 1.1rem;
  border: 0.5px solid var(--st-border-tertiary, #e8e4dc);
  border-radius: var(--st-radius-lg, 12px);
  background: var(--st-bg-secondary, #f3f0ea);
}

.lesson-record-context__eyebrow {
  margin: 0 0 0.35rem;
  font-size: 0.75rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--st-text-tertiary, #a8a29e);
}

.lesson-record-context__title {
  margin: 0;
  font-size: 1rem;
  font-weight: 700;
  color: var(--st-text-primary, #1c1917);
}

.lesson-record-context__meta {
  margin: 0.15rem 0 0;
  color: var(--st-text-secondary, #57534e);
}

.lesson-record-form .groups-form__field.lesson-record-form__rich-text-field,
.lesson-record-form .groups-form__field.lesson-record-form__attachments,
.lesson-record-form .groups-form__field.lesson-record-form__title-field {
  max-width: none;
}

.lesson-record-form .groups-form__field.lesson-record-form__title-field {
  margin-bottom: 1rem;
}

.lesson-record-form__delivery-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 1rem;
  margin-bottom: 0.25rem;
}

.lesson-record-form__delivery-grid--when {
  margin-bottom: 1rem;
}

@media (min-width: 900px) {
  .lesson-record-form__delivery-grid--when {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
}

.lesson-record-form__duration-selects {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.65rem;
}

.lesson-record-form__rich-text {
  border: 0.5px solid var(--st-border-secondary, #ddd8cf);
  border-radius: var(--st-radius-md, 8px);
  background: var(--st-bg-primary, #fff);
  overflow: hidden;
}

.lesson-record-form__rich-text .ql-toolbar.ql-snow {
  border: 0;
  border-bottom: 0.5px solid var(--st-border-tertiary, #e8e4dc);
  background: var(--st-bg-secondary, #f3f0ea);
}

.lesson-record-form__rich-text .ql-container.ql-snow {
  border: 0;
  min-height: 12rem;
  font-size: 0.9375rem;
  font-family: inherit;
}

.lesson-record-form__rich-text .ql-editor {
  min-height: 12rem;
  line-height: 1.55;
}

.lesson-record-form__dropzone {
  border: 1.5px dashed var(--st-border-secondary, #ddd8cf);
  border-radius: var(--st-radius-md, 8px);
  padding: 1rem 1.15rem;
  cursor: pointer;
  background: var(--st-bg-secondary, #f3f0ea);
  position: relative;
  transition: border-color 0.15s ease, background 0.15s ease;
}

.lesson-record-form__dropzone:hover,
.lesson-record-form__dropzone.dropzone-active {
  border-color: var(--st-accent, #5c5346);
  background: #fff;
}

.lesson-record-form__dropzone-inner {
  display: flex;
  align-items: center;
  gap: 1rem;
  flex-wrap: wrap;
}

.lesson-record-form__dropzone-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 2.5rem;
  height: 2.5rem;
  border-radius: 999px;
  background: #fff;
  color: var(--st-text-secondary, #57534e);
  flex-shrink: 0;
}

.lesson-record-form__dropzone-copy {
  flex: 1 1 12rem;
  min-width: 0;
}

.lesson-record-form__dropzone-title {
  margin: 0;
  font-size: 0.875rem;
  font-weight: 700;
  color: var(--st-text-primary, #1c1917);
}

.lesson-record-form__dropzone-hint {
  margin: 0.2rem 0 0;
  font-size: 0.8125rem;
  color: var(--st-text-secondary, #57534e);
  line-height: 1.45;
}

.lesson-record-form__file-input {
  position: absolute;
  inset: 0;
  opacity: 0;
  cursor: pointer;
}

.lesson-record-form__file-preview,
.lesson-record-form__existing-attachments {
  margin: 0.75rem 0 0;
  padding: 0;
  list-style: none;
}

.lesson-record-form__file-preview-item,
.lesson-record-form__existing-attachments li {
  font-size: 0.8125rem;
  color: var(--st-text-secondary, #57534e);
  margin-top: 0.25rem;
}

.lesson-show__record-link,
.lesson-show__record-action {
  display: inline-block;
  margin-top: 0.5rem;
}

.calendar-event-popover__record-status {
  margin: 0.35rem 0 0;
  font-size: 0.88rem;
  color: var(--slate-600, #475569);
}

@media (max-width: 900px) {
  .lesson-record-page__layout,
  .lesson-record-show__layout {
    grid-template-columns: 1fr;
  }

  .lesson-record-form__delivery-grid {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 640px) {
  .lesson-records-index__summary {
    flex-direction: column;
  }

  .lesson-records-index__stat {
    width: 100%;
    min-width: 0;
  }

  .daily-log-records__filters-card {
    grid-template-columns: 1fr;
  }

  .daily-log-records__filters.students-index__filters-form {
    grid-template-columns: 1fr;
  }

  .daily-log-records__filters-actions {
    width: 100%;
    margin-bottom: 0;
  }

  .daily-log-records__apply {
    width: 100%;
    min-height: 2.75rem;
  }

  .daily-log-records__title-cell {
    max-width: none;
  }

  .lesson-record-show__header-actions {
    width: 100%;
  }

  .lesson-record-show__header-actions .btn-primary {
    flex: 1 1 auto;
    text-align: center;
  }
}

.lesson-record-form__student-entry-heading {
  display: flex;
  flex-wrap: wrap;
  gap: 1rem;
  justify-content: space-between;
  align-items: flex-start;
  margin-bottom: 1rem;
}

.lesson-record-form__bulk-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem;
  align-items: flex-end;
}

.lesson-record-form__bulk-indicator {
  display: flex;
  flex-direction: column;
  gap: 0.35rem;
  min-width: 8rem;
}

.lesson-record-form__bulk-indicator-label {
  font-size: 0.8125rem;
  color: var(--st-text-secondary, #57534e);
}

.lesson-record-form__student-grid-wrap {
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}

.lesson-record-form__student-grid {
  min-width: 42rem;
}

.lesson-record-form__student-name {
  min-width: 10rem;
  white-space: nowrap;
}

.lr-insights__header {
  margin-bottom: 1.5rem;
}

.lr-insights__title {
  margin: 0 0 0.35rem;
}

.lr-insights__section {
  margin-bottom: 2rem;
  padding-bottom: 1.5rem;
  border-bottom: 1px solid var(--st-border, #e7e5e4);
}

.lr-insights__section:last-child {
  border-bottom: 0;
}

.lr-insights__section-title {
  margin: 0 0 0.75rem;
  font-size: 1rem;
}

.lr-insights__card {
  padding: 1rem;
  margin-bottom: 1rem;
  border: 1px solid var(--st-border, #e7e5e4);
  border-radius: 0.75rem;
  background: var(--st-surface-muted, #fafaf9);
}

.lr-insights__card-title {
  margin: 0 0 0.5rem;
  font-size: 0.9375rem;
}

.lr-insights__summary {
  margin: 0 0 0.75rem;
}

.lr-insights__distribution,
.lr-insights__timeline,
.lr-insights__patterns,
.lr-insights__notes {
  margin: 0;
  padding: 0;
  list-style: none;
}

.lr-insights__distribution li,
.lr-insights__timeline li,
.lr-insights__patterns li,
.lr-insights__notes li {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem 1rem;
  padding: 0.35rem 0;
  font-size: 0.875rem;
}

.lr-insights__distribution-label {
  min-width: 6rem;
}

.lr-insight-trend {
  display: inline-block;
  padding: 0.15rem 0.5rem;
  border-radius: 999px;
  font-size: 0.75rem;
  font-weight: 600;
}

.lr-insight-trend-wrap {
  display: inline-flex;
  align-items: center;
  gap: 0.3rem;
  margin-left: 0.5rem;
  vertical-align: middle;
  position: relative;
  z-index: 1;
}

.lr-insight-trend-wrap:focus-within {
  z-index: 1100;
}

.lr-insight-trend-wrap .lr-insight-trend {
  margin-left: 0;
}

.lr-insight-trend-help {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  width: 1.125rem;
  height: 1.125rem;
  padding: 0;
  border: 1px solid #a8a29e;
  border-radius: 999px;
  background: #fff;
  color: #57534e;
  font-size: 0.6875rem;
  font-weight: 700;
  line-height: 1;
  cursor: help;
}

.lr-insight-trend-help:hover,
.lr-insight-trend-help:focus-visible {
  border-color: #78716c;
  color: #292524;
  outline: 2px solid rgba(67, 58, 50, 0.25);
  outline-offset: 1px;
  z-index: 1100;
}

/* Trend help sits inside clipped tab cards — open below, align right, and stack above neighbours. */
.lr-insights .lr-insight-trend-help[data-tooltip]::after {
  bottom: auto;
  top: calc(100% + 0.45rem);
  left: auto;
  right: 0;
  transform: none;
  padding: 0.45rem 0.65rem;
  white-space: normal;
  max-width: min(18rem, 90vw);
  width: max-content;
  text-align: left;
  font-size: 0.75rem;
  font-weight: 500;
  line-height: 1.45;
  box-shadow: 0 4px 14px rgba(28, 25, 23, 0.18);
  z-index: 1100;
}

.lr-insights .lr-insight-trend-help[data-tooltip]::before {
  bottom: auto;
  top: calc(100% + 0.15rem);
  left: auto;
  right: 0.35rem;
  transform: none;
  border-top-color: transparent;
  border-bottom-color: var(--st-accent-strong, #433a32);
  z-index: 1100;
}

.lr-insights,
.lr-insights-summary,
.lr-insights-stat,
.lr-insights-panel,
.lr-insights-panel__header,
.lr-insights-panel__body,
.lr-insights-metric-grid,
.lr-insights-metric-card,
.lr-insights-metric-card__header,
.lr-insights-patterns,
.lr-insights-patterns__item {
  overflow: visible;
}

.lr-insights-stat:has(.lr-insight-trend-help:is(:hover, :focus-visible)),
.lr-insights-metric-card:has(.lr-insight-trend-help:is(:hover, :focus-visible)),
.lr-insights-panel:has(.lr-insight-trend-help:is(:hover, :focus-visible)),
.lr-insights-patterns__item:has(.lr-insight-trend-help:is(:hover, :focus-visible)) {
  position: relative;
  z-index: 1100;
}

.lr-insights-panel__header .lr-insight-trend-wrap,
.lr-insights-metric-card__header .lr-insight-trend-wrap,
.lr-insights-stat .lr-insight-trend-wrap {
  margin-left: 0;
}

.lr-insight-trend--improving {
  background: #dcfce7;
  color: #166534;
}

.lr-insight-trend--stable {
  background: #e0e7ff;
  color: #3730a3;
}

.lr-insight-trend--declining {
  background: #fee2e2;
  color: #991b1b;
}

.lr-insight-trend--insufficient {
  background: #f5f5f4;
  color: #78716c;
}

.lr-insights--student .lr-insights__section.lr-insights-panel,
.lr-insights--group .lr-insights__section.lr-insights-panel {
  margin-bottom: 0;
  padding-bottom: 0;
  border-bottom: 0;
}

.lr-insights--student .lr-insights__section:not(.lr-insights-panel),
.lr-insights--group .lr-insights__section:not(.lr-insights-panel) {
  margin-bottom: 0;
  padding-bottom: 0;
  border-bottom: 0;
}

.lr-insights--student,
.lr-insights--group {
  display: flex;
  flex-direction: column;
  gap: 1.25rem;
}

.progress-insights-source {
  display: grid;
  gap: 1rem;
  padding: 1.15rem;
  border: 1px solid var(--st-border, #e7e5e4);
  border-radius: 0.9rem;
  background: #fff;
  box-shadow: 0 1px 2px rgb(28 25 23 / 0.04);
}

.group-progress-insights {
  display: grid;
  gap: 1.25rem;
}

.written-results-filters {
  padding: 0.9rem;
  border: 1px solid #dbe3ee;
  border-radius: 0.75rem;
  background: rgb(255 255 255 / 0.78);
}

.progress-insights-filters {
  border-color: var(--st-border, #e7e5e4);
  background: #fafaf9;
}

.progress-insights-filters .groups-form__hint {
  margin-top: 0.25rem;
  font-size: 0.68rem;
}

.written-results-filters__grid {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 0.75rem;
}

.written-results-filters__fixed {
  min-height: 2.5rem;
  display: flex;
  align-items: center;
  padding: 0.55rem 0.7rem;
  border: 1px solid #dbe3ee;
  border-radius: 0.45rem;
  background: #f8fafc;
  color: #334155;
  font-size: 0.82rem;
}

.written-results-filters__actions {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  margin-top: 0.8rem;
}

.written-results-overview {
  display: grid;
  grid-template-columns: minmax(12rem, 0.65fr) minmax(0, 1.35fr);
  gap: 1.25rem;
  align-items: start;
  padding: 1rem;
  border: 1px solid #dbe3ee;
  border-radius: 0.75rem;
  background: #fff;
}

.written-results-overview h4,
.written-results-overview p {
  margin: 0;
}

.written-results-overview h4 {
  color: #1e3a5f;
  font-size: 0.9rem;
}

.written-results-overview p {
  margin-top: 0.35rem;
  color: var(--color-text-muted, #78716c);
  font-size: 0.8rem;
  line-height: 1.45;
}

.progress-insights-source--written {
  border-color: #d8e2ef;
  background:
    linear-gradient(180deg, rgb(239 246 255 / 0.55) 0, #fff 7rem);
}

.progress-insights-source__header {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: 0.8rem;
  padding-bottom: 0.9rem;
  border-bottom: 1px solid var(--st-border, #e7e5e4);
}

.progress-insights-source__icon {
  width: 2.6rem;
  height: 2.6rem;
  display: grid;
  place-items: center;
  border-radius: 0.7rem;
  color: #57534e;
  background: #f3f0ea;
}

.progress-insights-source--written .progress-insights-source__icon {
  color: #1d4ed8;
  background: #dbeafe;
}

.progress-insights-source__icon svg {
  width: 1.3rem;
  height: 1.3rem;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.progress-insights-source__header h3,
.progress-insights-source__header p {
  margin: 0;
}

.progress-insights-source__header h3 {
  font-size: 1rem;
  color: var(--auth-heading, #1c1917);
}

.progress-insights-source__header p {
  margin-top: 0.2rem;
  color: var(--color-text-muted, #78716c);
  font-size: 0.8rem;
}

.progress-insights-source__count {
  padding: 0.3rem 0.6rem;
  border-radius: 999px;
  color: #1e40af;
  background: #dbeafe;
  font-size: 0.72rem;
  font-weight: 700;
  white-space: nowrap;
}

.written-results-summary {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0.75rem;
}

.written-results-summary article {
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
  padding: 0.8rem 0.9rem;
  border: 1px solid #dbe3ee;
  border-radius: 0.7rem;
  background: rgb(255 255 255 / 0.85);
}

.written-results-summary span {
  color: var(--color-text-muted, #78716c);
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.035em;
  text-transform: uppercase;
}

.written-results-summary strong {
  color: #1e3a5f;
  font-size: 1.3rem;
}

.written-results-charts {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.75rem;
}

.written-results-chart {
  min-width: 0;
  padding: 0.9rem;
  border: 1px solid #dbe3ee;
  border-radius: 0.75rem;
  background: #fff;
}

.written-results-chart--trend {
  grid-column: 1 / -1;
}

.written-results-chart > header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
}

.written-results-chart h4 {
  margin: 0 0 0.75rem;
  font-size: 0.82rem;
  color: #334155;
}

.written-results-chart > header h4 {
  margin-bottom: 0;
}

.written-results-chart--trend .lr-insights-sparkline {
  margin-top: 1rem;
  height: 4.5rem;
}

.written-results-chart__range {
  display: flex;
  justify-content: space-between;
  margin-top: 0.25rem;
  color: var(--color-text-muted, #78716c);
  font-size: 0.68rem;
}

.written-results-chart__legend {
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem;
  margin-top: 0.45rem;
  color: var(--color-text-muted, #78716c);
  font-size: 0.66rem;
}

.written-results-chart__legend span {
  display: inline-flex;
  align-items: center;
  gap: 0.3rem;
}

.written-results-chart__legend i {
  width: 1.25rem;
  height: 0;
  display: inline-block;
  border-top: 2px dashed;
}

.written-results-chart__legend-average {
  border-color: #64748b;
}

.written-results-chart__legend-trend {
  border-color: #f97316;
}

.written-results-history {
  display: grid;
  gap: 0.75rem;
}

.written-results-history > h4 {
  margin: 0;
  color: #1e3a5f;
  font-size: 0.9rem;
}

.written-results-history__grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.75rem;
}

.written-results-history__chart > header div {
  min-width: 0;
}

.written-results-history__chart h5 {
  margin: 0;
  color: #334155;
  font-size: 0.82rem;
}

.written-results-history__chart header span {
  color: var(--color-text-muted, #78716c);
  font-size: 0.68rem;
}

.written-results-history__chart header strong {
  color: #1e3a5f;
  font-size: 0.85rem;
}

.written-results-history__chart .lr-insights-sparkline {
  height: 4rem;
  margin-top: 0.8rem;
}

.lr-insights-bar__fill--written {
  background: #3b82f6;
}

.lr-insights-bar__fill--written-secondary {
  background: #8b5cf6;
}

.lr-insights-patterns {
  margin: 0;
  padding: 0;
  list-style: none;
  display: grid;
  gap: 0.55rem;
}

.lr-insights-patterns__item {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 0.5rem 0.75rem;
  padding: 0.65rem 0.85rem;
  border: 1px solid var(--st-border, #e7e5e4);
  border-radius: 0.65rem;
  background: #fafaf9;
}

.lr-insights-summary {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.75rem;
}

.lr-insights-stat {
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
  min-height: 5.5rem;
  padding: 0.9rem 1rem;
  border: 1px solid var(--st-border, #e7e5e4);
  border-radius: 0.75rem;
  background: linear-gradient(180deg, #fff 0%, #fafaf9 100%);
}

.lr-insights-stat__label {
  font-size: 0.75rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--color-text-muted, #78716c);
}

.lr-insights-stat__value {
  font-size: 1.35rem;
  line-height: 1.2;
  color: var(--auth-heading, #1c1917);
}

.lr-insights-stat__hint {
  font-size: 0.78rem;
  color: var(--color-text-muted, #78716c);
}

.lr-insights-panel {
  padding: 1rem;
  border: 1px solid var(--st-border, #e7e5e4);
  border-radius: 0.85rem;
  background: #fff;
}

.lr-insights-panel__header {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 0.5rem 1rem;
  margin-bottom: 0.85rem;
}

.lr-insights-panel__header .lr-insights__section-title {
  margin: 0;
}

.lr-insights-panel__body--split {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 1rem;
}

.lr-insights-panel__subheading {
  margin: 0 0 0.65rem;
  font-size: 0.8125rem;
  font-weight: 700;
  color: var(--color-text-muted, #78716c);
}

.lr-insights-panel__sparkline-wrap {
  margin-top: 0.85rem;
}

.lr-insights-panel__sparkline-label {
  display: block;
  margin-bottom: 0.35rem;
  font-size: 0.78rem;
  color: var(--color-text-muted, #78716c);
}

.lr-insights-bars {
  margin: 0;
  padding: 0;
  list-style: none;
}

.lr-insights-bars__row {
  display: grid;
  grid-template-columns: minmax(5rem, 0.9fr) minmax(0, 2fr) 3rem;
  gap: 0.65rem;
  align-items: center;
  padding: 0.3rem 0;
  font-size: 0.8125rem;
}

.lr-insights-bars__label {
  min-width: 0;
  font-weight: 600;
}

.lr-insights-bars__track {
  display: block;
  height: 0.45rem;
  border-radius: 999px;
  background: #eceae6;
  overflow: hidden;
}

.lr-insights-bars__fill {
  display: block;
  height: 100%;
  border-radius: inherit;
}

.lr-insights-bar__fill--present { background: #22c55e; }
.lr-insights-bar__fill--late { background: #f59e0b; }
.lr-insights-bar__fill--absent { background: #ef4444; }
.lr-insights-bar__fill--neutral { background: #94a3b8; }
.lr-insights-bar__fill--progress { background: #6366f1; }
.lr-insights-bar__fill--grade { background: #0ea5e9; }

.lr-insights-bars__value {
  text-align: right;
  color: var(--color-text-muted, #78716c);
  font-variant-numeric: tabular-nums;
}

.lr-insights-sparkline {
  display: block;
  width: 100%;
  max-width: 100%;
  height: 3rem;
  overflow: visible;
}

.lr-insights-sparkline--empty {
  min-height: 3rem;
  border-radius: 0.5rem;
  background: #f5f5f4;
}

.lr-insights-sparkline__line {
  fill: none;
  stroke-width: 1.75;
  stroke-linecap: round;
  stroke-linejoin: round;
  opacity: 0.88;
}

.lr-insights-sparkline__trend-line-halo {
  fill: none;
  stroke: #fff;
  stroke-width: 5;
  stroke-linecap: round;
  opacity: 0.98;
}

.lr-insights-sparkline__trend-line {
  fill: none;
  stroke: #f97316;
  stroke-width: 2.25;
  stroke-dasharray: 7 5;
  stroke-linecap: round;
}

.lr-insights-sparkline__average-line {
  fill: none;
  stroke: #64748b;
  stroke-width: 1.5;
  stroke-dasharray: 3 3;
  opacity: 0.8;
}

.lr-insights-sparkline__dot {
  stroke: #fff;
  stroke-width: 1.25;
  opacity: 0.95;
}

.lr-insights-sparkline--improving .lr-insights-sparkline__line,
.lr-insights-sparkline--improving .lr-insights-sparkline__dot { stroke: #16a34a; fill: #16a34a; }

.lr-insights-sparkline--declining .lr-insights-sparkline__line,
.lr-insights-sparkline--declining .lr-insights-sparkline__dot { stroke: #dc2626; fill: #dc2626; }

.lr-insights-sparkline--stable .lr-insights-sparkline__line,
.lr-insights-sparkline--stable .lr-insights-sparkline__dot { stroke: #4f46e5; fill: #4f46e5; }

.lr-insights-sparkline--neutral .lr-insights-sparkline__line,
.lr-insights-sparkline--neutral .lr-insights-sparkline__dot { stroke: #78716c; fill: #78716c; }

.lr-insights-strip {
  display: flex;
  gap: 0.55rem;
  overflow-x: auto;
  padding-bottom: 0.25rem;
  -webkit-overflow-scrolling: touch;
}

.lr-insights-strip__item {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.25rem;
  min-width: 3.25rem;
  flex: 0 0 auto;
}

.lr-insights-dot {
  width: 0.85rem;
  height: 0.85rem;
  border-radius: 999px;
  box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.06);
}

.lr-insights-dot--present { background: #22c55e; }
.lr-insights-dot--late { background: #f59e0b; }
.lr-insights-dot--absent { background: #ef4444; }
.lr-insights-dot--neutral { background: #94a3b8; }

.lr-insights-strip__date,
.lr-insights-strip__label {
  font-size: 0.68rem;
  line-height: 1.2;
  text-align: center;
  color: var(--color-text-muted, #78716c);
}

.lr-insights-strip__label {
  font-weight: 600;
  color: var(--color-text, #44403c);
}

.lr-insights-metric-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 0.85rem;
}

.lr-insights-metric-card {
  padding: 0.95rem 1rem;
  border: 1px solid var(--st-border, #e7e5e4);
  border-radius: 0.75rem;
  background: #fafaf9;
}

.lr-insights-metric-card__header {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 0.35rem 0.75rem;
  margin-bottom: 0.45rem;
}

.lr-insights-metric-card__title {
  margin: 0;
  font-size: 0.9375rem;
}

.lr-insights-metric-card__latest {
  margin: 0 0 0.65rem;
  font-size: 0.875rem;
}

.lr-insights-metric-timeline {
  display: flex;
  flex-wrap: wrap;
  gap: 0.45rem;
  margin: 0.75rem 0 0;
  padding: 0;
  list-style: none;
}

.lr-insights-metric-timeline__item {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  padding: 0.28rem 0.55rem;
  border-radius: 999px;
  background: #fff;
  border: 1px solid var(--st-border, #e7e5e4);
  font-size: 0.75rem;
}

.lr-insights-metric-timeline__date {
  color: var(--color-text-muted, #78716c);
}

.lr-insights-metric-timeline__value {
  font-weight: 700;
}

.lr-insights__muted-note {
  margin: 0.75rem 0 0;
  font-size: 0.8125rem;
  color: var(--color-text-muted, #78716c);
}

.lr-insights-notes {
  display: grid;
  gap: 0.75rem;
}

.lr-insights-note {
  padding: 0.85rem 1rem;
  border: 1px solid var(--st-border, #e7e5e4);
  border-left: 3px solid var(--st-nav-accent, #2d6a4f);
  border-radius: 0.65rem;
  background: #fff;
}

.lr-insights-note__meta {
  display: flex;
  flex-wrap: wrap;
  gap: 0.35rem 0.75rem;
  margin-bottom: 0.35rem;
  font-size: 0.78rem;
  color: var(--color-text-muted, #78716c);
}

.lr-insights-note__group {
  font-weight: 700;
}

.lr-insights-note__body {
  margin: 0;
  font-size: 0.875rem;
  line-height: 1.5;
}

@media (min-width: 768px) {
  .lr-insights-summary {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }

  .lr-insights-panel__body--split {
    grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr);
    align-items: start;
  }

  .lr-insights-metric-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 640px) {
  .lr-insights-bars__row {
    grid-template-columns: 1fr;
    gap: 0.25rem;
  }

  .lr-insights-bars__value {
    text-align: left;
  }
}

@media (max-width: 640px) {
  .lesson-record-form__bulk-actions {
    width: 100%;
  }

  .lesson-record-form__bulk-indicator {
    flex: 1 1 100%;
  }
}

.lr-status-badge {
  display: inline-flex;
  align-items: center;
  padding: 0.2rem 0.55rem;
  border-radius: 999px;
  font-size: 0.8125rem;
  font-weight: 600;
}

.lr-status-badge--success { background: #dcfce7; color: #166534; }
.lr-status-badge--danger { background: #fee2e2; color: #991b1b; }
.lr-status-badge--warning { background: #fef3c7; color: #92400e; }
.lr-status-badge--info { background: #dbeafe; color: #1e40af; }
.lr-status-badge--neutral { background: #f5f5f4; color: #57534e; }

.lesson-record-show__student-entry-lead {
  margin: 0 0 1rem;
}

.lesson-record-show__note-cell {
  max-width: 16rem;
  white-space: normal;
}

.lesson-record-show__student-grid .bl-table__td {
  vertical-align: middle;
}

.lesson-record-show__student-grid .bl-table__th,
.lesson-record-show__student-grid .bl-table__td {
  text-align: left;
}

.lesson-record-form__tracked-homework {
  margin-top: 1rem;
  margin-bottom: 1.25rem;
  padding: 1rem 1.1rem;
  border: 1px solid var(--color-border, #e8e4dc);
  border-radius: 0.75rem;
  background: #fbfaf8;
}

.lesson-record-form__checkbox-label,
.lesson-record-form__radio-label {
  display: flex;
  align-items: center;
  gap: 0.65rem;
  min-height: 2.6rem;
  cursor: pointer;
  font-size: 0.88rem;
}

.lesson-record-form__tracked-fields {
  margin-top: 1rem;
  padding-top: 1rem;
  border-top: 1px solid var(--color-border, #e8e4dc);
}

.lesson-record-form__tracked-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1rem;
  margin-bottom: 1rem;
}

.lesson-record-form__assign-scope {
  display: grid;
  gap: 0.35rem;
  margin: 0 0 1rem;
  padding: 0;
  border: 0;
}

.lesson-record-form__student-picker-list {
  display: grid;
  gap: 0.25rem;
  max-height: 16rem;
  overflow-y: auto;
  padding: 0.35rem;
  border: 1px solid var(--color-border, #e8e4dc);
  border-radius: 0.65rem;
  background: #fff;
}

.lesson-record-form__assignee-option {
  display: flex;
  align-items: center;
  gap: 0.65rem;
  min-height: 2.6rem;
  padding: 0.45rem 0.65rem;
  border-radius: 0.5rem;
}

.lesson-record-form__assignee-option:hover {
  background: #f0eee9;
}

.lesson-record-show__tracked-homework {
  margin-top: 1.25rem;
  padding-top: 1.1rem;
  border-top: 1px solid var(--color-border, #e8e4dc);
}

.lesson-record-show__tracked-heading {
  margin-bottom: 0.75rem;
  font-size: 0.92rem;
  font-weight: 700;
}

.lesson-record-show__tracked-stats {
  display: grid;
  gap: 0.35rem;
  margin-bottom: 1rem;
}

.lesson-record-show__tracked-link {
  margin-top: 0.35rem;
}

@media (max-width: 1000px) {
  .written-results-filters__grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 640px) {
  .lesson-record-form__tracked-grid { grid-template-columns: 1fr; }

  .progress-insights-source {
    padding: 0.9rem;
  }

  .progress-insights-source__header {
    grid-template-columns: auto minmax(0, 1fr);
    align-items: start;
  }

  .progress-insights-source__count {
    grid-column: 1 / -1;
    justify-self: start;
  }

  .written-results-summary,
  .written-results-charts,
  .written-results-history__grid,
  .written-results-filters__grid,
  .written-results-overview {
    grid-template-columns: 1fr;
  }

  .written-results-chart--trend {
    grid-column: auto;
  }
}
/* Course Resources tab */

.course-resources-tab {
  display: flex;
  flex-direction: column;
  gap: 1.25rem;
}

.course-resources-breadcrumb {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.35rem 0.5rem;
  font-size: 0.9rem;
  color: var(--si-text-muted, #64748b);
}

.course-resources-breadcrumb__link {
  color: var(--si-link, #2563eb);
  text-decoration: none;
}

.course-resources-breadcrumb__current {
  color: var(--si-text, #0f172a);
  font-weight: 600;
}

.course-resources-breadcrumb__sep {
  color: var(--si-text-muted, #94a3b8);
}

.course-resources-header {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 0.5rem;
}

.course-resources-actions,
.course-resources-empty__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
}

/* Filters panel */

.course-resources-filters {
  display: flex;
  flex-direction: column;
  gap: 1rem;
  padding: 1rem 1.1rem;
  border: 1px solid var(--si-border, #e2e8f0);
  border-radius: 12px;
  background: var(--si-surface-muted, #f8fafc);
}

.course-resources-filters__primary {
  display: grid;
  gap: 0.75rem 1rem;
  align-items: end;
}

.course-resources-filters__field {
  display: flex;
  flex-direction: column;
  gap: 0.35rem;
  min-width: 0;
}

.course-resources-filters__field--search {
  min-width: 0;
}

.course-resources-filters__field--search .students-index__search-wrap {
  width: 100%;
  max-width: none;
  min-width: 0;
}

.course-resources-filters__field--search .students-index__search-input {
  width: 100%;
  min-width: 0;
}

.course-resources-filters__label {
  font-size: 0.8rem;
  font-weight: 600;
  color: var(--si-text-muted, #64748b);
  text-transform: uppercase;
  letter-spacing: 0.03em;
}

.course-resources-filters__actions {
  display: flex;
  align-items: end;
}

.course-resources-filters__actions .students-index__btn {
  width: 100%;
  min-height: 2.75rem;
}

.course-resources-search-summary {
  margin: 0;
  padding: 0.65rem 0.85rem;
  border-radius: 10px;
  background: #eff6ff;
  border: 1px solid #bfdbfe;
  color: #1e40af;
  font-size: 0.9rem;
}

.course-resources-folder-card--match {
  border-color: #93c5fd;
  background: #f8fbff;
}

.course-resources-folder-card--match .course-resources-folder-card__icon {
  background: #dbeafe;
}

.course-resource-row__folder {
  font-size: 0.82rem;
  color: var(--si-link, #2563eb);
  text-decoration: none;
}

.course-resource-row__folder:hover {
  text-decoration: underline;
}

.course-resource-file__folder {
  color: var(--si-link, #2563eb);
  text-decoration: none;
}

.course-resource-file__folder:hover {
  text-decoration: underline;
}

.course-resources-filters .tag-filter {
  flex: 1 0 100%;
  width: 100%;
  margin-top: 0.25rem;
}

/* Sections */

.course-resources-section__header {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 0.5rem;
  margin-bottom: 0.75rem;
}

.course-resources-section__heading {
  margin: 0 0 0.75rem;
  font-size: 0.95rem;
  font-weight: 700;
  color: var(--si-text, #0f172a);
}

.course-resources-section__header .course-resources-section__heading {
  margin-bottom: 0;
}

/* Folder cards */

.course-resources-folders {
  display: grid;
  gap: 0.75rem;
  grid-template-columns: repeat(auto-fill, minmax(min(100%, 16rem), 1fr));
}

.course-resources-folder-card {
  position: relative;
  display: flex;
  flex-direction: column;
  min-height: 100%;
  border: 1px solid var(--si-border, #e2e8f0);
  border-radius: 12px;
  background: #fff;
  overflow: hidden;
  transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.course-resources-folder-card:hover {
  border-color: var(--si-link, #2563eb);
  box-shadow: 0 2px 8px rgba(15, 23, 42, 0.06);
}

.course-resources-folder-card__link {
  display: flex;
  gap: 0.85rem;
  align-items: flex-start;
  flex: 1;
  padding: 1rem 1rem 0.85rem;
  color: inherit;
  text-decoration: none;
  min-height: 2.75rem;
}

.course-resources-folder-card__icon {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  width: 2.5rem;
  height: 2.5rem;
  border-radius: 10px;
  background: var(--si-surface-muted, #f1f5f9);
  color: var(--si-link, #2563eb);
}

.course-resources-folder-card__body {
  display: flex;
  flex-direction: column;
  gap: 0.2rem;
  min-width: 0;
}

.course-resources-folder-card__name {
  font-weight: 600;
  color: var(--si-text, #0f172a);
  line-height: 1.3;
  word-break: break-word;
}

.course-resources-folder-card__count {
  font-size: 0.82rem;
  color: var(--si-text-muted, #64748b);
}

.course-resources-folder-card__description {
  margin-top: 0.15rem;
  font-size: 0.85rem;
  color: var(--si-text-muted, #64748b);
  line-height: 1.4;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.course-resources-folder-card__actions {
  display: flex;
  justify-content: flex-end;
  gap: 0.25rem;
  padding: 0 0.65rem 0.65rem;
}

.cl-icon-btn--disabled {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 2.75rem;
  height: 2.75rem;
  border-radius: 8px;
  color: var(--si-text-muted, #94a3b8);
  cursor: not-allowed;
  opacity: 0.55;
}

/* Batch selection */

.course-resources-batch-form {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
}

.course-resources-batch-bar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  padding: 0.65rem 0.85rem;
  border: 1px solid var(--si-border, #e2e8f0);
  border-radius: 10px;
  background: #fff;
}

.course-resources-batch-bar__select-all {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  min-height: 2.75rem;
  font-size: 0.9rem;
  font-weight: 500;
  cursor: pointer;
}

.course-resources-batch-bar__select-all input[type="checkbox"] {
  width: 1rem;
  height: 1rem;
}

.students-index__btn--danger {
  background: #dc2626;
  color: #fff;
  border-color: #b91c1c;
}

.students-index__btn--danger:hover:not(:disabled) {
  background: #b91c1c;
  border-color: #991b1b;
  color: #fff;
}

.students-index__btn--outline.students-index__btn--danger {
  background: var(--st-bg-primary, #fff);
  color: #b91c1c;
  border-color: #fecaca;
}

.students-index__btn--outline.students-index__btn--danger:hover:not(:disabled) {
  background: #fef2f2;
  border-color: #fca5a5;
  color: #b91c1c;
}

.students-index__btn--danger:disabled {
  opacity: 0.45;
  cursor: not-allowed;
}

.course-resource-form__delete-form {
  display: inline;
}

/* Empty state */

.course-resources-empty {
  padding: 2.5rem 1.5rem;
  text-align: center;
  border: 1px dashed var(--si-border, #e2e8f0);
  border-radius: 12px;
  background: var(--si-surface-muted, #f8fafc);
}

.course-resources-empty__title {
  margin: 0 0 0.5rem;
  font-size: 1.15rem;
}

.course-resources-empty__lead {
  margin: 0 0 1.25rem;
  color: var(--si-text-muted, #64748b);
}

/* Resource files */

.course-resources-files {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}

.course-resource-file {
  display: grid;
  grid-template-columns: auto auto minmax(0, 1fr) auto;
  gap: 0.85rem 1rem;
  align-items: center;
  padding: 0.85rem 1rem;
  border: 1px solid var(--si-border, #e2e8f0);
  border-radius: 12px;
  background: #fff;
  transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.course-resource-file:has(.course-resource-file__select) {
  grid-template-columns: auto auto auto minmax(0, 1fr) auto;
}

.course-resource-file--selectable {
  grid-template-columns: auto auto minmax(0, 1fr);
  align-items: start;
}

.course-resource-file--selectable .course-resource-file__select {
  padding-top: 0.35rem;
}

.course-resource-file--selectable .course-resource-file__body {
  min-width: 0;
}

.course-resource-file__title-text {
  min-width: 0;
  word-break: break-word;
}

.course-resource-file:hover {
  border-color: #cbd5e1;
  box-shadow: 0 1px 4px rgba(15, 23, 42, 0.05);
}

.course-resource-file--archived {
  opacity: 0.72;
  background: var(--si-surface-muted, #f8fafc);
}

.course-resource-file__select {
  display: flex;
  align-items: center;
  min-height: 2.75rem;
  cursor: pointer;
}

.course-resource-file__select input[type="checkbox"] {
  width: 1rem;
  height: 1rem;
}

.course-resource-file__icon {
  display: flex;
  align-items: center;
  justify-content: center;
}

.course-resource-file__icon-wrap {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 2.75rem;
  height: 2.75rem;
  border-radius: 10px;
  flex-shrink: 0;
}

.course-resource-file__icon-wrap--file,
.course-resource-file__icon-wrap--office {
  background: #eff6ff;
  color: #2563eb;
}

.course-resource-file__icon-wrap--pdf {
  background: #fef2f2;
  color: #dc2626;
}

.course-resource-file__icon-wrap--image {
  background: #f0fdf4;
  color: #16a34a;
}

.course-resource-file__icon-wrap--video {
  background: #faf5ff;
  color: #9333ea;
}

.course-resource-file__icon-wrap--audio {
  background: #fff7ed;
  color: #ea580c;
}

.course-resource-file__icon-wrap--link {
  background: #ecfeff;
  color: #0891b2;
}

.course-resource-file__body {
  min-width: 0;
}

.course-resource-file__title-row {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 0.5rem 0.75rem;
}

.course-resource-file__title-link {
  font-weight: 600;
  font-size: 0.9375rem;
  color: var(--si-text, #0f172a);
  text-decoration: none;
  line-height: 1.35;
  word-break: break-word;
}

.course-resource-file__title-link:hover {
  color: var(--si-link, #2563eb);
  text-decoration: underline;
}

.course-resource-file__type {
  display: inline-flex;
  align-items: center;
  padding: 0.15rem 0.45rem;
  border-radius: 999px;
  background: var(--si-surface-muted, #f1f5f9);
  color: var(--si-text-muted, #64748b);
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.03em;
  text-transform: uppercase;
  white-space: nowrap;
}

.course-resource-file__description {
  margin: 0.35rem 0 0;
  color: var(--si-text-muted, #64748b);
  font-size: 0.85rem;
  line-height: 1.45;
}

.course-resource-file__meta {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.25rem 0.35rem;
  margin-top: 0.35rem;
  font-size: 0.8rem;
  color: var(--si-text-muted, #64748b);
}

.course-resource-file__meta-sep {
  color: #cbd5e1;
}

.course-resource-file__tags {
  margin-top: 0.5rem;
}

.course-resource-file__actions {
  display: flex;
  align-items: center;
  gap: 0.25rem;
  align-self: start;
  padding-top: 0.15rem;
}

/* Legacy row classes kept for lesson record picker */
.course-resources-library {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
}

.course-resource-row {
  display: grid;
  grid-template-columns: auto auto 1fr auto;
  gap: 0.75rem 1rem;
  align-items: start;
  padding: 1rem 1.1rem;
  border: 1px solid var(--si-border, #e2e8f0);
  border-radius: 12px;
  background: #fff;
}

.course-resource-row__title-link {
  font-weight: 600;
  color: var(--si-link, #2563eb);
  text-decoration: none;
}

/* Dialogs */

.course-resources-dialog {
  border: none;
  border-radius: 12px;
  padding: 1.25rem;
  max-width: 28rem;
  width: calc(100% - 2rem);
  box-shadow: 0 16px 48px rgba(15, 23, 42, 0.18);
}

.course-resources-dialog::backdrop {
  background: rgba(15, 23, 42, 0.45);
}

.course-resources-dialog__title {
  margin: 0 0 1rem;
  font-size: 1.1rem;
}

.course-resources-dialog__actions,
.course-resource-form__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  margin-top: 1rem;
}

.course-resource-form__danger {
  margin-top: 0;
  padding-top: 1.25rem;
  border-top: 1px solid var(--si-border, #e2e8f0);
}

.course-resource-form__danger-heading {
  margin: 0 0 0.35rem;
  font-size: 0.9375rem;
  font-weight: 600;
  color: var(--si-text, #0f172a);
}

.course-resource-form__danger-lead {
  margin: 0 0 0.85rem;
  font-size: 0.875rem;
  line-height: 1.45;
  color: var(--si-text-muted, #64748b);
}

.course-resource-form__visibility {
  border: 0;
  padding: 0;
  margin: 0 0 1.35rem;
}

.course-resource-form__visibility-options {
  display: flex;
  flex-direction: column;
  gap: 0.65rem;
  margin-top: 0.35rem;
}

.course-resource-form__visibility-option {
  display: grid;
  grid-template-columns: 1.125rem minmax(0, 1fr);
  gap: 0.75rem;
  align-items: start;
  min-height: 2.75rem;
  padding: 0.75rem 0.85rem;
  border: 1px solid var(--si-border, #e2e8f0);
  border-radius: 10px;
  background: #fff;
  cursor: pointer;
  margin: 0;
}

.course-resource-form__visibility .course-resource-form__visibility-option {
  display: grid;
  margin-bottom: 0;
}

.course-resource-form__visibility-option:has(input:checked) {
  border-color: var(--st-accent, #5c5346);
  background: var(--st-bg-secondary, #faf9f7);
}

.course-resource-form__visibility-option input[type="radio"] {
  width: 1.125rem;
  height: 1.125rem;
  margin: 0.125rem 0 0;
  flex-shrink: 0;
}

.course-resource-form__visibility-copy {
  min-width: 0;
}

.course-resource-form__visibility-option strong {
  display: block;
  font-size: 0.875rem;
  line-height: 1.35;
  color: var(--st-text-primary, #1c1917);
}

.course-resource-form__visibility-description {
  display: block;
  margin-top: 0.2rem;
  font-size: 0.8125rem;
  font-weight: 400;
  color: var(--st-text-secondary, #57534e);
  line-height: 1.45;
}

.course-resource-form__groups {
  margin: -0.15rem 0 0;
  padding: 0.85rem 0.85rem 0.85rem 2.75rem;
  border: 1px solid var(--si-border, #e2e8f0);
  border-radius: 10px;
  background: var(--st-bg-secondary, #faf9f7);
}

.course-resource-form__groups-label {
  margin: 0 0 0.65rem;
  font-size: 0.8125rem;
  font-weight: 600;
  color: var(--st-text-primary, #1c1917);
}

.course-resource-form__groups .groups-form__checkbox-row {
  margin-bottom: 0;
}

.course-resource-form .groups-form__field--checkbox {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  min-height: 2.75rem;
}

.course-resource-form .groups-form__field--checkbox input[type="checkbox"] {
  width: 1rem;
  height: 1rem;
  margin: 0;
  flex-shrink: 0;
}

.course-resource-form .groups-form__field--checkbox label {
  display: inline;
  margin: 0;
  cursor: pointer;
}

.course-resource-form__tags {
  border: 0;
  padding: 0;
  margin: 0 0 1.35rem;
}

.course-resource-form__tag-choices {
  margin-top: 0.15rem;
}

.course-resource-form__dropzone {
  margin-top: 0.35rem;
}

.lesson-record-form__resources.lesson-record-resource-picker {
  display: block;
  padding: 0;
  border: 0;
  background: transparent;
  gap: 0;
}

.lesson-record-resource-picker__layout {
  display: grid;
  gap: 1.25rem;
}

.lesson-record-resource-picker__panel {
  display: flex;
  flex-direction: column;
  gap: 0.85rem;
  min-width: 0;
  padding: 1rem 1.1rem;
  border: 1px solid var(--st-border-tertiary, #e8e4dc);
  border-radius: var(--st-radius-lg, 12px);
  background: var(--st-bg-secondary, #f3f0ea);
}

.lesson-record-resource-picker__panel-heading {
  margin: 0;
  font-size: 0.82rem;
  font-weight: 700;
  letter-spacing: 0.03em;
  text-transform: uppercase;
  color: var(--st-text-secondary, #57534e);
}

.lesson-record-form__resources .lesson-record-resource-picker__toolbar {
  display: grid;
  grid-template-columns: minmax(0, 1.5fr) minmax(0, 1fr);
  gap: 0.75rem;
  align-items: center;
}

.lesson-record-form__resources .lesson-record-resource-picker__search,
.lesson-record-form__resources .lesson-record-resource-picker__toolbar .groups-form__select--wide {
  width: 100%;
  min-width: 0;
}

.lesson-record-resource-picker__list {
  display: flex;
  flex-direction: column;
  gap: 0.65rem;
  max-height: 22rem;
  overflow-y: auto;
  padding-right: 0.15rem;
}

.lesson-record-resource-picker__empty {
  margin: 0;
  padding: 1rem 0.5rem;
  text-align: center;
  font-size: 0.9rem;
  color: var(--st-text-secondary, #57534e);
}

.lesson-record-form__resources .lesson-record-resource-picker__list .course-resource-file {
  margin: 0;
}

.lesson-record-form__resources .lesson-record-resource-picker__list .course-resource-file__title-text {
  font-size: 0.95rem;
  font-weight: 600;
  line-height: 1.35;
  color: var(--st-text-primary, #1c1917);
  word-break: break-word;
}

.lesson-record-form__resources .lesson-record-resource-picker__list .course-resource-file__meta {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.35rem 0.65rem;
}

.lesson-record-form__resources .lesson-record-resource-picker__list .course-resource-file__folder {
  color: var(--st-text-secondary, #57534e);
  text-decoration: none;
  cursor: default;
  font-size: 0.82rem;
}

.lesson-record-form__resources .lesson-record-resource-picker__list .course-resource-file__folder:hover {
  text-decoration: none;
}

.lesson-record-resource-picker__selected {
  padding: 1rem 1.1rem;
  border: 1px solid var(--st-border-tertiary, #e8e4dc);
  border-radius: var(--st-radius-lg, 12px);
  background: var(--st-bg-primary, #fff);
}

.lesson-record-resource-picker__selected-header {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 0.5rem;
  margin-bottom: 0.75rem;
}

.lesson-record-resource-picker__selected-heading {
  margin: 0;
  font-size: 0.95rem;
  font-weight: 700;
  color: var(--st-text-primary, #1c1917);
}

.lesson-record-resource-picker__selected-count {
  font-size: 0.82rem;
  font-weight: 600;
  color: var(--st-text-secondary, #57534e);
}

.lesson-record-resource-picker__selected-empty {
  margin: 0;
}

.lesson-record-resource-picker__selected-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 0.55rem;
}

.lesson-record-resource-picker__chip {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  gap: 0.65rem;
  align-items: center;
  padding: 0.65rem 0.75rem;
  border: 1px solid var(--st-border-tertiary, #e8e4dc);
  border-radius: 10px;
  background: var(--st-bg-secondary, #f3f0ea);
}

.lesson-record-resource-picker__chip-icon .course-resource-file__icon-wrap {
  width: 2.25rem;
  height: 2.25rem;
}

.lesson-record-resource-picker__chip-body {
  display: flex;
  flex-direction: column;
  gap: 0.2rem;
  min-width: 0;
}

.lesson-record-resource-picker__chip-title {
  font-size: 0.92rem;
  font-weight: 600;
  line-height: 1.35;
  color: var(--st-text-primary, #1c1917);
  word-break: break-word;
}

.lesson-record-resource-picker__chip-meta {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.35rem 0.55rem;
}

.lesson-record-resource-picker__chip-meta .course-resource-file__type {
  font-size: 0.75rem;
}

.lesson-record-resource-picker__chip-folder {
  font-size: 0.78rem;
  color: var(--st-text-secondary, #57534e);
}

.lesson-record-resource-picker__chip-folder::before {
  content: "·";
  margin-right: 0.35rem;
  color: var(--st-text-tertiary, #a8a29e);
}

.lesson-record-resource-picker__chip-remove {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 2.75rem;
  height: 2.75rem;
  padding: 0;
  border: 1px solid var(--st-border-tertiary, #e8e4dc);
  border-radius: 999px;
  background: var(--st-bg-primary, #fff);
  color: var(--st-text-secondary, #57534e);
  font-size: 1.25rem;
  line-height: 1;
  cursor: pointer;
  transition: background 0.15s ease, border-color 0.15s ease, color 0.15s ease;
}

.lesson-record-resource-picker__chip-remove:hover {
  background: #fef2f2;
  border-color: #fecaca;
  color: #b91c1c;
}

@media (min-width: 900px) {
  .lesson-record-resource-picker__layout {
    grid-template-columns: minmax(0, 1.35fr) minmax(0, 1fr);
    align-items: start;
  }
}

@media (max-width: 640px) {
  .lesson-record-form__resources .lesson-record-resource-picker__toolbar {
    grid-template-columns: 1fr;
  }

  .lesson-record-resource-picker__list {
    max-height: 18rem;
  }
}

.lesson-record-resources-used {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}

.lesson-record-resources-used__item {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  align-items: center;
  padding: 0.5rem 0;
  border-bottom: 1px solid var(--si-border, #e2e8f0);
}

@media (max-width: 640px) {
  .course-resources-filters__primary {
    grid-template-columns: 1fr;
  }

  .course-resources-folders {
    grid-template-columns: 1fr;
  }

  .course-resource-file {
    grid-template-columns: auto minmax(0, 1fr);
    grid-template-rows: auto auto;
  }

  .course-resource-file:has(.course-resource-file__select) {
    grid-template-columns: auto auto minmax(0, 1fr);
  }

  .course-resource-file__select {
    grid-row: 1;
    grid-column: 1;
  }

  .course-resource-file__icon {
    grid-row: 1;
    grid-column: 1;
  }

  .course-resource-file:has(.course-resource-file__select) .course-resource-file__icon {
    grid-column: 2;
  }

  .course-resource-file__body {
    grid-column: 1 / -1;
  }

  .course-resource-file__actions {
    grid-column: 1 / -1;
    justify-content: flex-end;
    padding-top: 0;
  }

  .course-resource-row {
    grid-template-columns: auto 1fr;
  }

  .course-resources-batch-bar {
    flex-direction: column;
    align-items: stretch;
  }

  .course-resources-batch-bar .students-index__btn {
    width: 100%;
  }

  .course-resources-header {
    justify-content: stretch;
  }

  .course-resources-actions {
    width: 100%;
  }

  .course-resources-actions .students-index__btn {
    flex: 1 1 auto;
    justify-content: center;
  }
}

@media (min-width: 640px) {
  .course-resources-filters__primary {
    grid-template-columns: minmax(0, 1.5fr) repeat(3, minmax(0, 1fr)) auto;
  }
}

@media (min-width: 900px) {
  .course-resources-filters__primary {
    grid-template-columns: minmax(0, 2fr) repeat(3, minmax(8rem, 1fr)) auto;
  }
}
/* Scheme of Work */

/* Course curriculum tab */
.course-curriculum-tab {
  display: flex;
  flex-direction: column;
  gap: 1.25rem;
}

.course-curriculum-tab__header {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  justify-content: space-between;
  gap: 1rem;
}

.course-curriculum-tab__intro {
  flex: 1 1 16rem;
  min-width: 0;
}

.course-curriculum-tab__intro .cp-tab-heading {
  margin-bottom: 0.35rem;
}

.course-curriculum-tab__intro .cp-tab-lead {
  margin: 0;
}

.course-curriculum-tab__add {
  flex-shrink: 0;
}

.course-curriculum-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
}

.course-curriculum-topic {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  gap: 1rem;
  align-items: start;
  padding: 1rem 1.15rem;
  border: 1px solid var(--st-border-tertiary, #e8e4dc);
  border-radius: var(--st-radius-lg, 12px);
  background: var(--st-bg-primary, #fff);
  transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.course-curriculum-topic:hover {
  border-color: var(--st-border-secondary, #ddd8cf);
  box-shadow: 0 2px 8px rgba(28, 25, 23, 0.05);
}

.course-curriculum-topic--inactive {
  background: var(--st-bg-secondary, #f3f0ea);
}

.course-curriculum-topic__index {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 2rem;
  height: 2rem;
  padding: 0 0.5rem;
  border-radius: 999px;
  background: var(--st-bg-secondary, #f3f0ea);
  color: var(--st-text-secondary, #57534e);
  font-size: 0.8125rem;
  font-weight: 700;
  line-height: 1;
}

.course-curriculum-topic__body {
  display: flex;
  flex-direction: column;
  gap: 0.4rem;
  min-width: 0;
}

.course-curriculum-topic__title-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.5rem;
}

.course-curriculum-topic__title {
  margin: 0;
  font-size: 1rem;
  font-weight: 700;
  line-height: 1.35;
  color: var(--st-text-primary, #1c1917);
}

.course-curriculum-topic__meta {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.5rem 0.75rem;
  font-size: 0.8125rem;
  color: var(--st-text-tertiary, #78716c);
}

.course-curriculum-topic__code {
  display: inline-flex;
  padding: 0.15rem 0.5rem;
  border-radius: var(--st-radius-sm, 6px);
  background: var(--st-bg-tertiary, #ebe4d8);
  color: var(--st-text-secondary, #57534e);
  font-size: 0.75rem;
  font-weight: 600;
  letter-spacing: 0.03em;
  text-transform: uppercase;
}

.course-curriculum-topic__stat {
  color: var(--st-text-tertiary, #78716c);
}

.course-curriculum-topic__description {
  margin: 0;
  font-size: 0.875rem;
  line-height: 1.55;
  color: var(--st-text-secondary, #57534e);
}

.course-curriculum-topic__actions {
  display: flex;
  gap: 0.35rem;
  align-items: center;
  padding-top: 0.1rem;
}

.course-curriculum-tab__empty {
  padding: 2.5rem 1.5rem;
  text-align: center;
  border: 1px dashed var(--st-border-tertiary, #e8e4dc);
  border-radius: var(--st-radius-lg, 12px);
  background: var(--st-bg-secondary, #f3f0ea);
}

.course-curriculum-tab__empty .cp-tab-empty {
  margin: 0 0 0.5rem;
}

.course-curriculum-tab__empty-hint {
  margin: 0 0 1rem;
  font-size: 0.875rem;
  color: var(--st-text-tertiary, #78716c);
}

.sow-offerings-tab {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}

.sow-overview-tab {
  display: flex;
  flex-direction: column;
  gap: 1.25rem;
}

.sow-overview-tab__coverage > .btn-primary {
  margin-top: 1.25rem;
  align-self: flex-start;
}

.sow-scheme-progress-tab {
  display: flex;
  flex-direction: column;
  gap: 1.25rem;
}

.sow-scheme-progress-tab__intro .cp-tab-heading {
  margin: 0 0 0.35rem;
}

.sow-scheme-progress-tab__intro .cp-tab-lead {
  margin: 0;
}

.sow-scheme-progress-tab__grid,
.sow-offerings-grid,
.sow-classes-grid,
.sow-teachers-grid {
  display: grid;
  gap: 1rem;
  grid-template-columns: repeat(auto-fill, minmax(min(100%, 18rem), 1fr));
}

.sow-offering-card,
.sow-class-card,
.sow-teacher-card,
.sow-group-progress-card,
.sow-item-card {
  border: 1px solid var(--st-border-tertiary, #e8e4dc);
  border-radius: var(--st-radius-lg, 12px);
  padding: 1rem 1.15rem;
  background: var(--st-bg-primary, #fff);
  box-shadow: 0 1px 2px rgba(28, 25, 23, 0.04);
}

.sow-group-progress-card {
  display: flex;
  flex-direction: column;
  gap: 1rem;
  min-width: 0;
}

.sow-group-progress-card__header {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  justify-content: space-between;
  gap: 0.85rem;
}

.sow-group-progress-card__heading {
  flex: 1 1 12rem;
  min-width: 0;
}

.sow-group-progress-card__title {
  margin: 0;
  font-size: 1.05rem;
  font-weight: 700;
  line-height: 1.35;
}

.sow-group-progress-card__title-link {
  color: var(--st-text-primary, #1c1917);
  text-decoration: none;
}

.sow-group-progress-card__title-link:hover {
  color: var(--si-link, #2563eb);
  text-decoration: underline;
}

.sow-group-progress-card__meta {
  margin: 0.25rem 0 0;
  font-size: 0.85rem;
  color: var(--st-text-secondary, #57534e);
}

.sow-group-progress-card__action {
  flex-shrink: 0;
  align-self: flex-start;
  white-space: nowrap;
}

.sow-group-progress-card__stats {
  display: flex;
  flex-direction: column;
  gap: 0;
  padding: 0.15rem 0.85rem;
  border: 1px solid var(--st-border-tertiary, #e8e4dc);
  border-radius: var(--st-radius-md, 8px);
  background: var(--st-bg-secondary, #f3f0ea);
}

.sow-group-progress-card__stats .gs-stat-row {
  padding: 0.55rem 0;
}

.sow-group-progress-card__current-item {
  text-align: right;
  word-break: break-word;
}

.sow-group-progress-card__section-label {
  margin: 0 0 0.5rem;
  font-size: 0.78rem;
  font-weight: 700;
  letter-spacing: 0.03em;
  text-transform: uppercase;
  color: var(--st-text-secondary, #57534e);
}

.sow-group-progress-card__coverage-tags {
  gap: 0.45rem;
}

.sow-group-progress-card__recent {
  padding-top: 0.15rem;
  border-top: 1px solid var(--st-border-tertiary, #e8e4dc);
}

.sow-group-progress-card__records {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 0.45rem;
}

.sow-group-progress-card__record-link {
  display: flex;
  flex-direction: column;
  gap: 0.15rem;
  padding: 0.65rem 0.75rem;
  border: 1px solid var(--st-border-tertiary, #e8e4dc);
  border-radius: var(--st-radius-md, 8px);
  background: var(--st-bg-secondary, #f3f0ea);
  color: inherit;
  text-decoration: none;
  transition: border-color 0.15s ease, background 0.15s ease;
}

.sow-group-progress-card__record-link:hover {
  border-color: var(--si-link, #2563eb);
  background: #f8fbff;
}

.sow-group-progress-card__record-date {
  font-size: 0.78rem;
  font-weight: 600;
  color: var(--st-text-secondary, #57534e);
}

.sow-group-progress-card__record-title {
  font-size: 0.92rem;
  font-weight: 600;
  line-height: 1.35;
  color: var(--st-text-primary, #1c1917);
  word-break: break-word;
}

.sow-offering-card {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
}

.sow-offering-card__header {
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
}

.sow-offering-card__title {
  margin: 0;
  font-size: 1.05rem;
  font-weight: 600;
}

.sow-offering-card__meta {
  margin: 0;
  font-size: 0.85rem;
  color: var(--si-text-muted);
}

.sow-offering-card__actions {
  margin-top: auto;
  padding-top: 0.25rem;
}

.sow-classes-tab {
  display: flex;
  flex-direction: column;
  gap: 1.25rem;
}

.sow-classes-tab__intro .cp-tab-heading {
  margin: 0 0 0.35rem;
}

.sow-classes-tab__intro .cp-tab-lead {
  margin: 0;
}

.sow-class-card {
  display: flex;
  flex-direction: column;
  gap: 1rem;
  min-width: 0;
}

.sow-class-card__header {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  justify-content: space-between;
  gap: 0.85rem;
}

.sow-class-card__heading {
  flex: 1 1 12rem;
  min-width: 0;
}

.sow-class-card__title {
  margin: 0;
  font-size: 1.05rem;
  font-weight: 700;
  line-height: 1.35;
}

.sow-class-card__title-link {
  color: var(--st-text-primary, #1c1917);
  text-decoration: none;
}

.sow-class-card__title-link:hover {
  color: var(--si-link, #2563eb);
  text-decoration: underline;
}

.sow-class-card__meta {
  margin: 0.25rem 0 0;
  font-size: 0.85rem;
  line-height: 1.45;
  color: var(--st-text-secondary, #57534e);
}

.sow-class-card__action {
  flex-shrink: 0;
  align-self: flex-start;
  white-space: nowrap;
}

.sow-class-card__stats {
  display: flex;
  flex-direction: column;
  gap: 0;
  padding: 0.15rem 0.85rem;
  border: 1px solid var(--st-border-tertiary, #e8e4dc);
  border-radius: var(--st-radius-md, 8px);
  background: var(--st-bg-secondary, #f3f0ea);
}

.sow-class-card__stats .gs-stat-row {
  padding: 0.55rem 0;
}

.sow-class-card__section-label {
  margin: 0 0 0.5rem;
  font-size: 0.78rem;
  font-weight: 700;
  letter-spacing: 0.03em;
  text-transform: uppercase;
  color: var(--st-text-secondary, #57534e);
}

.sow-class-card__coverage-tags {
  gap: 0.45rem;
}

.sow-teachers-tab {
  display: flex;
  flex-direction: column;
  gap: 1.25rem;
}

.sow-teachers-tab__intro .cp-tab-heading {
  margin: 0 0 0.35rem;
}

.sow-teachers-tab__intro .cp-tab-lead {
  margin: 0;
}

.sow-teacher-card {
  display: flex;
  flex-direction: column;
  gap: 1rem;
  min-width: 0;
}

.sow-teacher-card__header {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  gap: 0.35rem;
}

.sow-teacher-card__heading {
  flex: 1 1 12rem;
  min-width: 0;
}

.sow-teacher-card__title {
  margin: 0;
  font-size: 1.05rem;
  font-weight: 700;
  line-height: 1.35;
}

.sow-teacher-card__title-link {
  color: var(--st-text-primary, #1c1917);
  text-decoration: none;
}

.sow-teacher-card__title-link:hover {
  color: var(--si-link, #2563eb);
  text-decoration: underline;
}

.sow-teacher-card__meta {
  margin: 0.25rem 0 0;
  font-size: 0.85rem;
  line-height: 1.45;
  color: var(--st-text-secondary, #57534e);
}

.sow-teacher-card__section-label {
  margin: 0 0 0.5rem;
  font-size: 0.78rem;
  font-weight: 700;
  letter-spacing: 0.03em;
  text-transform: uppercase;
  color: var(--st-text-secondary, #57534e);
}

.sow-teacher-card__group-tags {
  gap: 0.45rem;
}

.sow-teacher-card__group-link {
  display: inline-flex;
  align-items: center;
  min-height: 2rem;
  padding: 0.35rem 0.75rem;
  border: 1px solid var(--st-border-tertiary, #e8e4dc);
  border-radius: 999px;
  background: var(--st-bg-secondary, #f3f0ea);
  color: var(--st-text-primary, #1c1917);
  font-size: 0.85rem;
  font-weight: 600;
  line-height: 1.3;
  text-decoration: none;
  transition: border-color 0.15s ease, background 0.15s ease, color 0.15s ease;
}

.sow-teacher-card__group-link:hover {
  border-color: var(--si-link, #2563eb);
  background: #f8fbff;
  color: var(--si-link, #2563eb);
}

.sow-scheme-tab {
  display: flex;
  flex-direction: column;
  gap: 1.25rem;
}

.sow-scheme-tab__header {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: flex-start;
  gap: 1rem;
}

.sow-scheme-tab__intro {
  flex: 1 1 12rem;
  min-width: 0;
}

.sow-scheme-tab__intro .cp-tab-heading {
  margin: 0;
}

.sow-scheme-tab__header-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: flex-end;
  gap: 0.65rem;
}

.sow-scheme-tab__term-section {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
}

.sow-scheme-tab__term-section + .sow-scheme-tab__term-section {
  margin-top: 0.5rem;
  padding-top: 1.25rem;
  border-top: 1px solid var(--st-border-tertiary, #e8e4dc);
}

.sow-scheme-tab__term-title {
  margin: 0;
  font-size: 0.9375rem;
  font-weight: 700;
  color: var(--st-text-secondary, #57534e);
  letter-spacing: 0.01em;
}

.sow-view-toggle {
  display: inline-flex;
  border: 1px solid var(--st-border-tertiary, #e8e4dc);
  border-radius: var(--st-radius-md, 8px);
  overflow: hidden;
  background: var(--st-bg-primary, #fff);
}

.sow-view-toggle__btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 2.25rem;
  padding: 0.45rem 0.85rem;
  text-decoration: none;
  color: var(--st-text-secondary, #57534e);
  font-size: 0.8125rem;
  font-weight: 500;
  border-right: 1px solid var(--st-border-tertiary, #e8e4dc);
  transition: background 0.12s ease, color 0.12s ease;
}

.sow-view-toggle__btn:last-child {
  border-right: 0;
}

.sow-view-toggle__btn:hover {
  background: var(--st-bg-secondary, #f3f0ea);
  color: var(--st-text-primary, #1c1917);
}

.sow-view-toggle__btn--active {
  background: var(--st-bg-secondary, #f3f0ea);
  color: var(--st-text-primary, #1c1917);
  font-weight: 600;
}

.sow-item-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
}

.sow-item-card {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 0.85rem 1rem;
  align-items: start;
  padding: 1rem 1.1rem;
  border: 1px solid var(--st-border-tertiary, #e8e4dc);
  border-radius: var(--st-radius-lg, 12px);
  background: var(--st-bg-primary, #fff);
  transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.sow-item-card:hover {
  border-color: var(--st-border-secondary, #ddd8cf);
  box-shadow: 0 2px 8px rgba(28, 25, 23, 0.05);
}

.sow-item-card--reorderable {
  grid-template-columns: auto minmax(0, 1fr) auto;
}

.sow-item-card__handle {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 2rem;
  height: 2rem;
  margin-top: 0.05rem;
  border-radius: var(--st-radius-sm, 6px);
  color: var(--st-text-tertiary, #78716c);
  cursor: grab;
  user-select: none;
}

.sow-item-card__handle:active {
  cursor: grabbing;
}

.sow-item-card__body {
  display: flex;
  flex-direction: column;
  gap: 0.45rem;
  min-width: 0;
}

.sow-item-card__title-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.5rem 0.75rem;
}

.sow-item-card__title {
  margin: 0;
  font-size: 1rem;
  font-weight: 700;
  line-height: 1.35;
  color: var(--st-text-primary, #1c1917);
}

.sow-item-card__meta {
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
}

.sow-item-card__topic {
  display: inline-flex;
  align-self: flex-start;
  padding: 0.15rem 0.5rem;
  border-radius: var(--st-radius-sm, 6px);
  background: var(--st-bg-tertiary, #ebe4d8);
  color: var(--st-text-secondary, #57534e);
  font-size: 0.75rem;
  font-weight: 600;
  letter-spacing: 0.03em;
  text-transform: uppercase;
}

.sow-item-card__description {
  margin: 0;
  font-size: 0.875rem;
  line-height: 1.55;
  color: var(--st-text-secondary, #57534e);
}

.sow-item-card__stats {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem 1rem;
}

.sow-item-card__stat {
  display: inline-flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 0.35rem;
  font-size: 0.8125rem;
  color: var(--st-text-secondary, #57534e);
}

.sow-item-card__stat-label {
  font-weight: 600;
  color: var(--st-text-tertiary, #78716c);
}

.sow-item-card__resources {
  margin-top: 0.1rem;
}

.sow-item-card__actions {
  align-self: start;
  padding-top: 0.05rem;
}

.sow-item-card__actions .cl-order-actions__form {
  margin: 0;
  display: inline-flex;
}

.cl-icon-btn--duplicate:hover {
  background: #eef2ff;
  color: #4f46e5;
  border-color: #c7d2fe;
}

.cl-icon-btn--skip:hover {
  background: #fff7ed;
  color: #c2410c;
  border-color: #fed7aa;
}

.scheme-item-form .lesson-record-form__rich-text-field {
  max-width: none;
}

.scheme-item-form .lesson-record-form__rich-text .ql-container.ql-snow,
.scheme-item-form .lesson-record-form__rich-text .ql-editor {
  min-height: 8.5rem;
}

.sow-badge {
  display: inline-flex;
  padding: 0.18rem 0.55rem;
  border-radius: 999px;
  font-size: 0.75rem;
  font-weight: 600;
}

.sow-badge--neutral {
  background: var(--si-surface-muted);
  color: var(--si-text-muted);
}

.sow-badge--progress {
  background: #e8f1ff;
  color: #2459a6;
}

.sow-badge--success {
  background: #e7f6ed;
  color: #1f6b3f;
}

.sow-badge--muted {
  background: #f2f2f2;
  color: #666;
}

.sow-empty-state--featured {
  border: 1px dashed var(--si-border);
  border-radius: var(--si-radius-md);
  padding: 2rem 1.25rem;
  text-align: center;
}

.sow-empty-state--featured .cp-tab-empty {
  margin: 0 0 0.5rem;
}

.sow-empty-state--featured .sy-hint {
  margin: 0 0 1rem;
}

@media (max-width: 640px) {
  .course-curriculum-tab__header {
    flex-direction: column;
    align-items: stretch;
  }

  .course-curriculum-tab__add {
    width: 100%;
    justify-content: center;
  }

  .course-curriculum-topic {
    grid-template-columns: auto minmax(0, 1fr);
    gap: 0.75rem;
  }

  .course-curriculum-topic__actions {
    grid-column: 1 / -1;
    justify-content: flex-end;
    padding-top: 0;
    border-top: 1px solid var(--st-border-tertiary, #e8e4dc);
    margin-top: 0.15rem;
    padding-top: 0.65rem;
  }

  .sow-scheme-tab__header {
    flex-direction: column;
    align-items: stretch;
  }

  .sow-scheme-tab__header-actions {
    width: 100%;
    flex-direction: column;
    align-items: stretch;
  }

  .sow-view-toggle {
    width: 100%;
  }

  .sow-view-toggle__btn {
    flex: 1 1 50%;
    min-height: 2.75rem;
  }

  .sow-scheme-tab__header-actions .students-index__btn {
    width: 100%;
    justify-content: center;
    min-height: 2.75rem;
  }

  .sow-item-card,
  .sow-item-card--reorderable {
    grid-template-columns: minmax(0, 1fr);
    grid-template-rows: auto auto;
  }

  .sow-item-card__handle {
    grid-row: 1;
    grid-column: 1;
    justify-self: start;
  }

  .sow-item-card__body {
    grid-column: 1 / -1;
  }

  .sow-item-card--reorderable .sow-item-card__body {
    grid-column: 1 / -1;
  }

  .sow-item-card__actions {
    grid-column: 1 / -1;
    justify-content: flex-end;
    padding-top: 0.35rem;
    border-top: 1px solid var(--st-border-tertiary, #e8e4dc);
    margin-top: 0.15rem;
    padding-top: 0.65rem;
  }

  .sow-item-card--reorderable .sow-item-card__handle {
    display: none;
  }
}

@media (max-width: 900px) {
  .sow-scheme-progress-tab__grid,
  .sow-offerings-grid,
  .sow-classes-grid {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 640px) {
  .sow-group-progress-card__header {
    flex-direction: column;
    align-items: stretch;
  }

  .sow-group-progress-card__action {
    width: 100%;
    min-height: 2.75rem;
    text-align: center;
  }

  .sow-group-progress-card__stats .gs-stat-row {
    flex-direction: column;
    align-items: flex-start;
    gap: 0.2rem;
  }

  .sow-group-progress-card__current-item,
  .sow-group-progress-card__stats .gs-stat-value {
    text-align: left;
  }

  .sow-class-card__header {
    flex-direction: column;
    align-items: stretch;
  }

  .sow-class-card__action {
    width: 100%;
    min-height: 2.75rem;
    text-align: center;
  }

  .sow-class-card__stats .gs-stat-row {
    flex-direction: column;
    align-items: flex-start;
    gap: 0.2rem;
  }

  .sow-class-card__stats .gs-stat-value {
    text-align: left;
  }
}
.task-form-page,
.task-show-page {
  max-width: 74rem;
  margin-inline: auto;
}

.tasks-index__tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 0.45rem;
  margin-bottom: 1rem;
}

.tasks-index__tab {
  display: inline-flex;
  align-items: center;
  min-height: 2.35rem;
  padding: 0.35rem 0.85rem;
  border: 1px solid var(--color-border, #e8e4dc);
  border-radius: 999px;
  background: #fbfaf8;
  color: var(--color-text-muted, #64748b);
  font-size: 0.82rem;
  font-weight: 650;
  text-decoration: none;
}

.tasks-index__tab:hover {
  background: #f3f1ed;
  color: var(--color-text, #2d2926);
}

.tasks-index__tab--active {
  border-color: #bdd5c5;
  background: #edf5f0;
  color: #28563f;
}

.tasks-index__table {
  min-width: 54rem;
}

.tasks-index__assignees {
  display: block;
  max-width: 22rem;
  overflow: hidden;
  color: var(--color-text-muted, #64748b);
  text-overflow: ellipsis;
  white-space: nowrap;
}

.tasks-index__assignee-link {
  color: var(--st-nav-accent, #2d6a4f);
  font-weight: 600;
  text-decoration: none;
}

.tasks-index__assignee-link:hover {
  text-decoration: underline;
}

.tasks-index__assignee-more {
  color: var(--color-text-muted, #64748b);
  font-weight: 650;
}

.tasks-index__due {
  white-space: nowrap;
}

.tasks-index__type {
  display: inline-flex;
  align-items: center;
  min-height: 1.55rem;
  padding: 0.1rem 0.55rem;
  border-radius: 999px;
  background: #eef4ef;
  color: #315f45;
  font-size: 0.74rem;
  font-weight: 700;
}

.tasks-index__status,
.tasks-index__priority {
  display: inline-flex;
  align-items: center;
  min-height: 1.55rem;
  padding: 0.1rem 0.55rem;
  border-radius: 999px;
  font-size: 0.74rem;
  font-weight: 700;
  line-height: 1.25;
  white-space: nowrap;
}

.tasks-index__status--open,
.tasks-index__status--in_progress,
.tasks-index__status--upcoming {
  background: #eef4fb;
  color: #315f88;
}

.tasks-index__status--due_today {
  background: #fff8e8;
  color: #8b5c14;
}

.tasks-index__status--overdue {
  background: #fff0ed;
  color: #a13f32;
}

.tasks-index__status--completed {
  background: #eaf5ed;
  color: #2f6846;
}

.tasks-index__status--cancelled {
  background: #f1f1f0;
  color: #66625c;
}

.tasks-index__priority {
  background: #f3f1ed;
  color: #625d55;
}

.tasks-index__priority--high,
.tasks-index__priority--urgent {
  background: #fff4df;
  color: #8b5c14;
}

.tasks-index__priority--urgent {
  background: #fff0ed;
  color: #a13f32;
}

.task-show__body {
  padding: 1.75rem 2rem 2rem;
}

.task-show__section + .task-show__section {
  margin-top: 1.5rem;
  padding-top: 1.5rem;
  border-top: 1px solid var(--color-border, #e8e4dc);
}

.task-show__heading {
  margin: 0 0 0.75rem;
  font-size: 1rem;
}

.task-show__section-head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 1rem;
  margin-bottom: 0.85rem;
}

.task-show__stats {
  margin: 0;
  color: var(--color-text-muted, #64748b);
  font-size: 0.84rem;
}

.task-show__meta-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(12rem, 1fr));
  gap: 0.85rem 1.25rem;
}

.task-show__meta-label {
  display: block;
  color: var(--color-text-muted, #64748b);
  font-size: 0.74rem;
  font-weight: 700;
  letter-spacing: 0.03em;
  text-transform: uppercase;
}

.task-show__meta-value {
  display: block;
  margin-top: 0.2rem;
  color: var(--color-text, #2d2926);
  font-size: 0.92rem;
}

.task-show__prose {
  color: var(--color-text, #2d2926);
  line-height: 1.55;
}

.task-show__assignment-list {
  display: grid;
  gap: 0.65rem;
  margin: 0;
  padding: 0;
  list-style: none;
}

.task-show__assignment-item {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  padding: 0.75rem 0.85rem;
  border: 1px solid var(--color-border, #e8e4dc);
  border-radius: 0.65rem;
  background: #fbfaf8;
}

.task-show__assignment-label {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 0.45rem;
}

.task-show__assignments-table {
  min-width: 36rem;
}

.task-show__notes {
  margin-top: 2rem;
  padding-top: 1.5rem;
  border-top: 1px solid var(--color-border, #e8e4dc);
}

.task-show-card textarea.cp-notes__textarea {
  box-sizing: border-box;
  width: 100%;
  padding: 0.55rem 0.7rem;
  border: 0.5px solid #ddd8cf;
  border-radius: 8px;
  outline: none;
  background: #fff;
  color: var(--cs-text, #2d2926);
  font-family: inherit;
  font-size: 0.875rem;
  resize: vertical;
  transition: border-color 0.15s, box-shadow 0.15s;
}

.task-show-card textarea.cp-notes__textarea:focus {
  border-color: var(--cs-accent, #5c5346);
  box-shadow: 0 0 0 2px rgba(92, 83, 70, 0.12);
}

.profile-tasks__summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  margin-bottom: 1rem;
  color: var(--color-text-muted, #64748b);
  font-size: 0.84rem;
}

.profile-tasks__summary > span {
  padding: 0.25rem 0.65rem;
  border-radius: 999px;
  background: #eef4ef;
  color: #315f45;
  font-weight: 700;
}

.profile-tasks__actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: flex-end;
  gap: 0.65rem;
}

.profile-tasks__actions .students-index__btn {
  min-height: 2.5rem;
}

.profile-tasks__table {
  width: 100%;
  min-width: 42rem;
  table-layout: fixed;
}

.profile-tasks .index-list-table-wrap {
  max-width: 100%;
  overflow-x: auto;
  border: 1px solid var(--color-border, #e8e4dc);
  border-radius: 0.75rem;
}

.profile-tasks__table th,
.profile-tasks__table td {
  padding-right: 0.55rem;
  padding-left: 0.55rem;
  font-size: 0.82rem;
}

.profile-tasks__table th {
  text-align: left;
}

.profile-tasks__table th:last-child {
  text-align: right;
}

.profile-tasks__table th:nth-child(1) { width: 31%; }
.profile-tasks__table th:nth-child(2) { width: 20%; }
.profile-tasks__table th:nth-child(3) { width: 15%; }
.profile-tasks__table th:nth-child(4) { width: 18%; }
.profile-tasks__table th:nth-child(5) { width: 16%; }

.profile-tasks__table td:first-child {
  overflow-wrap: anywhere;
}

.profile-tasks__table .contacts-index__actions {
  justify-content: flex-end;
  flex-wrap: nowrap;
  gap: 0.25rem;
}

.task-form-card {
  overflow: hidden;
}

.task-form {
  padding: 0;
}

.task-form__error {
  margin: 1.25rem 2rem 0;
}

.task-form__section {
  padding: 1.75rem 2rem;
}

.task-form__section + .task-form__section {
  border-top: 1px solid var(--color-border, #e8e4dc);
}

.task-form__section-heading {
  display: flex;
  align-items: flex-start;
  gap: 0.8rem;
  margin-bottom: 1.35rem;
}

.task-form__section-number {
  display: grid;
  place-items: center;
  width: 1.9rem;
  height: 1.9rem;
  flex: 0 0 auto;
  border-radius: 999px;
  background: #edf5f0;
  color: var(--st-nav-accent, #2d6a4f);
  font-size: 0.78rem;
  font-weight: 750;
}

.task-form__section-title {
  margin: 0;
  color: var(--color-text, #2d2926);
  font-size: 1rem;
  line-height: 1.4;
}

.task-form__section-lead {
  margin: 0.2rem 0 0;
  color: var(--color-text-muted, #64748b);
  font-size: 0.84rem;
}

.task-form__fields {
  display: grid;
  grid-template-columns: minmax(0, 2fr) minmax(12rem, 1fr);
  gap: 1.1rem 1.25rem;
}

.task-form__field--full {
  grid-column: 1 / -1;
}

.task-form .groups-form__textarea {
  width: 100%;
  min-height: 8.5rem;
  resize: vertical;
}

.task-form .lesson-record-form__rich-text-field {
  max-width: none;
}

.task-form .lesson-record-form__rich-text .ql-container.ql-snow,
.task-form .lesson-record-form__rich-text .ql-editor {
  min-height: 9rem;
}

.task-show__prose {
  line-height: 1.6;
}

.task-show__prose > :first-child { margin-top: 0; }
.task-show__prose > :last-child { margin-bottom: 0; }

.task-form__assignee-groups {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1rem;
}

.task-form__assignee-group {
  min-width: 0;
  border: 1px solid var(--color-border, #e8e4dc);
  border-radius: 0.75rem;
  background: #fbfaf8;
  overflow: hidden;
}

.task-form__assignee-head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 0.75rem;
  padding: 0.8rem 1rem;
  border-bottom: 1px solid var(--color-border, #e8e4dc);
  background: #f6f3ee;
}

.task-form__assignee-title {
  margin: 0;
  font-size: 0.86rem;
  font-weight: 700;
}

.task-form__assignee-count {
  color: var(--color-text-muted, #64748b);
  font-size: 0.75rem;
}

.task-form__assignee-search {
  position: relative;
  padding: 0.65rem 0.65rem 0.25rem;
}

.task-form__assignee-search-icon {
  position: absolute;
  top: 50%;
  left: 1.25rem;
  display: grid;
  place-items: center;
  color: var(--color-text-muted, #64748b);
  pointer-events: none;
  transform: translateY(-35%);
}

.task-form__assignee-search-input {
  box-sizing: border-box;
  width: 100%;
  min-height: 2.25rem;
  padding: 0.4rem 0.65rem 0.4rem 2rem;
  border: 1px solid var(--color-border, #e8e4dc);
  border-radius: 0.5rem;
  outline: none;
  background: #fff;
  color: var(--color-text, #2d2926);
  font: inherit;
  font-size: 0.8rem;
}

.task-form__assignee-search-input:focus {
  border-color: var(--st-nav-accent, #2d6a4f);
  box-shadow: 0 0 0 2px rgba(45, 106, 79, 0.1);
}

.task-form__assignee-no-results {
  margin: 0;
  padding: 1rem 0.65rem;
  color: var(--color-text-muted, #64748b);
  font-size: 0.82rem;
  text-align: center;
}

.task-form__assignee-list {
  display: grid;
  align-content: start;
  max-height: 18rem;
  overflow-y: auto;
  padding: 0.4rem;
}

.task-form__assignee-option {
  display: flex;
  align-items: center;
  gap: 0.65rem;
  min-height: 2.6rem;
  padding: 0.5rem 0.65rem;
  border-radius: 0.5rem;
  cursor: pointer;
  font-size: 0.86rem;
}

.task-form__assignee-option[hidden] {
  display: none;
}

.task-form__assignee-option:hover {
  background: #f0eee9;
}

.task-form__assignee-option:has(input:checked) {
  background: #eaf3ed;
  color: #28563f;
  font-weight: 650;
}

.task-form__assignee-option input {
  width: 1rem;
  height: 1rem;
  flex: 0 0 auto;
  accent-color: var(--st-nav-accent, #2d6a4f);
}

.task-form__empty {
  margin: 0;
  padding: 1rem;
  color: var(--color-text-muted, #64748b);
  font-size: 0.84rem;
}

.task-form__footer {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 0.7rem;
  padding: 1.1rem 2rem;
  border-top: 1px solid var(--color-border, #e8e4dc);
  background: #fbfaf8;
}

.is-hidden {
  display: none !important;
}

@media (max-width: 760px) {
  .task-show__body { padding: 1.25rem; }
  .task-form__section { padding: 1.25rem; }
  .task-form__fields { grid-template-columns: 1fr; }
  .task-form__footer { align-items: stretch; flex-direction: column-reverse; padding: 1rem 1.25rem; }
  .task-form__footer .students-index__btn { justify-content: center; width: 100%; }
  .task-show__assignment-item { align-items: stretch; flex-direction: column; }
}

@media (max-width: 560px) {
  .profile-tasks__summary {
    align-items: stretch;
    flex-direction: column;
  }

  .profile-tasks__actions {
    justify-content: flex-start;
  }

  .profile-tasks .index-list-table-wrap {
    overflow: visible;
    border: 0;
  }

  .task-form__assignee-groups { grid-template-columns: 1fr; }

  .profile-tasks__table,
  .profile-tasks__table tbody,
  .profile-tasks__table tr,
  .profile-tasks__table td {
    display: block;
    width: 100%;
    min-width: 0;
  }

  .profile-tasks__table thead {
    display: none;
  }

  .profile-tasks__table tbody {
    display: grid;
    gap: 0.75rem;
  }

  .profile-tasks__table tr {
    padding: 0.45rem 0.8rem;
    border: 1px solid var(--color-border, #e8e4dc);
    border-radius: 0.7rem;
    background: #fff;
  }

  .profile-tasks__table td {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 0.45rem 0;
    border: 0;
    text-align: right;
  }

  .profile-tasks__table td::before {
    flex: 0 0 auto;
    color: var(--color-text-muted, #64748b);
    content: attr(data-label);
    font-size: 0.75rem;
    font-weight: 650;
    text-align: left;
  }

  .profile-tasks__table td:first-child {
    padding-bottom: 0.7rem;
    border-bottom: 1px solid var(--color-border, #e8e4dc);
    font-size: 0.9rem;
  }
}
.communication-index__header {
  margin-bottom: 1.5rem;
}

.communication-index__header .students-index__btn svg {
  flex: 0 0 auto;
}

.communication-index__tabs {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 0.45rem;
  margin-bottom: 1rem;
}

.communication-index__tab {
  display: inline-flex;
  align-items: center;
  gap: 0.42rem;
  min-height: 2.35rem;
  flex: 0 0 auto;
  padding: 0.35rem 0.85rem;
  border: 1px solid var(--color-border, #e8e4dc);
  border-radius: 999px;
  background: #fbfaf8;
  color: var(--color-text-muted, #64748b);
  font-size: 0.82rem;
  font-weight: 650;
  text-decoration: none;
  transition: background 120ms ease, border-color 120ms ease, color 120ms ease;
}

.communication-index__tab:hover {
  background: #f3f1ed;
  color: var(--color-text, #2d2926);
}

.communication-index__tab--active {
  border-color: #bdd5c5;
  background: #edf5f0;
  color: #28563f;
}

.communication-index__tab-icon {
  display: grid;
  place-items: center;
  width: 1rem;
  height: 1rem;
}

.communication-index__tab-icon svg {
  width: 100%;
  height: 100%;
  fill: none;
  stroke: currentColor;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 1.8;
}

.communication-index__table-wrap {
  border: 1px solid var(--color-border, #e8e4dc);
  border-radius: 0.75rem;
  background: #fff;
  box-shadow: 0 1px 2px rgba(28, 25, 23, 0.04);
}

.communication-index__table {
  min-width: 46rem;
}

.communication-index__table th:first-child {
  width: 42%;
}

.communication-index__subject {
  display: inline-block;
  max-width: 31rem;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.communication-index__announcement {
  display: inline-flex;
  align-items: center;
  min-height: 1.4rem;
  margin-right: 0.45rem;
  padding: 0.08rem 0.45rem;
  border-radius: 999px;
  background: #fff3cd;
  color: #795b12;
  font-size: 0.68rem;
  font-weight: 750;
  letter-spacing: 0.02em;
  text-transform: uppercase;
  vertical-align: top;
}

.communication-index__latest {
  color: var(--color-text-muted, #64748b);
  white-space: nowrap;
}

.communication-index__classification,
.communication-index__status {
  display: inline-flex;
  align-items: center;
  min-height: 1.55rem;
  padding: 0.12rem 0.55rem;
  border-radius: 999px;
  font-size: 0.74rem;
  font-weight: 700;
  line-height: 1.25;
  white-space: nowrap;
}

.communication-index__classification {
  background: #f3f1ed;
  color: #625d55;
}

.communication-index__status {
  background: #eef4fb;
  color: #315f88;
}

.communication-index__status--sent,
.communication-index__status--delivered {
  background: #eaf5ed;
  color: #2f6846;
}

.communication-index__status--draft {
  background: #f3f1ed;
  color: #625d55;
}

.communication-index__status--scheduled {
  background: #fff8e8;
  color: #8b5c14;
}

.communication-index__status--failed {
  background: #fff0ed;
  color: #a13f32;
}

.communication-index__pagination {
  display: flex;
  justify-content: center;
  margin-top: 1rem;
}

.communication-index__empty {
  display: flex;
  align-items: center;
  flex-direction: column;
  justify-content: center;
  min-height: 18rem;
  padding: 2.5rem 1.5rem;
  border: 1px solid var(--color-border, #e8e4dc);
  border-radius: 0.75rem;
  background: #fff;
  text-align: center;
  box-shadow: 0 1px 2px rgba(28, 25, 23, 0.04);
}

.communication-index__empty-icon {
  display: grid;
  place-items: center;
  width: 3.5rem;
  height: 3.5rem;
  margin-bottom: 1rem;
  border-radius: 999px;
  background: #edf5f0;
  color: var(--st-nav-accent, #2d6a4f);
}

.communication-index__empty h2 {
  margin: 0;
  color: var(--color-text, #2d2926);
  font-size: 1rem;
}

.communication-index__empty p {
  margin: 0.4rem 0 1.15rem;
  color: var(--color-text-muted, #64748b);
  font-size: 0.84rem;
}

.communication-log__empty {
  min-height: 12rem;
  margin-top: 1rem;
}

.communication-log__empty h2 + .students-index__btn {
  margin-top: 1.15rem;
}

.communication-log__header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 1rem;
  margin-bottom: 1rem;
}

.communication-log__header .cp-tab-lead {
  margin-bottom: 0;
}

.communication-log__compose {
  flex: 0 0 auto;
}

.communication-log__filters {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 1rem;
  margin-bottom: 1rem;
  padding: 0.9rem 1rem;
  border: 1px solid var(--color-border, #e8e4dc);
  border-radius: 0.75rem;
  background: #fbfaf8;
}

.communication-log__filter-fields,
.communication-log__filter-actions {
  display: flex;
  align-items: flex-end;
  gap: 0.7rem;
}

.communication-log__filter-field {
  display: flex;
  flex-direction: column;
  gap: 0.3rem;
}

.communication-log__filter-field label {
  color: var(--color-text-muted, #64748b);
  font-size: 0.75rem;
  font-weight: 700;
}

.communication-log__filter-field .students-index__select {
  min-width: 10.5rem;
}

.communication-log__filter-actions .students-index__btn {
  min-height: 2.35rem;
}

.communication-log__table-wrap {
  max-width: 100%;
  overflow-x: auto;
  border: 1px solid var(--color-border, #e8e4dc);
  border-radius: 0.75rem;
  background: #fff;
  box-shadow: 0 1px 2px rgba(28, 25, 23, 0.04);
}

.communication-log__table {
  width: 100%;
  min-width: 58rem;
}

.communication-log__table th,
.communication-log__table td {
  padding-right: 0.7rem;
  padding-left: 0.7rem;
  font-size: 0.8rem;
  vertical-align: middle;
}

.communication-log__table th {
  text-align: left;
}

.communication-log__table th:first-child {
  width: 28%;
}

.communication-log__subject {
  display: inline-block;
  max-width: 19rem;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.communication-log__sent,
.communication-log__recipients {
  color: var(--color-text-muted, #64748b);
  white-space: nowrap;
}

.communication-compose__header {
  align-items: flex-start;
}

.communication-compose-card {
  overflow: hidden;
}

.communication-compose {
  padding: 0;
}

.communication-compose__notice,
.communication-compose__preview {
  margin: 1.25rem 2rem 0;
}

.communication-compose__preview {
  display: flex;
  align-items: flex-start;
  gap: 0.75rem;
  padding: 0.9rem 1rem;
  border: 1px solid #bdd5c5;
  border-radius: 0.7rem;
  background: #edf5f0;
  color: #28563f;
}

.communication-compose__preview-icon {
  display: grid;
  place-items: center;
  flex: 0 0 auto;
  width: 1.75rem;
  height: 1.75rem;
}

.communication-compose__preview strong {
  display: block;
  font-size: 0.84rem;
}

.communication-compose__preview p {
  margin: 0.15rem 0 0;
  font-size: 0.82rem;
  line-height: 1.5;
}

.communication-compose__preview > div {
  min-width: 0;
  flex: 1;
}

.communication-compose__preview-groups {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0.55rem;
  margin-top: 0.8rem;
}

.communication-compose__preview-group {
  min-width: 0;
  overflow: hidden;
  border: 1px solid rgba(40, 86, 63, 0.18);
  border-radius: 0.55rem;
  background: rgba(255, 255, 255, 0.58);
}

.communication-compose__preview-group summary {
  padding: 0.55rem 0.65rem;
  cursor: pointer;
  font-size: 0.78rem;
  font-weight: 700;
}

.communication-compose__preview-group ul {
  max-height: 10rem;
  margin: 0;
  overflow-y: auto;
  padding: 0 0.65rem 0.6rem 1.8rem;
  font-size: 0.78rem;
  line-height: 1.55;
}

.communication-compose__section {
  padding: 1.75rem 2rem;
}

.communication-compose__section + .communication-compose__section {
  border-top: 1px solid var(--color-border, #e8e4dc);
}

.communication-compose__section-heading {
  display: flex;
  align-items: flex-start;
  gap: 0.8rem;
  margin-bottom: 1.35rem;
}

.communication-compose__section-number {
  display: grid;
  place-items: center;
  width: 1.9rem;
  height: 1.9rem;
  flex: 0 0 auto;
  border-radius: 999px;
  background: #edf5f0;
  color: var(--st-nav-accent, #2d6a4f);
  font-size: 0.78rem;
  font-weight: 750;
}

.communication-compose__section-title {
  margin: 0;
  color: var(--color-text, #2d2926);
  font-size: 1rem;
  line-height: 1.4;
}

.communication-compose__section-lead {
  margin: 0.2rem 0 0;
  color: var(--color-text-muted, #64748b);
  font-size: 0.84rem;
}

.communication-compose__message {
  min-height: 11rem;
}

.communication-compose__field--last {
  margin-bottom: 0;
}

.communication-compose__recipient-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1rem;
}

.communication-compose__focused-recipient {
  display: flex;
  align-items: center;
  gap: 0.9rem;
  padding: 1rem;
  border: 1px solid var(--color-border, #e8e4dc);
  border-radius: 0.75rem;
  background: #fbfaf8;
}

.communication-compose__focused-recipient-icon {
  display: grid;
  place-items: center;
  width: 2.75rem;
  height: 2.75rem;
  flex: 0 0 auto;
  border-radius: 999px;
  background: #eaf3ed;
  color: #28563f;
  font-size: 0.9rem;
  font-weight: 750;
}

.communication-compose__focused-recipient-copy {
  display: grid;
  min-width: 0;
  flex: 1;
  gap: 0.12rem;
}

.communication-compose__focused-recipient-copy span,
.communication-compose__focused-recipient-copy p {
  color: var(--color-text-muted, #64748b);
  font-size: 0.8rem;
}

.communication-compose__focused-recipient-copy strong {
  overflow-wrap: anywhere;
  color: var(--color-text, #2d2926);
  font-size: 0.95rem;
}

.communication-compose__focused-recipient-copy p {
  margin: 0.2rem 0 0;
  line-height: 1.45;
}

.communication-compose__picker,
.communication-compose__guardian-picker,
.communication-compose__inferred-teacher-picker {
  min-width: 0;
  margin: 0;
  padding: 0;
  overflow: hidden;
  border: 1px solid var(--color-border, #e8e4dc);
  border-radius: 0.75rem;
  background: #fbfaf8;
}

.communication-compose__picker-heading,
.communication-compose__guardian-picker legend,
.communication-compose__inferred-teacher-picker legend {
  box-sizing: border-box;
  width: 100%;
  padding: 0.75rem 0.9rem;
  border: 0;
  border-bottom: 1px solid var(--color-border, #e8e4dc);
  background: #f6f3ee;
  color: var(--color-text, #2d2926);
  font-size: 0.82rem;
  font-weight: 700;
}

.communication-compose__picker-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
}

.communication-compose__picker-heading label {
  margin: 0;
}

.communication-compose__picker-heading span {
  color: var(--color-text-muted, #64748b);
  font-size: 0.74rem;
  font-weight: 650;
}

.communication-compose__picker-toolbar {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.55rem;
  border-bottom: 1px solid var(--color-border, #e8e4dc);
  background: #fff;
}

.communication-compose__picker-search {
  position: relative;
  min-width: 0;
  flex: 1;
}

.communication-compose__picker-search-icon {
  position: absolute;
  top: 50%;
  left: 0.6rem;
  display: grid;
  place-items: center;
  color: var(--color-text-muted, #64748b);
  pointer-events: none;
  transform: translateY(-50%);
}

.communication-compose__picker-search-input {
  box-sizing: border-box;
  width: 100%;
  min-height: 2.2rem;
  padding: 0.4rem 0.6rem 0.4rem 1.9rem;
  border: 1px solid var(--color-border, #e8e4dc);
  border-radius: 0.48rem;
  outline: none;
  background: #fbfaf8;
  color: var(--color-text, #2d2926);
  font: inherit;
  font-size: 0.78rem;
}

.communication-compose__picker-search-input:focus {
  border-color: var(--st-nav-accent, #2d6a4f);
  box-shadow: 0 0 0 2px rgba(45, 106, 79, 0.1);
}

.communication-compose__picker-tools {
  display: flex;
  align-items: center;
  flex: 0 0 auto;
  gap: 0.25rem;
}

.communication-compose__picker-tool {
  min-height: 2.2rem;
  padding: 0.35rem 0.55rem;
  border: 1px solid var(--color-border, #e8e4dc);
  border-radius: 0.45rem;
  background: #fff;
  color: var(--color-text-muted, #64748b);
  cursor: pointer;
  font: inherit;
  font-size: 0.72rem;
  font-weight: 650;
  white-space: nowrap;
}

.communication-compose__picker-tool:hover {
  border-color: #bdd5c5;
  background: #edf5f0;
  color: #28563f;
}

.communication-compose__multi-select {
  display: block;
  box-sizing: border-box;
  width: 100%;
  min-height: 10rem;
  padding: 0.4rem;
  border: 0;
  outline: none;
  background: #fff;
  color: var(--color-text, #2d2926);
  font: inherit;
  font-size: 0.84rem;
}

.communication-compose__multi-select option {
  padding: 0.55rem 0.65rem;
  border-radius: 0.45rem;
}

.communication-compose__multi-select option:checked {
  background: linear-gradient(#eaf3ed, #eaf3ed);
  color: #28563f;
  font-weight: 650;
}

.communication-compose__multi-select:focus {
  box-shadow: inset 0 0 0 2px rgba(45, 106, 79, 0.18);
}

.communication-compose__picker-empty {
  margin: 0;
  padding: 0.8rem;
  border-top: 1px solid var(--color-border, #e8e4dc);
  color: var(--color-text-muted, #64748b);
  font-size: 0.78rem;
  text-align: center;
}

.communication-compose__guardian-picker legend,
.communication-compose__inferred-teacher-picker legend {
  float: left;
}

.communication-compose__guardian-options,
.communication-compose__inferred-teacher-options {
  display: grid;
  clear: both;
  gap: 0.35rem;
  padding: 0.55rem;
}

.communication-compose__guardian-option,
.communication-compose__inferred-teacher-option {
  display: flex;
  align-items: center;
  gap: 0.65rem;
  min-height: 2.55rem;
  padding: 0.45rem 0.65rem;
  border-radius: 0.5rem;
  cursor: pointer;
  color: var(--color-text, #2d2926);
  font-size: 0.84rem;
}

.communication-compose__guardian-option:hover,
.communication-compose__inferred-teacher-option:hover {
  background: #f0eee9;
}

.communication-compose__guardian-option:has(input:checked),
.communication-compose__inferred-teacher-option:has(input:checked) {
  background: #eaf3ed;
  color: #28563f;
  font-weight: 650;
}

.communication-compose__guardian-option input,
.communication-compose__inferred-teacher-option input {
  width: 1rem;
  height: 1rem;
  flex: 0 0 auto;
  accent-color: var(--st-nav-accent, #2d6a4f);
}

.communication-compose__inferred-teacher-option span {
  display: grid;
  gap: 0.2rem;
}

.communication-compose__inferred-teacher-option small {
  color: var(--color-text-muted, #64748b);
  font-size: 0.76rem;
  font-weight: 400;
  line-height: 1.4;
}

.communication-compose__recipient-hint {
  display: flex;
  align-items: flex-start;
  gap: 0.55rem;
  margin-top: 1rem;
  padding: 0.7rem 0.8rem;
  border: 1px solid var(--color-border, #e8e4dc);
  border-radius: 0.6rem;
  background: #fbfaf8;
  color: var(--color-text-muted, #64748b);
}

.communication-compose__recipient-hint > span {
  display: grid;
  place-items: center;
  flex: 0 0 auto;
}

.communication-compose__recipient-hint p {
  margin: 0;
  font-size: 0.8rem;
  line-height: 1.5;
}

.communication-compose__delivery-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1rem 1.25rem;
}

.communication-compose__announcement-note {
  display: flex;
  align-items: flex-start;
  gap: 0.75rem;
  margin-bottom: 1rem;
  padding: 0.9rem 1rem;
  border: 1px solid #e8d89e;
  border-radius: 0.7rem;
  background: #fff9e8;
  color: #684f13;
}

.communication-compose__announcement-note > span {
  display: grid;
  place-items: center;
  flex: 0 0 auto;
  width: 1.75rem;
  height: 1.75rem;
}

.communication-compose__announcement-note strong {
  display: block;
  font-size: 0.84rem;
}

.communication-compose__announcement-note p {
  margin: 0.2rem 0 0;
  font-size: 0.8rem;
  line-height: 1.5;
}

.communication-compose__file-field {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  min-height: 3.5rem;
  padding: 0.65rem 0.8rem;
  border: 1px dashed var(--color-border, #d8d2c8);
  border-radius: 0.65rem;
  background: #fbfaf8;
}

.communication-compose__file-icon {
  display: grid;
  place-items: center;
  flex: 0 0 auto;
  color: var(--color-text-muted, #64748b);
}

.communication-compose__file-field input[type="file"] {
  max-width: 100%;
  color: var(--color-text-muted, #64748b);
  font-size: 0.82rem;
}

.communication-compose__file-field input[type="file"]::file-selector-button {
  margin-right: 0.75rem;
  padding: 0.45rem 0.7rem;
  border: 1px solid var(--color-border, #d8d2c8);
  border-radius: 0.45rem;
  background: #fff;
  color: var(--color-text, #2d2926);
  cursor: pointer;
  font: inherit;
  font-weight: 650;
}

.communication-compose__footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  padding: 1.1rem 2rem;
  border-top: 1px solid var(--color-border, #e8e4dc);
  background: #fbfaf8;
}

.communication-compose__actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  flex-wrap: wrap;
  gap: 0.65rem;
}

.communication-back-link {
  display: inline-flex;
  align-items: center;
  gap: 0.3rem;
  min-height: 2.75rem;
  margin-bottom: 0.35rem;
  color: var(--color-text-muted, #64748b);
  font-size: 0.82rem;
  font-weight: 650;
  text-decoration: none;
}

.communication-back-link:hover {
  color: var(--st-nav-accent, #2d6a4f);
}

.communication-show__heading {
  min-width: 0;
}

.communication-show__header-actions {
  align-items: center;
}

.communication-show__action-form {
  margin: 0;
}

.communication-thread {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}

.communication-message,
.communication-reply {
  overflow: hidden;
  border: 1px solid var(--color-border, #e8e4dc);
  border-radius: 0.75rem;
  background: #fff;
  box-shadow: 0 1px 2px rgba(28, 25, 23, 0.04);
}

.communication-message__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  padding: 0.9rem 1rem;
  border-bottom: 1px solid var(--color-border, #e8e4dc);
  background: #fbfaf8;
}

.communication-message__sender {
  display: flex;
  align-items: center;
  min-width: 0;
  gap: 0.7rem;
}

.communication-message__sender > div {
  display: flex;
  min-width: 0;
  flex-direction: column;
  gap: 0.1rem;
}

.communication-message__sender strong {
  overflow: hidden;
  color: var(--color-text, #2d2926);
  font-size: 0.88rem;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.communication-message__sender time {
  color: var(--color-text-muted, #64748b);
  font-size: 0.75rem;
}

.communication-message__avatar {
  display: grid;
  place-items: center;
  width: 2rem;
  height: 2rem;
  flex: 0 0 auto;
  border-radius: 999px;
  background: #edf5f0;
  color: #28563f;
  font-size: 0.78rem;
  font-weight: 750;
}

.communication-message__badges {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  flex-wrap: wrap;
  gap: 0.4rem;
}

.communication-message__body {
  padding: 1.25rem;
  color: var(--color-text, #2d2926);
  font-size: 0.9rem;
  line-height: 1.65;
  overflow-wrap: anywhere;
}

.communication-message__body > :first-child {
  margin-top: 0;
}

.communication-message__body > :last-child {
  margin-bottom: 0;
}

.communication-message__redacted {
  padding: 0.75rem 0.85rem;
  border: 1px solid #f1d5cf;
  border-radius: 0.55rem;
  background: #fff5f2;
  color: #8c3d32;
  font-style: italic;
}

.communication-message__footer {
  display: flex;
  flex-direction: column;
  gap: 0.8rem;
  padding: 0.9rem 1rem;
  border-top: 1px solid var(--color-border, #e8e4dc);
  background: #fbfaf8;
  color: var(--color-text-muted, #64748b);
  font-size: 0.78rem;
}

.communication-message__attachments,
.communication-message__delivery {
  display: flex;
  align-items: flex-start;
  gap: 0.6rem;
}

.communication-message__attachments strong,
.communication-message__delivery strong {
  flex: 0 0 auto;
  color: var(--color-text, #2d2926);
}

.communication-message__attachment-list {
  display: flex;
  min-width: 0;
  flex-wrap: wrap;
  gap: 0.35rem;
}

.communication-message__attachment {
  display: inline-flex;
  align-items: center;
  min-height: 1.8rem;
  max-width: 100%;
  padding: 0.18rem 0.55rem;
  overflow: hidden;
  border: 1px solid var(--color-border, #e8e4dc);
  border-radius: 999px;
  background: #fff;
  color: var(--st-nav-accent, #2d6a4f);
  text-decoration: none;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.communication-message__actions {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 0.55rem;
}

.communication-message__actions form {
  margin: 0;
}

.communication-reply {
  margin-top: 1.25rem;
}

.communication-reply__header {
  padding: 0.9rem 1rem;
  border-bottom: 1px solid var(--color-border, #e8e4dc);
  background: #fbfaf8;
}

.communication-reply__header h2 {
  margin: 0;
  font-size: 1rem;
}

.communication-reply__form {
  padding: 1rem;
}

.communication-reply__message {
  min-height: 8rem;
}

.communication-reply__footer {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 1rem;
}

.communication-reply__classification {
  width: min(22rem, 100%);
  margin: 0;
}

.communication-audit__table {
  min-width: 50rem;
}

.communication-audit__time {
  color: var(--color-text-muted, #64748b);
  white-space: nowrap;
}

.communication-audit__action {
  display: inline-flex;
  align-items: center;
  min-height: 1.55rem;
  padding: 0.12rem 0.55rem;
  border-radius: 999px;
  background: #edf5f0;
  color: #28563f;
  font-size: 0.74rem;
  font-weight: 700;
  white-space: nowrap;
}

.communication-audit__metadata {
  display: block;
  max-width: 30rem;
  overflow: hidden;
  color: var(--color-text-muted, #64748b);
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
  font-size: 0.72rem;
  overflow-wrap: anywhere;
  text-overflow: ellipsis;
  white-space: normal;
}

@media (max-width: 900px) {
  .communication-compose__recipient-grid {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 760px) {
  .communication-log__header {
    align-items: stretch;
    flex-direction: column;
  }

  .communication-log__compose {
    justify-content: center;
    width: 100%;
  }

  .communication-log__filters,
  .communication-log__filter-fields,
  .communication-log__filter-actions {
    align-items: stretch;
    flex-direction: column;
  }

  .communication-log__filter-field .students-index__select,
  .communication-log__filter-actions .students-index__btn {
    width: 100%;
  }

  .communication-log__table-wrap {
    overflow: visible;
    border: 0;
    background: transparent;
    box-shadow: none;
  }

  .communication-log__table,
  .communication-log__table tbody,
  .communication-log__table tr,
  .communication-log__table td {
    display: block;
    width: 100%;
    min-width: 0;
  }

  .communication-log__table thead {
    display: none;
  }

  .communication-log__table tbody {
    display: grid;
    gap: 0.75rem;
  }

  .communication-log__table tr {
    padding: 0.45rem 0.8rem;
    border: 1px solid var(--color-border, #e8e4dc);
    border-radius: 0.7rem;
    background: #fff;
  }

  .communication-log__table td {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 0.45rem 0;
    border: 0;
    text-align: right;
  }

  .communication-log__table td::before {
    flex: 0 0 auto;
    color: var(--color-text-muted, #64748b);
    content: attr(data-label);
    font-size: 0.72rem;
    font-weight: 700;
    text-align: left;
  }

  .communication-log__table td:first-child {
    padding-bottom: 0.7rem;
    border-bottom: 1px solid var(--color-border, #e8e4dc);
    font-size: 0.9rem;
  }

  .communication-log__subject {
    max-width: 70%;
  }

  .communication-index__tab {
    min-height: 2.75rem;
  }

  .communication-index__header {
    align-items: stretch;
  }

  .communication-index__header .students-index__btn-row,
  .communication-index__header .students-index__btn,
  .communication-compose__header .students-index__btn-row,
  .communication-compose__header .students-index__btn {
    width: 100%;
  }

  .communication-index__header .students-index__btn,
  .communication-compose__header .students-index__btn {
    justify-content: center;
  }

  .communication-index__empty {
    min-height: 14rem;
    padding: 2rem 1.25rem;
  }

  .communication-compose__notice,
  .communication-compose__preview {
    margin: 1rem 1.25rem 0;
  }

  .communication-compose__section {
    padding: 1.25rem;
  }

  .communication-compose__preview-groups {
    grid-template-columns: 1fr;
  }

  .communication-compose__focused-recipient {
    align-items: flex-start;
    flex-wrap: wrap;
  }

  .communication-compose__focused-recipient .students-index__btn {
    width: 100%;
    justify-content: center;
  }

  .communication-compose__recipient-grid,
  .communication-compose__delivery-grid {
    grid-template-columns: 1fr;
  }

  .communication-compose__picker-toolbar {
    align-items: stretch;
    flex-direction: column;
  }

  .communication-compose__picker-tools,
  .communication-compose__picker-tool {
    flex: 1;
  }

  .communication-compose__picker-tool {
    min-height: 2.75rem;
  }

  .communication-compose__footer {
    align-items: stretch;
    flex-direction: column-reverse;
    padding: 1rem 1.25rem;
  }

  .communication-compose__footer > .students-index__btn,
  .communication-compose__actions,
  .communication-compose__actions .students-index__btn {
    width: 100%;
  }

  .communication-compose__actions {
    align-items: stretch;
    flex-direction: column-reverse;
  }

  .communication-compose__actions .students-index__btn {
    justify-content: center;
  }

  .communication-show__header-actions,
  .communication-show__header-actions .students-index__btn,
  .communication-show__action-form,
  .communication-show__action-form .students-index__btn {
    width: 100%;
  }

  .communication-show__header-actions .students-index__btn {
    justify-content: center;
  }

  .communication-message__header,
  .communication-reply__footer {
    align-items: stretch;
    flex-direction: column;
  }

  .communication-message__badges {
    justify-content: flex-start;
  }

  .communication-message__body {
    padding: 1rem;
  }

  .communication-message__attachments,
  .communication-message__delivery {
    flex-direction: column;
    gap: 0.35rem;
  }

  .communication-message__actions,
  .communication-message__actions form,
  .communication-message__actions .students-index__btn,
  .communication-reply__footer .students-index__btn {
    width: 100%;
  }

  .communication-message__actions .students-index__btn,
  .communication-reply__footer .students-index__btn {
    justify-content: center;
  }

  .communication-reply__classification {
    width: 100%;
  }
}
/* Admin area — support staff console */

.admin-body {
  margin: 0;
  font-family: var(--font-app);
  background: var(--color-surface);
  color: var(--color-text);
}

.admin-header {
  background: var(--schoolise-navy-dark);
  color: var(--color-text-inverse);
  padding: var(--space-3) var(--space-4);
}

.admin-header__inner {
  max-width: var(--content-max-width);
  margin: 0 auto;
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: var(--space-3);
}

.admin-header__title {
  color: var(--color-text-inverse);
  font-weight: 700;
  text-decoration: none;
}

.admin-nav {
  display: flex;
  gap: var(--space-4);
}

.admin-nav a {
  color: #c4b8a4;
  text-decoration: none;
  font-size: 0.875rem;
  font-weight: 600;
}

.admin-nav a.active {
  color: var(--color-text-inverse);
}

.admin-header__logout {
  padding: 0.4rem 0.75rem;
  border: 1px solid rgba(255, 255, 255, 0.25);
  border-radius: var(--radius-sm);
  background: transparent;
  color: var(--color-text-inverse);
  cursor: pointer;
  font-size: 0.8125rem;
}

.admin-main {
  max-width: var(--content-max-width);
  margin: 0 auto;
  padding: var(--space-6) var(--space-4);
}

.admin-page__title {
  margin: 0 0 var(--space-2);
  font-size: 1.5rem;
  font-weight: 700;
}

.admin-page__lead {
  margin: 0 0 var(--space-5);
  color: var(--color-text-muted);
}

.admin-panel {
  background: var(--color-surface-raised);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
  padding: var(--space-5);
  margin-bottom: var(--space-4);
}

.admin-panel__title {
  margin: 0 0 var(--space-4);
  font-size: 1rem;
  font-weight: 700;
}

.admin-panel__subtitle {
  margin: var(--space-4) 0 var(--space-2);
  font-size: 0.875rem;
  font-weight: 600;
}

.admin-muted {
  color: var(--color-text-muted);
  font-size: 0.875rem;
}

.admin-input {
  padding: 0.5rem 0.75rem;
  border: 1px solid var(--color-border);
  border-radius: var(--radius-sm);
  font-family: inherit;
  font-size: 0.875rem;
}

.admin-input--grow {
  flex: 1;
  min-width: 12rem;
}

.admin-button {
  padding: 0.5rem 1rem;
  border: none;
  border-radius: var(--radius-sm);
  background: var(--schoolise-blue);
  color: var(--color-text-inverse);
  font-weight: 600;
  cursor: pointer;
}

.admin-link {
  color: var(--schoolise-blue);
  text-decoration: none;
  font-weight: 600;
}

.admin-link-strong {
  color: var(--schoolise-blue);
  font-weight: 600;
}

.admin-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 0.875rem;
}

.admin-table th,
.admin-table td {
  padding: var(--space-3);
  border-bottom: 1px solid var(--color-border);
  text-align: left;
}

.admin-toolbar {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-3);
  align-items: flex-end;
}

.admin-support-filters__row {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-3);
  align-items: flex-end;
  margin-bottom: var(--space-4);
}

.admin-support-request-top {
  display: grid;
  grid-template-columns: 2fr 1fr;
  gap: var(--space-4);
  margin-bottom: var(--space-4);
}

.admin-dl {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: var(--space-2) var(--space-4);
  font-size: 0.875rem;
}

.admin-dl dt {
  color: var(--color-text-muted);
  font-weight: 600;
}

.admin-request-body {
  margin-top: var(--space-4);
  white-space: pre-wrap;
  font-size: 0.875rem;
  line-height: 1.6;
}

.admin-form-field {
  margin-bottom: var(--space-3);
}

.admin-form-field .admin-input {
  width: 100%;
  max-width: 28rem;
}

.admin-comment-list {
  list-style: none;
  margin: 0 0 var(--space-4);
  padding: 0;
}

.admin-comment-list li {
  padding: var(--space-3) 0;
  border-bottom: 1px solid var(--color-border);
}

.admin-comment-body {
  margin-top: var(--space-2);
  white-space: pre-wrap;
}

.admin-table .cl-icon-btn:hover {
  background: #f0ece6;
  color: var(--schoolise-blue);
  border-color: #ccc5b8;
}

@media (max-width: 900px) {
  .admin-support-request-top {
    grid-template-columns: 1fr;
  }
}
.students-index,
.teachers-index,
.contacts-index,
.contacts-form,
.contacts-import,
.students-import,
.teachers-form,
.groups-index,
.groups-form,
.groups-show,
.questions-index,
.questions-show,
.questions-form,
.figures-index,
.assessments-form,
.assessments-index,
.reports-index {
  color: var(--st-text-primary);
}

.students-index {
  padding: 1rem 1rem 2.5rem;
  margin-bottom: 0;
  background-color: var(--color-surface);
  border-radius: var(--radius-lg);
}

.contacts-index,
.groups-index {
  padding: 1rem 1rem 2.5rem;
  margin-bottom: 0;
  background-color: var(--color-surface);
  border-radius: var(--radius-lg);
}

.contacts-form {
  padding: 1rem 1rem 2.5rem;
  margin-bottom: 0;
  background-color: var(--st-canvas);
  border-radius: var(--st-radius-lg);
}

.dashboard-header {
  margin-bottom: 2rem;
}

.dashboard-header h1 {
  font-size: 1.75rem;
  font-weight: 600;
  color: var(--st-text-primary);
  margin: 0;
}

.edit-public-id-line {
  margin: 0.35rem 0 0;
  padding: 0;
  font-size: 0.75rem;
  font-weight: 500;
  color: var(--st-text-tertiary);
  letter-spacing: 0.02em;
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
}

.assessments-index,
.reports-index {
  padding: 1rem 1rem 2.5rem;
  margin-bottom: 0;
  background-color: var(--color-surface);
  border-radius: var(--radius-lg);
}
/* ── Contacts / students import ── */
.contacts-import,
.students-import {
  padding: 1rem 1rem 2.5rem;
  margin-bottom: 0;
  background-color: var(--st-canvas);
  border-radius: var(--st-radius-lg);
}

.contacts-import .students-index__header,
.students-import .students-index__header {
  margin-bottom: 1.5rem;
}

.ci-actions__form {
  margin: 0;
  display: inline-flex;
}

.ci-actions--secondary {
  margin-top: 0.75rem;
}

.ci-table__select {
  width: 100%;
  min-width: 10rem;
  min-height: 2.5rem;
  height: auto;
  padding-top: 0.35rem;
  padding-bottom: 0.35rem;
}

.ci-card {
  background: var(--st-bg-primary);
  border: 0.5px solid var(--st-border-tertiary);
  border-radius: var(--st-radius-lg);
  overflow: hidden;
  box-shadow: 0 1px 2px rgba(28, 25, 23, 0.04);
  margin-bottom: 1.25rem;
}

.ci-card__header {
  background: var(--st-bg-secondary);
  padding: 0.7rem 1.25rem;
  border-bottom: 0.5px solid var(--st-border-tertiary);
}

.ci-card__title {
  font-size: 0.85rem;
  font-weight: 700;
  color: var(--st-text-primary);
}

.ci-card__body {
  padding: 1.25rem 1.5rem;
  min-width: 0;
}

.ci-card__footer {
  padding: 1rem 1.5rem;
  border-top: 0.5px solid var(--st-border-tertiary);
  background: var(--st-bg-secondary);
}

/* Paste step */
.ci-paste-body {
  display: flex;
  flex-direction: column;
  gap: 1rem;
  min-width: 0;
}

.ci-paste-body .cf-field {
  min-width: 0;
  width: 100%;
  display: flex;
  flex-direction: column;
  gap: 0.3rem;
}

.ci-paste-body .cf-field label {
  font-size: 0.775rem;
  font-weight: 600;
  color: var(--st-text-secondary);
}

.contacts-import select.cf-input,
.students-import select.cf-input,
.contacts-import .ci-role-select,
.students-import .ci-role-select {
  display: block;
  width: 100%;
  min-height: 34px;
  height: 34px;
  padding: 0 2rem 0 0.7rem;
  border: 0.5px solid var(--st-border-secondary);
  border-radius: var(--st-radius-md);
  background-color: var(--st-bg-primary);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%2394a3b8' stroke-width='2'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 0.5rem center;
  color: var(--st-text-primary);
  font-family: inherit;
  font-size: 0.8125rem;
  line-height: 1.25;
  box-sizing: border-box;
  outline: none;
  cursor: pointer;
  appearance: none;
  -webkit-appearance: none;
  transition: border-color 0.15s, box-shadow 0.15s;
}

.contacts-import .ci-table__select,
.students-import .ci-table__select {
  display: block;
  width: 100%;
  min-width: 10rem;
  min-height: 2.5rem;
  height: auto;
  padding: 0.35rem 2rem 0.35rem 0.7rem;
  border: 0.5px solid var(--st-border-secondary);
  border-radius: var(--st-radius-md);
  background-color: var(--st-bg-primary);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%2394a3b8' stroke-width='2'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 0.5rem center;
  color: var(--st-text-primary);
  font-family: inherit;
  font-size: 0.8125rem;
  line-height: 1.25;
  box-sizing: border-box;
  outline: none;
  cursor: pointer;
  appearance: none;
  -webkit-appearance: none;
  transition: border-color 0.15s, box-shadow 0.15s;
}

.contacts-import select.cf-input:focus,
.students-import select.cf-input:focus,
.contacts-import .ci-role-select:focus,
.students-import .ci-role-select:focus,
.contacts-import .ci-table__select:focus,
.students-import .ci-table__select:focus {
  border-color: var(--st-accent);
  box-shadow: 0 0 0 2px rgba(92, 83, 70, 0.12);
}

.ci-role-select {
  width: 220px;
  max-width: 100%;
}

.ci-textarea {
  display: block;
  width: 100%;
  max-width: 100%;
  min-width: 0;
  box-sizing: border-box;
  padding: 0.85rem 1rem;
  border: 0.5px solid var(--st-border-secondary);
  border-radius: var(--st-radius-md);
  background: var(--st-bg-primary);
  color: var(--st-text-primary);
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
  font-size: 0.8125rem;
  line-height: 1.6;
  resize: vertical;
  outline: none;
  transition: border-color 0.15s, box-shadow 0.15s;
}

.ci-textarea:focus {
  border-color: var(--st-accent);
  box-shadow: 0 0 0 2px rgba(92, 83, 70, 0.12);
}

/* Mapping table */
.ci-table-wrap {
  overflow-x: auto;
  border-bottom: 0.5px solid var(--st-border-tertiary);
}

.ci-table {
  width: max-content;
  min-width: 100%;
  border-collapse: collapse;
  font-size: 0.8125rem;
}

.ci-table thead tr {
  background: var(--st-bg-secondary);
  border-bottom: 0.5px solid var(--st-border-tertiary);
}

.ci-table thead th {
  padding: 0.6rem 0.75rem;
  text-align: left;
  font-size: 0.75rem;
  font-weight: 600;
  color: var(--st-text-secondary);
  white-space: nowrap;
  border-right: 0.5px solid var(--st-border-tertiary);
}

.ci-table thead th:last-child { border-right: none; }

.ci-table tbody tr {
  border-bottom: 0.5px solid var(--st-border-tertiary);
  transition: background 0.1s;
}

.ci-table tbody tr:last-child { border-bottom: none; }
.ci-table tbody tr:hover { background: var(--st-bg-secondary); }

.ci-table tbody td {
  padding: 0.6rem 0.75rem;
  color: var(--st-text-primary);
  vertical-align: middle;
  border-right: 0.5px solid var(--st-border-tertiary);
}

.ci-table tbody td:last-child { border-right: none; }

.ci-table__num {
  width: 48px;
  text-align: center;
  font-weight: 600;
  color: var(--st-text-tertiary) !important;
}

.ci-table__skip {
  width: 90px;
  text-align: center;
}

.ci-table__cell {
  min-width: 180px;
  word-break: break-word;
}

/* Actions row */
.ci-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.65rem;
  align-items: center;
}

.ci-actions__back { margin-left: auto; }

/* Confirmation summary */
.ci-summary {
  display: flex;
  gap: 1.5rem;
  flex-wrap: wrap;
  margin-bottom: 1.25rem;
  padding-bottom: 1.25rem;
  border-bottom: 0.5px solid var(--st-border-tertiary);
}

.ci-summary__item {
  padding: 0.6rem 1rem;
  border-radius: var(--st-radius-md);
  background: var(--st-bg-secondary);
  border: 0.5px solid var(--st-border-tertiary);
  font-size: 0.85rem;
  font-weight: 600;
  color: var(--color-text);
}

.ci-summary__item--warn  { background: #fffbeb; border-color: #fde68a; color: #92400e; }
.ci-summary__item--error { background: #fef2f2; border-color: #fecaca; color: #991b1b; }

.ci-flagged-rows {
  margin-bottom: 1.25rem;
  padding: 0.85rem 1rem;
  border: 0.5px solid var(--color-border);
  border-radius: var(--radius-md);
  background: var(--st-bg-secondary);
  font-size: 0.8125rem;
}

.ci-flagged-rows__row + .ci-flagged-rows__row {
  margin-top: 0.75rem;
  padding-top: 0.75rem;
  border-top: 0.5px solid var(--color-border);
}

.ci-flagged-rows__heading {
  margin: 0 0 0.35rem;
  font-weight: 600;
  color: var(--color-text);
}

.ci-flagged-rows__error {
  margin: 0.15rem 0;
  color: #991b1b;
}

.ci-flagged-rows__warning {
  margin: 0.15rem 0;
  color: #92400e;
}

/* Help footer */
.ci-help {
  margin-top: 1rem;
  color: var(--color-text-muted);
  font-size: 0.85rem;
  line-height: 1.5;
}
.contacts-index table.data-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 0.8125rem;
}

.contacts-index table.data-table thead tr {
  background: var(--st-bg-secondary);
  border-bottom: 0.5px solid var(--color-border);
}

.contacts-index table.data-table thead th {
  padding: 10px 12px;
  text-align: left;
  font-size: 0.6875rem;
  font-weight: 500;
  color: var(--color-text-muted);
  letter-spacing: 0.03em;
  vertical-align: middle;
}

.contacts-index table.data-table thead th.contacts-index__th--narrow {
  width: 2.75rem;
  text-align: center;
}

.contacts-index table.data-table tbody tr {
  border-bottom: 0.5px solid var(--color-border);
}

.contacts-index table.data-table tbody tr:hover {
  background: var(--st-bg-secondary);
}

.contacts-index table.data-table tbody td {
  padding: 11px 12px;
  font-size: 0.8125rem;
  color: var(--color-text);
  vertical-align: middle;
}

.contacts-index table.data-table input[type="checkbox"] {
  width: 15px;
  height: 15px;
  accent-color: var(--st-accent);
  cursor: pointer;
  vertical-align: middle;
}

.contacts-index table.data-table thead th.contacts-index__th--sortable .contacts-index__sort-link {
  text-decoration: none;
  color: var(--color-brand-500);
  font-weight: 600;
}

.contacts-index table.data-table thead th.contacts-index__th--sortable .contacts-index__sort-link:hover {
  color: var(--color-brand-600);
}

.contacts-index table.data-table thead th.contacts-index__th--sorted .contacts-index__sort-link {
  color: var(--color-brand-600);
}

.contacts-index__mono {
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
  font-size: 0.75rem;
  color: var(--color-text-muted);
}

.contacts-index__name-link {
  font-weight: 600;
  text-decoration: none;
  color: var(--color-text);
}

.contacts-index__name-link:hover {
  color: var(--color-brand-500);
}

.contacts-index__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
  align-items: center;
  line-height: 0;
}

.contacts-index table.data-table .contact-icon-link.contacts-index__icon-btn,
.contacts-index .contact-card-actions .contact-icon-link.contacts-index__icon-btn {
  width: 28px;
  height: 28px;
  padding: 0;
  border-radius: var(--st-radius-md);
  border: 0.5px solid var(--st-border-tertiary);
  background: transparent;
  color: var(--st-text-secondary);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  line-height: 0;
}

.contacts-index table.data-table .contact-icon-link.contacts-index__icon-btn:hover,
.contacts-index .contact-card-actions .contact-icon-link.contacts-index__icon-btn:hover {
  background: var(--st-bg-secondary);
  color: var(--st-accent);
  border-color: var(--st-border-secondary);
}

.contacts-index .contact-card-actions a.contact-icon-link {
  color: var(--st-text-secondary);
}

/* Assessments index (/assessments) */
.assessments-index table.data-table,
.reports-index table.data-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 0.8125rem;
  table-layout: fixed;
}

.assessments-index table.data-table thead tr,
.reports-index table.data-table thead tr {
  background: var(--st-bg-secondary);
  border-bottom: 0.5px solid var(--color-border);
}

.assessments-index table.data-table thead th,
.reports-index table.data-table thead th {
  padding: 10px 12px;
  text-align: left;
  font-size: 0.6875rem;
  font-weight: 500;
  color: var(--color-text-muted);
  letter-spacing: 0.03em;
  vertical-align: middle;
}

.assessments-index table.data-table tbody tr,
.reports-index table.data-table tbody tr {
  border-bottom: 0.5px solid var(--color-border);
  transition: background 0.1s;
}

.assessments-index table.data-table tbody tr:hover,
.reports-index table.data-table tbody tr:hover {
  background: #faf9f7;
}

.assessments-index table.data-table tbody td,
.reports-index table.data-table tbody td {
  padding: 10px 12px;
  vertical-align: middle;
  color: var(--color-text);
}

.assessments-index table.data-table input[type="checkbox"],
.reports-index table.data-table input[type="checkbox"] {
  width: 1rem;
  height: 1rem;
  accent-color: var(--st-accent);
  cursor: pointer;
}

.assessments-index table.data-table thead th.assessments-index__th--sortable .assessments-index__sort-link,
.assessments-index table.data-table thead th.assessments-index__th--sortable .assessments-index__sort-link:hover {
  text-decoration: none;
  color: inherit;
  font-weight: 500;
}

.assessments-index table.data-table thead th.assessments-index__th--sortable .assessments-index__sort-link:hover {
  color: var(--color-text);
}

.assessments-index table.data-table thead th.assessments-index__th--sorted,
.assessments-index table.data-table thead th.assessments-index__th--sorted .assessments-index__sort-link {
  color: var(--color-brand-500);
}

.assessments-index__mono,
.reports-index__mono {
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
  font-size: 0.78rem;
  color: var(--color-text-muted);
}

.assessments-index__title-link,
.reports-index__name-link {
  font-weight: 600;
  color: var(--color-text);
  text-decoration: none;
}

.assessments-index__title-link:hover,
.reports-index__name-link:hover {
  color: var(--color-brand-500);
}

.assessments-index__tags {
  display: flex;
  flex-wrap: wrap;
  gap: 0.3rem;
}

.assessments-index__tag {
  display: inline-block;
  padding: 0.15rem 0.5rem;
  border-radius: 999px;
  font-size: 0.6875rem;
  font-weight: 600;
  background: var(--st-bg-secondary);
  color: var(--color-text-muted);
  border: 0.5px solid var(--color-border-strong);
}

.assessments-index__statuses {
  display: inline-flex;
  flex-wrap: wrap;
  gap: 0.35rem;
  align-items: center;
}

.assessments-index__badge {
  display: inline-block;
  padding: 0.15rem 0.5rem;
  border-radius: 999px;
  font-size: 0.6875rem;
  font-weight: 600;
  white-space: nowrap;
  border: 0.5px solid transparent;
}

.assessments-index__badge--draft {
  background: var(--st-bg-secondary);
  color: var(--color-text-muted);
  border-color: var(--color-border-strong);
}

.assessments-index__badge--ready {
  background: #e8f0fa;
  color: #1e4a7a;
  border-color: #c5d9f0;
}

.assessments-index__badge--ended {
  background: #fff4e6;
  color: #9a3412;
  border-color: #fed7aa;
}

.assessments-index__badge--scheduled {
  background: #fef3c7;
  color: #92400e;
  border-color: #fde68a;
}

.assessments-index table.data-table tbody .assessments-index__actions,
.reports-index table.data-table tbody .reports-index__actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: flex-end;
  gap: 0.35rem;
  width: 100%;
  min-width: 0;
  line-height: 0;
}

/* Assessments list table — flexible columns; scroll only when viewport is narrow on desktop */
.assessments-index table.assessments-index__list-table {
  table-layout: auto;
  width: 100%;
  min-width: min(100%, 52rem);
}

.assessments-index__list-title-link {
  font-weight: 600;
  word-break: break-word;
}

.assessments-index table.data-table thead th.students-index__th--narrow,
.assessments-index table.data-table tbody td.students-index__td--check {
  width: 2.25rem;
  box-sizing: border-box;
}

.assessments-index table.data-table thead th.students-index__th--ref,
.assessments-index table.data-table thead th.assessments-index__th--ref,
.assessments-index table.data-table tbody td.students-index__td--ref {
  width: 3.75rem;
  max-width: 4rem;
  padding-left: 8px;
  padding-right: 6px;
  box-sizing: border-box;
}

.assessments-index table.data-table thead th.assessments-index__th--sortable {
  white-space: normal;
  line-height: 1.25;
  vertical-align: bottom;
  overflow: hidden;
}

.assessments-index table.data-table thead th.assessments-index__th--sortable .assessments-index__sort-link {
  display: inline;
  word-break: break-word;
}

.assessments-index table.data-table thead th.assessments-index__th--title,
.assessments-index table.data-table tbody td.assessments-index__td--title {
  width: 13%;
  min-width: 6.5rem;
}

.assessments-index table.data-table thead th.assessments-index__th--tags,
.assessments-index table.data-table tbody td.assessments-index__td--tags {
  width: 9%;
  min-width: 5rem;
}

.assessments-index table.data-table thead th.assessments-index__th--created,
.assessments-index table.data-table tbody td.assessments-index__td--created,
.assessments-index table.data-table thead th.assessments-index__th--time,
.assessments-index table.data-table tbody td.assessments-index__td--time {
  white-space: nowrap;
}

.assessments-index table.data-table tbody td.assessments-index__td--marks {
  white-space: nowrap;
}

.assessments-index table.data-table thead th.assessments-index__th--created,
.assessments-index table.data-table tbody td.assessments-index__td--created {
  width: 6.25rem;
}

.assessments-index table.data-table thead th.assessments-index__th--author,
.assessments-index table.data-table tbody td.assessments-index__td--author {
  width: 10%;
  min-width: 5.5rem;
}

.assessments-index table.data-table thead th.assessments-index__th--status,
.assessments-index table.data-table tbody td.assessments-index__td--status {
  width: 8%;
  min-width: 6.5rem;
  max-width: 11rem;
}

.assessments-index table.data-table thead th.assessments-index__th--marks,
.assessments-index table.data-table tbody td.assessments-index__td--marks {
  width: 3.75rem;
  max-width: 4rem;
  text-align: center;
  white-space: normal;
  line-height: 1.25;
}

.assessments-index table.data-table thead th.assessments-index__th--time,
.assessments-index table.data-table tbody td.assessments-index__td--time {
  width: 4rem;
}

.assessments-index table.data-table thead th.assessments-index__th--actions,
.assessments-index table.data-table thead th.students-index__th--actions,
.assessments-index table.data-table tbody td.students-index__td--actions {
  width: 12rem;
  min-width: 9rem;
  max-width: 20rem;
  text-align: right;
  white-space: normal;
  overflow: visible;
  vertical-align: middle;
}

.assessments-index table.data-table thead th.assessments-index__th--actions,
.assessments-index table.data-table thead th.students-index__th--actions {
  color: var(--color-text-muted);
  font-weight: 500;
  vertical-align: middle;
  background: var(--st-bg-secondary);
}

.assessments-index table.data-table tbody td.assessments-index__td--title,
.assessments-index table.data-table tbody td.assessments-index__td--author {
  overflow: hidden;
  text-overflow: ellipsis;
}

.assessments-index table.data-table tbody td.assessments-index__td--tags {
  overflow: hidden;
}

/* Reports index column widths (desktop table only) */
@media (min-width: 1024px) {
  .reports-index .reports-index__list-table {
    min-width: 58rem;
  }
}

.reports-index table.data-table thead th.students-index__th--narrow,
.reports-index table.data-table tbody td.students-index__td--check {
  width: 2.25rem;
  box-sizing: border-box;
}

.reports-index table.data-table thead th.reports-index__th--created,
.reports-index table.data-table tbody td.reports-index__td--created,
.reports-index table.data-table thead th.reports-index__th--emailed,
.reports-index table.data-table tbody td.reports-index__td--emailed {
  width: 6.25rem;
  white-space: nowrap;
}

.reports-index table.data-table thead th.students-index__th--ref,
.reports-index table.data-table tbody td.students-index__td--ref {
  width: 5.25rem;
  max-width: 5.5rem;
}

.reports-index table.data-table thead th.reports-index__th--student,
.reports-index table.data-table tbody td.reports-index__td--student {
  width: 12%;
  min-width: 6rem;
}

.reports-index table.data-table thead th.reports-index__th--assessment,
.reports-index table.data-table tbody td.reports-index__td--assessment {
  width: 16%;
  min-width: 7rem;
}

.reports-index table.data-table thead th.reports-index__th--title,
.reports-index table.data-table tbody td.reports-index__td--title {
  width: 14%;
  min-width: 6rem;
}

.reports-index table.data-table thead th.students-index__th--actions,
.reports-index table.data-table tbody td.students-index__td--actions {
  width: 9.25rem;
  min-width: 9.25rem;
  text-align: right;
  white-space: nowrap;
}

.reports-index table.data-table tbody td.reports-index__td--student,
.reports-index table.data-table tbody td.reports-index__td--assessment,
.reports-index table.data-table tbody td.reports-index__td--title {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.assessments-index table.data-table a.assessment-icon-link {
  color: var(--color-text-muted);
}

.assessments-index table.data-table .assessment-icon-link.assessments-index__icon-btn,
.reports-index table.data-table .reports-index__icon-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
  width: 28px;
  height: 28px;
  padding: 0;
  border-radius: var(--radius-md);
  border: 0.5px solid var(--color-border);
  background: var(--color-surface-raised);
  color: var(--color-text-muted);
  line-height: 0;
  box-sizing: border-box;
}

.assessments-index table.data-table .assessment-icon-link.assessments-index__icon-btn:hover,
.reports-index table.data-table .reports-index__icon-btn:hover {
  background: var(--st-bg-secondary);
  color: var(--color-brand-500);
  border-color: var(--color-border-strong);
}

.assessments-index table.data-table .assessment-icon-link.assessments-index__icon-btn--danger:hover,
.reports-index table.data-table .reports-index__icon-btn--danger:hover {
  color: var(--color-brand-500);
  background: var(--st-bg-secondary);
  border-color: var(--color-border-strong);
}

.assessments-index table.data-table .assessment-icon-link.assessments-index__icon-btn--email:hover,
.reports-index table.data-table .reports-index__icon-btn--email:hover {
  color: #0f766e;
  background: #f0fdfa;
  border-color: #99f6e4;
}

.reports-index__empty {
  padding: 2rem 1.5rem;
  text-align: center;
  color: var(--color-text-muted);
  font-size: 0.875rem;
}

.assessments-index__muted,
.reports-index__muted {
  color: var(--st-text-tertiary);
}

.reports-index__icon-btn--disabled {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 2rem;
  height: 2rem;
  color: var(--st-text-tertiary);
  cursor: not-allowed;
  opacity: 0.55;
}

.students-index__bulk-card-actions {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}

.assessments-index__table-wrap--with-footer,
.reports-index__table-wrap--with-footer {
  border-radius: var(--radius-lg) var(--radius-lg) 0 0;
}

.assessments-index__footer .students-index__pagination-bar,
.reports-index__footer .students-index__pagination-bar {
  border: 0.5px solid var(--color-border);
  border-top: none;
  border-radius: 0 0 var(--radius-lg) var(--radius-lg);
  background: var(--color-surface-raised);
}

/* ── Assessments grid view ── */
.assessments-index__grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 1rem;
}

@media (max-width: 1024px) {
  .assessments-index__grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 640px) {
  .assessments-index__grid {
    grid-template-columns: 1fr;
  }
}

.assessments-grid-card {
  display: flex;
  flex-direction: column;
  gap: 0;
  background: var(--color-surface-raised);
  border: 0.5px solid var(--color-border);
  border-left-width: 3px;
  border-left-style: solid;
  border-left-color: var(--color-border-strong);
  border-radius: var(--radius-lg);
  padding: 1rem 1.1rem 0.9rem;
  box-shadow: 0 1px 2px rgba(28, 25, 23, 0.04);
  transition: box-shadow 0.15s, border-color 0.15s;
}

.assessments-grid-card:hover {
  box-shadow: 0 3px 10px rgba(28, 25, 23, 0.08);
}

/* Status-coloured left border */
.assessments-grid-card--draft    { border-left-color: var(--color-border-strong); }
.assessments-grid-card--ready    { border-left-color: #0e7490; }
.assessments-grid-card--active   { border-left-color: #16a34a; }
.assessments-grid-card--completed{ border-left-color: #16a34a; }
.assessments-grid-card--closed   { border-left-color: #dc2626; }
.assessments-grid-card--ended    { border-left-color: #ea580c; }

.assessments-grid-card__top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 0.6rem;
}

.assessments-grid-card__ref {
  font-size: 0.7rem;
  font-weight: 700;
  color: var(--st-text-tertiary);
  letter-spacing: 0.05em;
  font-family: ui-monospace, monospace;
  text-transform: uppercase;
}

.assessments-grid-card__check {
  cursor: pointer;
  flex-shrink: 0;
}

.assessments-grid-card__icon-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 0.7rem;
}

.assessments-grid-card__icon {
  width: 40px;
  height: 40px;
  border-radius: 10px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}

/* Status-coloured icon backgrounds */
.assessments-grid-card__icon--draft     { background: var(--st-bg-tertiary);  color: var(--color-text-muted); }
.assessments-grid-card__icon--ready     { background: #ebe6dc; color: #5c5346; }
.assessments-grid-card__icon--active    { background: #dcfce7; color: #15803d; }
.assessments-grid-card__icon--completed { background: #dcfce7; color: #15803d; }
.assessments-grid-card__icon--closed    { background: #fee2e2; color: #b91c1c; }
.assessments-grid-card__icon--ended     { background: #ffedd5; color: #c2410c; }

.assessments-grid-card__badges {
  display: flex;
  flex-wrap: wrap;
  gap: 0.35rem;
  justify-content: flex-end;
}

.assessments-grid-card__title {
  font-size: 0.92rem;
  font-weight: 600;
  line-height: 1.4;
  margin: 0 0 0.65rem;
}

.assessments-grid-card__title-link {
  display: inline;
  color: var(--color-text);
  text-decoration: none;
  font-size: inherit;
  font-weight: inherit;
  padding: 0;
  line-height: inherit;
}

.assessments-grid-card__title-link:hover {
  color: var(--color-brand-500);
  text-decoration: underline;
}

.assessments-grid-card__tags {
  display: flex;
  flex-wrap: wrap;
  gap: 0.3rem;
  margin-bottom: 0.65rem;
}

.assessments-grid-card__tag--more {
  background: var(--st-bg-tertiary);
  color: var(--color-text-muted);
}

.assessments-grid-card__footer {
  display: flex;
  flex-direction: column;
  gap: 0.55rem;
  margin-top: auto;
  padding-top: 0.65rem;
  border-top: 0.5px solid var(--color-border);
}

.assessments-grid-card__meta {
  display: flex;
  align-items: center;
  gap: 0.3rem;
  flex-wrap: wrap;
}

.assessments-grid-card__meta-item {
  font-size: 0.72rem;
  color: var(--color-text-muted);
  display: flex;
  align-items: center;
  gap: 0.22rem;
}

.assessments-grid-card__meta-sep {
  color: var(--color-border-strong);
  font-size: 0.72rem;
  opacity: 0.6;
}

.assessments-grid-card__actions {
  display: flex;
  align-items: center;
  gap: 3px;
  line-height: 0;
}

/* Icon buttons inside the grid cards */
.assessments-index__grid .assessment-icon-link.assessments-index__icon-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 30px;
  height: 30px;
  padding: 0;
  border-radius: var(--radius-md);
  border: 0.5px solid var(--color-border);
  background: var(--st-bg-secondary);
  color: var(--color-text-muted);
  line-height: 0;
  box-sizing: border-box;
  text-decoration: none;
  cursor: pointer;
  transition: background 0.12s, border-color 0.12s, color 0.12s;
}

.assessments-index__grid .assessment-icon-link.assessments-index__icon-btn:hover {
  background: #ebe6de;
  color: var(--color-text);
  border-color: var(--color-border-strong);
}

.assessments-index__grid .assessment-icon-link.assessments-index__icon-btn--danger:hover {
  background: #fef2f2;
  color: #b91c1c;
  border-color: #fecaca;
}

.contacts-index__grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 1.25rem;
}

@media (max-width: 1100px) {
  .contacts-index__grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

@media (max-width: 820px) {
  .contacts-index__grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 520px) {
  .contacts-index__grid {
    grid-template-columns: 1fr;
  }
}

.contacts-index__card {
  position: relative;
  background: var(--st-bg-primary);
  border: 0.5px solid var(--st-border-tertiary);
  border-radius: var(--st-radius-lg);
  padding: 1.25rem 1rem 0.9rem;
  display: flex;
  flex-direction: column;
  align-items: center;
  transition: border-color 0.15s;
  height: 100%;
  box-sizing: border-box;
}

.contacts-index__card:hover {
  border-color: var(--st-border-secondary);
}

.contacts-index__card-check {
  position: absolute;
  top: 12px;
  left: 12px;
  width: 16px;
  height: 16px;
  accent-color: var(--st-accent);
  cursor: pointer;
}

.contacts-index__card-avatar-wrap {
  margin-bottom: 1rem;
}

.contacts-index__card-photo {
  width: 100px;
  height: 100px;
  object-fit: cover;
  border-radius: 50%;
  border: 3px solid var(--st-border-tertiary);
}

.contacts-index__card-photo-placeholder {
  width: 100px;
  height: 100px;
  border-radius: 50%;
  background: var(--st-bg-secondary);
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0 auto;
  font-size: 2.25rem;
  color: var(--st-text-tertiary);
}

.contacts-index__card-ref {
  margin: 0 0 0.25rem;
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
  font-size: 0.625rem;
  color: var(--st-text-tertiary);
  letter-spacing: 0.04em;
  text-align: center;
}

.contacts-index__card-name {
  margin: 0 0 0.4rem;
  font-size: 0.875rem;
  font-weight: 500;
  color: var(--st-text-primary);
  text-align: center;
}

.contacts-index__card-name a {
  text-decoration: none;
  color: inherit;
  font-weight: 500;
}

.contacts-index__card-name a:hover {
  color: var(--st-accent);
}

.contacts-index__card-badges {
  display: flex;
  flex-wrap: wrap;
  gap: 0.35rem;
  justify-content: center;
  margin-bottom: 0.75rem;
}

.contacts-index__card-meta {
  width: 100%;
  border-top: 0.5px solid var(--st-border-tertiary);
  padding-top: 0.65rem;
  margin-top: 0.15rem;
}

.students-index__meta-row {
  display: flex;
  align-items: flex-start;
  gap: 0.35rem;
  margin-bottom: 0.35rem;
}

.students-index__meta-row:last-child {
  margin-bottom: 0;
}

.students-index__meta-label {
  font-size: 0.6875rem;
  color: var(--st-text-tertiary);
  white-space: nowrap;
  padding-top: 1px;
}

.students-index__meta-val {
  font-size: 0.6875rem;
  color: var(--st-text-secondary);
  word-break: break-word;
}

.students-index__badge {
  display: inline-block;
  padding: 2px 8px;
  border-radius: 99px;
  font-size: 0.6875rem;
  font-weight: 500;
  vertical-align: middle;
}

.students-index__badge--active {
  background: var(--st-badge-active-bg);
  color: var(--st-badge-active-fg);
}

.students-index__badge--inactive {
  background: #fee2e2;
  color: #991b1b;
}

.students-index__badge--portal-no {
  background: var(--st-bg-secondary);
  color: var(--st-text-tertiary);
  border: 0.5px solid var(--st-border-tertiary);
}

.students-index__badge--portal-yes {
  background: #dcfce7;
  color: #166534;
}

.students-index__badge--portal-invited {
  background: #fef3c7;
  color: #92400e;
}

.students-index__badge--portal-suspended {
  background: #fee2e2;
  color: #991b1b;
}

.contacts-index__card input.contact-bulk-cb {
  width: 16px;
  height: 16px;
  accent-color: var(--st-accent);
  cursor: pointer;
}

.contacts-index__card .contact-card-actions {
  display: flex;
  gap: 6px;
  margin-top: 0.75rem;
  width: 100%;
  justify-content: flex-end;
  line-height: 0;
}
.students-index__header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 1rem;
  margin-bottom: 1.5rem;
  flex-wrap: wrap;
}

.students-index__title {
  margin: 0 0 0.35rem;
  font-size: 1.375rem;
  font-weight: 500;
  color: var(--color-text);
  letter-spacing: -0.02em;
}

.students-index__lead {
  margin: 0;
  font-size: 0.8125rem;
  line-height: 1.5;
  color: var(--color-text-muted);
}

.students-index__btn-row {
  display: flex;
  gap: 0.5rem;
  flex-shrink: 0;
  flex-wrap: wrap;
}

.students-index__btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.35rem;
  height: 36px;
  padding: 0 1rem;
  border-radius: var(--radius-md);
  font-size: 0.8125rem;
  font-weight: 500;
  text-decoration: none;
  white-space: nowrap;
  border: 0.5px solid transparent;
  cursor: pointer;
  box-sizing: border-box;
}

.students-index__btn--primary {
  background: var(--st-accent);
  color: #fff;
  border-color: var(--st-accent-strong);
}

.students-index__btn--primary:hover {
  background: var(--st-accent-hover);
  color: #fff;
}

.students-index__btn--outline {
  background: var(--st-bg-primary);
  color: var(--st-text-primary);
  border-color: var(--st-border-secondary);
}

.students-index__btn--outline:hover {
  border-color: var(--st-border-mid);
  background: var(--st-bg-secondary);
}

.students-index__toolbar {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  margin-bottom: 1rem;
  flex-wrap: wrap;
  width: 100%;
  box-sizing: border-box;
}

.students-index__filters-form {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  flex: 1;
  flex-wrap: wrap;
  min-width: 0;
}

.students-index__search-wrap {
  position: relative;
  flex: 1;
  min-width: 180px;
}

.students-index .students-index__search-wrap,
.teachers-index .students-index__search-wrap,
.contacts-index .students-index__search-wrap {
  flex: 1 1 10rem;
  max-width: 14rem;
  min-width: 9rem;
}

.students-index__search-icon {
  position: absolute;
  left: 10px;
  top: 50%;
  transform: translateY(-50%);
  display: flex;
  color: var(--st-text-tertiary);
  pointer-events: none;
}

.students-index__search-input {
  width: 100%;
  height: 36px;
  padding: 0 0.75rem 0 2rem;
  border: 0.5px solid var(--color-border-strong);
  border-radius: var(--radius-md);
  background: var(--color-surface-raised);
  color: var(--color-text);
  font-size: 0.8125rem;
  box-sizing: border-box;
}

.students-index__search-input:focus {
  outline: none;
  border-color: var(--color-brand-500);
  box-shadow: 0 0 0 2px rgba(92, 83, 70, 0.12);
}

.students-index__select {
  height: 36px;
  padding: 0 1.75rem 0 0.65rem;
  border: 0.5px solid var(--color-border-strong);
  border-radius: var(--radius-md);
  background: var(--color-surface-raised);
  color: var(--color-text);
  font-size: 0.8125rem;
  cursor: pointer;
  appearance: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%2394a3b8' stroke-width='2'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 0.5rem center;
}

/* Per-page control: extra width for digits + custom chevron padding */
.students-index__pagination-bar .pagination-per-page-select.students-index__select,
.figures-index__footer .pagination-per-page-select.students-index__select {
  width: 4.75rem;
  min-width: 4.75rem;
  max-width: 4.75rem;
  height: 36px;
  padding: 0 1.75rem 0 0.65rem;
  font-size: 0.8125rem;
  line-height: 1.25;
  text-align: left;
  box-sizing: border-box;
}

.figures-index__footer .pagination-per-page-label {
  font-size: 0.8125rem;
  color: var(--color-text-muted);
}

.figures-index__footer-per {
  padding: 0.85rem 1.1rem;
}

.students-index__view-toggle {
  display: flex;
  background: var(--st-bg-secondary);
  border-radius: var(--radius-md);
  padding: 3px;
  gap: 2px;
  flex-shrink: 0;
}

.students-index__view-btn {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  padding: 5px 12px;
  border-radius: 6px;
  font-size: 0.75rem;
  font-weight: 500;
  text-decoration: none;
  color: var(--color-text-muted);
  border: none;
  background: none;
  white-space: nowrap;
}

.students-index__view-btn:hover {
  color: var(--color-text);
}

.students-index__view-btn--active {
  background: var(--st-bg-primary);
  color: var(--st-text-primary);
  border: 0.5px solid var(--st-border-tertiary);
  box-shadow: 0 1px 2px rgba(28, 25, 23, 0.06);
}

.students-index__view-icon {
  flex-shrink: 0;
}

.students-index__staff-type-row {
  display: flex;
  flex-wrap: wrap;
  gap: 0.35rem;
  margin-bottom: 0.75rem;
}

.students-index__staff-type-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 32px;
  padding: 0 0.75rem;
  border-radius: 999px;
  font-size: 0.75rem;
  font-weight: 500;
  text-decoration: none;
  color: var(--color-text-muted);
  border: 0.5px solid var(--st-border-secondary);
  background: var(--st-bg-primary);
  box-sizing: border-box;
}

.students-index__staff-type-btn:hover:not(.students-index__staff-type-btn--active) {
  border-color: var(--st-border-mid);
  background: var(--st-bg-secondary);
  color: var(--color-text);
}

.students-index__staff-type-btn--active {
  background: var(--st-accent);
  border-color: var(--st-accent-strong);
  color: #fff;
}

.students-index__badge--teaching {
  background: rgba(37, 99, 235, 0.1);
  color: #1d4ed8;
}

.students-index__badge--non-teaching {
  background: rgba(100, 116, 139, 0.12);
  color: #475569;
}

.students-index__no-role {
  color: var(--color-text-muted);
  font-style: italic;
  font-size: 0.8125rem;
}

@media (max-width: 640px) {
  .students-index__staff-type-btn {
    min-height: 44px;
    flex: 1 1 calc(50% - 0.35rem);
  }
}

.students-index__alpha-row {
  display: flex;
  flex-wrap: wrap;
  gap: 2px;
  margin-bottom: 1rem;
  align-items: center;
}

.students-index__alpha-btn {
  width: 28px;
  height: 28px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 6px;
  font-size: 0.75rem;
  font-weight: 500;
  text-decoration: none;
  color: var(--color-text-muted);
  border: none;
  background: none;
  box-sizing: border-box;
}

.students-index__alpha-btn:hover:not(.students-index__alpha-btn--dim):not(.students-index__alpha-btn--active) {
  background: var(--st-bg-secondary);
  color: var(--color-text);
}

.students-index__alpha-btn--active {
  background: var(--color-brand-500);
  color: #fff;
}

.students-index__alpha-btn--dim {
  color: #c4bfb6;
  cursor: default;
  pointer-events: none;
}

.contacts-index table.data-table tbody td.students-index__td--check {
  text-align: center;
}

.students-index__bulk-layout {
  display: flex;
  gap: 1.25rem;
  align-items: flex-start;
  flex-wrap: wrap;
}

.students-index__bulk-main {
  flex: 1;
  min-width: min(100%, 520px);
}

.students-index__bulk-sidebar {
  flex: 0 0 280px;
  max-width: 100%;
  align-self: flex-start;
  position: sticky;
  top: 1rem;
}

.students-index__bulk-sidebar-inner {
  display: flex;
  flex-direction: column;
  gap: 1rem;
  width: 100%;
}

.students-index__bulk-card {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
  padding: 1rem 1.1rem;
  border-radius: var(--st-radius-lg);
  border: 0.5px solid var(--st-border-tertiary);
  background: var(--st-bg-primary);
}

.students-index__bulk-card--status {
  background: #f4faf0;
  border-color: #c9dcb8;
}

.students-index__bulk-card--gap-lg {
  gap: 1rem;
}

.students-index__bulk-card--muted {
  background: var(--st-bg-secondary);
  border-color: var(--st-border-secondary);
}

.students-index__bulk-card-title {
  font-weight: 700;
  font-size: 0.95rem;
  color: var(--st-text-primary);
}

.students-index__bulk-card-hint {
  margin: 0;
  font-size: 0.8rem;
  line-height: 1.45;
  color: var(--st-text-secondary);
}

.students-index__bulk-field-label {
  display: block;
  font-weight: 600;
  font-size: 0.8rem;
  margin-bottom: 0.35rem;
  color: var(--st-text-secondary);
}

.students-index__bulk-select {
  width: 100%;
  box-sizing: border-box;
  padding: 0.5rem 0.65rem;
  border-radius: var(--st-radius-md);
  border: 0.5px solid var(--st-border-secondary);
  background: var(--st-bg-primary);
  color: var(--st-text-primary);
  font-family: inherit;
  font-size: 0.875rem;
}

.students-index__bulk-btn-row {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}

.students-index__bulk-btn {
  width: 100%;
  padding: 0.55rem 1rem;
  border-radius: 999px;
  font-weight: 700;
  font-size: 0.88rem;
  cursor: pointer;
  font-family: inherit;
  border: none;
  box-sizing: border-box;
}

.students-index__bulk-btn--active {
  background: #3b6d11;
  color: #fafaf9;
}

.students-index__bulk-btn--active:hover {
  background: #32600e;
}

.students-index__bulk-btn--inactive {
  background: #fef2f2;
  color: #991b1b;
  border: 1px solid #fecaca;
}

.students-index__bulk-btn--inactive:hover {
  background: #fee2e2;
}

.students-index__bulk-btn--primary {
  background: var(--st-accent);
  color: #fafaf9;
  font-size: 0.9rem;
  padding: 0.6rem 1rem;
}

.students-index__bulk-btn--primary:hover {
  background: var(--st-accent-strong);
}

.courses-bulk-year-levels__checks {
  display: flex;
  flex-direction: column;
  gap: 0.35rem;
  max-height: 14rem;
  overflow-y: auto;
  padding: 0.35rem 0;
}

.courses-bulk-year-levels__check {
  display: flex;
  align-items: flex-start;
  gap: 0.5rem;
  min-height: 2.5rem;
  padding: 0.35rem 0.15rem;
  font-size: 0.875rem;
  font-weight: 600;
  color: var(--st-text-primary);
  cursor: pointer;
}

.courses-bulk-year-levels__check input {
  margin-top: 0.15rem;
  flex-shrink: 0;
}

.contacts-index .contact-card-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  align-items: center;
  line-height: 0;
}

.students-index__select-bar {
  display: flex;
  align-items: center;
  gap: 0.65rem;
  padding: 0.65rem 0.9rem;
  background: var(--st-bg-secondary);
  border-radius: var(--radius-md);
  margin-bottom: 1rem;
  border: 0.5px solid var(--st-border-tertiary);
}

.students-index__select-bar label {
  font-size: 0.8125rem;
  color: var(--color-text-muted);
  display: flex;
  align-items: center;
  gap: 0.5rem;
  cursor: pointer;
  margin: 0;
}

.students-index__select-bar input[type="checkbox"] {
  width: 16px;
  height: 16px;
  accent-color: var(--st-accent);
  cursor: pointer;
}

.students-index__table-wrap,
.contacts-index__table-wrap,
.groups-index__table-wrap,
.questions-index__table-wrap,
.assessments-index__table-wrap,
.reports-index__table-wrap {
  border: 0.5px solid var(--color-border);
  border-radius: var(--radius-lg);
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  background: var(--color-surface-raised);
}

.questions-index table.data-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 0.8125rem;
  table-layout: fixed;
}

.contacts-form .btn-outline,
.contacts-import .btn-outline,
.students-import .btn-outline,
.contacts-form a.btn-outline,
.contacts-import a.btn-outline,
.students-import a.btn-outline {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: 36px;
  padding: 0 1rem;
  border-radius: var(--st-radius-md);
  border: 0.5px solid var(--st-border-secondary);
  background: #fff;
  color: var(--st-text-secondary);
  font-weight: 500;
  font-size: 0.8125rem;
  text-decoration: none;
  white-space: nowrap;
  cursor: pointer;
  transition: background 0.15s ease, border-color 0.15s ease;
}

.contacts-form .btn-outline:hover,
.contacts-import .btn-outline:hover,
.students-import .btn-outline:hover,
.contacts-form a.btn-outline:hover,
.contacts-import a.btn-outline:hover,
.students-import a.btn-outline:hover {
  background: var(--st-bg-secondary);
  border-color: var(--st-border-mid);
  color: var(--st-text-primary);
}

.btn-primary--block,
.students-index__bulk-btn.btn-primary {
  width: 100%;
}

/* ── Contact form (new/edit) ── */
.contacts-form .cf-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 280px);
  gap: 1.25rem;
  align-items: start;
  max-width: 100%;
}

.contacts-form .cf-left {
  display: flex;
  flex-direction: column;
  gap: 1.25rem;
}

.contacts-form .cf-right {
  display: flex;
  flex-direction: column;
  gap: 1.25rem;
  min-width: 0;
}

.contacts-form .cf-card {
  background: #fff;
  border: 0.5px solid var(--st-border-tertiary);
  border-radius: var(--st-radius-lg);
  overflow: hidden;
  box-shadow: 0 1px 2px rgba(28, 25, 23, 0.04);
}

.contacts-form .cf-card__header {
  background: var(--st-bg-secondary);
  padding: 0.7rem 1.25rem;
  border-bottom: 0.5px solid var(--st-border-tertiary);
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.contacts-form .cf-card__title {
  font-size: 0.85rem;
  font-weight: 700;
  color: var(--st-text-primary);
}

.contacts-form .cf-card__hint {
  font-size: 0.775rem;
  color: var(--st-text-tertiary);
}

.contacts-form .cf-card__req,
.contacts-form .cf-req {
  color: #dc2626;
}

.contacts-form .cf-card__body {
  padding: 1.25rem 1.5rem;
}

.contacts-form .cf-card--calendar-colour .colour-palette-field {
  min-width: 0;
  margin: 0;
  padding: 0;
  border: 0;
}

.contacts-form .cf-card--calendar-colour .colour-palette-field__hint {
  margin: 0 0 0.85rem;
  color: var(--st-text-tertiary);
  font-size: 0.775rem;
  line-height: 1.45;
}

.contacts-form .cf-card--calendar-colour .colour-palette-field__options {
  grid-template-columns: repeat(auto-fit, minmax(7.5rem, 1fr));
  gap: 0.6rem;
}

.contacts-form .cf-card--calendar-colour .colour-palette-field__option {
  min-height: 2.5rem;
  padding: 0.45rem 1.8rem 0.45rem 0.6rem;
  font-size: 0.8125rem;
  font-weight: 500;
}

.contacts-form .cf-card--calendar-colour .colour-palette-field__option:has(input:checked) {
  font-weight: 600;
}

.contacts-form .cf-card--calendar-colour .colour-palette-field__swatch {
  width: 1.35rem;
  height: 1.35rem;
}

.contacts-form .cf-fields {
  display: grid;
  gap: 1rem;
}

.contacts-form .cf-fields--2col {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.contacts-form .cf-field {
  display: flex;
  flex-direction: column;
  gap: 0.3rem;
}

.contacts-form .cf-field--full {
  grid-column: 1 / -1;
}

.contacts-form .cf-field label {
  font-size: 0.775rem;
  font-weight: 600;
  color: var(--st-text-secondary);
}

.contacts-form .cf-input {
  display: block;
  width: 100%;
  height: 34px;
  padding: 0 0.7rem;
  border: 0.5px solid var(--st-border-secondary);
  border-radius: var(--st-radius-md);
  background: #fff;
  color: var(--st-text-primary);
  font-size: 0.8125rem;
  box-sizing: border-box;
  outline: none;
  transition: border-color 0.15s, box-shadow 0.15s;
}

.contacts-form .cf-input:focus {
  border-color: var(--st-accent);
  box-shadow: 0 0 0 2px rgba(92, 83, 70, 0.12);
}

.contacts-form textarea.cf-input {
  height: auto;
  min-height: 80px;
  padding: 0.55rem 0.7rem;
  resize: vertical;
}

.contacts-form .cf-sidebar .cf-card__body {
  padding: 1.25rem;
}

.contacts-form .cf-sidebar__body {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}

.contacts-form .cf-upload-zone {
  position: relative;
  border: 1.5px dashed var(--st-border-secondary);
  border-radius: var(--st-radius-md);
  padding: 1.25rem 0.75rem;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.35rem;
  background: var(--st-bg-secondary);
  cursor: pointer;
  transition: border-color 0.15s, background 0.15s;
  text-align: center;
  overflow: hidden;
}

.contacts-form .cf-upload-zone:hover {
  border-color: var(--st-accent);
  background: #ede9e2;
}

.contacts-form .cf-upload-zone__input {
  position: absolute;
  inset: 0;
  opacity: 0;
  cursor: pointer;
  width: 100%;
  height: 100%;
}

.contacts-form .cf-upload-zone__icon {
  font-size: 1.35rem;
}

.contacts-form .cf-upload-zone__label {
  font-size: 0.775rem;
  font-weight: 600;
  color: var(--st-text-primary);
}

.contacts-form .cf-upload-zone__hint {
  font-size: 0.7rem;
  color: var(--st-text-tertiary);
}

.contacts-form .cf-upload-zone__preview {
  width: 100%;
  border-radius: var(--st-radius-sm, 6px);
  border: 0.5px solid var(--st-border-tertiary);
}

.contacts-form .cf-hint {
  font-size: 0.775rem;
  color: var(--st-text-secondary);
  line-height: 1.45;
}

.contacts-form .cf-tag-editor { padding-top: 1rem; border-top: 0.5px solid var(--st-border-tertiary); }
.contacts-form .cf-tag-editor__label { font-size: 0.775rem; font-weight: 600; color: var(--st-text-secondary); }
.contacts-form .cf-tag-editor__options { display: flex; flex-wrap: wrap; gap: .45rem; margin-top: .65rem; }
.contacts-form .cf-tag-editor__option { display: inline-flex; align-items: center; gap: .35rem; cursor: pointer; }
.contacts-form .cf-tag-editor__option input { width: 1rem; height: 1rem; margin: 0; }

.contacts-form .cf-field--staff-roles .cf-hint {
  margin-top: 0.35rem;
}

.contacts-form .cf-role-picker {
  border: 0.5px solid var(--st-border-secondary);
  border-radius: var(--st-radius-md);
  background: var(--st-bg-secondary, #f8f6f2);
  overflow: hidden;
}

.contacts-form .cf-role-picker__list {
  display: flex;
  flex-direction: column;
  max-height: 14rem;
  overflow-y: auto;
}

.contacts-form .cf-role-picker__option {
  display: flex;
  align-items: flex-start;
  gap: 0.6rem;
  padding: 0.65rem 0.75rem;
  border-bottom: 0.5px solid var(--st-border-tertiary, #e8e4dc);
  background: #fff;
  cursor: pointer;
  transition: background 0.12s, border-color 0.12s;
}

.contacts-form .cf-role-picker__option:last-child {
  border-bottom: none;
}

.contacts-form .cf-role-picker__option:hover {
  background: rgba(243, 240, 234, 0.65);
}

.contacts-form .cf-role-picker__option--checked,
.contacts-form .cf-role-picker__option:has(.cf-role-picker__input:checked) {
  background: rgba(92, 83, 70, 0.06);
}

.contacts-form .cf-role-picker__input {
  width: 1rem;
  height: 1rem;
  margin: 0.1rem 0 0;
  flex-shrink: 0;
  accent-color: var(--st-accent, #5c5346);
  cursor: pointer;
}

.contacts-form .cf-role-picker__label {
  display: flex;
  flex-direction: column;
  gap: 0.15rem;
  min-width: 0;
}

.contacts-form .cf-role-picker__name {
  font-size: 0.8125rem;
  font-weight: 600;
  color: var(--st-text-primary);
  line-height: 1.35;
}

.contacts-form .cf-role-picker__badge {
  display: inline-block;
  margin-top: 0.2rem;
  padding: 0.1rem 0.45rem;
  border-radius: 999px;
  font-size: 0.72rem;
  font-weight: 600;
  color: var(--sy-color-primary, #2563eb);
  background: color-mix(in srgb, var(--sy-color-primary, #2563eb) 12%, transparent);
}

.contacts-form .cf-role-picker__desc {
  font-size: 0.75rem;
  color: var(--st-text-secondary);
  line-height: 1.4;
}

.contacts-form .cf-role-picker__empty {
  margin: 0;
  padding: 0.75rem;
  border: 0.5px dashed var(--st-border-secondary);
  border-radius: var(--st-radius-md);
  background: var(--st-bg-secondary, #f8f6f2);
  font-size: 0.8125rem;
  color: var(--st-text-secondary);
  line-height: 1.45;
}

.contacts-form .cf-checkbox-label {
  display: flex;
  align-items: flex-start;
  gap: 0.55rem;
  cursor: pointer;
  font-size: 0.8125rem;
  color: var(--st-text-primary);
}

.contacts-form .cf-staff-fields {
  margin-top: 0.85rem;
  padding-top: 0.85rem;
  border-top: 0.5px solid var(--st-border-secondary);
}

.contacts-form .cf-errors {
  max-width: 960px;
  background: #fef2f2;
  border: 0.5px solid #fecaca;
  border-radius: var(--st-radius-md);
  padding: 1rem 1.15rem;
  margin-bottom: 1.25rem;
  color: #991b1b;
  font-size: 0.875rem;
}

.contacts-form .cf-errors ul {
  margin: 0;
  padding-left: 1.25rem;
}

.contacts-form .cf-actions {
  max-width: 960px;
  margin-top: 1.25rem;
  display: flex;
  gap: 0.65rem;
  align-items: center;
}

.contacts-index__action-link {
  font-size: 0.8125rem;
  font-weight: 600;
  color: var(--schoolise-blue);
  text-decoration: none;
  margin-right: 0.75rem;
}

/* Contact show (AssessMap-style warm layout + notes tab) */
.contact-show {
  --cs-canvas: #f9f8f4;
  --cs-text: #1c1917;
  --cs-text-secondary: #57534e;
  --cs-text-muted: #78716c;
  --cs-bg: #ffffff;
  --cs-bg-soft: #f3f0ea;
  --cs-border: #e8e4dc;
  --cs-accent: #5c5346;
  --cs-accent-strong: #433a32;
  --cs-radius: 12px;
  padding: 1rem 1rem 2.5rem;
  margin-bottom: 0;
  background-color: var(--cs-canvas);
  border-radius: var(--cs-radius);
}

.contact-show__header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 1rem;
  margin-bottom: 1.25rem;
}

.contact-show__title {
  margin: 0 0 0.25rem;
  color: var(--cs-text);
}

.contact-show__subtitle {
  margin: 0;
  color: var(--cs-text-secondary);
}

.contact-show__header-actions {
  display: flex;
  gap: 0.6rem;
  align-items: center;
  flex-wrap: wrap;
}

.contact-show__header .nav-link {
  color: var(--cs-accent);
  font-weight: 600;
  text-decoration: none;
}

.contact-show__header .nav-link:hover {
  color: var(--cs-accent-strong);
}

.contact-show__layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(280px, 340px);
  gap: 1.25rem;
  align-items: start;
}

.contact-show .auth-card.contact-show__main {
  padding: 0;
  border-radius: var(--cs-radius);
  border: 0.5px solid var(--cs-border);
  box-shadow: 0 4px 24px rgba(28, 25, 23, 0.06);
  overflow: hidden;
  background: var(--cs-bg);
}

.contact-show .auth-card.contact-show__main:has(.lr-insights) {
  overflow: visible;
}

.contact-show .auth-card.contact-show__main:has(.lr-insights) .contact-show__body {
  overflow: visible;
}

.contact-show .auth-card.contact-show__sidebar {
  padding: 0;
  border-radius: var(--cs-radius);
  border: 0.5px solid var(--cs-border);
  box-shadow: 0 4px 24px rgba(28, 25, 23, 0.06);
  background: var(--cs-bg);
  min-width: 0;
}

.contact-show__main {
  min-width: 0;
}

.contact-show__tabs-bar {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem 1rem;
  padding: 0.85rem 1rem;
  border-bottom: 0.5px solid var(--cs-border);
  background: var(--cs-bg-soft);
}

.contact-show__tabs-bar .cp-tab {
  text-decoration: none;
  font-weight: 600;
  padding: 0.45rem 0.8rem;
  border-radius: 8px;
  display: inline-block;
  font-size: 0.875rem;
  color: var(--cs-text-secondary);
  transition: background 0.12s, color 0.12s;
}

.contact-show__tabs-bar .cp-tab:hover {
  background: var(--cs-border);
  color: var(--cs-text);
}

.contact-show__tabs-bar .cp-tab--active {
  background: var(--cs-bg);
  color: var(--cs-text);
  font-weight: 700;
  box-shadow: 0 1px 3px rgba(28, 25, 23, 0.08);
}

.contact-show__body {
  padding: 1.1rem 1.25rem;
  min-width: 0;
}

.contact-show__sidebar-head {
  display: flex;
  gap: 0.75rem;
  align-items: center;
  padding: 1.1rem 1.25rem;
  border-bottom: 0.5px solid var(--cs-border);
}

.contact-show__avatar,
.contact-show__avatar-placeholder {
  width: 4rem;
  height: 4rem;
  border-radius: 999px;
  flex-shrink: 0;
  object-fit: cover;
}

.contact-show__avatar-placeholder {
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--cs-bg-soft);
  color: var(--cs-accent);
  font-size: 1.5rem;
  font-weight: 700;
}

.contact-show__sidebar-name {
  font-weight: 700;
  color: var(--cs-text);
}

.contact-show__sidebar-role {
  font-size: 0.8125rem;
  color: var(--cs-text-muted);
}

.contact-show__sidebar-block,
.contact-show__sidebar-divider {
  padding: 1rem 1.25rem;
}

.contact-show__sidebar-divider {
  border-top: 0.5px solid var(--cs-border);
}

.contact-show__muted-label {
  font-size: 0.75rem;
  font-weight: 600;
  color: var(--cs-text-muted);
  margin-bottom: 0.35rem;
}

.contact-show__muted-label--section {
  margin-bottom: 0.75rem;
}

.contact-show__details-grid {
  display: grid;
  gap: 0.65rem;
  font-size: 0.875rem;
  color: var(--cs-text);
}

.contact-show__detail-sub {
  margin-top: 0.15rem;
}

.contact-show__extra-fields {
  display: grid;
  gap: 0.35rem;
}

.contact-show__sidebar-link {
  font-weight: 600;
}

.contact-show .nav-link.contact-show__sidebar-link {
  color: var(--cs-accent);
  text-decoration: none;
}

.contact-show .nav-link.contact-show__sidebar-link:hover {
  color: var(--cs-accent-strong);
}

.contact-show__mono {
  font-family: ui-monospace, monospace;
  font-size: 0.8125rem;
}

.contact-show__status-pill {
  display: inline-block;
  padding: 0.2rem 0.55rem;
  border-radius: 999px;
  font-size: 0.75rem;
  font-weight: 600;
}

.contact-show__status-pill--on {
  background: #dcfce7;
  color: #166534;
}

.contact-show__status-pill--off {
  background: #f1f5f9;
  color: var(--st-text-secondary);
}

.contact-show__status-form {
  margin: 0;
}

.active-inactive-toggle {
  display: inline-flex;
  border-radius: 999px;
  overflow: hidden;
  border: 1px solid var(--cs-border);
}

.active-inactive-toggle__form {
  display: contents;
  margin: 0;
}

.active-inactive-toggle__btn {
  display: inline-block;
  border: none;
  border-left: 1px solid var(--cs-border);
  padding: 0.4rem 0.95rem;
  font-size: 0.8rem;
  font-weight: 700;
  cursor: pointer;
  background: var(--cs-bg-soft);
  color: var(--cs-accent-strong);
  text-align: center;
  user-select: none;
  font-family: inherit;
}

.active-inactive-toggle__btn--active {
  border-left: none;
}

.active-inactive-toggle__btn--active.is-selected {
  background: #16a34a;
  color: #fff;
  cursor: default;
}

.active-inactive-toggle__btn--inactive.is-selected {
  background: #dc2626;
  color: #fff;
  cursor: default;
}

.active-inactive-toggle__btn:disabled {
  opacity: 1;
}

.contact-show__portal-block {
  margin-top: 0.35rem;
}

.contact-show__portal-badge {
  display: inline-block;
  padding: 0.25rem 0.6rem;
  border-radius: 999px;
  font-size: 0.75rem;
  font-weight: 600;
}

.contact-show__portal-badge--active {
  background: #dcfce7;
  color: #166534;
}

.contact-show__portal-badge--invited {
  background: #fef3c7;
  color: #92400e;
}

.contact-show__portal-badge--suspended {
  background: #fee2e2;
  color: #991b1b;
}

.contact-show__portal-badge--neutral {
  background: #f1f5f9;
  color: var(--st-text-secondary);
}

.contact-show__portal-role {
  margin-top: 0.3rem;
  font-size: 0.8125rem;
  color: var(--st-text-secondary);
}

.contact-show__portal-action {
  margin-top: 0.5rem;
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  align-items: center;
}

.nav-link--compact {
  display: inline-block;
  font-size: 0.8125rem;
  padding: 0.3rem 0.6rem;
}

.contact-show .auth-card.contact-show__main textarea.cp-notes__textarea {
  width: 100%;
  padding: 0.55rem 0.7rem;
  border-radius: 8px;
  border: 0.5px solid #ddd8cf;
  background: #fff;
  resize: vertical;
  font-size: 0.875rem;
  font-family: inherit;
  color: var(--cs-text);
  outline: none;
  transition: border-color 0.15s, box-shadow 0.15s;
  box-sizing: border-box;
}

.contact-show .auth-card.contact-show__main textarea.cp-notes__textarea:focus {
  border-color: var(--cs-accent);
  box-shadow: 0 0 0 2px rgba(92, 83, 70, 0.12);
}

.cp-notes {
  display: flex;
  flex-direction: column;
  gap: 1.25rem;
}

.cp-notes__title {
  font-weight: 700;
  margin-bottom: 0.5rem;
  color: var(--cs-text);
  font-size: 0.9rem;
}

.cp-notes__submit {
  margin-top: 0.6rem;
}

.cp-note-list {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
}

.cp-note-card {
  background: var(--cs-bg);
  border: 0.5px solid #ddd8cf;
  border-radius: 8px;
  padding: 0.9rem 1rem;
}

.cp-note-card__meta {
  display: flex;
  justify-content: space-between;
  gap: 1rem;
  align-items: flex-start;
}

.cp-note-card__author {
  color: var(--cs-text-secondary);
  font-size: 0.82rem;
  font-weight: 600;
}

.cp-note-card__dot {
  color: #a8a29e;
}

.cp-note-card__body {
  margin-top: 0.6rem;
  white-space: pre-wrap;
  line-height: 1.55;
  font-size: 0.9rem;
  color: var(--cs-text);
}

.student-lesson-observations {
  padding-top: 1.15rem;
  border-top: 1px solid var(--st-border-tertiary, #e8e4dc);
}

.student-lesson-observations__header {
  margin-bottom: 0.75rem;
}

.student-lesson-observations__title {
  margin: 0;
  color: var(--cs-text);
  font-size: 0.9rem;
}

.student-lesson-observations__lead {
  margin: 0.25rem 0 0;
  color: var(--cs-text-secondary);
  font-size: 0.8rem;
  line-height: 1.45;
}

.student-lesson-observations__list {
  display: grid;
  gap: 0.75rem;
}

.student-lesson-observation {
  padding: 0.9rem 1rem;
  border: 1px solid var(--st-border-tertiary, #e8e4dc);
  border-left: 3px solid #a8a29e;
  border-radius: 8px;
  background: var(--cs-bg);
}

.student-lesson-observation__meta {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  gap: 0.35rem 1rem;
  color: var(--cs-text-secondary);
  font-size: 0.75rem;
}

.student-lesson-observation__meta > div {
  display: flex;
  flex-wrap: wrap;
  gap: 0.25rem;
}

.student-lesson-observation__body {
  margin: 0.65rem 0 0;
  color: var(--cs-text);
  font-size: 0.875rem;
  line-height: 1.5;
  white-space: pre-wrap;
}

.student-lesson-observation__link {
  display: inline-block;
  margin-top: 0.65rem;
  font-size: 0.78rem;
  font-weight: 650;
}

.student-lesson-observations__pagination {
  margin-top: 1rem;
}

.cp-note-delete {
  background: #fef2f2;
  border: 0.5px solid #fecaca;
  color: #991b1b;
  padding: 0.22rem 0.65rem;
  border-radius: 999px;
  font-size: 0.775rem;
  font-weight: 700;
  cursor: pointer;
  white-space: nowrap;
  flex-shrink: 0;
  font-family: inherit;
}

.cp-note-delete:hover {
  background: #fecaca;
}

.cp-tab-empty {
  color: var(--cs-text-secondary);
  font-size: 0.9rem;
  margin: 0;
}

.cp-tab-heading {
  font-weight: 800;
  margin-bottom: 0.35rem;
  color: var(--st-text-primary);
}

.cp-tab-lead {
  margin: 0 0 1rem;
  font-size: 0.875rem;
  line-height: 1.5;
  color: var(--st-text-secondary);
}

/* Teacher "Teaching allocations" tab sections */
.cp-groups-section {
  margin-bottom: 1.75rem;
}

.cp-groups-section:last-child {
  margin-bottom: 0;
}

.cp-groups-section__title {
  font-size: 0.9375rem;
  font-weight: 700;
  line-height: 1.3;
  margin: 0 0 0.65rem;
  color: var(--st-text-primary);
}

.cp-groups-section__hint {
  font-size: 0.8125rem;
  line-height: 1.5;
  color: var(--st-text-tertiary);
  margin: 0.65rem 0 0;
}

/* Empty + hint pairing reads as a single tidy note */
.cp-groups-note {
  display: flex;
  align-items: flex-start;
  gap: 0.6rem;
  padding: 0.75rem 0.9rem;
  background: var(--st-bg-secondary);
  border: 0.5px solid var(--st-border-secondary);
  border-radius: var(--st-radius-sm, 8px);
}

.cp-groups-note__icon {
  flex: 0 0 auto;
  display: inline-flex;
  color: var(--st-text-tertiary);
  margin-top: 0.05rem;
}

.cp-groups-note__body {
  min-width: 0;
}

.cp-groups-note__title {
  font-size: 0.875rem;
  font-weight: 600;
  color: var(--st-text-primary);
  margin: 0;
}

.cp-groups-note__text {
  font-size: 0.8125rem;
  line-height: 1.5;
  color: var(--st-text-tertiary);
  margin: 0.2rem 0 0;
}

.cp-group-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 0.6rem;
}

.cp-group-chip {
  display: flex;
  align-items: center;
  gap: 0.35rem;
  background: var(--st-bg-secondary);
  border: 0.5px solid var(--st-border-secondary);
  padding: 0.3rem 0.55rem 0.3rem 0.8rem;
  border-radius: 999px;
  font-weight: 700;
  color: var(--st-text-primary);
  font-size: 0.875rem;
}

.cp-chip-link {
  text-decoration: none;
  color: var(--st-text-primary);
  font-weight: 700;
}

.cp-chip-link:hover {
  color: var(--st-accent);
}

.cp-chip-meta {
  font-weight: 500;
  color: var(--st-text-tertiary);
  font-size: 0.775rem;
}

.cp-chip-remove {
  background: none;
  border: none;
  color: var(--st-text-tertiary);
  font-weight: 700;
  cursor: pointer;
  padding: 0 0.15rem;
  line-height: 1;
  font-size: 0.8rem;
}

.cp-chip-remove:hover {
  color: #991b1b;
}

.cp-add-group-form {
  margin-top: 1rem;
  max-width: 440px;
}

.cp-add-group-form--class-course {
  max-width: none;
}

.cp-add-group-form form {
  display: flex;
  flex-wrap: wrap;
  gap: 0.65rem;
  align-items: center;
}

.cp-add-group-form--class-course form {
  display: grid;
  gap: 0.65rem;
  align-items: center;
}

@media (min-width: 640px) {
  .cp-add-group-form--class-course form {
    grid-template-columns: minmax(0, 1.15fr) minmax(0, 1.15fr) minmax(7.5rem, 0.85fr) auto;
  }
}

.cp-add-group-select {
  flex: 1;
  min-width: 0;
  width: 100%;
  min-height: 2.75rem;
  padding: 0.5rem 0.75rem;
  border-radius: var(--st-radius-sm);
  border: 1px solid var(--st-border-secondary);
  background: var(--st-bg-primary);
  color: var(--st-text-primary);
  font-size: 0.875rem;
  outline: none;
}

.cp-add-group-select:disabled {
  background: var(--st-bg-secondary, #f5f3ef);
  color: var(--st-text-tertiary);
  cursor: not-allowed;
}

.cp-add-group-select:focus {
  border-color: var(--st-accent);
  box-shadow: 0 0 0 2px rgba(92, 83, 70, 0.12);
}

.cp-add-group-form .btn-primary {
  min-height: 2.75rem;
  white-space: nowrap;
}

@media (max-width: 639px) {
  .cp-add-group-form--class-course form {
    grid-template-columns: 1fr;
  }

  .cp-add-group-form--class-course .btn-primary {
    width: 100%;
  }
}

.tc-list {
  display: grid;
  gap: 0.75rem;
}

.contact-show .cp-badge {
  display: inline-flex;
  align-items: center;
  padding: 0.15rem 0.5rem;
  border-radius: 999px;
  font-size: 0.6875rem;
  font-weight: 600;
  white-space: nowrap;
}

.contact-show .cp-badge--neutral {
  background: var(--st-bg-secondary);
  color: var(--st-text-secondary);
  border: 0.5px solid var(--st-border-secondary);
}

.tc-card {
  display: flex;
  flex-direction: column;
  gap: 0.85rem;
  padding: 0.9rem 1rem;
  border: 0.5px solid var(--st-border-secondary);
  border-radius: var(--st-radius-md);
  background: var(--st-bg-primary);
  min-width: 0;
}

.tc-card__head {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.45rem 0.65rem;
  min-width: 0;
}

.tc-section + .tc-section {
  margin-top: 0.25rem;
  padding-top: 0.25rem;
}

.tc-meta {
  display: flex;
  flex-direction: column;
  gap: 0.35rem;
  margin: 0;
}

.tc-meta__row {
  display: grid;
  grid-template-columns: minmax(6.5rem, 8.5rem) minmax(0, 1fr);
  gap: 0.35rem 0.75rem;
  align-items: baseline;
}

.tc-meta__label {
  margin: 0;
  font-size: 0.75rem;
  font-weight: 600;
  color: var(--st-text-tertiary);
}

.tc-meta__value {
  margin: 0;
  font-size: 0.875rem;
  color: var(--st-text-primary);
  min-width: 0;
}

.tc-meta__muted {
  color: var(--st-text-tertiary);
  font-weight: 500;
}

@media (max-width: 640px) {
  .tc-meta__row {
    grid-template-columns: 1fr;
    gap: 0.1rem;
  }
}

.tc-card__title {
  font-weight: 700;
  font-size: 0.9375rem;
  color: var(--st-text-primary);
  text-decoration: none;
}

.tc-card__title:hover {
  color: var(--st-accent);
}

.tc-card__notes {
  margin: 0;
  font-size: 0.8125rem;
  line-height: 1.45;
  color: var(--st-text-secondary);
}

.tc-card__actions {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  justify-content: space-between;
  gap: 0.75rem;
  padding-top: 0.15rem;
  border-top: 0.5px solid var(--st-border-tertiary);
}

.tc-card__form {
  display: flex;
  flex: 1 1 16rem;
  flex-wrap: wrap;
  align-items: flex-end;
  gap: 0.65rem;
  min-width: 0;
}

.tc-card__notes-input {
  flex: 1 1 12rem;
  min-width: 0;
  max-width: 100%;
  padding: 0.45rem 0.65rem;
  border-radius: var(--st-radius-sm);
  border: 0.5px solid var(--st-border-secondary);
  background: var(--st-bg-primary);
  color: var(--st-text-primary);
  font-size: 0.875rem;
}

.tc-card__notes-input:focus {
  border-color: var(--st-accent);
  box-shadow: 0 0 0 2px rgba(92, 83, 70, 0.12);
  outline: none;
}

.tc-card__save {
  flex-shrink: 0;
  min-height: 2.25rem;
}

.tc-card__remove-form {
  margin: 0;
  flex-shrink: 0;
  align-self: flex-end;
  margin-left: auto;
}

.tc-card__remove {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 2.25rem;
  padding: 0.45rem 0.85rem;
  border: 0.5px solid var(--st-border-secondary);
  border-radius: var(--st-radius-sm);
  background: var(--st-bg-secondary);
  color: var(--st-text-secondary);
  font-size: 0.8125rem;
  font-weight: 600;
  cursor: pointer;
}

.tc-card__remove:hover {
  color: #991b1b;
  border-color: #fecaca;
  background: #fef2f2;
}

.tc-check {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  font-size: 0.82rem;
  font-weight: 600;
  color: var(--st-text-secondary);
  white-space: nowrap;
}

.tc-check-block {
  display: flex;
  flex-direction: column;
  gap: 0.2rem;
  min-width: 0;
}

.tc-check-hint {
  margin: 0;
  font-size: 0.75rem;
  line-height: 1.4;
  font-weight: 500;
  color: var(--st-text-tertiary);
  max-width: 18rem;
}

.tc-add-form {
  margin-top: 1.25rem;
  padding: 1rem 1.1rem;
  border: 0.5px solid var(--st-border-secondary);
  border-radius: var(--st-radius-md);
  background: var(--st-bg-secondary, #f3f0ea);
}

.tc-add-form__title {
  margin: 0 0 0.85rem;
  font-size: 0.875rem;
  font-weight: 700;
  color: var(--st-text-primary);
}

.tc-add-form__form {
  display: flex;
  flex-direction: column;
  gap: 0.85rem;
}

.tc-add-form__main {
  display: grid;
  gap: 0.75rem;
  min-width: 0;
}

.tc-add-form__select {
  width: 100%;
  min-width: 0;
  min-height: 2.75rem;
  padding: 0.5rem 0.75rem;
  border-radius: var(--st-radius-sm);
  border: 0.5px solid var(--st-border-secondary);
  background: var(--st-bg-primary);
  color: var(--st-text-primary);
  font-size: 0.875rem;
}

.tc-add-form__options {
  display: grid;
  gap: 0.75rem;
  min-width: 0;
}

.tc-add-form__notes {
  width: 100%;
  min-width: 0;
  max-width: none;
  min-height: 2.75rem;
  padding: 0.5rem 0.75rem;
  border-radius: var(--st-radius-sm);
  border: 0.5px solid var(--st-border-secondary);
  background: var(--st-bg-primary);
  color: var(--st-text-primary);
  font-size: 0.875rem;
}

.tc-add-form__notes:focus,
.tc-add-form__select:focus {
  border-color: var(--st-accent);
  box-shadow: 0 0 0 2px rgba(92, 83, 70, 0.12);
  outline: none;
}

.tc-add-form__submit {
  flex-shrink: 0;
  min-height: 2.75rem;
  white-space: nowrap;
}

.tc-add-form .tc-check-hint {
  max-width: none;
}

@media (min-width: 640px) {
  .tc-add-form__main {
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
  }

  .tc-add-form__options {
    grid-template-columns: minmax(12rem, 0.85fr) minmax(0, 1.15fr);
    align-items: start;
  }

  .tc-card__form {
    flex-wrap: nowrap;
  }

  .tc-card__actions {
    flex-wrap: nowrap;
  }
}

@media (max-width: 639px) {
  .tc-add-form__submit {
    width: 100%;
  }
}

/* Legacy aliases kept for any cached partials */
.tc-row {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
  padding: 0.85rem;
  border: 0.5px solid var(--st-border-secondary);
  border-radius: var(--st-radius-md);
  background: var(--st-bg-primary);
}

.tc-row__main {
  display: flex;
  flex-wrap: wrap;
  gap: 0.45rem 0.65rem;
  align-items: center;
}

.tc-row__form {
  display: flex;
  flex-wrap: wrap;
  gap: 0.65rem;
  align-items: center;
}

.tc-notes {
  min-width: 0;
  max-width: 100%;
}

.tc-remove {
  flex-shrink: 0;
}

.cp-add-group-select:focus {
  border-color: var(--st-accent);
  box-shadow: 0 0 0 2px rgba(92, 83, 70, 0.12);
}

.cp-class-allocation-list {
  display: flex;
  flex-direction: column;
  gap: 0.65rem;
}

.cp-class-allocation {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 0.75rem;
  padding: 0.85rem 1rem;
  border: 0.5px solid var(--st-border-secondary);
  border-radius: var(--st-radius-md);
  background: var(--st-bg-secondary);
}

.cp-class-allocation__main {
  min-width: 0;
}

.cp-class-allocation__name {
  display: inline-block;
  font-weight: 700;
  font-size: 0.9375rem;
  margin-bottom: 0.35rem;
}

.cp-class-allocation__meta {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.45rem 0.65rem;
}

.cp-class-allocation__context {
  font-size: 0.8125rem;
  color: var(--st-text-secondary);
}

.cp-class-allocation__remove {
  flex-shrink: 0;
  background: none;
  border: none;
  color: var(--st-text-tertiary);
  font-size: 0.8125rem;
  font-weight: 600;
  cursor: pointer;
  padding: 0.2rem 0;
  text-decoration: underline;
}

.cp-class-allocation__remove:hover {
  color: #991b1b;
}

.cp-add-class-form {
  max-width: 100%;
}

.cp-add-class-form__fields {
  display: flex;
  flex-wrap: wrap;
  gap: 0.65rem;
  flex: 1 1 100%;
}

.cp-add-class-form__role {
  min-width: 9rem;
  flex: 0 1 12rem;
}

.cp-tab-empty--inline {
  margin-top: 1rem;
}

@media (max-width: 640px) {
  .cp-class-allocation {
    flex-direction: column;
    align-items: stretch;
  }

  .cp-add-class-form__fields {
    flex-direction: column;
  }

  .cp-add-class-form__role {
    flex: 1 1 auto;
    width: 100%;
  }
}

.contact-show__banner-warn {
  margin-bottom: 1.25rem;
  padding: 0.85rem 1.1rem;
  background: #fef9e8;
  border: 1px solid #e8d5a8;
  border-radius: var(--radius-lg);
  color: #5c4d24;
  font-size: 0.92rem;
  line-height: 1.5;
}

.contact-show__banner-cta {
  font-weight: 600;
  margin-left: 0.35rem;
}

.contact-show__link-stack {
  display: grid;
  gap: 0.12rem;
}

.contact-show__parent-slots {
  display: grid;
  gap: 0.45rem;
}

.contact-show__parent-slot {
  text-align: left;
}

.contact-show__sibling-reason {
  font-size: 0.8rem;
  line-height: 1.15;
  color: var(--st-text-secondary);
}

@media (max-width: 1023px) {
  .contacts-form .cf-layout {
    grid-template-columns: minmax(0, 1fr);
  }

  .contacts-form .cf-layout > .cf-left,
  .contacts-form .cf-layout > .cf-right,
  .contacts-form .cf-sidebar {
    min-width: 0;
    max-width: 100%;
  }

  .contacts-form .cf-fields--2col {
    grid-template-columns: minmax(0, 1fr);
  }

  .contact-show__layout {
    grid-template-columns: 1fr;
  }

  .contact-show__header {
    flex-direction: column;
    align-items: stretch;
  }

  .contact-show__tabs-bar {
    gap: 0.35rem;
  }

  .contact-show__tabs-bar .cp-tab {
    font-size: 0.8125rem;
    padding: 0.4rem 0.65rem;
  }

  .tc-card__actions {
    flex-direction: column;
    align-items: stretch;
  }

  .tc-card__form {
    flex-direction: column;
    align-items: stretch;
  }

  .tc-card__save,
  .tc-card__remove {
    width: 100%;
  }

  .cp-note-card__meta {
    flex-direction: column;
    align-items: flex-start;
  }

  .students-index__bulk-layout {
    flex-direction: column;
  }

  .students-index__bulk-sidebar {
    flex: 1 1 100%;
    position: static;
    width: 100%;
  }
}

@media (max-width: 767px) {
  .contacts-form .cf-layout {
    gap: 1rem;
  }

  .contacts-form .cf-left {
    gap: 1rem;
  }

  .contacts-form .cf-card__header {
    flex-wrap: wrap;
    align-items: flex-start;
    gap: 0.35rem 0.75rem;
    padding: 0.65rem 1rem;
  }

  .contacts-form .cf-card__hint {
    flex: 1 1 100%;
    margin-left: 0 !important;
    line-height: 1.35;
  }

  .contacts-form .cf-card__body {
    padding: 1rem;
  }

  .contacts-form .cf-sidebar .cf-card__body {
    padding: 1rem;
  }

  .contacts-form .cf-field {
    min-width: 0;
  }

  .contacts-form .cf-field label {
    line-height: 1.35;
  }

  .contacts-form .cf-errors,
  .contacts-form .cf-actions {
    max-width: none;
  }

  .contacts-form .cf-actions {
    flex-direction: column;
    align-items: stretch;
    gap: 0.5rem;
  }

  .contacts-form .cf-actions .btn-primary,
  .contacts-form .cf-actions .btn-outline {
    width: 100%;
    justify-content: center;
    text-align: center;
  }

  .contacts-form .cf-role-picker__option {
    min-height: 44px;
    padding-top: 0.75rem;
    padding-bottom: 0.75rem;
  }

  .contacts-form .cf-role-picker__input {
    width: 1.125rem;
    height: 1.125rem;
  }
}

.stg-parent-links {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}

.stg-parent-links__row {
  padding: 0.85rem 0;
  border-bottom: 0.5px solid var(--st-border-tertiary);
}

.stg-parent-links__row:last-child {
  border-bottom: none;
  padding-bottom: 0;
}

.stg-parent-links__fields {
  display: grid;
  grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr) minmax(0, 0.8fr);
  gap: 0.75rem;
  align-items: end;
}

.stg-parent-links__primary,
.stg-parent-links__remove {
  display: flex;
  align-items: center;
  gap: 0.45rem;
  min-height: 2.5rem;
}

.stg-parent-links__checkbox {
  width: 15px;
  height: 15px;
  accent-color: var(--st-accent);
}

.stg-enrollment-editor {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}

.stg-enrollment-editor__title {
  margin: 0 0 0.25rem;
  font-size: 0.8125rem;
  font-weight: 600;
  color: var(--st-text-secondary);
}

.stg-enrollment-editor__row {
  padding: 0.85rem 0;
  border-bottom: 0.5px solid var(--st-border-tertiary);
}

.stg-enrollment-editor__row:last-child {
  border-bottom: none;
  padding-bottom: 0;
}

.stg-enrollment-editor__row:last-child {
  border-bottom: none;
  padding-bottom: 0;
}

/* Student form — AssessMap-aligned enrolment and parent slots */
.sf-card {
  background: var(--st-bg-primary);
  border: 0.5px solid var(--st-border-secondary);
  border-radius: var(--st-radius-md);
  box-shadow: 0 1px 3px rgba(28, 25, 23, 0.06), 0 4px 12px rgba(28, 25, 23, 0.04);
  overflow: hidden;
  margin-bottom: 1.25rem;
}

.sf-card__header {
  background: var(--st-bg-secondary);
  padding: 0.7rem 1.25rem;
  border-bottom: 0.5px solid var(--st-border-secondary);
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 0.5rem;
}

.sf-card__title {
  font-size: 0.85rem;
  font-weight: 700;
  color: var(--st-text-primary);
}

.sf-card__hint {
  font-size: 0.775rem;
  color: var(--st-text-tertiary);
  margin-left: auto;
  line-height: 1.45;
}

.sf-card__body {
  padding: 1.25rem 1.5rem;
}

.sf-notice {
  padding: 0.85rem 1.1rem;
  border-radius: var(--st-radius-sm);
  border: 0.5px solid var(--st-border-secondary);
  font-size: 0.875rem;
  line-height: 1.5;
  margin-bottom: 1.25rem;
}

.sf-notice--warn {
  background: #fffbeb;
  border-color: #fcd34d;
  color: #78350f;
}

.sf-enrolment-row {
  display: grid;
  grid-template-columns: 1fr 1fr auto;
  gap: 1rem;
  align-items: end;
  padding-bottom: 1rem;
  border-bottom: 0.5px solid var(--st-border-tertiary);
  margin-bottom: 1rem;
}

.sf-enrolment-row:last-child {
  border-bottom: none;
  margin-bottom: 0;
  padding-bottom: 0;
}

.sf-remove-label,
.sf-unlink-label {
  display: flex;
  align-items: center;
  gap: 0.4rem;
  font-size: 0.8rem;
  color: #991b1b;
  cursor: pointer;
  white-space: nowrap;
  padding-bottom: 0.5rem;
  min-height: 44px;
}

.sf-parents-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1.5rem;
}

.sf-parent-card {
  border: 0.5px solid var(--st-border-secondary);
  border-radius: var(--st-radius-sm);
  overflow: hidden;
  min-width: 0;
}

.sf-parent-card__header {
  background: var(--st-bg-secondary);
  padding: 0.65rem 1rem;
  border-bottom: 0.5px solid var(--st-border-secondary);
  font-size: 0.8rem;
  font-weight: 700;
  color: var(--st-text-primary);
}

.sf-parent-card__body {
  padding: 1.1rem 1.15rem;
  display: flex;
  flex-direction: column;
  gap: 1rem;
  min-width: 0;
}

.sf-parent-card__body .cf-field {
  min-width: 0;
}

.sf-adult-label {
  display: flex;
  align-items: center;
  gap: 0.45rem;
  font-size: 0.8125rem;
  min-height: 44px;
}

.sf-parent-address-fields {
  display: flex;
  flex-direction: column;
  gap: 0.85rem;
  margin-top: 0.15rem;
  padding-top: 0.85rem;
  border-top: 0.5px solid var(--st-border-tertiary);
}

.sf-parent-address-fields[hidden] {
  display: none !important;
}

.sf-parent-mini-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.85rem 1rem;
}

.sf-parent-mini-field {
  display: flex;
  flex-direction: column;
  gap: 0.35rem;
  min-width: 0;
}

.sf-parent-mini-field label {
  font-size: 0.72rem;
  font-weight: 600;
  color: var(--st-text-tertiary);
  line-height: 1.35;
}

.sf-parent-mini-field input,
.sf-parent-mini-field select {
  height: 34px;
  padding: 0 0.65rem;
  border: 0.5px solid var(--st-border-tertiary);
  border-radius: var(--st-radius-sm);
  background: var(--st-bg-primary);
  font-size: 0.775rem;
  color: var(--st-text-primary);
  width: 100%;
  max-width: 100%;
  min-width: 0;
  box-sizing: border-box;
  font-family: inherit;
  outline: none;
}

.sf-parent-mini-field input:focus,
.sf-parent-mini-field select:focus {
  border-color: var(--st-accent);
  box-shadow: 0 0 0 2px rgba(92, 83, 70, 0.12);
}

@media (max-width: 900px) {
  .sf-enrolment-row {
    grid-template-columns: minmax(0, 1fr);
  }

  .sf-parents-grid {
    grid-template-columns: minmax(0, 1fr);
    gap: 1.75rem;
  }

  .sf-parent-mini-grid {
    grid-template-columns: minmax(0, 1fr);
  }

  .sf-card__header {
    flex-direction: column;
    align-items: flex-start;
  }

  .sf-card__hint {
    margin-left: 0;
  }

  .sf-card__body {
    padding: 1rem;
  }
}

/* Student form — guardians and family */
.sf-card--guardians .sf-card__header {
  align-items: flex-start;
}

.sf-card--guardians .sf-card__hint {
  margin-left: 0;
  flex: 1 1 100%;
  font-size: 0.775rem;
  color: var(--st-text-tertiary);
  line-height: 1.45;
}

.sf-guardians-grid {
  display: flex;
  flex-direction: column;
  gap: 1.25rem;
}

.sf-guardian-card {
  border: 0.5px solid var(--st-border-secondary);
  border-radius: var(--st-radius-md);
  overflow: hidden;
  min-width: 0;
  background: var(--st-bg-primary);
}

.sf-guardian-card__header {
  background: var(--st-bg-secondary);
  padding: 0.65rem 1rem;
  border-bottom: 0.5px solid var(--st-border-secondary);
}

.sf-guardian-card__title {
  font-size: 0.8rem;
  font-weight: 700;
  color: var(--st-text-primary);
}

.sf-guardian-card__body {
  padding: 1.15rem 1.25rem;
  display: flex;
  flex-direction: column;
  gap: 1.15rem;
  min-width: 0;
}

.sf-guardian-section {
  display: flex;
  flex-direction: column;
  gap: 0.85rem;
  min-width: 0;
}

.sf-guardian-section__label {
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--st-text-tertiary);
}

.sf-guardian-fields-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.85rem 1rem;
}

.sf-guardian-new-fields[hidden] {
  display: none !important;
}

.sf-guardian-checkboxes {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.5rem 1rem;
  padding: 0.85rem 1rem;
  background: var(--st-bg-secondary);
  border: 0.5px solid var(--st-border-tertiary);
  border-radius: var(--st-radius-sm);
}

.sf-guardian-checkboxes--communication {
  grid-template-columns: minmax(0, 1fr);
}

.sf-checkbox {
  display: flex;
  align-items: flex-start;
  gap: 0.5rem;
  font-size: 0.8125rem;
  line-height: 1.4;
  color: var(--st-text-secondary);
  min-height: 44px;
  cursor: pointer;
}

.sf-checkbox input[type="checkbox"] {
  width: 1rem;
  height: 1rem;
  margin-top: 0.15rem;
  flex-shrink: 0;
  accent-color: var(--st-accent);
}

.sf-checkbox--danger {
  color: #991b1b;
}

.sf-guardian-section--danger {
  padding-top: 0.85rem;
  border-top: 0.5px solid var(--st-border-tertiary);
}

.sf-guardian-actions {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 0.65rem;
  margin-top: 1.25rem;
  padding-top: 1.15rem;
  border-top: 0.5px solid var(--st-border-tertiary);
}

.sf-guardian-add-btn {
  min-height: 44px;
}

.sf-guardian-hint {
  margin: 0;
}

.contacts-form .sf-guardian-card .cf-field {
  min-width: 0;
}

.contacts-form .sf-guardian-card .cf-field label {
  font-size: 0.775rem;
  font-weight: 600;
  color: var(--st-text-secondary);
}

@media (max-width: 640px) {
  .sf-guardian-fields-grid,
  .sf-guardian-checkboxes {
    grid-template-columns: minmax(0, 1fr);
  }

  .sf-guardian-card__body {
    padding: 1rem;
  }
}

.contact-show__academic-current {
  margin-top: 0.25rem;
}

.contact-show__academic-year {
  font-weight: 700;
  color: var(--st-text-primary);
}

.contact-show__academic-level {
  font-size: 0.875rem;
  color: var(--st-text-secondary);
}

.contact-show__academic-history-row {
  font-size: 0.8125rem;
  color: var(--st-text-secondary);
}

.contact-show__guardian-row {
  display: grid;
  gap: 0.15rem;
}

.contact-show__guardian-meta,
.contact-show__guardian-comm {
  font-size: 0.75rem;
  color: var(--st-text-tertiary);
}

.cp-class-section {
  margin-bottom: 1.25rem;
}

.cp-class-section__title {
  margin: 0 0 0.5rem;
  font-size: 0.8125rem;
  font-weight: 700;
  color: var(--st-text-secondary);
  text-transform: uppercase;
  letter-spacing: 0.03em;
}
/* Private contact document tabs */
.contact-files {
  display: grid;
  gap: 1.1rem;
}

.contact-files__header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 1rem;
}

.contact-files__header .cp-tab-lead {
  margin-bottom: 0;
}

.contact-files__count {
  flex: 0 0 auto;
  padding: 0.28rem 0.65rem;
  border: 1px solid var(--st-border-secondary);
  border-radius: 999px;
  background: var(--st-bg-secondary);
  color: var(--st-text-secondary);
  font-size: 0.75rem;
  font-weight: 700;
}

.contact-files__upload {
  overflow: hidden;
  border: 1px solid var(--st-border-secondary);
  border-radius: var(--st-radius-md);
  background: var(--st-bg-primary);
  box-shadow: 0 1px 2px rgba(28, 25, 23, 0.04);
}

.contact-files__upload-header {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  padding: 0.9rem 1rem;
  border-bottom: 1px solid var(--st-border-tertiary);
  background: var(--st-bg-secondary);
}

.contact-files__upload-header h3,
.contact-files__upload-header p {
  margin: 0;
}

.contact-files__upload-header h3 {
  color: var(--st-text-primary);
  font-size: 0.9rem;
  font-weight: 700;
}

.contact-files__upload-header p {
  margin-top: 0.15rem;
  color: var(--st-text-secondary);
  font-size: 0.78rem;
  line-height: 1.4;
}

.contact-files__upload-icon,
.contact-files__file-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
  color: var(--st-accent);
}

.contact-files__upload-icon {
  width: 2.25rem;
  height: 2.25rem;
  border-radius: 0.55rem;
  background: rgba(45, 106, 79, 0.1);
}

.contact-files__form {
  padding: 1rem;
}

.contact-files__fields {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.9rem 1rem;
  margin-bottom: 1rem;
}

.contact-files__field {
  min-width: 0;
}

.contact-files__field--file,
.contact-files__description {
  grid-column: 1 / -1;
}

.contact-files__label {
  display: block;
  margin-bottom: 0.35rem;
  color: var(--st-text-primary);
  font-size: 0.78rem;
  font-weight: 700;
}

.contact-files__input,
.contact-files__file-input {
  width: 100%;
  min-height: 2.65rem;
  box-sizing: border-box;
  border: 1px solid var(--st-border-secondary);
  border-radius: 0.5rem;
  background: var(--st-bg-primary);
  color: var(--st-text-primary);
  font: inherit;
  font-size: 0.85rem;
}

.contact-files__input {
  padding: 0.6rem 0.7rem;
}

.contact-files__input:focus,
.contact-files__file-input:focus {
  outline: none;
  border-color: var(--st-accent);
  box-shadow: 0 0 0 3px rgba(45, 106, 79, 0.11);
}

.contact-files__textarea {
  min-height: 4.75rem;
  line-height: 1.45;
  resize: vertical;
}

.contact-files__file-input {
  padding: 0.28rem;
}

.contact-files__file-input::file-selector-button {
  min-height: 2rem;
  margin-right: 0.7rem;
  padding: 0 0.75rem;
  border: 0;
  border-radius: 0.35rem;
  background: var(--st-bg-secondary);
  color: var(--st-text-primary);
  font: inherit;
  font-size: 0.78rem;
  font-weight: 700;
  cursor: pointer;
}

.contact-files__field-hint {
  display: block;
  margin-top: 0.3rem;
  color: var(--st-text-tertiary);
  font-size: 0.72rem;
}

.contact-files__form-footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  padding-top: 0.85rem;
  border-top: 1px solid var(--st-border-tertiary);
}

.contact-files__form-footer > span {
  color: var(--st-text-tertiary);
  font-size: 0.75rem;
}

.contact-files__table-wrap {
  overflow-x: auto;
  border: 1px solid var(--st-border-secondary);
  border-radius: var(--st-radius-md);
  background: var(--st-bg-primary);
}

.contact-files__table {
  min-width: 39rem;
}

.contact-files__table .bl-table__th,
.contact-files__table .bl-table__td {
  padding: 0.78rem 0.85rem;
  vertical-align: middle;
}

.contact-files__document {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 0.15rem 0.55rem;
  min-width: 12rem;
}

.contact-files__document strong,
.contact-files__document span {
  display: block;
}

.contact-files__document strong {
  color: var(--st-text-primary);
  font-size: 0.85rem;
}

.contact-files__document span,
.contact-files__document p,
.contact-files__meta {
  color: var(--st-text-secondary);
  font-size: 0.75rem;
}

.contact-files__document p {
  grid-column: 2;
  margin: 0.25rem 0 0;
  line-height: 1.4;
}

.contact-files__category {
  display: inline-flex;
  padding: 0.2rem 0.5rem;
  border-radius: 999px;
  background: rgba(45, 106, 79, 0.09);
  color: var(--st-accent);
  font-size: 0.72rem;
  font-weight: 700;
  white-space: nowrap;
}

.contact-files__meta {
  min-width: 9rem;
  white-space: nowrap;
}

.contact-files__meta span {
  display: block;
}

.contact-files__meta span + span {
  margin-top: 0.15rem;
  color: var(--st-text-tertiary);
}

.contact-files__actions-heading,
.contact-files__actions {
  width: 1%;
  text-align: right !important;
  white-space: nowrap;
}

.contact-files__action-group {
  display: inline-flex;
  gap: 0.35rem;
}

.contact-files__delete-form {
  display: inline-flex;
  margin: 0;
}

.contact-files__action {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 2rem;
  height: 2rem;
  padding: 0;
  border: 1px solid var(--st-border-secondary);
  border-radius: 0.45rem;
  background: var(--st-bg-primary);
  color: var(--st-text-secondary);
  cursor: pointer;
}

.contact-files__action:hover {
  border-color: var(--st-accent);
  background: var(--st-bg-secondary);
  color: var(--st-accent);
}

.contact-files__action--danger:hover {
  border-color: #dc2626;
  background: #fef2f2;
  color: #b91c1c;
}

.contact-files__empty {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.8rem;
  padding: 1.5rem;
  border: 1px dashed var(--st-border-secondary);
  border-radius: var(--st-radius-md);
  background: var(--st-bg-secondary);
  text-align: left;
}

.contact-files__empty > span {
  display: inline-flex;
  color: var(--st-text-tertiary);
}

.contact-files__empty h2,
.contact-files__empty p {
  margin: 0;
}

.contact-files__empty h2 {
  color: var(--st-text-primary);
  font-size: 0.9rem;
}

.contact-files__empty p {
  margin-top: 0.2rem;
  color: var(--st-text-secondary);
  font-size: 0.78rem;
}

@media (max-width: 800px) {
  .contact-files__header,
  .contact-files__form-footer {
    align-items: stretch;
    flex-direction: column;
  }

  .contact-files__count {
    align-self: flex-start;
  }
}

@media (max-width: 560px) {
  .contact-files__fields {
    grid-template-columns: 1fr;
  }

  .contact-files__field--file,
  .contact-files__description {
    grid-column: auto;
  }

  .contact-files__form-footer .students-index__btn {
    width: 100%;
  }
}
/* Organisation Health — top bar indicator and health page */

.topbar-right {
  display: flex;
  align-items: center;
  gap: var(--space-3);
  flex-shrink: 0;
  overflow: visible;
}

.topbar-health {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  position: relative;
  overflow: visible;
  width: 2.75rem;
  height: 2.75rem;
  border-radius: var(--radius-md);
  border: 1px solid var(--st-border-secondary);
  background: var(--st-bg-primary);
  color: var(--st-nav-accent);
  text-decoration: none;
  box-shadow: 0 1px 2px rgba(44, 40, 37, 0.06);
  transition: background 0.15s ease, border-color 0.15s ease, color 0.15s ease, box-shadow 0.15s ease;
}

.topbar-health:hover,
.topbar-health:focus-visible {
  background: #f0f7f3;
  border-color: #b7d9c8;
  color: var(--st-nav-accent);
  box-shadow: 0 1px 3px rgba(45, 106, 79, 0.12);
  outline: none;
}

.topbar-health--healthy {
  color: var(--st-nav-accent);
  border-color: rgba(45, 106, 79, 0.28);
  background: linear-gradient(180deg, #ffffff 0%, #f6faf7 100%);
}

.topbar-health--attention {
  color: #b45309;
  border-color: rgba(180, 83, 9, 0.35);
  background: linear-gradient(180deg, #ffffff 0%, #fff8ef 100%);
}

.topbar-health--critical {
  color: #b91c1c;
  border-color: rgba(185, 28, 28, 0.4);
  background: linear-gradient(180deg, #ffffff 0%, #fef2f2 100%);
}

.topbar-health--critical .topbar-health__badge {
  background: #b91c1c;
}

.topbar-health__wrap {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 2rem;
  height: 2rem;
  flex-shrink: 0;
}

.topbar-health--badged .topbar-health__wrap {
  /* Nudge icon clear of the corner badge */
  margin-top: 0.05rem;
  margin-left: 0.1rem;
}

.topbar-health__icon {
  display: block;
  overflow: visible;
}

.radar-icon {
  display: block;
  overflow: visible;
  color: currentColor;
}

.radar-icon__grid circle,
.radar-icon__grid line {
  stroke: currentColor;
  stroke-width: 1.35;
  vector-effect: non-scaling-stroke;
}

.radar-icon__grid circle {
  fill: none;
  opacity: 0.55;
}

.radar-icon__grid line {
  opacity: 0.55;
}

.radar-icon__sweep {
  fill: currentColor;
  opacity: 0.88;
}

.radar-icon__core {
  fill: currentColor;
}

.topbar-health--healthy .radar-icon__sweep {
  opacity: 0.72;
}

.topbar-health--attention .radar-icon__sweep {
  opacity: 1;
}

.topbar-health--attention .radar-icon__grid circle,
.topbar-health--attention .radar-icon__grid line {
  opacity: 0.65;
}

.topbar-health__badge {
  position: absolute;
  top: -0.15rem;
  left: -0.15rem;
  z-index: 2;
  min-width: 1rem;
  height: 1rem;
  padding: 0 0.28rem;
  border-radius: 999px;
  font-size: 0.5625rem;
  font-weight: 700;
  line-height: 1rem;
  text-align: center;
  background: var(--st-nav-accent);
  color: #fff;
  border: 1.5px solid var(--st-canvas);
  box-shadow: 0 1px 2px rgba(44, 40, 37, 0.15);
  transform: translate(-40%, -40%);
  pointer-events: none;
}

/* Health page */

.org-health {
  display: grid;
  gap: var(--space-5);
  width: 100%;
  max-width: none;
}

.org-health__header {
  margin-bottom: var(--space-1);
}

.org-health__title {
  margin: 0 0 var(--space-2);
  font-size: clamp(1.5rem, 2.5vw, 1.75rem);
  font-weight: 700;
  letter-spacing: -0.02em;
  color: var(--color-text);
  line-height: 1.2;
}

.org-health__subtitle {
  margin: 0;
  font-size: 0.9375rem;
  line-height: 1.55;
  color: var(--color-text-muted);
}

.org-health__panel {
  background: var(--st-bg-primary);
  border: 1px solid var(--st-border-tertiary);
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-sm);
  overflow: hidden;
}

.org-health__panel--summary {
  padding: var(--space-5) var(--space-6);
}

.org-health__panel--empty {
  padding: clamp(var(--space-6), 5vw, var(--space-8));
  text-align: center;
}

.org-health__empty-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 4rem;
  height: 4rem;
  margin: 0 auto var(--space-4);
  border-radius: 999px;
  background: #f0f7f3;
  color: var(--st-nav-accent);
}

.org-health__empty-title {
  margin: 0 0 var(--space-2);
  font-size: 1.125rem;
  font-weight: 600;
  color: var(--color-text);
}

.org-health__empty-body {
  margin: 0;
  font-size: 0.9375rem;
  line-height: 1.55;
  color: var(--color-text-muted);
}

.org-health__summary-heading {
  margin: 0 0 var(--space-4);
  font-size: 1rem;
  font-weight: 600;
  color: var(--color-text);
}

.org-health__summary-stats {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-3);
  margin: 0;
  padding: 0;
  list-style: none;
}

.org-health__stat {
  display: flex;
  align-items: center;
  gap: var(--space-3);
  min-width: 8.5rem;
  padding: var(--space-3) var(--space-4);
  border-radius: var(--radius-md);
  border: 1px solid var(--st-border-tertiary);
  background: var(--st-bg-secondary);
}

.org-health__stat-label {
  font-size: 0.8125rem;
  font-weight: 600;
  color: var(--color-text-muted);
}

.org-health__stat-value {
  margin-left: auto;
  font-size: 1.25rem;
  font-weight: 700;
  line-height: 1;
  color: var(--color-text);
}

.org-health__stat--critical .org-health__stat-value {
  color: #b91c1c;
}

.org-health__stat--warning .org-health__stat-value {
  color: #b45309;
}

.org-health__stat--info .org-health__stat-value {
  color: #0f766e;
}

.org-health__panel-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-3);
  padding: var(--space-4) var(--space-6);
  border-bottom: 1px solid var(--st-border-tertiary);
  background: var(--st-bg-secondary);
}

.org-health__panel-title {
  margin: 0;
  font-size: 0.9375rem;
  font-weight: 600;
  color: var(--color-text);
}

.org-health__panel-count {
  font-size: 0.75rem;
  font-weight: 700;
  color: var(--color-text-muted);
  background: var(--st-bg-primary);
  border: 1px solid var(--st-border-tertiary);
  border-radius: 999px;
  padding: 0.15rem 0.55rem;
}

.org-health__issues {
  margin: 0;
  padding: 0;
  list-style: none;
}

.org-health__issue {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  justify-content: space-between;
  gap: var(--space-3) var(--space-4);
  padding: var(--space-4) var(--space-6);
  border-bottom: 1px solid var(--st-border-tertiary);
}

.org-health__issue:last-child {
  border-bottom: 0;
}

.org-health__issue-content {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  gap: var(--space-3);
  min-width: 0;
  flex: 1 1 14rem;
}

.org-health__issue-copy {
  min-width: 0;
  flex: 1 1 12rem;
}

.org-health__issue-title {
  margin: 0 0 0.35rem;
  font-size: 0.9375rem;
  font-weight: 600;
  color: var(--color-text);
  line-height: 1.35;
}

.org-health__title-link {
  color: inherit;
  text-decoration: none;
}

.org-health__title-link:hover {
  color: var(--st-nav-accent);
  text-decoration: underline;
}

.org-health__issue-description {
  margin: 0;
  font-size: 0.875rem;
  line-height: 1.5;
  color: var(--color-text-muted);
}

.org-health__severity {
  display: inline-block;
  flex-shrink: 0;
  margin-top: 0.1rem;
  font-size: 0.6875rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  padding: 0.25rem 0.5rem;
  border-radius: 999px;
  white-space: nowrap;
}

.org-health__severity--critical {
  background: var(--color-danger-bg);
  color: var(--color-danger);
}

.org-health__severity--warning {
  background: var(--color-warning-bg);
  color: var(--color-warning);
}

.org-health__severity--info {
  background: rgba(20, 184, 166, 0.12);
  color: #0f766e;
}

.org-health__action {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 2.5rem;
  padding: 0.45rem 0.9rem;
  border-radius: var(--radius-md);
  border: 1px solid var(--st-border-secondary);
  background: var(--st-bg-primary);
  font-size: 0.8125rem;
  font-weight: 600;
  color: var(--st-nav-accent);
  text-decoration: none;
  white-space: nowrap;
  transition: background 0.15s ease, border-color 0.15s ease;
}

.org-health__action:hover {
  background: #f0f7f3;
  border-color: #b7d9c8;
  text-decoration: none;
}

@media (max-width: 640px) {
  .topbar-right {
    gap: var(--space-2);
  }

  .org-health__panel--summary,
  .org-health__panel-header,
  .org-health__issue {
    padding-left: var(--space-4);
    padding-right: var(--space-4);
  }

  .org-health__summary-stats {
    flex-direction: column;
  }

  .org-health__stat {
    width: 100%;
    min-width: 0;
  }

  .org-health__issue {
    flex-direction: column;
    align-items: stretch;
  }

  .org-health__action {
    align-self: flex-start;
  }
}

@media (max-width: 900px) {
  .topbar-right {
    order: 2;
  }
}

.org-health__panel--readiness {
  display: grid;
  gap: var(--space-5);
  padding: var(--space-5) var(--space-6);
}

.org-health__readiness-main {
  min-width: 0;
}

@media (min-width: 900px) {
  .org-health__panel--readiness {
    grid-template-columns: minmax(0, 1.35fr) minmax(16rem, 0.85fr);
    grid-template-areas:
      "main next"
      "stats stats";
    align-items: start;
  }

  .org-health__readiness-main {
    grid-area: main;
  }

  .org-health__summary-stats {
    grid-area: stats;
  }

  .org-health__next-action {
    grid-area: next;
    align-self: stretch;
  }
}

@media (min-width: 1100px) {
  .org-health__summary-stats {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }

  .org-health__stat {
    min-width: 0;
  }
}

.org-health__readiness-label {
  margin: 0 0 var(--space-2);
  font-size: 1.125rem;
  font-weight: 700;
  color: var(--color-text);
}

.org-health__readiness-percent {
  margin: 0 0 var(--space-3);
  font-size: clamp(2rem, 4vw, 2.5rem);
  font-weight: 700;
  line-height: 1;
  letter-spacing: -0.03em;
  color: var(--st-nav-accent);
}

.org-health__progress {
  height: 0.65rem;
  border-radius: 999px;
  background: var(--st-bg-secondary);
  border: 1px solid var(--st-border-tertiary);
  overflow: hidden;
}

.org-health__progress-bar {
  display: block;
  height: 100%;
  background: var(--st-nav-accent);
  border-radius: 999px;
}

.org-health__progress-text {
  margin: var(--space-2) 0 0;
  font-size: 0.8125rem;
  color: var(--color-text-muted);
}

.org-health__stat--review .org-health__stat-value,
.org-health__stat--recommended .org-health__stat-value {
  color: #b45309;
}

.org-health__stat--completed .org-health__stat-value {
  color: var(--st-nav-accent);
}

.org-health__next-action {
  padding: var(--space-4);
  border-radius: var(--radius-md);
  border: 1px solid rgba(45, 106, 79, 0.2);
  background: #f6faf7;
}

.org-health__next-action-label {
  margin: 0 0 var(--space-1);
  font-size: 0.75rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--color-text-muted);
}

.org-health__next-action-title {
  margin: 0 0 var(--space-3);
  font-size: 1rem;
  font-weight: 600;
  color: var(--color-text);
}

.org-health__cta {
  display: inline-flex;
  min-height: 2.75rem;
}

.org-health__issue-actions {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-2);
  align-items: center;
}

.org-health__severity--action_required {
  background: var(--color-danger-bg);
  color: var(--color-danger);
}

.org-health__severity--review_required {
  background: var(--color-warning-bg);
  color: var(--color-warning);
}

.org-health__severity--recommended {
  background: rgba(20, 184, 166, 0.12);
  color: #0f766e;
}

.org-health__severity--completed {
  background: #f0f7f3;
  color: var(--st-nav-accent);
}

.org-health__meta {
  margin: var(--space-2) 0 0;
  font-size: 0.75rem;
  color: var(--color-text-muted);
}

.org-health__meta--error {
  color: #b91c1c;
}

.org-health__action--secondary {
  color: var(--color-text-muted);
}

.org-health__action--review {
  cursor: pointer;
  border-color: rgba(45, 106, 79, 0.35);
  background: #f0f7f3;
}

.org-health__completed {
  border-top: 1px solid var(--st-border-tertiary);
}

.org-health__completed-summary {
  padding: var(--space-3) var(--space-6);
  font-size: 0.875rem;
  font-weight: 600;
  color: var(--color-text-muted);
  cursor: pointer;
}

.org-health__issues--completed .org-health__issue {
  opacity: 0.92;
}

.dashboard-health-callout {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-3);
  margin: 0 0 var(--space-5);
  padding: var(--space-4) var(--space-5);
  border-radius: var(--radius-lg);
  border: 1px solid rgba(45, 106, 79, 0.22);
  background: linear-gradient(180deg, #ffffff 0%, #f6faf7 100%);
}

.dashboard-health-callout__copy {
  min-width: 0;
  flex: 1 1 16rem;
}

.dashboard-health-callout__title {
  margin: 0 0 var(--space-1);
  font-size: 0.9375rem;
  font-weight: 700;
  color: var(--color-text);
}

.dashboard-health-callout__body {
  margin: 0;
  font-size: 0.875rem;
  line-height: 1.45;
  color: var(--color-text-muted);
}

@media (max-width: 640px) {
  .org-health__panel--readiness,
  .org-health__completed-summary {
    padding-left: var(--space-4);
    padding-right: var(--space-4);
  }
}
/* intl-tel-input — shared overrides */

.iti {
  display: block;
  width: 100%;
}

.iti input {
  width: 100%;
  box-sizing: border-box;
}

.iti__flag-container {
  border-top-left-radius: inherit;
  border-bottom-left-radius: inherit;
}

/* Account page */
.ac-card__body .iti input {
  padding: var(--space-2) var(--space-3) var(--space-2) 3.2rem;
  border: 1px solid var(--color-border);
  border-radius: var(--radius-sm);
  font-family: inherit;
  font-size: 0.9rem;
  background: var(--color-surface-raised);
  min-height: 2.5rem;
}

.ac-card__body .iti input:focus {
  outline: none;
  border-color: var(--color-brand-500);
  box-shadow: 0 0 0 2px var(--auth-accent-ring);
}

/* Settings organisation form */
.oe-card__body .iti input {
  width: 100%;
  padding: 0.55rem 0.75rem 0.55rem 3.2rem;
  border: 1px solid var(--color-border);
  border-radius: var(--radius-sm);
  font-family: inherit;
  font-size: 0.9rem;
  background: var(--color-surface-raised);
  min-height: 2.5rem;
}

.oe-card__body .iti input:focus {
  outline: none;
  border-color: var(--color-brand-500);
  box-shadow: 0 0 0 2px var(--auth-accent-ring);
}

/* Contact form */
.contacts-form .cf-field .iti {
  width: 100%;
  max-width: 100%;
}

.contacts-form .cf-field .iti input {
  width: 100%;
  min-height: 34px;
  height: 34px;
  padding: 0 0.7rem 0 3.2rem;
  border: 0.5px solid var(--st-border-secondary);
  border-radius: var(--st-radius-md);
  background: #fff;
  color: var(--st-text-primary);
  font-size: 0.8125rem;
}

.contacts-form .cf-field .iti input:focus {
  border-color: var(--st-accent);
  box-shadow: 0 0 0 2px rgba(92, 83, 70, 0.12);
}
/* Student / parent portal layout */

.portal-body {
  background:
    radial-gradient(ellipse 80% 50% at 10% -10%, color-mix(in srgb, var(--color-brand, #1f4b6e) 12%, transparent), transparent 55%),
    linear-gradient(180deg, var(--color-surface, #f7f8fa) 0%, var(--color-bg, #eef1f5) 100%);
}

.portal-main {
  padding-block: clamp(1rem, 2.5vw, 1.75rem);
}

.portal-content {
  max-width: 72rem;
}

.portal-page {
  display: flex;
  flex-direction: column;
  gap: var(--space-3, 1rem);
}

.portal-page h1 {
  margin: 0;
  font-size: clamp(1.5rem, 2.5vw, 2rem);
  font-weight: 650;
  letter-spacing: -0.02em;
  color: var(--color-text, #15202b);
}

.portal-page__lead {
  margin: 0;
  color: var(--color-text-muted, #5b6570);
}

.portal-page__header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 1rem;
}

.portal-button--disabled {
  cursor: not-allowed;
  opacity: 0.55;
  pointer-events: none;
}

.portal-page__notice {
  margin: -0.25rem 0 1rem;
  padding: 0.75rem 0.9rem;
  border: 1px solid var(--st-border-secondary, #ddd8cf);
  border-radius: var(--st-radius-md, 8px);
  background: var(--st-bg-secondary, #f8f6f2);
  color: var(--st-text-secondary, #57534e);
  font-size: 0.875rem;
}

.portal-page__kicker,
.portal-card__eyebrow,
.portal-tile__type {
  color: var(--color-text-muted, #5b6570);
  font-size: 0.75rem;
  font-weight: 650;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.portal-back-link,
.portal-widget-link {
  color: var(--color-brand, #1f4b6e);
  font-size: 0.875rem;
  font-weight: 600;
  text-decoration: none;
}

.portal-back-link {
  min-height: 2.75rem;
  display: inline-flex;
  align-items: center;
  align-self: flex-start;
}

.portal-count {
  min-width: 2.25rem;
  min-height: 2.25rem;
  display: inline-grid;
  place-items: center;
  padding: 0.25rem 0.65rem;
  border-radius: 999px;
  background: color-mix(in srgb, var(--color-brand, #1f4b6e) 10%, white);
  color: var(--color-brand, #1f4b6e);
  font-weight: 700;
}

.portal-card-list {
  display: grid;
  gap: 0.75rem;
}

.portal-card {
  min-width: 0;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 1rem;
  padding: 1rem;
  background: var(--color-surface-raised, #fff);
  border: 1px solid var(--color-border, #d7dde5);
  border-radius: var(--radius-md, 0.65rem);
  box-shadow: 0 1px 2px rgb(15 23 42 / 0.04);
}

.portal-card__body {
  min-width: 0;
}

.portal-card__body h2 {
  margin: 0.35rem 0;
  font-size: 1rem;
}

.portal-card__body p {
  margin: 0.35rem 0 0;
  color: var(--color-text-muted, #5b6570);
}

.portal-card__eyebrow {
  display: flex;
  gap: 0.65rem;
  align-items: center;
  flex-wrap: wrap;
}

.portal-card__meta {
  min-width: 8rem;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: flex-end;
  gap: 0.2rem;
  color: var(--color-text-muted, #5b6570);
  font-size: 0.8rem;
  text-align: right;
}

.portal-card__meta strong {
  color: var(--color-text, #15202b);
  font-size: 0.9rem;
}

.portal-course-card,
.portal-tile.portal-course-tile {
  border-left: 0.3rem solid var(--portal-course-accent, #4f6ef7);
}

.portal-course-detail {
  border-top: 0.3rem solid var(--portal-course-accent, #4f6ef7);
}

.portal-course-header {
  padding-left: 0.85rem;
  border-left: 0.3rem solid var(--portal-course-accent, #4f6ef7);
}

.portal-course-feature {
  position: relative;
  padding-left: 3.75rem;
}

.portal-course-feature::before {
  content: "";
  position: absolute;
  left: 1rem;
  width: 2rem;
  height: 2rem;
  border: 1px solid color-mix(in srgb, var(--portal-course-border, #3d5cd6) 35%, white);
  border-radius: 0.5rem;
  background: color-mix(in srgb, var(--portal-course-accent, #4f6ef7) 12%, white);
}

.portal-class-overview {
  gap: 1rem;
}

.portal-class-hero {
  position: relative;
  min-width: 0;
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: 1rem;
  overflow: hidden;
  padding: clamp(1.25rem, 3vw, 1.75rem);
  border: 1px solid var(--color-border, #d7dde5);
  border-top: 0.3rem solid var(--portal-course-accent, #4f6ef7);
  border-radius: var(--radius-md, 0.65rem);
  background:
    radial-gradient(circle at 100% 0, color-mix(in srgb, var(--portal-course-accent, #4f6ef7) 9%, transparent), transparent 40%),
    var(--color-surface-raised, #fff);
  box-shadow: 0 1px 3px rgb(15 23 42 / 0.06);
}

.portal-class-hero.portal-course-header {
  padding-left: clamp(1.25rem, 3vw, 1.75rem);
  border-left: 1px solid var(--color-border, #d7dde5);
}

.portal-class-hero__icon {
  width: 3.5rem;
  height: 3.5rem;
  display: grid;
  place-items: center;
  border: 1px solid color-mix(in srgb, var(--portal-course-border, #3d5cd6) 25%, white);
  border-radius: var(--radius-md, 0.65rem);
  background: color-mix(in srgb, var(--portal-course-accent, #4f6ef7) 11%, white);
  color: var(--portal-course-border, #3d5cd6);
}

.portal-class-hero__content {
  min-width: 0;
}

.portal-class-hero__content h1 {
  margin-top: 0.2rem;
}

.portal-class-hero__content .portal-page__lead {
  margin-top: 0.35rem;
  overflow-wrap: anywhere;
}

.portal-class-sections {
  min-width: 0;
  padding-top: 0.35rem;
}

.portal-class-sections__header {
  margin-bottom: 0.85rem;
}

.portal-class-sections__header h2 {
  margin: 0;
  color: var(--color-text, #15202b);
  font-size: 1.05rem;
}

.portal-class-sections__header p {
  margin: 0.25rem 0 0;
  color: var(--color-text-muted, #5b6570);
  font-size: 0.8125rem;
  line-height: 1.45;
}

.portal-class-feature {
  min-height: 6.5rem;
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: 0.85rem;
  padding: 1rem;
  border-left: 0.25rem solid var(--portal-course-accent, #4f6ef7);
}

.portal-class-feature::before {
  content: none;
}

.portal-class-feature__icon {
  width: 2.5rem;
  height: 2.5rem;
  display: grid;
  place-items: center;
  border-radius: var(--radius-sm, 0.4rem);
  background: color-mix(in srgb, var(--portal-course-accent, #4f6ef7) 10%, white);
  color: var(--portal-course-border, #3d5cd6);
}

.portal-class-feature__icon svg {
  width: 1.3rem;
  height: 1.3rem;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.7;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.portal-class-feature__copy {
  min-width: 0;
  display: grid;
  gap: 0.25rem;
}

.portal-class-feature__copy strong {
  color: var(--color-text, #15202b);
  font-size: 0.9rem;
}

.portal-class-feature__copy > span {
  line-height: 1.4;
}

.portal-class-feature__arrow {
  color: var(--color-text-muted, #5b6570);
  font-size: 1.1rem;
  transition: transform 120ms ease;
}

.portal-class-feature:hover .portal-class-feature__arrow {
  transform: translateX(0.15rem);
}

.portal-grade-pill,
.portal-status-pill {
  display: inline-flex;
  align-items: center;
  min-height: 1.75rem;
  padding: 0.15rem 0.65rem;
  border: 1px solid var(--color-border, #d7dde5);
  border-radius: 999px;
  background: var(--color-bg, #eef1f5);
  color: var(--color-text, #15202b);
  font-size: 0.8rem;
  font-weight: 650;
  white-space: nowrap;
}

.portal-metadata {
  color: var(--color-text-muted, #5b6570);
  font-size: 0.8125rem;
}

.portal-tile__footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
}

.portal-card h2,
.portal-tile h2,
.portal-detail-card h1,
.portal-detail-card dd,
.portal-link-list a {
  overflow-wrap: anywhere;
}

.portal-task-card,
.portal-task-detail {
  --portal-task-tone: #2563a6;
  --portal-task-tint: #eaf3fb;
  --portal-task-border: #a9c8e5;
}

.portal-task-card {
  border-left: 0.3rem solid var(--portal-task-tone);
}

.portal-task-card--due_today,
.portal-task-detail--due_today {
  --portal-task-tone: #9a6412;
  --portal-task-tint: #fff4d6;
  --portal-task-border: #e6c46f;
}

.portal-task-card--overdue,
.portal-task-detail--overdue {
  --portal-task-tone: #a6342b;
  --portal-task-tint: #fdecea;
  --portal-task-border: #e4aaa5;
}

.portal-task-card--completed,
.portal-task-detail--completed {
  --portal-task-tone: #267049;
  --portal-task-tint: #e8f5ed;
  --portal-task-border: #9bc9ab;
}

.portal-task-card--cancelled,
.portal-task-detail--cancelled {
  --portal-task-tone: #62676d;
  --portal-task-tint: #eff1f2;
  --portal-task-border: #c8ccd0;
}

.portal-task-detail {
  border-top: 0.3rem solid var(--portal-task-tone);
}

.portal-task-status {
  border: 1px solid var(--portal-task-border);
  background: var(--portal-task-tint);
  color: var(--portal-task-tone);
}

.portal-task-priority {
  display: inline-flex;
  align-items: center;
  min-height: 1.5rem;
  padding: 0.125rem 0.5rem;
  border-radius: 999px;
  background: #eaf3fb;
  color: #2563a6;
  font-size: 0.7rem;
  font-weight: 700;
  letter-spacing: 0.03em;
}

.portal-task-priority--low {
  background: #eff1f2;
  color: #62676d;
}

.portal-task-priority--high {
  background: #fff4d6;
  color: #9a6412;
}

.portal-task-priority--urgent {
  background: #fdecea;
  color: #a6342b;
}

.portal-task-card__meta {
  gap: 0.75rem;
}

.portal-task-card__due {
  display: flex;
  flex-direction: column;
  gap: 0.2rem;
}

.btn-primary.portal-task-complete {
  min-height: 2.75rem;
  white-space: nowrap;
}

.btn-primary.portal-task-complete--read-only:disabled {
  border-color: #9aa4b2;
  background: #e5e7eb;
  color: #5b6570;
  cursor: not-allowed;
  opacity: 1;
}

.portal-tile-grid,
.portal-feature-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 1rem;
}

.portal-details-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1rem;
}

.portal-tile,
.portal-feature-card,
.portal-detail-card {
  min-width: 0;
  padding: 1.15rem;
  background: var(--color-surface-raised, #fff);
  border: 1px solid var(--color-border, #d7dde5);
  border-radius: var(--radius-md, 0.65rem);
  box-shadow: 0 1px 2px rgb(15 23 42 / 0.04);
}

.portal-tile h2 {
  margin: 0.45rem 0;
  font-size: 1.1rem;
}

.portal-tile p {
  min-height: 1.5rem;
  margin: 0 0 1rem;
  color: var(--color-text-muted, #5b6570);
}

.portal-feature-card {
  min-height: 7rem;
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 0.45rem;
  color: var(--color-text, #15202b);
  text-decoration: none;
  transition: border-color 120ms ease, transform 120ms ease;
}

.portal-feature-card:hover {
  border-color: var(--color-brand, #1f4b6e);
  transform: translateY(-1px);
}

.portal-feature-card span {
  color: var(--color-text-muted, #5b6570);
  font-size: 0.875rem;
}

.portal-detail-card {
  padding: 0;
  overflow: hidden;
}

.portal-detail-card--wide {
  grid-column: 1 / -1;
}

.portal-detail-card__header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 1rem;
  padding: 1rem 1.15rem;
  border-bottom: 1px solid var(--color-border, #d7dde5);
}

.portal-detail-card__header h1,
.portal-detail-card__header h2 {
  margin: 0.25rem 0 0;
}

.portal-detail-card__header h2 {
  font-size: 1.05rem;
}

.portal-detail-profile {
  display: flex;
  align-items: center;
  gap: 0.9rem;
  min-width: 0;
}

.portal-detail-profile__photo,
.portal-detail-profile__placeholder {
  width: 4.5rem;
  height: 4.5rem;
  border-radius: 999px;
  flex-shrink: 0;
  object-fit: cover;
}

.portal-detail-profile__placeholder {
  display: flex;
  align-items: center;
  justify-content: center;
  background: color-mix(in srgb, var(--color-primary, #0f766e) 12%, #fff);
  color: var(--color-primary, #0f766e);
  font-size: 1.45rem;
  font-weight: 700;
}

@media (max-width: 640px) {
  .portal-detail-profile__photo,
  .portal-detail-profile__placeholder {
    width: 3.75rem;
    height: 3.75rem;
    font-size: 1.25rem;
  }
}

.portal-detail-card__body {
  padding: 1.15rem;
}

.portal-detail-card__body > section + section {
  margin-top: 1.25rem;
  padding-top: 1.25rem;
  border-top: 1px solid var(--color-border, #d7dde5);
}

.portal-detail-card__body h2 {
  margin: 0 0 0.65rem;
  font-size: 1rem;
}

.portal-detail-card__summary,
.portal-detail-list {
  margin: 0;
}

.portal-detail-card__summary {
  display: flex;
  gap: 1.5rem;
  flex-wrap: wrap;
}

.portal-detail-card__summary div,
.portal-detail-list div {
  display: flex;
  gap: 0.5rem;
}

.portal-detail-card__summary div {
  min-width: 0;
  flex-direction: column;
  text-align: right;
}

.portal-detail-card__summary dt,
.portal-detail-list dt {
  color: var(--color-text-muted, #5b6570);
  font-size: 0.78rem;
}

.portal-detail-card__summary dd,
.portal-detail-list dd {
  margin: 0;
  font-weight: 600;
}

.portal-detail-list {
  display: grid;
  gap: 0.75rem;
}

.portal-detail-list div {
  justify-content: space-between;
  padding-bottom: 0.75rem;
  border-bottom: 1px solid var(--color-border, #d7dde5);
}

.portal-detail-list div:last-child {
  padding-bottom: 0;
  border-bottom: 0;
}

.portal-detail-list--compact {
  margin-top: 1rem;
}

.portal-detail-rows,
.portal-link-list {
  list-style: none;
  margin: 0;
  padding: 0;
}

.portal-detail-rows li {
  display: flex;
  justify-content: space-between;
  gap: 1rem;
  padding: 0.65rem 0;
  border-bottom: 1px solid var(--color-border, #d7dde5);
}

.portal-detail-rows li:first-child {
  padding-top: 0;
}

.portal-detail-rows li:last-child {
  padding-bottom: 0;
  border-bottom: 0;
}

.portal-detail-rows li div {
  display: flex;
  flex-direction: column;
  gap: 0.15rem;
}

.portal-detail-rows span,
.portal-muted {
  color: var(--color-text-muted, #5b6570);
}

.portal-detail-actions {
  margin-top: 1rem;
}

.portal-reports__heading {
  min-width: 0;
  display: flex;
  align-items: center;
  gap: 0.9rem;
}

.portal-reports__heading-icon,
.portal-report-card__icon {
  flex: 0 0 auto;
  display: grid;
  place-items: center;
  color: var(--color-brand, #1f4b6e);
  background: color-mix(in srgb, var(--color-brand, #1f4b6e) 9%, white);
  border: 1px solid color-mix(in srgb, var(--color-brand, #1f4b6e) 17%, white);
}

.portal-reports__heading-icon {
  width: 3rem;
  height: 3rem;
  border-radius: 0.8rem;
}

.portal-reports__heading-icon svg {
  width: 1.45rem;
  height: 1.45rem;
}

.portal-reports__list {
  display: grid;
  gap: 0.75rem;
}

.portal-report-card {
  min-width: 0;
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: 1rem;
  padding: 1rem;
  background: var(--color-surface-raised, #fff);
  border: 1px solid var(--color-border, #d7dde5);
  border-radius: var(--radius-md, 0.65rem);
  box-shadow: 0 1px 2px rgb(15 23 42 / 0.04);
}

.portal-report-card__icon {
  width: 2.7rem;
  height: 2.7rem;
  border-radius: 0.65rem;
}

.portal-report-card__icon svg {
  width: 1.3rem;
  height: 1.3rem;
}

.portal-report-card__body {
  min-width: 0;
}

.portal-report-card__eyebrow,
.portal-report-card__details {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 0.4rem;
  color: var(--color-text-muted, #5b6570);
}

.portal-report-card__eyebrow {
  font-size: 0.72rem;
  font-weight: 650;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.portal-report-card h2 {
  margin: 0.28rem 0;
  font-size: 1rem;
  line-height: 1.35;
}

.portal-report-card h2 a {
  color: var(--color-text, #15202b);
  text-decoration: none;
}

.portal-report-card h2 a:hover {
  color: var(--color-brand, #1f4b6e);
  text-decoration: underline;
}

.portal-report-card__details {
  gap: 0.35rem 1rem;
  font-size: 0.8rem;
}

.portal-report-card__aside {
  min-width: 9rem;
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 0.65rem;
}

.portal-report-card__status {
  display: inline-flex;
  align-items: center;
  min-height: 1.6rem;
  padding: 0.2rem 0.55rem;
  border-radius: 999px;
  color: #475569;
  background: #f1f5f9;
  font-size: 0.72rem;
  font-weight: 700;
}

.portal-report-card__status--generated,
.portal-report-card__status--delivered {
  color: #166534;
  background: #dcfce7;
}

.portal-report-card__status--sending,
.portal-report-card__status--partially-delivered {
  color: #92400e;
  background: #fef3c7;
}

.portal-report-card__status--failed {
  color: #991b1b;
  background: #fee2e2;
}

.portal-report-card__actions {
  display: flex;
  align-items: center;
  gap: 0.75rem;
}

.portal-report-card__actions .btn-secondary {
  min-height: 2.25rem;
  padding: 0.4rem 0.7rem;
  font-size: 0.8rem;
}

.portal-report-card__actions a {
  display: inline-flex;
  align-items: center;
  gap: 0.38rem;
}

.portal-report-card__actions svg {
  flex: 0 0 auto;
  width: 0.95rem;
  height: 0.95rem;
  stroke-width: 1.9;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.portal-report-card__download {
  color: var(--color-brand, #1f4b6e);
  font-size: 0.8rem;
  font-weight: 650;
  text-decoration: none;
}

.portal-report-card__download:hover {
  text-decoration: underline;
}

.portal-report-show {
  max-width: 48rem;
}

.portal-report-show__card {
  margin-top: 0.35rem;
}

.portal-report-show__title-block {
  display: grid;
  gap: 0.55rem;
  min-width: 0;
}

.portal-report-show__title-block h1 {
  margin: 0;
  font-size: clamp(1.2rem, 2.4vw, 1.55rem);
  line-height: 1.3;
}

.portal-report-show__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.65rem;
  margin-top: 0;
  margin-bottom: 0.35rem;
}

.portal-report-show__actions .btn-primary {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.45rem;
  min-height: 2.75rem;
}

.portal-report-show__actions .btn-primary svg {
  width: 1.05rem;
  height: 1.05rem;
  stroke-width: 2;
}

.portal-report-show__section {
  display: grid;
  gap: 0.75rem;
}

.portal-report-show__section-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
}

.portal-report-show__section-head h2,
.portal-report-show__section > h2 {
  margin: 0;
}

.portal-report-show__count {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 1.7rem;
  height: 1.7rem;
  padding: 0 0.45rem;
  border-radius: 999px;
  background: color-mix(in srgb, var(--color-brand, #1f4b6e) 10%, white);
  color: var(--color-brand, #1f4b6e);
  font-size: 0.72rem;
  font-weight: 700;
}

.portal-report-show__prose {
  margin: 0;
  color: var(--color-text, #1f2937);
  font-size: 0.95rem;
  line-height: 1.55;
}

.portal-report-show__items,
.portal-report-show__comments {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 0.65rem;
}

.portal-report-show__items li,
.portal-report-show__comments li {
  display: grid;
  gap: 0.35rem;
  padding: 0.85rem 0.95rem;
  border: 1px solid var(--color-border, #d7dde5);
  border-radius: var(--radius-sm, 0.5rem);
  background: var(--st-bg-secondary, #f8fafc);
}

.portal-report-show__item-main {
  display: grid;
  gap: 0.2rem;
  min-width: 0;
}

.portal-report-show__item-main strong {
  color: var(--color-text, #1f2937);
  font-size: 0.92rem;
}

.portal-report-show__item-main span,
.portal-report-show__item-meta,
.portal-report-show__comment-meta {
  color: var(--color-text-muted, #5b6570);
  font-size: 0.8rem;
}

.portal-report-show__item-meta,
.portal-report-show__comment-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 0.45rem 0.75rem;
}

.portal-report-show__comments p {
  margin: 0;
  color: var(--color-text, #1f2937);
  font-size: 0.9rem;
  line-height: 1.5;
}

.portal-report-show__pdf-hint {
  margin: 0.25rem 0 0;
  color: var(--color-text-muted, #5b6570);
  font-size: 0.82rem;
  line-height: 1.45;
}

.portal-empty {
  min-height: 12rem;
  display: grid;
  place-items: center;
  align-content: center;
  gap: 0.5rem;
  padding: 2rem;
  color: var(--color-text-muted, #5b6570);
  text-align: center;
  background: var(--color-surface-raised, #fff);
  border: 1px dashed var(--color-border, #d7dde5);
  border-radius: var(--radius-md, 0.65rem);
}

.portal-empty__icon {
  width: 2.5rem;
  height: 2.5rem;
  display: grid;
  place-items: center;
  border-radius: 50%;
  background: var(--color-bg, #eef1f5);
}

.portal-empty p {
  margin: 0;
}

.portal-metric {
  display: block;
  margin-top: 0.35rem;
  font-size: clamp(1.75rem, 4vw, 2.5rem);
}

.portal-section {
  display: grid;
  gap: 0.75rem;
}

.portal-section > h2 {
  margin: 0;
  font-size: 1.1rem;
}

.portal-calendar {
  min-width: 0;
  padding: clamp(0.5rem, 2vw, 1rem);
  overflow-x: auto;
  background: var(--color-surface-raised, #fff);
}

.portal-calendar .fc {
  --fc-border-color: var(--color-border);
  --fc-page-bg-color: var(--color-surface-raised);
  --fc-neutral-bg-color: var(--color-surface);
  --fc-today-bg-color: rgba(93, 74, 62, 0.06);
  --fc-button-bg-color: var(--color-surface);
  --fc-button-border-color: var(--color-border);
  --fc-button-text-color: var(--color-text);
  --fc-button-hover-bg-color: var(--color-surface);
  --fc-button-hover-border-color: #c8bfb3;
  --fc-button-hover-text-color: var(--color-text);
  --fc-button-active-bg-color: #5d4a3e;
  --fc-button-active-border-color: #5d4a3e;
  --fc-button-active-text-color: #fff;
  min-width: 0;
  font-size: 0.875rem;
}

.portal-calendar .fc .fc-button {
  min-width: 2.75rem;
  min-height: 2.75rem;
  padding: 0.5rem 0.75rem;
  font-weight: 600;
  box-shadow: none;
  color: var(--fc-button-text-color);
}

.portal-calendar .fc .fc-button:hover {
  color: var(--fc-button-hover-text-color);
}

.portal-calendar .fc .fc-button:focus-visible {
  outline: 2px solid #5d4a3e;
  outline-offset: 2px;
}

.portal-calendar .fc .fc-button-primary:not(:disabled).fc-button-active,
.portal-calendar .fc .fc-button-primary:not(:disabled):active {
  background-color: var(--fc-button-active-bg-color);
  border-color: var(--fc-button-active-border-color);
  color: var(--fc-button-active-text-color);
}

.portal-calendar .fc .fc-header-toolbar {
  flex-wrap: wrap;
  gap: var(--space-2, 0.5rem);
  margin-bottom: var(--space-3, 1rem);
}

.portal-calendar .fc .fc-toolbar-chunk {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--space-2, 0.5rem);
}

.portal-calendar .fc .fc-toolbar-title {
  font-size: 1.125rem;
  font-weight: 700;
  color: var(--color-text);
}

.portal-dashboard-list {
  margin-top: 0.75rem;
}

.portal-announcements {
  margin-bottom: var(--space-5, 1.5rem);
  overflow: hidden;
  border: 1px solid #e4d59d;
  border-radius: var(--radius-lg, 0.75rem);
  background: #fffdf5;
  box-shadow: var(--shadow-sm);
}

.portal-announcements__heading {
  display: flex;
  align-items: center;
  gap: 0.65rem;
  padding: 0.85rem 1rem;
  border-bottom: 1px solid #eadfb8;
  background: #fff8df;
  color: #624a0d;
}

.portal-announcements__heading h2 {
  margin: 0;
  font-size: 0.9rem;
}

.portal-announcements__icon {
  display: grid;
  place-items: center;
}

.portal-announcements__list {
  display: grid;
}

.portal-announcement {
  padding: 1rem 1.15rem;
}

.portal-announcement + .portal-announcement {
  border-top: 1px solid #eee5c7;
}

.portal-announcement__header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 1rem;
}

.portal-announcement__label {
  color: #866b20;
  font-size: 0.68rem;
  font-weight: 750;
  letter-spacing: 0.05em;
  text-transform: uppercase;
}

.portal-announcement h3 {
  margin: 0.15rem 0 0;
  color: var(--color-text, #2d2926);
  font-size: 1rem;
}

.portal-announcement__date,
.portal-announcement footer {
  color: var(--color-text-muted, #64748b);
  font-size: 0.75rem;
}

.portal-announcement__date {
  flex: 0 0 auto;
}

.portal-announcement__body {
  margin-top: 0.65rem;
  color: var(--color-text, #2d2926);
  font-size: 0.875rem;
  line-height: 1.55;
}

.portal-announcement__body > :first-child {
  margin-top: 0;
}

.portal-announcement__body > :last-child {
  margin-bottom: 0;
}

.portal-announcement footer {
  margin-top: 0.75rem;
}

@media (max-width: 640px) {
  .portal-announcement__header {
    flex-direction: column;
    gap: 0.35rem;
  }
}

.portal-widget-link {
  min-height: 2.75rem;
  display: inline-flex;
  align-items: center;
}

.portal-read-only-notice {
  margin: 0;
  padding: 0.75rem 1rem;
  border: 1px solid #d5b96f;
  border-radius: var(--radius-sm, 0.4rem);
  background: #fff8e7;
  color: #6b4d0f;
}

.btn-primary.portal-messaging-action {
  min-height: 2.75rem;
}

.portal-messaging-action--disabled,
.btn-primary.portal-messaging-action--disabled:disabled {
  border-color: #9aa4b2;
  background: #e5e7eb;
  color: #5b6570;
  cursor: not-allowed;
  opacity: 1;
}

.portal-messaging-action--disabled:hover {
  background: #e5e7eb;
  color: #5b6570;
}

.portal-recipient-picker {
  margin: 0 0 1rem;
  padding: 0;
  border: 0;
}

.portal-recipient-picker legend {
  margin-bottom: 0.5rem;
  font-weight: 650;
}

.portal-recipient-picker label {
  min-height: 2.75rem;
  display: flex;
  align-items: center;
  gap: 0.65rem;
  padding: 0.5rem 0.75rem;
  border: 1px solid var(--color-border, #d7dde5);
  border-radius: var(--radius-sm, 0.4rem);
}

.portal-recipient-picker label + label {
  margin-top: 0.5rem;
}

.portal-recipient-picker:disabled label {
  background: var(--color-bg, #eef1f5);
  color: var(--color-text-muted, #5b6570);
  cursor: not-allowed;
}

.portal-recipient-picker__group {
  min-width: 0;
  margin-bottom: 1rem;
}

.portal-recipient-picker__group > strong {
  display: block;
  margin-bottom: 0.5rem;
}

.portal-message-compose {
  width: 100%;
  max-width: 58rem;
  margin-inline: auto;
}

.portal-message-compose__card {
  overflow: hidden;
  border: 1px solid var(--color-border, #d7dde5);
  border-radius: var(--radius-md, 0.65rem);
  background: var(--color-surface-raised, #fff);
  box-shadow: 0 1px 3px rgb(15 23 42 / 0.06);
}

.portal-message-compose__card > .portal-read-only-notice {
  margin: 1rem 1rem 0;
}

.portal-message-compose__form {
  display: flex;
  flex-direction: column;
}

.portal-message-compose__section {
  padding: clamp(1.1rem, 3vw, 1.5rem);
}

.portal-message-compose__section + .portal-message-compose__section {
  border-top: 1px solid var(--color-border, #d7dde5);
}

.portal-message-compose__section-heading {
  display: flex;
  align-items: flex-start;
  gap: 0.75rem;
  margin-bottom: 1rem;
}

.portal-message-compose__section-heading h2 {
  margin: 0;
  color: var(--color-text, #15202b);
  font-size: 1rem;
}

.portal-message-compose__section-heading p {
  margin: 0.2rem 0 0;
  color: var(--color-text-muted, #5b6570);
  font-size: 0.8125rem;
  line-height: 1.45;
}

.portal-message-compose__section-icon {
  width: 2.4rem;
  height: 2.4rem;
  flex: 0 0 auto;
  display: grid;
  place-items: center;
  border-radius: var(--radius-sm, 0.4rem);
  background: color-mix(in srgb, var(--color-brand, #1f4b6e) 10%, white);
  color: var(--color-brand, #1f4b6e);
}

.portal-message-compose__section-icon svg {
  width: 1.2rem;
  height: 1.2rem;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.7;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.portal-message-compose__field {
  display: flex;
  flex-direction: column;
  gap: 0.35rem;
  margin-bottom: 1rem;
}

.portal-message-compose__field:last-child {
  margin-bottom: 0;
}

.portal-message-compose__field label {
  color: var(--color-text, #15202b);
  font-size: 0.8rem;
  font-weight: 600;
}

.portal-message-compose__input,
.portal-message-compose__textarea {
  box-sizing: border-box;
  width: 100%;
  max-width: none !important;
  min-height: 2.75rem;
  padding: 0.65rem 0.75rem;
  border: 1px solid var(--color-border, #d7dde5);
  border-radius: var(--radius-sm, 0.4rem);
  background: var(--color-surface-raised, #fff);
  color: var(--color-text, #15202b);
  font: inherit;
  font-size: 0.875rem;
}

.portal-message-compose__textarea {
  min-height: 9rem;
  resize: vertical;
}

.portal-message-compose__input:focus,
.portal-message-compose__textarea:focus {
  border-color: var(--color-brand, #1f4b6e);
  outline: 2px solid color-mix(in srgb, var(--color-brand, #1f4b6e) 22%, transparent);
  outline-offset: 1px;
}

.portal-message-compose__input::placeholder,
.portal-message-compose__textarea::placeholder {
  color: color-mix(in srgb, var(--color-text-muted, #5b6570) 75%, white);
}

.portal-message-compose .portal-recipient-picker {
  margin-bottom: 0;
}

.portal-message-compose .portal-recipient-picker__group {
  margin-bottom: 0;
}

.portal-message-compose .portal-recipient-picker__group > strong {
  color: var(--color-text-muted, #5b6570);
  font-size: 0.75rem;
  letter-spacing: 0.03em;
  text-transform: uppercase;
}

.portal-message-compose .portal-recipient-picker label {
  position: relative;
  border-color: var(--color-border, #d7dde5);
  background: var(--color-surface-raised, #fff);
  font-size: 0.85rem;
  cursor: pointer;
  transition: border-color 0.15s ease, background 0.15s ease;
}

.portal-message-compose .portal-recipient-picker label:hover {
  border-color: color-mix(in srgb, var(--color-brand, #1f4b6e) 55%, white);
  background: color-mix(in srgb, var(--color-brand, #1f4b6e) 4%, white);
}

.portal-message-compose .portal-recipient-picker input[type="checkbox"] {
  width: 1rem;
  height: 1rem;
  flex: 0 0 auto;
  margin: 0;
  accent-color: var(--color-brand, #1f4b6e);
}

.portal-message-compose .portal-recipient-picker label:has(input:checked) {
  border-color: color-mix(in srgb, var(--color-brand, #1f4b6e) 58%, white);
  background: color-mix(in srgb, var(--color-brand, #1f4b6e) 7%, white);
}

.portal-message-compose__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.65rem;
  padding: 1rem clamp(1.1rem, 3vw, 1.5rem);
  border-top: 1px solid var(--color-border, #d7dde5);
  background: var(--color-surface, #f7f8fa);
}

.portal-message-compose__actions .btn-primary,
.portal-message-compose__actions .btn-secondary {
  min-height: 2.75rem;
}

@media (min-width: 641px) {
  .portal-recipient-picker {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1rem;
  }

  .portal-recipient-picker legend,
  .portal-recipient-picker > .portal-muted {
    grid-column: 1 / -1;
  }
}

.portal-reply-form {
  display: grid;
  gap: 0.65rem;
  padding: 1rem;
  background: var(--color-surface-raised, #fff);
  border: 1px solid var(--color-border, #d7dde5);
  border-radius: var(--radius-md, 0.65rem);
}

.portal-reply-form textarea {
  width: 100%;
}

.portal-form :disabled,
.portal-reply-form :disabled {
  cursor: not-allowed;
}

.portal-message {
  max-width: 48rem;
}

.portal-message--own {
  align-self: flex-end;
  background: color-mix(in srgb, var(--color-brand, #1f4b6e) 7%, white);
}

.portal-message header {
  display: flex;
  justify-content: space-between;
  gap: 1rem;
}

.portal-child-switcher {
  width: min(calc(100% - 2rem), 72rem);
  min-width: 0;
  margin: 0.75rem auto 0;
  padding: 0 1rem;
}

.portal-child-switcher__form {
  min-width: 0;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.5rem 0.75rem;
}

.portal-child-switcher__label {
  margin: 0;
  font-size: 0.875rem;
  font-weight: 600;
  color: var(--color-text-muted, #5b6570);
  white-space: nowrap;
}

.portal-child-switcher__select {
  flex: 1 1 12rem;
  min-width: 0;
  min-height: 2.75rem;
  max-width: 100%;
  padding: 0.5rem 2rem 0.5rem 0.75rem;
  border: 1px solid var(--color-border, #d7dde5);
  border-radius: var(--radius-md, 0.65rem);
  background: var(--color-surface-raised, #fff);
  color: var(--color-text, #15202b);
  font: inherit;
}

.portal-child-switcher__select:focus-visible {
  outline: 2px solid var(--color-brand, #1f4b6e);
  outline-offset: 2px;
}

.portal-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}

.portal-list li {
  min-height: 2.75rem;
  display: flex;
  align-items: center;
  gap: 0.75rem;
  flex-wrap: wrap;
}

.portal-subnav {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
}

.portal-subnav a {
  min-height: 2.75rem;
  display: inline-flex;
  align-items: center;
  padding: 0.5rem 0.9rem;
  border-radius: var(--radius-sm, 0.4rem);
  background: var(--color-surface-raised, #fff);
  border: 1px solid var(--color-border, #d7dde5);
  text-decoration: none;
  color: var(--color-text);
}

.portal-form .field,
.portal-page .field {
  display: flex;
  flex-direction: column;
  gap: 0.35rem;
  margin-bottom: 0.85rem;
}

.portal-form input,
.portal-form textarea,
.portal-page textarea,
.portal-page input[type="text"],
.portal-page input[type="email"] {
  width: 100%;
  max-width: 36rem;
}

/* Student file editor */
.portal-my-file-editor {
  width: 100%;
  max-width: 58rem;
  margin-inline: auto;
}

.portal-my-file-editor__card {
  overflow: hidden;
  border: 1px solid var(--color-border, #d7dde5);
  border-radius: var(--radius-md, 0.65rem);
  background: var(--color-surface-raised, #fff);
  box-shadow: 0 1px 3px rgb(15 23 42 / 0.06);
}

.portal-my-file-form {
  display: flex;
  flex-direction: column;
}

.portal-my-file-form__section {
  padding: clamp(1.1rem, 3vw, 1.5rem);
}

.portal-my-file-form__section + .portal-my-file-form__section {
  border-top: 1px solid var(--color-border, #d7dde5);
}

.portal-my-file-form__section-heading {
  margin-bottom: 1rem;
}

.portal-my-file-form__section-heading h2 {
  margin: 0;
  color: var(--color-text, #15202b);
  font-size: 1rem;
  font-weight: 650;
}

.portal-my-file-form__section-heading p {
  margin: 0.25rem 0 0;
  color: var(--color-text-muted, #5b6570);
  font-size: 0.8125rem;
  line-height: 1.5;
}

.portal-my-file-form__errors {
  margin: 1.25rem 1.25rem 0;
  padding: 0.85rem 1rem;
  border: 1px solid #efb4b4;
  border-radius: var(--radius-sm, 0.4rem);
  background: #fff5f5;
  color: #8f1d1d;
  font-size: 0.875rem;
}

.portal-my-file-form__errors ul {
  margin: 0.4rem 0 0;
  padding-left: 1.2rem;
}

.portal-file-picker {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.8rem 1rem;
  padding: 1rem;
  border: 1px dashed color-mix(in srgb, var(--color-brand, #1f4b6e) 48%, white);
  border-radius: var(--radius-md, 0.65rem);
  background: color-mix(in srgb, var(--color-brand, #1f4b6e) 5%, white);
  cursor: pointer;
  transition: border-color 0.15s ease, background 0.15s ease;
}

.portal-file-picker:hover,
.portal-file-picker:focus-within {
  border-color: var(--color-brand, #1f4b6e);
  background: color-mix(in srgb, var(--color-brand, #1f4b6e) 8%, white);
}

.portal-file-picker:focus-within {
  outline: 2px solid color-mix(in srgb, var(--color-brand, #1f4b6e) 35%, transparent);
  outline-offset: 2px;
}

.portal-file-picker__icon {
  width: 2.75rem;
  height: 2.75rem;
  flex: 0 0 auto;
  display: grid;
  place-items: center;
  border-radius: var(--radius-md, 0.65rem);
  background: color-mix(in srgb, var(--color-brand, #1f4b6e) 12%, white);
  color: var(--color-brand, #1f4b6e);
}

.portal-file-picker__copy {
  min-width: 0;
  flex: 1 1 18rem;
  display: grid;
  gap: 0.15rem;
}

.portal-file-picker__copy strong {
  color: var(--color-text, #15202b);
  font-size: 0.9rem;
}

.portal-file-picker__copy span {
  color: var(--color-text-muted, #5b6570);
  font-size: 0.78rem;
  line-height: 1.4;
}

.portal-file-picker__input {
  width: 100%;
  color: var(--color-text-muted, #5b6570);
  font: inherit;
  font-size: 0.8rem;
  cursor: pointer;
}

.portal-file-picker__input::file-selector-button {
  min-height: 2.35rem;
  margin-right: 0.75rem;
  padding: 0.45rem 0.8rem;
  border: 1px solid var(--color-border, #d7dde5);
  border-radius: var(--radius-sm, 0.4rem);
  background: var(--color-surface-raised, #fff);
  color: var(--color-text, #15202b);
  font: inherit;
  font-weight: 600;
  cursor: pointer;
}

.portal-my-file-form__current-file {
  margin: 0.65rem 0 0;
  color: var(--color-text-muted, #5b6570);
  font-size: 0.8rem;
  overflow-wrap: anywhere;
}

.portal-my-file-form__field {
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 0.35rem;
  margin-bottom: 1rem;
}

.portal-my-file-form__field:last-child {
  margin-bottom: 0;
}

.portal-my-file-form__field label {
  color: var(--color-text, #15202b);
  font-size: 0.8rem;
  font-weight: 600;
}

.portal-my-file-form__input,
.portal-my-file-form__select,
.portal-my-file-form__textarea {
  box-sizing: border-box;
  width: 100%;
  max-width: none !important;
  min-height: 2.75rem;
  padding: 0.65rem 0.75rem;
  border: 1px solid var(--color-border, #d7dde5);
  border-radius: var(--radius-sm, 0.4rem);
  background: var(--color-surface-raised, #fff);
  color: var(--color-text, #15202b);
  font: inherit;
  font-size: 0.875rem;
}

.portal-my-file-form__textarea {
  min-height: 7rem;
  resize: vertical;
}

.portal-my-file-form__input:focus,
.portal-my-file-form__select:focus,
.portal-my-file-form__textarea:focus {
  border-color: var(--color-brand, #1f4b6e);
  outline: 2px solid color-mix(in srgb, var(--color-brand, #1f4b6e) 22%, transparent);
  outline-offset: 1px;
}

.portal-my-file-form__input::placeholder,
.portal-my-file-form__textarea::placeholder {
  color: color-mix(in srgb, var(--color-text-muted, #5b6570) 75%, white);
}

.portal-my-file-form__grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 1rem;
}

.portal-my-file-form__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.65rem;
  padding: 1rem clamp(1.1rem, 3vw, 1.5rem);
  border-top: 1px solid var(--color-border, #d7dde5);
  background: var(--color-surface, #f7f8fa);
}

.portal-my-file-form__actions .btn-primary,
.portal-my-file-form__actions .btn-secondary {
  min-height: 2.75rem;
}

/* Portal account */
.portal-account {
  gap: clamp(1rem, 2vw, 1.5rem);
}

.portal-account__header {
  padding-bottom: 0.25rem;
}

.portal-account .ac-page__title-row {
  align-items: flex-start;
}

.portal-account .ac-page__icon {
  width: 3rem;
  height: 3rem;
  border-radius: var(--radius-md, 0.65rem);
  background: color-mix(in srgb, var(--color-brand, #1f4b6e) 10%, white);
  color: var(--color-brand, #1f4b6e);
  border-color: color-mix(in srgb, var(--color-brand, #1f4b6e) 22%, white);
}

.portal-account .ac-layout {
  grid-template-columns: minmax(0, 2fr) minmax(16rem, 1fr);
  gap: 1rem;
}

.portal-account .ac-left,
.portal-account .ac-right {
  display: flex;
  min-width: 0;
  flex-direction: column;
  gap: 1rem;
}

.portal-account .ac-card {
  border-radius: var(--radius-md, 0.65rem);
  box-shadow: 0 1px 2px rgb(15 23 42 / 0.04);
}

.portal-account .ac-card__header {
  padding: 1rem 1.15rem;
  background: var(--color-surface-raised, #fff);
}

.portal-account .ac-card__title {
  color: var(--color-text, #15202b);
  font-size: 1rem;
}

.portal-account .ac-card__subtitle {
  margin-top: 0.2rem;
  font-size: 0.8rem;
  line-height: 1.45;
}

.portal-account .ac-card__body,
.portal-account .ac-photo-body {
  padding: 1.15rem;
}

.portal-account .ac-card__body .field label {
  color: var(--color-text, #15202b);
  font-size: 0.8rem;
  text-transform: none;
  letter-spacing: normal;
}

.portal-account .ac-card__body input[type="text"],
.portal-account .ac-card__body input[type="email"],
.portal-account .ac-card__body input[type="tel"],
.portal-account .ac-card__body input[type="password"],
.portal-account .ac-card__body select {
  min-height: 2.75rem;
  padding: 0.65rem 0.75rem;
}

.portal-account .portal-detail-list > div {
  justify-content: space-between;
  gap: 1rem;
  padding: 0.65rem 0;
  border-bottom: 1px solid var(--color-border, #d7dde5);
}

.portal-account .portal-detail-list > div:last-child {
  border-bottom: 0;
}

.portal-account .portal-detail-list dd {
  min-width: 0;
  text-align: right;
  overflow-wrap: anywhere;
}

.portal-account .ac-avatar {
  width: 6rem;
  height: 6rem;
  font-size: 2rem;
}

.portal-account .btn-primary,
.portal-account .ac-btn--remove {
  min-height: 44px;
}

.portal-messages {
  display: flex;
  flex-direction: column;
  gap: 0.85rem;
}

.portal-message {
  padding: 0.85rem 1rem;
  background: var(--color-surface-raised, #fff);
  border: 1px solid var(--color-border, #d7dde5);
  border-radius: var(--radius-sm, 0.4rem);
}

.portal-message header {
  font-size: 0.8125rem;
  color: var(--color-text-muted);
  margin-bottom: 0.35rem;
}

.portal-impersonation-banner {
  background: color-mix(in srgb, var(--color-brand, #1f4b6e) 12%, #fff8e6);
}

.portal-nav {
  flex-wrap: wrap;
}

@media (min-width: 641px) {
  .portal-tile-grid,
  .portal-feature-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .portal-child-switcher__select {
    flex: 0 1 min(20rem, 45vw);
  }
}

@media (min-width: 1100px) {
  .portal-tile-grid:not(.portal-tile-grid--summary) {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

@media (max-width: 900px) {
  .portal-my-file-form__grid {
    grid-template-columns: 1fr;
    gap: 0;
  }

  .portal-account .ac-layout {
    grid-template-columns: 1fr;
  }

  .portal-topbar .portal-nav {
    width: 100%;
  }

  .portal-subnav {
    flex-direction: column;
  }

  .portal-subnav a {
    width: 100%;
    justify-content: flex-start;
  }

  .portal-details-grid {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 640px) {
  .portal-reports__heading {
    align-items: flex-start;
  }

  .portal-reports__heading-icon {
    width: 2.6rem;
    height: 2.6rem;
  }

  .portal-report-card {
    grid-template-columns: auto minmax(0, 1fr);
    align-items: start;
  }

  .portal-report-card__aside {
    grid-column: 1 / -1;
    width: 100%;
    align-items: flex-start;
    padding-top: 0.75rem;
    border-top: 1px solid var(--color-border, #d7dde5);
  }

  .portal-report-card__actions,
  .portal-report-card__actions .btn-secondary {
    width: 100%;
  }

  .portal-report-card__actions .btn-secondary {
    justify-content: center;
  }

  .portal-report-show__actions .btn-primary {
    width: 100%;
  }

  .portal-class-hero {
    grid-template-columns: auto minmax(0, 1fr);
    align-items: start;
  }

  .portal-class-hero .portal-count {
    grid-column: 1 / -1;
    justify-self: start;
  }

  .portal-class-feature {
    min-height: 5.75rem;
  }

  .portal-message-compose .portal-page__header {
    align-items: stretch;
    gap: 0.4rem;
  }

  .portal-message-compose .portal-back-link {
    min-height: auto;
  }

  .portal-message-compose__actions {
    flex-direction: column;
  }

  .portal-message-compose__actions .btn-primary,
  .portal-message-compose__actions .btn-secondary {
    width: 100%;
  }

  .portal-my-file-editor .portal-page__header {
    align-items: stretch;
    gap: 0.4rem;
  }

  .portal-my-file-editor .portal-back-link {
    min-height: auto;
  }

  .portal-file-picker {
    align-items: flex-start;
  }

  .portal-file-picker__copy {
    flex-basis: calc(100% - 3.75rem);
  }

  .portal-file-picker__input::file-selector-button {
    display: block;
    margin: 0 0 0.5rem;
  }

  .portal-my-file-form__actions {
    flex-direction: column;
  }

  .portal-my-file-form__actions .btn-primary,
  .portal-my-file-form__actions .btn-secondary {
    width: 100%;
  }

  .portal-main {
    padding-inline: 0;
  }

  .portal-page h1 {
    font-size: 1.35rem;
  }

  .portal-page__header,
  .portal-detail-card__header,
  .portal-detail-rows li {
    flex-direction: column;
  }

  .portal-account .ac-page__title-row {
    gap: 0.75rem;
  }

  .portal-account .ac-page__icon {
    width: 2.75rem;
    height: 2.75rem;
  }

  .portal-account .ac-fields-grid {
    grid-template-columns: 1fr;
    gap: 0;
  }

  .portal-account .portal-detail-list > div {
    align-items: flex-start;
    flex-direction: column;
    gap: 0.2rem;
  }

  .portal-account .portal-detail-list dd {
    text-align: left;
  }

  .portal-account .ac-card__actions .btn-primary,
  .portal-account .ac-photo-form .btn-primary {
    width: 100%;
  }

  .portal-child-switcher__form {
    width: 100%;
  }

  .portal-child-switcher__select {
    flex-basis: 100%;
    width: 100%;
  }

  .portal-card {
    grid-template-columns: 1fr;
  }

  .portal-card__meta {
    min-width: 0;
    align-items: flex-start;
    text-align: left;
  }

  .portal-card__meta,
  .portal-tile__footer,
  .portal-detail-actions,
  .portal-detail-actions .btn-primary,
  .portal-course-tile .btn-secondary {
    width: 100%;
  }

  .portal-tile__footer {
    align-items: stretch;
    flex-direction: column;
  }

  .portal-detail-actions .btn-primary,
  .portal-course-tile .btn-secondary {
    min-height: 2.75rem;
    justify-content: center;
  }

  .portal-task-card__meta,
  .portal-task-card__meta form,
  .portal-detail-card__body > form {
    width: 100%;
  }

  .btn-primary.portal-task-complete {
    width: 100%;
    min-height: 2.75rem;
    justify-content: center;
  }

  .portal-detail-card__summary {
    width: 100%;
    justify-content: space-between;
  }

  .portal-detail-card__summary div {
    text-align: left;
  }

  .portal-calendar .fc-header-toolbar {
    align-items: stretch;
    flex-direction: column;
    gap: 0.5rem;
  }

  .portal-calendar .fc-toolbar-chunk {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
  }
}
/*
 * Schoolise application styles
 *

























 */