:root {
  color-scheme: light;
  --ink: #162426;
  --muted: #5d6d70;
  --line: #d6dedb;
  --panel: #ffffff;
  --soft: #eef5f3;
  --brand: #176b73;
  --brand-dark: #104e55;
  --accent: #c76428;
  --danger: #b74438;
  --shadow: 0 18px 42px rgba(20, 39, 42, 0.12);
}
* { box-sizing: border-box; }
[hidden] { display: none !important; }
html { width: 100%; overflow-x: hidden; }
body {
  margin: 0;
  width: 100%;
  overflow-x: hidden;
  background: #f4f7f5;
  color: var(--ink);
  font-family: Segoe UI, system-ui, -apple-system, BlinkMacSystemFont, sans-serif;
  letter-spacing: 0;
}
a { color: inherit; }
.login-shell {
  min-height: 100vh;
  display: grid;
  place-items: center;
  padding: 24px;
  background: linear-gradient(120deg, #f5f7f5 0%, #e9f1ef 55%, #f7efe7 100%);
}
.login-panel {
  width: min(480px, 100%);
  background: var(--panel);
  border: 1px solid var(--line);
  border-radius: 8px;
  box-shadow: var(--shadow);
  padding: 28px;
}
.login-logo-link {
  display: flex;
  width: fit-content;
  max-width: 100%;
  margin: 0 auto 18px;
  text-decoration: none;
}
.login-logo {
  display: block;
  width: auto;
  max-width: min(220px, 100%);
  height: 72px;
  object-fit: contain;
}
.login-panel h1, .topbar h1 { margin: 0; font-size: 28px; line-height: 1.15; }
.muted { color: var(--muted); margin: 10px 0 22px; }
.web-control-details { display: grid; gap: 10px; margin: 0; }
.web-control-details div { display: grid; grid-template-columns: minmax(150px, 220px) minmax(0, 1fr); gap: 16px; align-items: start; }
.web-control-details dt { color: var(--muted); font-weight: 700; }
.web-control-details dd { margin: 0; overflow-wrap: anywhere; }
.web-control-summary-table .table-wrap { overflow-x: hidden; }
.web-control-summary-table table { min-width: 0; table-layout: fixed; }
.activity-requests-table .table-wrap { overflow-x: visible; }
.activity-requests-table table { min-width: 0; table-layout: fixed; }
.activity-requests-table th:nth-child(1) { width: 16%; }
.activity-requests-table th:nth-child(2) { width: 25%; }
.activity-requests-table th:nth-child(3) { width: 18%; }
.activity-requests-table th:nth-child(4) { width: 18%; }
.activity-requests-table th:nth-child(5) { width: 13%; }
.activity-requests-table th:nth-child(6) { width: 10%; }
.activity-requests-table td { white-space: normal; overflow-wrap: anywhere; }
.activity-requests-table td small { display: block; margin-top: 3px; }
.web-control-summary-table th,
.web-control-summary-table td { overflow-wrap: anywhere; }
.web-control-pages-table th:first-child,
.web-control-pages-table td:first-child { width: 76%; }
.web-control-pages-table th:last-child,
.web-control-pages-table td:last-child { text-align: right; width: 24%; }
.web-control-logins-table th:first-child,
.web-control-logins-table td:first-child { white-space: nowrap; width: 28%; }
.web-control-logins-table th:last-child,
.web-control-logins-table td:last-child { width: 72%; }
.eyebrow {
  margin: 0 0 7px;
  color: var(--brand);
  font-weight: 800;
  font-size: 12px;
  text-transform: uppercase;
}
.login-form { display: grid; gap: 14px; }
.login-remember {
  align-items: center;
  display: flex;
  font-weight: 600;
  gap: 9px;
  line-height: 1.35;
}
.login-remember input { flex: 0 0 auto; height: 18px; margin: 0; width: 18px; }
.login-password-manager-hint {
  display: block;
  margin-top: -6px;
  color: var(--muted);
  font-size: 12px;
  line-height: 1.4;
}
label { display: grid; gap: 7px; font-weight: 700; color: #304346; }
input, select, textarea {
  width: 100%;
  border: 1px solid #bfcac7;
  border-radius: 6px;
  min-height: 44px;
  padding: 10px 12px;
  font: inherit;
  color: var(--ink);
  background: white;
}
textarea { resize: vertical; min-height: 84px; }
input:focus, select:focus, textarea:focus { outline: 3px solid rgba(23, 107, 115, .18); border-color: var(--brand); }
button, .primary {
  border: 0;
  border-radius: 6px;
  min-height: 44px;
  padding: 10px 14px;
  background: var(--brand);
  color: white;
  font: inherit;
  font-weight: 800;
  cursor: pointer;
}
button:hover, .primary:hover { background: var(--brand-dark); }
.login-secondary-action {
  width: 100%;
  min-height: 44px;
  display: flex;
  align-items: center;
  justify-content: center;
  text-decoration: none;
  margin-top: 10px;
  box-sizing: border-box;
}
.ghost {
  color: var(--brand);
  background: #edf5f3;
  border: 1px solid #bfd6d2;
}
.quick-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
  margin-top: 8px;
}
.quick-label {
  margin: 16px 0 0;
  color: var(--muted);
  font-size: 13px;
  font-weight: 800;
}
.quick-dev-note {
  margin: 4px 0 0;
  color: var(--muted);
  font-size: 12px;
  font-weight: 700;
}
.quick-profile-form {
  min-width: 0;
  display: grid;
  margin: 0;
}
.quick-profile-button {
  min-height: 58px;
  padding: 9px 10px;
  display: grid;
  gap: 2px;
  text-align: left;
  line-height: 1.15;
}
.quick-profile-button strong,
.quick-profile-button span,
.quick-profile-button small {
  min-width: 0;
  overflow-wrap: anywhere;
}
.quick-profile-button strong {
  color: var(--ink);
  font-size: 14px;
}
.quick-profile-button span {
  color: var(--brand-dark);
  font-size: 12px;
  font-weight: 800;
}
.quick-profile-button small {
  color: var(--muted);
  font-size: 11px;
  font-weight: 600;
}
.quick-login-button em {
  color: var(--brand);
  font-size: 11px;
  font-style: normal;
  font-weight: 900;
}
.quick-technical {
  margin-top: 12px;
}
.quick-technical summary {
  cursor: pointer;
  color: var(--muted);
  font-size: 13px;
  font-weight: 800;
}
.quick-grid-technical {
  grid-template-columns: 1fr;
}
.alert {
  padding: 11px 13px;
  border-radius: 6px;
  color: #7c231c;
  background: #fdebe8;
  border: 1px solid #f0b7ae;
  font-weight: 700;
}
.notice {
  padding: 12px 14px;
  border-radius: 6px;
  font-weight: 800;
  margin: 0 0 16px;
}
.notice.success { color: #174b35; background: #e4f4ec; border: 1px solid #9dd4ba; }
.notice.error { color: #7c231c; background: #fdebe8; border: 1px solid #f0b7ae; }
.app-shell {
  min-height: 100vh;
  display: grid;
  grid-template-columns: 260px minmax(0, 1fr);
  max-width: 100%;
  overflow-x: clip;
}
.employee-report-trigger {
  position: fixed;
  right: 20px;
  bottom: 20px;
  z-index: 35;
  min-height: 44px;
  padding: 10px 16px;
  border: 1px solid #174f57;
  border-radius: 6px;
  background: #ffffff;
  color: #174f57;
  box-shadow: 0 8px 20px rgba(18,45,49,.18);
  font: inherit;
  font-weight: 800;
  cursor: pointer;
}
.employee-report-trigger:hover { background: #e8f3f1; }
.employee-report-trigger:focus-visible { outline: 3px solid #f3b05c; outline-offset: 3px; }
.employee-report-trigger:active { transform: translateY(1px); }
.employee-report-overlay {
  position: fixed;
  inset: 0;
  z-index: 45;
  display: grid;
  place-items: end;
  padding: 20px;
  background: rgba(18,45,49,.38);
}
.employee-report-overlay[hidden] { display: none; }
.employee-report-dialog {
  width: min(420px, 100%);
  max-height: calc(100vh - 40px);
  overflow-y: auto;
  padding: 20px;
  border: 1px solid #b8cfcb;
  border-radius: 8px;
  background: #ffffff;
  box-shadow: 0 18px 45px rgba(18,45,49,.28);
}
.employee-report-panel-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 14px;
}
.employee-report-panel-head h2 { margin: 0; font-size: 22px; }
.employee-report-close {
  width: 44px;
  height: 44px;
  flex: 0 0 44px;
  border: 1px solid #b8cfcb;
  border-radius: 6px;
  background: #ffffff;
  color: #174f57;
  font-size: 25px;
  line-height: 1;
  cursor: pointer;
}
.employee-report-types { display: grid; gap: 10px; }
.employee-report-type {
  min-height: 52px;
  width: 100%;
  padding: 12px 14px;
  border: 1px solid #8fb8b2;
  border-radius: 6px;
  background: #f4f9f8;
  color: #173f45;
  font: inherit;
  font-weight: 800;
  text-align: left;
  cursor: pointer;
}
.employee-report-type:hover { background: #e5f2f0; }
.employee-report-type[aria-pressed="true"] { border-color: #174f57; background: #dcefeb; }
.employee-report-close:focus-visible,
.employee-report-type:focus-visible { outline: 3px solid #f3b05c; outline-offset: 2px; }
.employee-report-selection-status { min-height: 22px; margin: 12px 0 0; color: #345f64; font-weight: 700; }
.employee-report-recorder { border-top: 1px solid #d7e2e1; margin-top: 14px; padding-top: 14px; }
.employee-report-recorder[hidden] { display: none; }
.employee-report-recorder-status { margin: 0 0 12px; color: #294f54; }
.employee-report-recorder-actions { display: flex; flex-wrap: wrap; gap: 8px; }
.employee-report-recorder-actions button {
  min-height: 42px;
  border: 1px solid #174f57;
  border-radius: 6px;
  background: #174f57;
  color: #fff;
  padding: 9px 14px;
  font-weight: 800;
  cursor: pointer;
}
.employee-report-recorder-actions button[data-employee-report-cancel] { background: #fff; color: #7a2934; border-color: #a94452; }
.employee-report-recorder-actions button:focus-visible { outline: 3px solid #f3b05c; outline-offset: 2px; }
.employee-report-recorder-actions button:disabled { opacity: .65; cursor: wait; }
.employee-report-confirmation { border-top: 1px solid #d7e2e1; margin-top: 14px; padding-top: 14px; }
.employee-report-confirmation[hidden] { display: none; }
.employee-report-confirmation p { margin: 0 0 10px; }
.employee-report-confirmation button {
  border: 1px solid #174f57;
  background: #174f57;
  color: #fff;
  border-radius: 6px;
  min-height: 42px;
  padding: 9px 14px;
  font: inherit;
  font-weight: 800;
  cursor: pointer;
}
.employee-report-confirmation button:focus-visible { outline: 3px solid #f3b05c; outline-offset: 2px; }
.employee-report-list { display: grid; gap: 10px; }
.employee-report-list-item { border: 1px solid var(--line); border-radius: 6px; background: #fff; overflow: hidden; }
.employee-report-list-link { display: block; padding: 14px; color: inherit; text-decoration: none; }
.employee-report-list-link:hover { background: #f3f8f7; }
.employee-report-list-link:focus-visible { outline: 3px solid #f3b05c; outline-offset: -3px; }
.employee-report-list-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.employee-report-list-badges { display: inline-flex; align-items: center; justify-content: flex-end; gap: 7px; flex-wrap: wrap; }
.employee-report-has-unread { border-color: #28796d; box-shadow: inset 4px 0 0 #28796d; }
.employee-report-unread-badge { display: inline-flex; align-items: center; min-height: 24px; padding: 2px 8px; border-radius: 999px; background: #dcefeb; color: #155f55; font-size: 12px; font-weight: 850; white-space: nowrap; }
.employee-report-list-item p { margin: 8px 0 5px; font-weight: 750; }
.employee-report-list-item small { color: var(--muted); overflow-wrap: anywhere; }
.employee-report-list-link .employee-report-open-label { display: inline-block; margin-top: 10px; color: #155f55; font-weight: 800; }
.employee-report-direction-filters {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: 12px;
  align-items: end;
  margin: 0 0 16px;
  padding: 14px;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: #f7faf9;
}
.employee-report-direction-filters label { display: grid; gap: 6px; color: var(--muted); font-size: 13px; font-weight: 800; }
.employee-report-direction-filters input,
.employee-report-direction-filters select { width: 100%; min-width: 0; min-height: 42px; }
.employee-report-direction-filter-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; min-height: 42px; }
.employee-report-direction-filter-actions .button { min-height: 42px; }
.employee-report-direction-counts {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
  margin: 0 0 16px;
}
.employee-report-direction-counts div { display: grid; gap: 2px; padding: 12px; border: 1px solid var(--line); border-radius: 6px; background: #fff; }
.employee-report-direction-counts strong { font-size: 22px; color: var(--brand); }
.employee-report-direction-counts span { color: var(--muted); font-size: 13px; font-weight: 750; }
.employee-report-direction-item .employee-report-list-link { display: grid; gap: 3px; }
.employee-report-direction-pagination { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-top: 16px; }
.employee-report-direction-pagination > span { color: var(--muted); font-weight: 750; }
.employee-report-detail-head { display: flex; align-items: start; justify-content: space-between; gap: 14px; }
.employee-report-detail-head h1 { margin: 5px 0 0; }
.employee-report-summary { margin: 18px 0 22px; }
.employee-report-detail h2 { margin: 0 0 12px; font-size: 20px; }
.employee-report-detail > .text-link { color: #155f55; }
.employee-report-technical-path {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: end;
  gap: 8px 14px;
  margin: 0 0 22px;
  padding: 12px 0;
  border-top: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
}
.employee-report-technical-path > div { min-width: 0; display: grid; gap: 6px; }
.employee-report-technical-path code { display: block; max-width: 100%; overflow-wrap: anywhere; word-break: break-word; }
.employee-report-technical-path .employee-report-copy-path { min-height: 42px; white-space: nowrap; }
.employee-report-copy-status { grid-column: 1 / -1; min-height: 20px; color: var(--muted); font-size: 13px; font-weight: 750; }
.employee-report-direction-response { display: grid; gap: 10px; margin: 0 0 22px; padding: 14px; border: 1px solid var(--line); border-radius: 6px; background: #f7faf9; }
.employee-report-direction-response label { font-weight: 800; }
.employee-report-direction-response textarea { width: 100%; min-height: 108px; resize: vertical; }
.employee-report-direction-response .button { justify-self: start; }
.employee-report-timeline { display: grid; gap: 10px; margin-bottom: 18px; }
.employee-report-technical-context { max-height: 420px; margin: 0 0 22px; padding: 14px; overflow: auto; border: 1px solid var(--line); border-radius: 6px; background: #f7f8fa; color: var(--ink); font-size: 13px; line-height: 1.5; white-space: pre-wrap; overflow-wrap: anywhere; }
.employee-report-capture-item { display: grid; gap: 8px; }
.employee-report-capture-preview { display: block; width: min(100%, 720px); height: auto; max-height: 520px; object-fit: contain; border: 1px solid var(--line); border-radius: 6px; background: #fff; }
.employee-report-add-information { margin: 0 0 18px; }
.employee-report-add-information-trigger {
  min-height: 42px;
  border: 1px solid #174f57;
  border-radius: 6px;
  background: #174f57;
  color: #fff;
  padding: 9px 14px;
  font: inherit;
  font-weight: 800;
  cursor: pointer;
}
.employee-report-add-information-trigger:focus-visible { outline: 3px solid #f3b05c; outline-offset: 2px; }
.employee-report-add-information .employee-report-dialog h2 { margin: 5px 0 0; }
.employee-report-event { border-left: 3px solid #39777c; padding: 10px 12px; background: #f7faf9; }
.employee-report-event-head { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; }
.employee-report-event-head time, .employee-report-event small { color: var(--muted); }
.employee-report-event p { margin: 8px 0 0; white-space: pre-wrap; }
.employee-report-attachments { margin: 9px 0 0; padding-left: 20px; }
.employee-report-attachments li { display: grid; gap: 6px; }
.employee-report-audio-meta { color: var(--muted); }
.employee-report-attachments audio { width: min(100%, 420px); min-height: 40px; }
.sidebar {
  position: sticky;
  top: 0;
  align-self: start;
  height: 100vh;
  min-width: 0;
  max-width: 100%;
  overflow-y: auto;
  overflow-x: clip;
  background: var(--brand);
  color: white;
  padding: 22px 16px;
}
.nav-details { display: block; }
.nav-details summary {
  list-style: none;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  gap: 12px;
  align-items: center;
  cursor: pointer;
}
.nav-details summary::-webkit-details-marker { display: none; }
.brand {
  min-width: 0;
  max-width: 100%;
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 4px 0 18px;
}
.brand span {
  min-width: 0;
}
.brand strong,
.brand small {
  max-width: 100%;
  overflow-wrap: anywhere;
}
.brand-profile-link {
  color: inherit;
  text-decoration: none;
  cursor: pointer;
}
.app-logo-link {
  flex: 0 0 100%;
  min-width: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  text-decoration: none;
}
.app-logo {
  display: block;
  width: auto;
  max-width: min(188px, 100%);
  height: 54px;
  padding: 5px 6px;
  object-fit: contain;
  object-position: center;
  border-radius: 8px;
  background: #ffffff;
  box-shadow: 0 8px 18px rgba(0,0,0,.12);
}
.brand-mark {
  width: 42px;
  height: 42px;
  border-radius: 8px;
  display: grid;
  place-items: center;
  background: #f3b05c;
  color: #122d31;
  font-weight: 900;
}
.brand small { display: block; color: #b8ccca; margin-top: 2px; }
.user-menu-trigger {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  gap: 10px;
  color: #ffffff;
}
.user-avatar {
  width: 42px;
  height: 42px;
  border-radius: 999px;
  display: grid;
  place-items: center;
  background: #f3b05c;
  color: var(--brand-dark);
  border: 2px solid rgba(255,255,255,.55);
  font-weight: 900;
  box-shadow: 0 4px 12px rgba(0,0,0,.18);
}
.user-menu-meta {
  display: grid;
  gap: 2px;
  min-width: 0;
}
.user-menu-meta strong,
.user-menu-meta small {
  max-width: 150px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.user-menu-meta small {
  color: #b8ccca;
  font-weight: 800;
}
.header-more-details {
  position: relative;
  flex: 0 0 auto;
}
.header-more-details > summary {
  list-style: none;
  min-height: 38px;
  display: flex;
  align-items: center;
  padding: 8px 10px;
  border-radius: 6px;
  background: rgba(255,255,255,.1);
  color: #ffffff;
  font-size: 13px;
  font-weight: 900;
  cursor: pointer;
}
.header-more-details > summary::-webkit-details-marker { display: none; }
.header-more-menu {
  position: absolute;
  top: calc(100% + 8px);
  right: 0;
  z-index: 12;
  width: 190px;
  display: grid;
  gap: 6px;
  padding: 8px;
  border: 1px solid rgba(255,255,255,.16);
  border-radius: 8px;
  background: var(--brand-dark);
  box-shadow: 0 14px 30px rgba(0,0,0,.26);
}
.header-more-menu-grouped {
  width: min(340px, calc(100vw - 24px));
  max-height: min(72vh, 560px);
  overflow-y: auto;
  gap: 10px;
}
.header-more-group {
  display: grid;
  gap: 5px;
  padding-bottom: 8px;
  border-bottom: 1px solid rgba(255,255,255,.13);
}
.header-more-group:last-child {
  border-bottom: 0;
  padding-bottom: 0;
}
.header-more-group strong {
  padding: 2px 4px;
  color: #b9d7d2;
  font-size: 11px;
  font-weight: 900;
  text-transform: uppercase;
}
.header-more-menu a {
  padding: 10px 11px;
  border-radius: 6px;
  color: #ffffff;
  text-decoration: none;
  font-weight: 800;
}
.header-more-menu a:hover { background: rgba(255,255,255,.12); }
.menu-toggle {
  display: none;
  color: var(--brand-dark);
  background: #f3b05c;
  border-radius: 6px;
  padding: 9px 12px;
  font-weight: 900;
}
.sidebar nav { display: grid; gap: 6px; }
.nav-details nav { margin-top: 14px; }
.nav-details:not([open]) nav { display: grid; }
.side-nav-group {
  display: grid;
  gap: 5px;
  padding: 11px 0;
  border-top: 1px solid rgba(255,255,255,.12);
}
.side-nav-group:first-child {
  border-top: 0;
  padding-top: 0;
}
.side-nav-group summary {
  padding: 0 5px 2px;
  color: #b9d7d2;
  font-size: 11px;
  font-weight: 900;
  text-transform: uppercase;
  cursor: pointer;
  list-style: none;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}
.side-nav-group summary::-webkit-details-marker {
  display: none;
}
.side-nav-group summary::after {
  content: "-";
  color: rgba(255,255,255,.65);
  font-size: 13px;
}
.side-nav-group:not([open]) summary::after {
  content: "+";
}
.side-nav-links {
  display: grid;
  gap: 5px;
  margin-top: 6px;
}
.side-nav-group:not([open]) .side-nav-links {
  display: none;
}
.sidebar nav a {
  min-width: 0;
  text-decoration: none;
  color: #e8f1ef;
  padding: 10px 12px;
  border-radius: 6px;
  font-weight: 700;
  overflow-wrap: anywhere;
}
.sidebar nav a:hover { background: rgba(255,255,255,.11); }
.sidebar nav a.is-active,
.header-more-menu a.is-active {
  background: rgba(243, 176, 92, .24);
  color: #ffffff;
  box-shadow: inset 3px 0 0 #f3b05c;
}
.sidebar nav a.nav-logout {
  margin-top: 10px;
  background: var(--danger);
  color: #ffffff;
  text-align: center;
  font-weight: 900;
}
.sidebar nav a.nav-logout:hover { background: #94352d; }
.workspace {
  min-width: 0;
  max-width: 100%;
  overflow-x: clip;
  padding: 26px;
}
.topbar {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 18px;
  margin-bottom: 24px;
}
.temporary-role-notice {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  margin: -8px 0 20px;
  padding: 12px 14px;
  border: 1px solid #c58b2a;
  border-left: 5px solid #c58b2a;
  border-radius: 6px;
  background: #fff7e7;
  color: var(--ink);
}
.temporary-role-notice div { display: grid; gap: 2px; }
.temporary-role-notice span { color: var(--muted); font-size: 13px; }
.temporary-role-notice .table-action { flex: 0 0 auto; }
.page-pasar-lista, .workspace:has(.teacher-session-attendance-shell) {
  padding-top: 14px;
}
.page-pasar-lista .topbar, .workspace:has(.teacher-session-attendance-shell) .topbar {
  margin-bottom: 12px;
}
.page-pasar-lista .topbar .eyebrow, .workspace:has(.teacher-session-attendance-shell) .topbar .eyebrow {
  display: none;
}
.teacher-date-actions {
  justify-content: center;
  gap: 10px;
}
.page-inline-actions {
  display: flex;
  justify-content: flex-end;
  gap: 8px;
  flex-wrap: wrap;
  margin: -62px 0 14px;
  min-height: 42px;
  pointer-events: none;
}
.page-inline-actions .table-action {
  pointer-events: auto;
}
.category-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
  margin-bottom: 18px;
}
.category-card {
  min-height: 142px;
  display: grid;
  align-content: space-between;
  gap: 10px;
  text-decoration: none;
  background: var(--panel);
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 18px;
  box-shadow: 0 10px 24px rgba(20, 39, 42, 0.06);
}
.category-card span {
  color: var(--brand);
  font-size: 13px;
  font-weight: 900;
  text-transform: uppercase;
}
.category-card strong {
  color: var(--ink);
  font-size: 26px;
}
.category-card p {
  color: var(--muted);
  margin: 0;
  line-height: 1.45;
}
.category-card:hover { border-color: #9fc5c0; transform: translateY(-1px); }
.admin-hero {
  display: flex;
  justify-content: space-between;
  gap: 18px;
  align-items: center;
  margin-bottom: 16px;
  padding: 18px;
  background: #ffffff;
  border: 1px solid var(--line);
  border-left: 6px solid var(--accent);
  border-radius: 8px;
  box-shadow: 0 10px 24px rgba(20, 39, 42, 0.06);
}
.admin-workbench {
  display: grid;
  gap: 14px;
  margin-bottom: 16px;
}
.admin-search-panel {
  min-width: 0;
  position: relative;
  padding: 14px;
  border: 1px solid var(--line);
  border-left: 6px solid var(--brand);
  border-radius: 8px;
  background: #ffffff;
  box-shadow: 0 10px 24px rgba(20, 39, 42, 0.06);
}
.admin-search-panel form {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 10px;
  align-items: end;
}
.admin-search-suggestions {
  position: absolute;
  left: 14px;
  right: 14px;
  top: calc(100% - 8px);
  z-index: 15;
  display: grid;
  gap: 6px;
  padding: 8px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #ffffff;
  box-shadow: 0 14px 30px rgba(20, 39, 42, 0.18);
}
.admin-search-suggestion {
  min-width: 0;
  display: grid;
  gap: 3px;
  padding: 10px;
  border-radius: 7px;
  color: var(--ink);
  text-decoration: none;
}
.admin-search-suggestion:hover {
  background: #edf8f6;
}
.admin-search-suggestion span {
  color: var(--brand);
  font-size: 12px;
  font-weight: 900;
  text-transform: uppercase;
}
.admin-search-suggestion strong,
.admin-search-suggestion small {
  min-width: 0;
  overflow-wrap: anywhere;
}
.admin-search-suggestion small {
  color: var(--muted);
  font-size: 13px;
  font-weight: 800;
}
.admin-main-actions {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 10px;
}
.admin-main-actions-primary {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}
.admin-main-action {
  min-width: 0;
  min-height: 122px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  gap: 12px;
  padding: 14px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #ffffff;
  color: var(--ink);
  text-decoration: none;
  box-shadow: 0 10px 24px rgba(20, 39, 42, 0.06);
}
.admin-main-action:nth-child(1) { border-color: #b8d6d1; background: #f2faf8; }
.admin-main-action:nth-child(2) { border-color: #d2d9dc; background: #f4f7f8; }
.admin-main-action:nth-child(3) { border-color: #e1c2ad; background: #fff4ec; }
.admin-main-action:nth-child(4) { border-color: #edc6a4; background: #fff7e8; }
.admin-main-action:nth-child(5) { border-color: #c3ccd0; background: #f1f5f6; }
.admin-main-icon {
  width: 38px;
  height: 38px;
  display: grid;
  place-items: center;
  border-radius: 999px;
  background: var(--brand);
  color: #ffffff;
  font-weight: 900;
}
.admin-main-action:nth-child(3) .admin-main-icon { background: #8f4f2b; }
.admin-main-action:nth-child(4) .admin-main-icon { background: #c76428; }
.admin-main-action:nth-child(5) .admin-main-icon { background: #314d54; }
.admin-main-copy {
  min-width: 0;
  display: grid;
  gap: 5px;
}
.admin-main-action strong {
  font-size: 18px;
  line-height: 1.15;
  overflow-wrap: anywhere;
}
.admin-main-action small {
  color: var(--muted);
  font-size: 13px;
  font-weight: 800;
  line-height: 1.3;
}
.extraescolar-wizard-header {
  display: grid;
  gap: 14px;
}
.wizard-steps {
  display: flex;
  gap: 8px;
  overflow-x: auto;
  padding-bottom: 2px;
}
.wizard-step {
  border: 1px solid var(--line);
  border-radius: 8px;
  color: var(--muted);
  flex: 0 0 auto;
  font-size: 13px;
  padding: 8px 10px;
  text-decoration: none;
}
.wizard-step.is-current {
  background: var(--ink);
  border-color: var(--ink);
  color: #fff;
}
.status-badge {
  border-radius: 999px;
  display: inline-flex;
  font-size: 12px;
  font-weight: 800;
  margin-right: 6px;
  padding: 3px 8px;
}
.status-badge.ok {
  background: #e7f7ed;
  color: #176c36;
}
.status-badge.warning {
  background: #fff4d6;
  color: #7a4d00;
}
.status-badge.danger {
  background: #ffe6e0;
  color: #9b2d18;
}
.employee-contract-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 20px 28px;
  margin: 6px 0 18px;
}
.employee-labor-section {
  min-width: 0;
  border-top: 2px solid var(--line);
  padding-top: 12px;
}
.employee-labor-section h3 {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  margin: 0 0 10px;
  font-size: 16px;
}
.employee-labor-section h3 .status-badge {
  margin-right: 0;
}
@media (max-width: 700px) {
  .employee-contract-grid {
    grid-template-columns: 1fr;
    gap: 16px;
  }
}
.compact-list {
  margin: 8px 0 0;
  padding-left: 18px;
}
.compact-list li {
  margin-bottom: 8px;
}
.admin-focus-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
  margin-bottom: 16px;
}
.admin-search-results-panel {
  min-width: 0;
  display: grid;
  gap: 12px;
  padding: 16px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #ffffff;
  box-shadow: 0 10px 24px rgba(20, 39, 42, 0.06);
  margin-bottom: 16px;
}
.admin-search-result-list {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
}
.admin-search-result-card {
  min-width: 0;
  display: grid;
  gap: 6px;
  padding: 12px;
  border: 1px solid var(--line);
  border-left: 5px solid var(--brand);
  border-radius: 8px;
  background: #fbfdfd;
}
.admin-search-result-card span {
  color: var(--brand);
  font-size: 12px;
  font-weight: 900;
  text-transform: uppercase;
}
.admin-search-result-card strong {
  min-width: 0;
  overflow-wrap: anywhere;
  font-size: 16px;
}
.admin-search-result-card small {
  min-width: 0;
  color: var(--muted);
  font-size: 13px;
  font-weight: 800;
  overflow-wrap: anywhere;
}
.admin-today-tray,
.admin-secondary-actions {
  min-width: 0;
  display: grid;
  gap: 12px;
  padding: 16px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #ffffff;
  box-shadow: 0 10px 24px rgba(20, 39, 42, 0.06);
  margin-bottom: 16px;
}
.admin-work-list {
  display: grid;
  gap: 8px;
}
.admin-work-item {
  min-width: 0;
  display: grid;
  grid-template-columns: 86px minmax(0, 1fr) auto;
  gap: 10px;
  align-items: center;
  padding: 11px;
  border: 1px solid var(--line);
  border-left: 5px solid #c3ccd0;
  border-radius: 8px;
  background: #fbfdfd;
  color: var(--ink);
  text-decoration: none;
}
.admin-work-item:hover {
  border-color: var(--brand);
  border-left-color: var(--brand);
  background: #f2faf8;
}
.admin-work-danger { border-left-color: #b74438; }
.admin-work-warning,
.admin-work-money { border-left-color: #c76428; }
.admin-work-notice { border-left-color: #314d54; }
.admin-work-group { border-left-color: #8f4f2b; }
.admin-today-toolbar {
  display: flex;
  align-items: end;
  flex-wrap: wrap;
  gap: 10px;
  margin-bottom: 16px;
}
.admin-today-toolbar form { margin: 0; }
.admin-today-toolbar label { display: grid; gap: 4px; }
.admin-today-toolbar input { width: 180px; min-height: 40px; }
.admin-today-grid > .admin-today-attention { grid-column: 1 / -1; }
.admin-today-grid > .admin-today-attention .admin-today-attention-list {
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 260px), 1fr));
}
.admin-today-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(320px, .8fr);
  gap: 14px;
  margin-bottom: 16px;
}
.admin-today-routine-list,
.admin-today-attention-list {
  display: grid;
  gap: 8px;
}
.admin-today-routine {
  min-width: 0;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 10px;
  align-items: center;
  padding: 12px;
  border: 1px solid var(--line);
  border-left: 5px solid #c3ccd0;
  border-radius: 8px;
  background: #fbfdfd;
}
.admin-today-routine.is-complete {
  border-left-color: #2f6d4e;
  background: #f2faf8;
}
.admin-today-routine strong,
.admin-today-routine small {
  display: block;
  min-width: 0;
  overflow-wrap: anywhere;
}
.admin-today-routine small {
  margin-top: 3px;
  color: var(--muted);
  font-weight: 800;
}
.admin-today-routine form {
  margin: 0;
}
.admin-today-routine button {
  min-height: 38px;
  padding: 0 12px;
}
.admin-today-attention-item {
  min-width: 0;
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 5px 10px;
  padding: 12px;
  border: 1px solid #e1c2ad;
  border-left: 5px solid #c76428;
  border-radius: 8px;
  background: #fff8ee;
  color: var(--ink);
  text-decoration: none;
}
.admin-today-attention-item span,
.admin-today-attention-item small,
.admin-today-attention-item em {
  color: var(--muted);
  font-size: 12px;
  font-weight: 850;
  overflow-wrap: anywhere;
}
.admin-today-attention-item span {
  color: var(--ink);
  font-size: 14px;
  font-weight: 950;
}
.admin-today-attention-item em {
  color: var(--brand);
  font-style: normal;
  font-weight: 950;
}
.admin-today-attention-item strong {
  grid-row: 1 / span 3;
  grid-column: 1;
  align-self: center;
  color: #8f4f2b;
  font-size: 28px;
  line-height: 1;
}
.admin-coverage-card {
  min-width: 0;
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(190px, auto);
  gap: 16px;
  align-items: center;
  padding: 14px;
  border: 1px solid #e1c2ad;
  border-left: 5px solid #c76428;
  border-radius: 8px;
  background: #fff8ee;
}
.admin-coverage-card-main,
.admin-coverage-card-status { min-width: 0; display: grid; gap: 5px; }
.admin-coverage-card-main strong { font-size: 16px; line-height: 1.35; overflow-wrap: anywhere; }
.admin-coverage-card-main span { font-weight: 900; }
.admin-coverage-card-main small { color: var(--muted); font-weight: 800; }
.admin-coverage-card-status { justify-items: end; text-align: right; }
.admin-coverage-card-status em { color: #9a4b20; font-style: normal; font-weight: 950; }
.admin-coverage-card-status .table-action { white-space: nowrap; }
@media (max-width: 760px) {
  .admin-coverage-card { grid-template-columns: minmax(0, 1fr); }
  .admin-coverage-card-status { justify-items: start; text-align: left; }
}
.admin-today-empty {
  display: grid;
  gap: 3px;
  padding: 13px;
  border: 1px solid #b8d6d1;
  border-radius: 8px;
  background: #f2faf8;
}
.admin-today-empty span {
  color: var(--muted);
  font-weight: 800;
}
.admin-today-work-cases {
  grid-column: 1 / -1;
}
.admin-today-work-case-section {
  display: grid;
  gap: 8px;
  padding: 12px 0;
  border-top: 1px solid var(--line);
}
.admin-today-work-case-section:first-of-type {
  border-top: 0;
  padding-top: 0;
}
.admin-today-work-case-hint {
  margin: 0;
  color: var(--muted);
  font-size: 13px;
  font-weight: 800;
}
.admin-today-work-case-list,
.admin-today-work-case-counters {
  display: grid;
  gap: 8px;
}
.admin-today-work-case-card {
  padding: 11px;
}
.work-case-list-panel,
.work-case-summary-panel,
.work-case-history,
.work-case-controls,
.work-case-closed {
  min-width: 0;
  display: grid;
  gap: 12px;
  padding: 16px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #ffffff;
  box-shadow: 0 10px 24px rgba(20, 39, 42, 0.06);
  margin-bottom: 16px;
}
.work-case-filter-panel {
  margin-bottom: 14px;
}
.work-case-list {
  display: grid;
  gap: 10px;
}
.work-case-card {
  min-width: 0;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 12px;
  align-items: center;
  padding: 13px;
  border: 1px solid var(--line);
  border-left: 5px solid #c3ccd0;
  border-radius: 8px;
  background: #fbfdfd;
}
.work-case-card.status-pendiente { border-left-color: #c76428; }
.work-case-card.status-en_gestion { border-left-color: #2e6ba8; }
.work-case-card.status-esperando { border-left-color: #8a6a18; }
.work-case-card.status-resuelto { border-left-color: #2f6d4e; }
.work-case-card.status-cancelado { border-left-color: #777777; opacity: .88; }
.work-case-card-main,
.work-case-meta-row,
.work-case-summary-grid,
.work-case-history-list,
.work-case-control-grid {
  min-width: 0;
}
.work-case-card-main {
  display: grid;
  gap: 7px;
}
.work-case-card-main strong,
.work-case-card-main p,
.work-case-card-main small {
  min-width: 0;
  overflow-wrap: anywhere;
}
.work-case-card-main p {
  margin: 0;
  color: var(--muted);
  font-weight: 750;
}
.work-case-meta-row {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}
.work-case-chip {
  display: inline-flex;
  align-items: center;
  min-height: 26px;
  padding: 0 9px;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: #ffffff;
  color: var(--muted);
  font-size: 12px;
  font-weight: 900;
}
.work-case-chip.status-pendiente { color: #8f4f2b; background: #fff8ee; border-color: #e1c2ad; }
.work-case-chip.status-en_gestion { color: #24547f; background: #eef6ff; border-color: #b9d5ee; }
.work-case-chip.status-esperando { color: #72580d; background: #fff9de; border-color: #e7d68c; }
.work-case-chip.status-resuelto { color: #245a40; background: #f2faf8; border-color: #b8d6d1; }
.work-case-chip.status-cancelado { color: #555555; background: #f2f2f2; border-color: #d6d6d6; }
.work-case-chip.priority-alta { color: #9c2d22; border-color: #efb0a7; background: #fff3f0; }
.work-case-chip.priority-media { color: #2c5b6c; border-color: #bad3dd; background: #f1fbff; }
.work-case-chip.priority-baja { color: #44634a; border-color: #c7dfcb; background: #f4fbf5; }
.work-case-summary-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
}
.work-case-summary-item {
  min-width: 0;
  padding: 11px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fbfdfd;
}
.work-case-summary-item span,
.work-case-summary-item strong {
  display: block;
  min-width: 0;
  overflow-wrap: anywhere;
}
.work-case-summary-item span {
  color: var(--muted);
  font-size: 12px;
  font-weight: 900;
  text-transform: uppercase;
}
.work-case-summary-item strong {
  margin-top: 4px;
}
.work-case-history-list {
  display: grid;
  gap: 9px;
}
.work-case-event {
  min-width: 0;
  padding: 12px;
  border: 1px solid var(--line);
  border-left: 5px solid #2e6ba8;
  border-radius: 8px;
  background: #fbfdfd;
}
.work-case-event strong,
.work-case-event small,
.work-case-event p {
  display: block;
  min-width: 0;
  overflow-wrap: anywhere;
}
.work-case-event small {
  color: var(--muted);
  font-weight: 850;
}
.work-case-event p {
  margin: 7px 0 0;
}
.work-case-control-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}
.work-case-control-grid .panel {
  margin: 0;
}
.work-case-detail-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-bottom: 14px;
}
.work-case-closed {
  border-left: 5px solid #777777;
  background: #f8f8f8;
}
.day-control-hero {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 12px;
  align-items: center;
  margin-bottom: 14px;
  padding: 16px;
  border: 1px solid var(--line);
  border-left: 6px solid var(--brand);
  border-radius: 8px;
  background: #ffffff;
  box-shadow: 0 10px 24px rgba(20, 39, 42, 0.06);
}
.day-control-hero span,
.day-control-hero small {
  display: block;
  color: var(--muted);
  font-size: 12px;
  font-weight: 900;
  text-transform: uppercase;
}
.day-control-hero strong {
  display: block;
  margin: 3px 0;
  font-size: 28px;
  line-height: 1.05;
}
.day-control-summary {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 10px;
  margin-bottom: 14px;
}
.day-control-metric {
  min-width: 0;
  padding: 14px;
  border: 1px solid var(--line);
  border-left: 6px solid #c3ccd0;
  border-radius: 8px;
  background: #ffffff;
  box-shadow: 0 10px 24px rgba(20, 39, 42, 0.06);
}
.day-control-metric span {
  display: block;
  color: var(--muted);
  font-size: 12px;
  font-weight: 900;
  text-transform: uppercase;
}
.day-control-metric strong {
  display: block;
  margin-top: 4px;
  font-size: 30px;
  line-height: 1;
}
.day-control-attention,
.day-control-teachers {
  min-width: 0;
  margin-bottom: 14px;
  padding: 16px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #ffffff;
  box-shadow: 0 10px 24px rgba(20, 39, 42, 0.06);
}
.day-control-attention-list,
.day-control-teacher-grid {
  display: grid;
  gap: 10px;
}
.day-control-attention-item {
  min-width: 0;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 10px;
  align-items: center;
  padding: 12px;
  border: 1px solid var(--line);
  border-left: 6px solid #c3ccd0;
  border-radius: 8px;
  background: #fbfdfd;
}
.day-control-attention-item strong,
.day-control-attention-item span {
  min-width: 0;
  display: block;
  overflow-wrap: anywhere;
}
.day-control-attention-item strong {
  font-size: 16px;
}
.day-control-attention-item span {
  color: var(--muted);
  font-size: 14px;
  font-weight: 900;
}
.day-control-attention-item a,
.day-control-teacher-card a {
  color: var(--brand);
  font-size: 13px;
  font-weight: 900;
  text-decoration: none;
}
.day-control-ok {
  padding: 16px;
  border: 1px solid #b8d6d1;
  border-left: 6px solid var(--brand);
  border-radius: 8px;
  background: #f2faf8;
}
.day-control-ok strong,
.day-control-ok span {
  display: block;
}
.day-control-ok span {
  color: var(--muted);
  font-size: 14px;
  font-weight: 800;
}
.day-control-teacher-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}
.day-control-teacher-card {
  min-width: 0;
  display: grid;
  gap: 8px;
  padding: 13px;
  border: 1px solid var(--line);
  border-left: 6px solid #c3ccd0;
  border-radius: 8px;
  background: #fbfdfd;
}
.day-control-teacher-card header {
  min-width: 0;
  display: grid;
  gap: 4px;
}
.day-control-teacher-card header strong,
.day-control-teacher-card p {
  min-width: 0;
  margin: 0;
  overflow-wrap: anywhere;
}
.day-control-teacher-card header strong {
  font-size: 17px;
}
.day-control-teacher-card header span {
  width: fit-content;
  padding: 5px 8px;
  border-radius: 999px;
  background: #edf2f3;
  color: var(--ink);
  font-size: 12px;
  font-weight: 900;
}
.day-control-teacher-card p,
.day-control-card-meta small {
  color: var(--muted);
  font-size: 13px;
  font-weight: 800;
}
.day-control-card-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 5px 10px;
}
.day-control-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  min-height: 24px;
}
.day-control-chips span {
  padding: 4px 7px;
  border-radius: 999px;
  background: #edf2f3;
  color: var(--ink);
  font-size: 11px;
  font-weight: 900;
}
.day-control-chips span.tone-red {
  background: #ffe1dc;
  color: #9a2d1f;
}
.day-control-chips span.tone-yellow {
  background: #fff2cf;
  color: #7a5200;
}
.day-control-chips span.tone-green {
  background: #dff4ef;
  color: #1d7f70;
}
.day-control-chips span.tone-gray {
  background: #eef1f1;
  color: #637274;
}
.tone-red { border-left-color: #b74438; }
.tone-yellow { border-left-color: #c76428; }
.tone-green { border-left-color: var(--brand); }
.tone-gray { border-left-color: #9aa6aa; }
.day-control-metric.tone-red,
.day-control-attention-item.tone-red,
.day-control-teacher-card.tone-red { background: #fff5f3; }
.day-control-metric.tone-yellow,
.day-control-attention-item.tone-yellow,
.day-control-teacher-card.tone-yellow { background: #fff8ee; }
.day-control-metric.tone-green,
.day-control-teacher-card.tone-green { background: #f2faf8; }
.day-control-metric.tone-gray,
.day-control-teacher-card.tone-gray { background: #f4f7f8; }
.admin-work-student { border-left-color: #176b73; }
.enrollment-status {
  display: inline-flex;
  align-items: center;
  min-height: 28px;
  padding: 4px 10px;
  border-radius: 999px;
  font-size: .82rem;
  font-weight: 850;
  white-space: nowrap;
}
.enrollment-status-warning { background: #fff7e8; color: #8f4f2b; }
.enrollment-status-notice { background: #eef7f9; color: #176b73; }
.enrollment-status-success { background: #e8f7ef; color: #1f7a52; }
.enrollment-status-muted { background: #edf0f2; color: #667579; }
.admin-warning-list {
  display: grid;
  gap: 8px;
  margin: 0;
  padding-left: 18px;
}
.admin-work-kind {
  color: var(--brand);
  font-size: 12px;
  font-weight: 900;
  text-transform: uppercase;
}
.admin-work-body {
  min-width: 0;
  display: grid;
  gap: 3px;
}
.admin-work-body strong {
  min-width: 0;
  overflow-wrap: anywhere;
  font-size: 15px;
  line-height: 1.2;
}
.admin-work-body small {
  min-width: 0;
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
  line-height: 1.25;
  overflow-wrap: anywhere;
}
.admin-work-body em {
  min-width: 0;
  color: var(--muted);
  font-size: 12px;
  font-style: normal;
  font-weight: 750;
  line-height: 1.25;
  overflow-wrap: anywhere;
}
.admin-work-meta {
  display: grid;
  justify-items: end;
  gap: 5px;
}
.admin-work-meta em {
  color: var(--muted);
  font-size: 12px;
  font-style: normal;
  font-weight: 900;
}
.admin-work-meta b {
  min-height: 30px;
  display: inline-flex;
  align-items: center;
  padding: 0 10px;
  border-radius: 6px;
  background: var(--brand);
  color: #ffffff;
  font-size: 12px;
}
.admin-secondary-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
}
.admin-secondary-grid .table-action {
  min-height: 42px;
}
.admin-metrics-compact {
  margin-top: 0;
}
.admin-focus-grid-compact {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}
.admin-focus-panel {
  min-width: 0;
  display: grid;
  gap: 12px;
  padding: 16px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #ffffff;
  box-shadow: 0 10px 24px rgba(20, 39, 42, 0.06);
}
.admin-focus-list {
  display: grid;
  gap: 8px;
}
.admin-focus-item {
  min-width: 0;
  display: grid;
  grid-template-columns: 82px minmax(0, 1fr);
  gap: 2px 10px;
  padding: 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fbfdfd;
  color: var(--ink);
  text-decoration: none;
}
.admin-focus-item span {
  grid-row: 1 / span 2;
  color: var(--brand);
  font-size: 12px;
  font-weight: 900;
  line-height: 1.2;
}
.admin-focus-item strong {
  min-width: 0;
  overflow-wrap: anywhere;
  font-size: 15px;
  line-height: 1.2;
}
.admin-focus-item small {
  min-width: 0;
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
  line-height: 1.25;
  overflow-wrap: anywhere;
}
.admin-focus-item:hover {
  border-color: var(--brand);
  background: #f2faf8;
}
.student-admin-overview,
.group-admin-overview,
.admin-payment-card-panel,
.message-card-panel,
.notice-card-panel {
  min-width: 0;
  display: grid;
  gap: 14px;
  padding: 16px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #ffffff;
  box-shadow: 0 10px 24px rgba(20, 39, 42, 0.06);
  margin-bottom: 16px;
}
.student-admin-overview,
.group-admin-overview {
  grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr) auto;
  align-items: center;
}
.student-admin-title,
.group-admin-title {
  min-width: 0;
  display: grid;
  gap: 5px;
}
.student-admin-title span,
.group-admin-title span {
  color: var(--brand);
  font-size: 12px;
  font-weight: 900;
  text-transform: uppercase;
}
.student-admin-title strong,
.group-admin-title strong {
  min-width: 0;
  overflow-wrap: anywhere;
  font-size: 24px;
  line-height: 1.15;
}
.student-admin-title small,
.group-admin-title small {
  color: var(--muted);
  font-weight: 800;
  overflow-wrap: anywhere;
}
.private-breadcrumb { margin:0 0 10px; max-width:100%; font-size:13px; color:var(--muted); }
.private-breadcrumb ol { display:flex; flex-wrap:wrap; gap:6px 10px; padding:0; margin:0; list-style:none; }
.private-breadcrumb li { min-width:0; overflow-wrap:anywhere; }
.private-breadcrumb li + li::before { content:"/"; margin-right:10px; color:var(--muted); }
.private-breadcrumb [aria-current="page"] { font-weight:600; }
.student-admin-title small a {
  color: var(--brand);
  text-decoration: none;
}
.student-admin-title small a:hover {
  text-decoration: underline;
}
.student-admin-stats,
.group-admin-badges {
  display: grid;
  gap: 8px;
}
.student-admin-stats {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}
.group-admin-badges {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}
.student-admin-stats .metric,
.group-admin-badges article {
  padding: 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #f7faf9;
}
.group-admin-badges article {
  display: grid;
  gap: 4px;
}
.group-admin-badges span {
  color: var(--muted);
  font-size: 12px;
  font-weight: 900;
}
.group-admin-badges strong {
  font-size: 16px;
  line-height: 1.15;
}
.student-admin-actions,
.group-admin-actions {
  display: grid;
  gap: 8px;
  min-width: 150px;
}
.next-steps-panel summary {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  cursor: pointer;
  font-weight: 900;
}
.next-steps-panel summary small {
  color: var(--muted);
}
.student-learning-hero {
  min-width: 0;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 14px;
  padding: 16px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #ffffff;
  box-shadow: 0 10px 24px rgba(20, 39, 42, 0.06);
  margin-bottom: 16px;
}
.student-learning-hero > div {
  min-width: 0;
  display: grid;
  gap: 5px;
}
.student-learning-hero span {
  color: var(--brand);
  font-size: 12px;
  font-weight: 900;
  text-transform: uppercase;
}
.student-learning-hero strong {
  min-width: 0;
  overflow-wrap: anywhere;
  font-size: 24px;
  line-height: 1.15;
}
.student-learning-hero small {
  color: var(--muted);
  font-weight: 800;
  overflow-wrap: anywhere;
}
.student-learning-actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 8px;
}
.student-learning-summary-list,
.student-learning-event-list {
  display: grid;
  gap: 10px;
}
.student-learning-summary-card,
.student-learning-event-card {
  min-width: 0;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto auto;
  align-items: center;
  gap: 12px;
  padding: 12px;
  border: 1px solid var(--line);
  border-left: 5px solid #c3ccd0;
  border-radius: 8px;
  background: #fbfdfd;
}
.student-learning-summary-card > div,
.student-learning-event-card > div {
  min-width: 0;
  display: grid;
  gap: 4px;
}
.student-learning-summary-card strong,
.student-learning-event-card strong {
  min-width: 0;
  overflow-wrap: anywhere;
}
.student-learning-summary-card span,
.student-learning-event-card span,
.student-learning-summary-card small,
.student-learning-event-card small {
  color: var(--muted);
  font-size: 13px;
  font-weight: 800;
  overflow-wrap: anywhere;
}
.student-learning-event-card em {
  font-style: normal;
  font-weight: 900;
  color: var(--brand);
}
.student-learning-event-card.status-delivered { border-left-color: var(--brand); }
.student-learning-event-card.status-partial { border-left-color: #c76428; }
.student-learning-event-card.status-unplanned { border-left-color: #7b68a8; }
.student-learning-event-actions {
  display: flex;
  justify-content: flex-end;
}
.filter-pills {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 12px;
}
.filter-pill {
  min-height: 34px;
  display: inline-flex;
  align-items: center;
  padding: 0 12px;
  border: 1px solid #bfd6d2;
  border-radius: 999px;
  background: #edf5f3;
  color: var(--brand);
  font-weight: 900;
  text-decoration: none;
}
.filter-pill.active {
  background: var(--brand);
  color: #ffffff;
}
.admin-payment-card-list,
.message-card-list,
.notice-card-list {
  display: grid;
  gap: 10px;
}
.admin-directory-list {
  display: grid;
  gap: 10px;
}
.admin-directory-card {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 10px;
  align-items: center;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fbfdfd;
}
.admin-directory-card strong {
  display: block;
  min-width: 0;
  color: var(--ink);
  font-size: 16px;
  overflow-wrap: anywhere;
}
.admin-directory-card small {
  display: block;
  color: var(--muted);
  font-size: 13px;
  font-weight: 800;
  overflow-wrap: anywhere;
}
.admin-directory-card span {
  display: inline-flex;
  width: fit-content;
  margin-top: 6px;
  border-radius: 999px;
  background: #edf8f6;
  color: var(--brand);
  padding: 4px 8px;
  font-size: 12px;
  font-weight: 900;
}
.admin-directory-card .table-action {
  width: 76px;
}
.training-course-list {
  display: grid;
  gap: 10px;
}
.training-course-card {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 10px;
  align-items: center;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fbfdfd;
}
.training-course-card strong {
  display: block;
  color: var(--ink);
  font-size: 16px;
  overflow-wrap: anywhere;
}
.training-course-card small {
  display: block;
  color: var(--muted);
  font-size: 13px;
  font-weight: 800;
  overflow-wrap: anywhere;
}
.training-course-card span {
  display: inline-flex;
  width: fit-content;
  margin-top: 6px;
  border-radius: 999px;
  background: #edf8f6;
  color: var(--brand);
  padding: 4px 8px;
  font-size: 12px;
  font-weight: 900;
}
.training-course-card .table-action {
  width: 76px;
}
.accounting-action-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
}
.accounting-action-card {
  min-height: 94px;
  display: grid;
  align-content: center;
  gap: 6px;
  padding: 14px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fbfdfd;
  color: var(--ink);
  text-decoration: none;
}
.accounting-action-card strong {
  color: var(--brand);
  font-size: 17px;
}
.accounting-action-card small {
  color: var(--muted);
  font-weight: 800;
  line-height: 1.25;
}
.accounting-action-card:hover {
  border-color: var(--brand);
  background: #edf8f6;
}
.remittance-actions {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}
.remittance-actions form {
  margin: 0;
}
.remittance-actions button {
  width: 100%;
  min-height: 42px;
}
.remittance-card-list {
  display: grid;
  gap: 10px;
}
.remittance-card {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 8px 10px;
  align-items: center;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fbfdfd;
}
.remittance-card strong {
  display: block;
  color: var(--ink);
  font-size: 16px;
  overflow-wrap: anywhere;
}
.remittance-card small {
  color: var(--muted);
  font-size: 13px;
  font-weight: 800;
  overflow-wrap: anywhere;
}
.remittance-card span {
  display: inline-flex;
  width: fit-content;
  margin-top: 6px;
  border-radius: 999px;
  background: #edf8f6;
  color: var(--brand);
  padding: 4px 8px;
  font-size: 12px;
  font-weight: 900;
}
.remittance-card em {
  color: var(--brand-dark);
  font-style: normal;
  font-weight: 900;
  white-space: nowrap;
}
.remittance-card .table-action {
  grid-column: 1 / -1;
}
.bank-movement-list {
  display: grid;
  gap: 10px;
}
.bank-movement-card {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 10px;
  align-items: start;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fbfdfd;
}
.bank-movement-card strong {
  display: block;
  color: var(--ink);
  font-size: 15px;
  overflow-wrap: anywhere;
}
.bank-movement-card small {
  display: block;
  color: var(--muted);
  font-size: 13px;
  font-weight: 800;
}
.bank-movement-card span {
  display: inline-flex;
  width: fit-content;
  margin-top: 6px;
  border-radius: 999px;
  background: #edf8f6;
  color: var(--brand);
  padding: 4px 8px;
  font-size: 12px;
  font-weight: 900;
}
.bank-movement-card em {
  color: var(--brand-dark);
  font-style: normal;
  font-weight: 900;
  white-space: nowrap;
}
.bank-movement-card em.negative {
  color: #9d3d28;
}
.bank-movement-card .review-form {
  grid-column: 1 / -1;
  min-width: 0;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}
.billing-payment-list {
  display: grid;
  gap: 10px;
}
.billing-payment-card {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 10px;
  align-items: center;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fbfdfd;
}
.billing-payment-card strong {
  display: block;
  color: var(--ink);
  font-size: 16px;
  overflow-wrap: anywhere;
}
.billing-payment-card small {
  display: block;
  color: var(--muted);
  font-size: 13px;
  font-weight: 800;
  overflow-wrap: anywhere;
}
.billing-payment-card span {
  display: inline-flex;
  width: fit-content;
  margin-top: 6px;
  border-radius: 999px;
  background: #edf8f6;
  color: var(--brand);
  padding: 4px 8px;
  font-size: 12px;
  font-weight: 900;
}
.billing-payment-card em {
  color: var(--brand-dark);
  font-style: normal;
  font-weight: 900;
  white-space: nowrap;
}
.billing-payment-actions {
  grid-column: 1 / -1;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.billing-payment-actions .inline-form {
  margin: 0;
}
.billing-payment-actions button,
.billing-payment-actions .table-action {
  min-height: 36px;
  padding: 0 12px;
}
.expense-card-list {
  display: grid;
  gap: 10px;
}
.expense-card {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 10px;
  align-items: center;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fbfdfd;
}
.expense-card strong {
  display: block;
  color: var(--ink);
  font-size: 16px;
  overflow-wrap: anywhere;
}
.expense-card small {
  display: block;
  color: var(--muted);
  font-size: 13px;
  font-weight: 800;
}
.expense-card em {
  color: #9d3d28;
  font-style: normal;
  font-weight: 900;
  white-space: nowrap;
}
.admin-payment-card {
  display: grid;
  grid-template-columns: 96px minmax(0, 1fr) auto auto auto;
  gap: 8px;
  align-items: center;
  padding: 11px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fbfdfd;
}
.admin-payment-card span,
.admin-payment-card small {
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
}
.admin-payment-card strong {
  min-width: 0;
  overflow-wrap: anywhere;
  font-size: 15px;
}
.admin-payment-card em {
  font-style: normal;
  font-weight: 900;
}
.admin-payment-card mark {
  padding: 5px 7px;
  border-radius: 999px;
  background: #e8f3f1;
  color: var(--brand);
  font-size: 11px;
  font-weight: 900;
}
.admin-payment-more {
  width: 100%;
  margin-top: 10px;
}
.message-inbox-summary,
.notice-work-summary {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
  margin-bottom: 16px;
}
.message-role-header {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(180px, 260px);
  gap: 12px;
  align-items: stretch;
  margin-bottom: 12px;
}
.message-role-header > div,
.message-role-header aside {
  min-width: 0;
  padding: 14px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fbfdfd;
}
.message-role-header span,
.message-role-header small {
  display: block;
  color: var(--brand);
  font-size: 12px;
  font-weight: 900;
  text-transform: uppercase;
}
.message-role-header h2 {
  margin: 4px 0;
  font-size: 24px;
}
.message-role-header p {
  margin: 0;
  color: var(--muted);
  font-weight: 800;
  line-height: 1.35;
}
.message-role-header strong {
  display: block;
  margin-top: 6px;
  overflow-wrap: anywhere;
  line-height: 1.2;
}
.message-role-actions {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 8px;
  margin-bottom: 12px;
}
.message-role-action,
.message-metric {
  min-width: 0;
  display: grid;
  align-content: center;
  min-height: 48px;
  padding: 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #ffffff;
  color: var(--ink);
  text-align: center;
  text-decoration: none;
  font-weight: 900;
}
.message-role-action:hover,
.message-metric:hover {
  border-color: var(--brand);
  background: #edf8f6;
}
.message-metric {
  text-align: left;
}
.message-metric span {
  color: var(--muted);
  font-size: 12px;
}
.message-metric strong {
  color: var(--brand);
  font-size: 24px;
}
.message-thread-card,
.notice-card {
  min-width: 0;
  display: grid;
  gap: 4px;
  padding: 12px;
  border: 1px solid var(--line);
  border-left: 5px solid var(--brand);
  border-radius: 8px;
  background: #fbfdfd;
  color: var(--ink);
  text-decoration: none;
}
.notice-card {
  border-left-color: #c76428;
}
.notice-card-auto {
  border-left-color: #314d54;
}
.notice-card-main {
  display: grid;
  gap: 4px;
  color: inherit;
  text-decoration: none;
}
.notice-card-main:hover strong {
  color: var(--brand);
}
.message-thread-card span,
.notice-card span {
  color: var(--brand);
  font-size: 12px;
  font-weight: 900;
}
.message-thread-card.is-unread {
  background: #f3fbf9;
  border-color: #9bc8bd;
  border-left-color: #1d7f70;
}
.message-thread-card.is-unread strong::before {
  content: "Nuevo ";
  display: inline-flex;
  margin-right: 6px;
  padding: 2px 6px;
  border-radius: 999px;
  background: #dff4ef;
  color: #1d7f70;
  font-size: 11px;
  vertical-align: middle;
}
.message-thread-card strong,
.notice-card strong {
  min-width: 0;
  overflow-wrap: anywhere;
  font-size: 16px;
  line-height: 1.2;
}
.message-thread-card small,
.notice-card small {
  color: var(--muted);
  font-size: 13px;
  font-weight: 800;
  line-height: 1.25;
  overflow-wrap: anywhere;
}
.message-channel-badges {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: 8px;
}
.message-channel-badge {
  display: inline-flex;
  align-items: center;
  min-height: 24px;
  padding: 4px 8px;
  border-radius: 999px;
  background: #eef4f3;
  color: var(--muted);
  font-size: 12px;
  font-weight: 900;
}
.message-channel-badge.status-enviado {
  background: #dff4ef;
  color: #1d7f70;
}
.message-channel-badge.status-pendiente {
  background: #fff2cf;
  color: #7a5200;
}
.message-channel-badge.status-error {
  background: #ffe1dc;
  color: #9a2d1f;
}
.message-channel-badge.status-no-enviar,
.message-channel-badge.status-cancelado {
  background: #eef1f1;
  color: #637274;
}
.message-channel-badges small {
  flex-basis: 100%;
  color: var(--muted);
  font-weight: 800;
}
.notice-card .inline-form {
  display: grid;
  grid-template-columns: 120px minmax(0, 1fr) auto;
  gap: 8px;
  margin: 8px 0 0;
}
.notice-card-actions {
  margin-top: 6px;
}
.notice-card-actions .table-action {
  width: 100%;
}
.notice-card .inline-form select,
.notice-card .inline-form input {
  min-width: 0;
  width: 100%;
}
.notice-detail-hero {
  min-width: 0;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 14px;
  align-items: center;
  padding: 18px;
  border: 1px solid var(--line);
  border-left: 7px solid var(--brand);
  border-radius: 8px;
  background: #fbfdfd;
  box-shadow: 0 10px 24px rgba(20, 39, 42, 0.06);
}
.notice-detail-hero span,
.notice-detail-block span,
.notice-resolution-panel .panel-head span {
  color: var(--brand);
  font-size: 12px;
  font-weight: 900;
  text-transform: uppercase;
}
.notice-detail-hero h2 {
  margin: 4px 0;
  overflow-wrap: anywhere;
  font-size: 26px;
  line-height: 1.1;
}
.notice-detail-hero small {
  color: var(--muted);
  font-weight: 800;
}
.notice-detail-badges {
  display: grid;
  gap: 7px;
  justify-items: end;
}
.notice-detail-badges strong,
.notice-detail-badges span {
  min-height: 30px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0 11px;
  border-radius: 999px;
  background: #edf4f3;
  color: var(--ink);
  font-size: 12px;
  font-weight: 900;
  text-transform: uppercase;
}
.notice-detail-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr) minmax(0, 0.9fr);
  gap: 12px;
}
.notice-detail-block {
  min-width: 0;
  display: grid;
  gap: 8px;
  align-content: start;
  padding: 15px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #ffffff;
}
.notice-detail-block p {
  margin: 0;
  color: var(--ink);
  font-weight: 800;
  line-height: 1.42;
  overflow-wrap: anywhere;
}
.notice-context-block .details {
  display: grid;
  gap: 8px;
  margin: 0;
}
.notice-context-block .details div {
  min-width: 0;
  display: grid;
  grid-template-columns: 92px minmax(0, 1fr);
  gap: 8px;
  padding-bottom: 8px;
  border-bottom: 1px solid var(--line);
}
.notice-context-block .details div:last-child {
  border-bottom: 0;
  padding-bottom: 0;
}
.notice-context-block dt {
  color: var(--muted);
  font-size: 12px;
  font-weight: 900;
}
.notice-context-block dd {
  min-width: 0;
  margin: 0;
  font-weight: 900;
  overflow-wrap: anywhere;
}
.notice-admin-need {
  border-left: 5px solid #c76428;
  background: #fffaf2;
}
.notice-admin-need strong {
  line-height: 1.35;
}
.notice-admin-need small,
.notice-resolve-inline small {
  color: var(--muted);
  font-size: 13px;
  font-weight: 800;
  line-height: 1.3;
}
.notice-resolution-panel {
  display: grid;
  gap: 12px;
}
.notice-resolution-form {
  display: grid;
  grid-template-columns: 170px minmax(0, 1fr) auto;
  gap: 10px;
  align-items: end;
}
.notice-resolution-form label {
  min-width: 0;
  display: grid;
  gap: 5px;
  color: var(--muted);
  font-size: 12px;
  font-weight: 900;
}
.notice-resolution-form select,
.notice-resolution-form textarea {
  min-width: 0;
  width: 100%;
}
.notice-resolution-form .wide {
  grid-column: auto;
}
.notice-resolve-inline {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 10px;
  align-items: center;
  padding: 12px;
  border: 1px solid #bfd6d2;
  border-radius: 8px;
  background: #f2faf8;
}
.notice-resolve-inline button {
  background: var(--brand);
}
.notice-resolve-inline button:disabled {
  cursor: not-allowed;
  opacity: 0.55;
}
.admin-compact-hero {
  padding: 14px;
}
.admin-hero h2 {
  margin: 0;
  font-size: 26px;
}
.admin-hero p {
  margin: 7px 0 0;
  color: var(--muted);
  line-height: 1.45;
}
.admin-hero-actions {
  display: grid;
  grid-template-columns: repeat(3, max-content);
  gap: 8px;
}
.admin-clock-shortcuts {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 12px;
  align-items: center;
  margin: 12px 0 16px;
  padding: 14px;
  border: 1px solid #bfd6d2;
  border-radius: 8px;
  background: #f4faf8;
  box-shadow: 0 10px 24px rgba(20, 39, 42, 0.06);
}
.admin-clock-self {
  min-width: 0;
  display: grid;
  gap: 3px;
}
.admin-clock-self span {
  color: #176b73;
  font-size: 12px;
  font-weight: 900;
  text-transform: uppercase;
}
.admin-clock-self strong {
  color: #173f45;
  font-size: 20px;
  line-height: 1.15;
  overflow-wrap: anywhere;
}
.admin-clock-self small {
  color: #45565c;
  font-weight: 800;
}
.admin-clock-actions {
  display: grid;
  grid-template-columns: repeat(3, max-content);
  gap: 8px;
}
.admin-clock-actions .table-action {
  min-height: 42px;
  align-items: center;
}
.quick-actions-panel { padding: 14px; }
.quick-actions {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 8px;
}
.quick-actions .table-action {
  min-height: 44px;
  text-align: center;
}
.payroll-action-panel {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
  margin-bottom: 16px;
}
.payroll-current-card,
.payroll-download-card {
  min-width: 0;
  display: grid;
  align-content: space-between;
  gap: 10px;
  padding: 16px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #ffffff;
  box-shadow: 0 10px 24px rgba(20, 39, 42, 0.06);
}
.payroll-current-card {
  border-left: 6px solid var(--brand);
  background: #edf8f6;
}
.payroll-download-card {
  border-left: 6px solid #c76428;
}
.payroll-current-card span,
.payroll-download-card span {
  color: var(--muted);
  font-size: 12px;
  font-weight: 900;
  text-transform: uppercase;
}
.payroll-current-card strong,
.payroll-download-card strong {
  font-size: 22px;
  line-height: 1.15;
}
.payroll-current-card small,
.payroll-download-card small {
  color: var(--muted);
  font-weight: 800;
  line-height: 1.3;
}
.teacher-home-section {
  background: var(--panel);
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 16px;
  margin-bottom: 16px;
  box-shadow: 0 10px 24px rgba(20, 39, 42, 0.06);
}
.teacher-home-hero {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 12px;
  align-items: center;
  margin-bottom: 14px;
  border: 1px solid #bfd6d2;
  border-radius: 8px;
  padding: 14px;
  background: #f4faf8;
}
.teacher-home-hero div {
  min-width: 0;
  display: grid;
  gap: 3px;
}
.teacher-home-hero span {
  color: #176b73;
  font-size: 12px;
  font-weight: 900;
  text-transform: uppercase;
}
.teacher-home-hero strong {
  color: #173f45;
  font-size: 20px;
  line-height: 1.15;
  overflow-wrap: anywhere;
}
.teacher-home-hero small {
  color: #45565c;
  font-weight: 800;
}
.teacher-home-hero .table-action {
  min-height: 46px;
}
.teacher-home-hero-link {
  min-height: 46px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0 16px;
  border-radius: 8px;
  background: var(--brand);
  color: #ffffff;
  font-weight: 900;
  text-decoration: none;
}
.teacher-now-shell {
  display: grid;
  gap: 12px;
  margin-bottom: 16px;
}
.teacher-now-header {
  min-width: 0;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 12px;
  align-items: center;
}
.teacher-now-header > div {
  min-width: 0;
  display: grid;
  gap: 3px;
}
.teacher-now-header span {
  color: #176b73;
  font-size: 12px;
  font-weight: 950;
  text-transform: uppercase;
}
.teacher-now-header strong {
  color: #173f45;
  font-size: 24px;
  line-height: 1.1;
  overflow-wrap: anywhere;
}
.teacher-now-header small {
  color: var(--muted);
  font-weight: 800;
}
.teacher-now-card {
  min-width: 0;
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(180px, auto);
  gap: 14px;
  align-items: center;
  padding: 18px;
  border: 1px solid #bfd6d2;
  border-left: 8px solid var(--brand);
  border-radius: 8px;
  background: #f4faf8;
  box-shadow: 0 14px 30px rgba(20, 39, 42, 0.10);
}
.teacher-now-main {
  min-width: 0;
  display: grid;
  gap: 5px;
}
.teacher-now-main span {
  color: #176b73;
  font-size: 12px;
  font-weight: 950;
  text-transform: uppercase;
}
.teacher-now-main strong {
  color: #173f45;
  font-size: 27px;
  line-height: 1.08;
  overflow-wrap: anywhere;
}
.teacher-now-main small {
  color: #3f575c;
  font-size: 15px;
  font-weight: 850;
  line-height: 1.35;
}
.teacher-now-action {
  min-width: 0;
  display: grid;
}
.teacher-now-primary,
.teacher-now-action .teacher-live-finish {
  min-height: 54px;
  width: 100%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0 18px;
  border: 0;
  border-radius: 8px;
  background: var(--brand);
  color: #ffffff;
  font-size: 16px;
  font-weight: 950;
  text-align: center;
  text-decoration: none;
  cursor: pointer;
}
.teacher-now-action form {
  margin: 0;
}
.teacher-now-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.4fr) repeat(2, minmax(0, 1fr));
  gap: 10px;
}
.teacher-now-context,
.teacher-now-mini,
.teacher-after-panel {
  min-width: 0;
  display: grid;
  gap: 4px;
  padding: 13px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #ffffff;
}
.teacher-now-context span,
.teacher-now-mini span,
.teacher-after-panel span {
  color: #176b73;
  font-size: 11px;
  font-weight: 950;
  text-transform: uppercase;
}
.teacher-now-context strong,
.teacher-now-mini strong,
.teacher-after-panel strong {
  min-width: 0;
  color: var(--ink);
  font-size: 16px;
  line-height: 1.2;
  overflow-wrap: anywhere;
}
.teacher-now-context small {
  min-width: 0;
  color: var(--muted);
  font-weight: 800;
  overflow-wrap: anywhere;
}
.teacher-now-mini-muted strong {
  color: var(--muted);
}
.teacher-after-panel {
  border-color: #d8c8ae;
  background: #fffaf1;
}
.teacher-secondary-links {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.teacher-secondary-links .table-action {
  min-height: 40px;
}
.teacher-next-class-panel {
  min-width: 0;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 12px;
  align-items: center;
  margin-bottom: 14px;
  padding: 16px;
  border: 1px solid #d8c8ae;
  border-left: 6px solid #c76428;
  border-radius: 8px;
  background: #fff8ec;
}
.teacher-next-class-panel div {
  min-width: 0;
  display: grid;
  gap: 4px;
}
.teacher-next-class-panel span {
  color: #8f4f2b;
  font-size: 12px;
  font-weight: 950;
  text-transform: uppercase;
}
.teacher-next-class-panel strong {
  min-width: 0;
  color: #173f45;
  font-size: 22px;
  line-height: 1.12;
  overflow-wrap: anywhere;
}
.teacher-next-class-panel small {
  color: #45565c;
  font-weight: 850;
  line-height: 1.35;
  overflow-wrap: anywhere;
}
.teacher-next-class-empty {
  border-color: #d7e4e2;
  border-left-color: #8aa4a7;
  background: #f7fbfa;
}
.teacher-action-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}
.teacher-action-grid-primary {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}
.teacher-action-grid-secondary {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}
.teacher-action-card {
  min-height: 118px;
  display: grid;
  align-content: space-between;
  gap: 12px;
  text-decoration: none;
  color: var(--ink);
  background: #ffffff;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 16px;
}
.teacher-action-grid-primary .teacher-action-card {
  min-height: 148px;
  color: #ffffff;
  border-color: transparent;
  box-shadow: 0 14px 28px rgba(20, 39, 42, 0.14);
}
.teacher-action-clock { background: #176b73; }
.teacher-action-attendance { background: #8f4f2b; }
.teacher-action-grid-primary .teacher-action-calendar {
  background: #2f6e54;
}
.teacher-action-grid-primary .teacher-action-card span {
  color: rgba(255,255,255,.86);
}
.teacher-action-grid-primary .teacher-action-card strong {
  font-size: 24px;
}
.teacher-action-notice {
  border-color: #edc6a4;
  background: #fff7e8;
}
.teacher-action-messages {
  border-color: #b8d6d1;
  background: #f2faf8;
}
.teacher-action-training {
  border-color: #d3cabd;
  background: #fbf7f0;
}
.teacher-action-calendar {
  border-color: #c3ccd0;
  background: #f1f5f6;
}
.teacher-action-payroll {
  border-color: #d7c5d7;
  background: #faf4fa;
}
.teacher-action-card strong {
  font-size: 20px;
  line-height: 1.15;
}
.teacher-action-card span {
  color: var(--muted);
  font-weight: 700;
}
.teacher-action-card:hover {
  border-color: var(--brand);
  box-shadow: 0 8px 18px rgba(23, 107, 115, 0.12);
}
.teacher-action-grid-primary .teacher-action-payroll {
  background: #8a3158;
}
.teacher-action-grid-primary .teacher-action-payroll:hover {
  background: #762847;
  border-color: #f3bfd4;
  box-shadow: 0 10px 22px rgba(118, 40, 71, 0.26);
}
.teacher-action-grid-primary .teacher-action-payroll:focus-visible {
  background: #8a3158;
  outline: 3px solid #4b122d;
  outline-offset: 3px;
  box-shadow: 0 10px 22px rgba(118, 40, 71, 0.24);
}
.teacher-action-grid-primary .teacher-action-payroll:active {
  background: #6a203e;
  transform: translateY(1px);
}
.teacher-today-list {
  display: grid;
  gap: 10px;
}
.teacher-today-card {
  min-width: 0;
  display: grid;
  grid-template-columns: 92px minmax(0, 1fr) auto;
  gap: 6px 12px;
  align-items: center;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fbfdfd;
}
.teacher-today-card span {
  color: #175c63;
  font-weight: 900;
}
.teacher-today-card strong {
  min-width: 0;
  overflow-wrap: anywhere;
  font-size: 16px;
}
.teacher-today-card small {
  min-width: 0;
  color: var(--muted);
  font-weight: 800;
  overflow-wrap: anywhere;
}
.teacher-today-card em {
  width: fit-content;
  padding: 2px 7px;
  border-radius: 999px;
  background: #fce6e2;
  color: #8f3f37;
  font-size: 11px;
  font-style: normal;
  font-weight: 950;
}
.teacher-today-card .table-action {
  grid-column: 3;
  grid-row: 1 / span 2;
}
.teacher-today-actions {
  margin-top: 10px;
}
.teacher-attendance-day-hero {
  min-width: 0;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 12px;
  align-items: center;
  margin-bottom: 12px;
  padding: 15px;
  border: 1px solid #bfd6d2;
  border-left: 6px solid var(--brand);
  border-radius: 8px;
  background: #f4faf8;
}
.teacher-attendance-day-hero div {
  min-width: 0;
  display: grid;
  gap: 3px;
}
.teacher-attendance-day-hero span {
  color: #176b73;
  font-size: 12px;
  font-weight: 950;
  text-transform: uppercase;
}
.teacher-attendance-day-hero strong {
  color: #173f45;
  font-size: 24px;
  line-height: 1.12;
}
.teacher-attendance-day-hero small {
  color: #45565c;
  font-weight: 850;
}
.teacher-date-form {
  display: grid;
  grid-template-columns: minmax(180px, 260px) minmax(0, 1fr);
  gap: 12px;
  align-items: end;
}
.teacher-class-select-list {
  display: grid;
  gap: 10px;
}
.teacher-class-select-card {
  min-width: 0;
  display: grid;
  grid-template-columns: 96px minmax(0, 1fr) auto;
  gap: 6px 12px;
  align-items: center;
  padding: 13px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fbfdfd;
}
.teacher-class-select-card > div {
  min-width: 0;
  display: grid;
  gap: 4px;
}
.teacher-class-select-card span {
  color: #175c63;
  font-weight: 900;
}
.teacher-class-select-card strong {
  min-width: 0;
  overflow-wrap: anywhere;
  font-size: 17px;
}
.teacher-class-select-card small {
  min-width: 0;
  color: var(--muted);
  font-weight: 800;
  overflow-wrap: anywhere;
}
.teacher-class-select-card em {
  width: fit-content;
  padding: 2px 7px;
  border-radius: 999px;
  background: #fce6e2;
  color: #8f3f37;
  font-size: 11px;
  font-style: normal;
  font-weight: 950;
}
.teacher-class-select-card .table-action {
  grid-column: 3;
  grid-row: 1 / span 2;
}
.teacher-assigned-group-list {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}
.teacher-assigned-group-card {
  min-width: 0;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 5px 10px;
  align-items: center;
  padding: 12px;
  border: 1px solid #bfd6d2;
  border-radius: 8px;
  background: #f4faf8;
}
.teacher-assigned-group-card span {
  grid-column: 1 / -1;
  color: #175c63;
  font-size: 12px;
  font-weight: 900;
}
.teacher-assigned-group-card strong {
  min-width: 0;
  overflow-wrap: anywhere;
  font-size: 16px;
}
.teacher-assigned-group-card small {
  min-width: 0;
  color: var(--muted);
  font-weight: 800;
  overflow-wrap: anywhere;
}
.teacher-assigned-group-card .table-actions {
  grid-column: 2;
  grid-row: 2 / span 2;
  min-width: 0;
}
.teacher-session-choice-list {
  display: grid;
  gap: 8px;
}
.teacher-session-choice-card {
  min-width: 0;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 10px;
  align-items: center;
  padding: 11px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fbfdfd;
}
.teacher-session-choice-card strong,
.teacher-session-choice-card small {
  display: block;
  min-width: 0;
  overflow-wrap: anywhere;
}
.teacher-session-choice-card small {
  margin-top: 3px;
  color: var(--muted);
  font-weight: 800;
}
.teacher-attendance-summary {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}
.teacher-session-attendance-shell {
  display: grid;
  gap: 12px;
}
.teacher-session-compact-heading { display:grid; gap:4px; min-width:0; overflow-wrap:anywhere; }
.teacher-session-compact-heading > a { font-size:16px; font-weight:700; line-height:1.35; }
.teacher-session-compact-heading > span { font-size:14px; color:var(--muted); }
.teacher-session-tabs { min-width:0; }
.teacher-start-confirmation,
.teacher-start-date-warning { display:grid; gap:12px; padding:14px; border:1px solid #d99a21; border-radius:8px; background:#fff8e8; color:#4a3410; }
.teacher-start-confirmation > strong { display:block; white-space:pre-line; line-height:1.5; }
.teacher-start-date-warning > span { line-height:1.45; }
.teacher-start-date-warning .table-action { width:100%; min-height:48px; display:inline-flex; align-items:center; justify-content:center; }
.teacher-start-confirmation .table-actions { align-items:start; }
.teacher-start-form { display:grid; gap:10px; min-width:min(360px, 100%); margin:0; }
.teacher-start-reason { display:grid; gap:5px; font-weight:800; }
.teacher-start-reason span { font-size:12px; color:#6b5a38; font-weight:600; }
.teacher-start-reason select,
.teacher-start-reason textarea { width:100%; min-width:0; }
.teacher-session-change-panel > .section-details-body { padding:14px; }
.teacher-session-change-requests .teacher-coverage-offer-list { display:grid; gap:12px; }
.teacher-session-change-requests .teacher-coverage-offer-card { display:grid; gap:10px; padding:12px 0; border-bottom:1px solid var(--border); min-width:0; overflow-wrap:anywhere; }
.teacher-session-change-requests .teacher-coverage-offer-card > div:first-child { display:grid; gap:5px; }
.teacher-session-change-requests .teacher-coverage-offer-card p { margin:0; }
.teacher-session-change-requests .table-actions { display:flex; flex-wrap:wrap; gap:8px; }
.teacher-session-change-requests .table-actions form { flex:1 1 120px; min-width:0; }
.teacher-session-change-requests .table-actions button { width:100%; min-height:44px; }
.teacher-coverage-offers { border-left:6px solid #c76428; }
.teacher-coverage-offer-list { display:grid; gap:10px; }
.teacher-coverage-offers .teacher-coverage-offer-card {
  min-width:0;
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  gap:12px;
  align-items:center;
  padding:12px;
  border:1px solid #e1c2ad;
  border-radius:8px;
  background:#fff8ee;
}
.teacher-coverage-offers .teacher-coverage-offer-card > div:first-child { min-width:0; display:grid; gap:4px; }
.teacher-coverage-offers .teacher-coverage-offer-card span { color:#9a4b20; font-size:12px; font-weight:950; text-transform:uppercase; }
.teacher-coverage-offers .teacher-coverage-offer-card strong,
.teacher-coverage-offers .teacher-coverage-offer-card small { min-width:0; overflow-wrap:anywhere; }
.teacher-coverage-offers .teacher-coverage-offer-card small { color:var(--muted); font-weight:800; }
.teacher-coverage-offers .table-actions { display:flex; flex-wrap:wrap; gap:8px; }
.teacher-coverage-offers .table-actions form { margin:0; }
.teacher-today-coverages { border-left:6px solid #1f8a78; }
.teacher-today-coverage-list { display:grid; gap:10px; }
.teacher-today-coverage-card {
  min-width:0;
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  gap:12px;
  align-items:center;
  padding:12px;
  border:1px solid #b8d6d1;
  border-radius:8px;
  background:#f2faf8;
}
.teacher-today-coverage-card > div { min-width:0; display:grid; gap:4px; }
.teacher-today-coverage-card span { color:#176b73; font-size:12px; font-weight:950; text-transform:uppercase; }
.teacher-today-coverage-card strong,
.teacher-today-coverage-card small { min-width:0; overflow-wrap:anywhere; }
.teacher-today-coverage-card small { color:var(--muted); font-weight:800; }
.coverage-availability-context { display:grid; gap:10px; padding:14px 0; border-top:1px solid var(--line); }
.coverage-availability-context h3 { margin:0; font-size:17px; }
.coverage-candidate-list { display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); gap:8px; }
.coverage-candidate { min-width:0; display:grid; gap:4px; padding:11px; border:1px solid #b8d6d1; border-radius:8px; background:#f2faf8; }
.coverage-candidate strong,
.coverage-candidate small { min-width:0; overflow-wrap:anywhere; }
.coverage-candidate small { color:#176b73; font-weight:800; }
.class-inline-notice.is-history { margin-top:10px; background:#f7f8f8; border-color:var(--line); }
@media (max-width:760px) {
  .teacher-coverage-offers .teacher-coverage-offer-card { grid-template-columns:minmax(0,1fr); }
  .teacher-coverage-offers .table-actions form,
  .teacher-coverage-offers .table-actions button { width:100%; }
  .teacher-today-coverage-card { grid-template-columns:minmax(0,1fr); }
  .teacher-today-coverage-card .table-action { width:100%; justify-content:center; }
}
.teacher-incident-context { margin-bottom:14px; line-height:1.45; }
.teacher-incident-context a { font-weight:700; overflow-wrap:anywhere; }
.teacher-incident-context small { display:block; color:var(--muted); }
.teacher-incident-shell .teacher-incident-form-panel { margin-top:0; }
.teacher-message-shell, .teacher-payroll-shell { min-width:0; }
.teacher-message-shell > .table-actions { margin:12px 0; }
.teacher-message-shell > .section-details, .teacher-payroll-shell > .section-details { margin:12px 0; }
.teacher-message-shell > .section-details > .section-details-body,
.teacher-payroll-shell > .section-details > .section-details-body { padding:14px; }
.teacher-message-shell .filter-pills, .teacher-payroll-shell .filter-pills { flex-wrap:wrap; }
.teacher-payroll-list { display:grid; gap:12px; }
.teacher-payroll-item { min-width:0; padding:16px; border:1px solid var(--line); border-radius:8px; background:white; }
.teacher-payroll-item header { display:flex; flex-wrap:wrap; align-items:baseline; justify-content:space-between; gap:8px; }
.teacher-payroll-item h2 { margin:0; font-size:18px; line-height:1.35; }
.teacher-payroll-item header > strong { font-size:18px; }
.teacher-payroll-item dl { display:flex; flex-wrap:wrap; gap:12px 24px; margin:14px 0; }
.teacher-payroll-item dt { color:var(--muted); font-size:12px; }
.teacher-payroll-item dd { margin:3px 0 0; overflow-wrap:anywhere; }
.teacher-payroll-item footer { display:flex; flex-wrap:wrap; gap:10px 18px; align-items:center; }
.teacher-payroll-item footer a { display:inline-flex; align-items:center; min-height:36px; }
.teacher-payroll-recent .teacher-payroll-item { padding:10px 0; border:0; border-bottom:1px solid var(--line); border-radius:0; }
.teacher-payroll-recent h3 { margin:0; font-size:16px; }
.teacher-payroll-recent .teacher-payroll-item header > strong { font-size:16px; }
.teacher-payroll-recent .teacher-payroll-list { gap:4px; }
.vacation-estimate { padding:10px 0; border-top:1px solid var(--line); border-bottom:1px solid var(--line); }
.vacation-estimate-year + .vacation-estimate-year { margin-top:12px; }
.vacation-estimate-values { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:8px; margin:8px 0; }
.vacation-estimate-values dt { font-size:12px; color:var(--muted); }
.vacation-estimate-values dd { margin:3px 0 0; font-weight:700; overflow-wrap:anywhere; }
.teacher-cash-page { min-width:0; gap:12px; }
.teacher-cash-tabs { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:4px; }
.teacher-cash-tabs a { display:flex; align-items:center; justify-content:center; min-height:44px; padding:4px; border-bottom:2px solid var(--line); color:var(--brand); text-decoration:none; }
.teacher-cash-tabs a.active { border-color:var(--brand); font-weight:700; }
.teacher-cash-page .panel { padding:12px; }
.teacher-cash-page h2 { font-size:17px; line-height:1.35; }
.teacher-cash-page p { margin:6px 0; }
.teacher-cash-page .table-actions { flex-wrap:wrap; gap:8px 16px; }
.teacher-cash-page .table-actions a { display:inline-flex; align-items:center; min-height:40px; }
.teacher-cash-balance { padding:12px 0; border-bottom:1px solid var(--line); }
.teacher-cash-record { display:grid; grid-template-columns:minmax(0,1fr) auto; align-items:start; gap:8px; padding:12px 0; border-bottom:1px solid var(--line); }
.teacher-cash-record:has(input[type="checkbox"]) { grid-template-columns:44px minmax(0,1fr) auto; }
.teacher-cash-select { display:flex; align-items:center; justify-content:center; width:44px; height:44px; margin:0; cursor:pointer; }
.teacher-cash-record > div { min-width:0; overflow-wrap:anywhere; }
.teacher-cash-record input[type="checkbox"], .teacher-cash-page .checkbox-row input[type="checkbox"] { width:22px; height:22px; min-width:22px; min-height:22px; margin:0; padding:0; }
.teacher-cash-record small { display:block; color:var(--muted); }
.teacher-cash-amount { font-size:14px; white-space:nowrap; }
.teacher-cash-float > summary { cursor:pointer; padding:12px 0; }
.teacher-cash-proof dl { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,2fr); gap:10px; }
.teacher-cash-proof dt { color:var(--muted); }
.teacher-cash-proof dd { margin:0; overflow-wrap:anywhere; }
.teacher-cash-compact form.inline-form { display:grid; gap:8px; min-width:0; width:100%; max-width:none; }
@media print {
  body:has(.teacher-cash-proof) .sidebar, body:has(.teacher-cash-proof) aside,
  body:has(.teacher-cash-proof) .topbar, .teacher-cash-proof .table-actions { display:none !important; }
  body:has(.teacher-cash-proof) .workspace { margin:0; padding:0; }
}
@media (max-width: 760px) {
  .teacher-mobile-table.teacher-cash-compact tr { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:4px; padding:8px 0; }
  .teacher-mobile-table.teacher-cash-compact td { padding:6px 4px; min-width:0; }
  .teacher-cash-compact td:first-child, .teacher-cash-compact td:last-child { grid-column:1 / -1; }
  .teacher-mobile-table.teacher-cash-compact td:first-child::before { display:none; }
  .teacher-cash-compact td[data-label="Pendiente"] { font-weight:700; }
  .teacher-cash-compact form.inline-form { display:grid !important; grid-template-columns:minmax(0,1fr) minmax(0,1fr); align-items:end; }
  .teacher-cash-compact form label:first-of-type { grid-column:1 / -1; }
  .teacher-cash-compact .cash-review-reason, .teacher-cash-compact form button { grid-column:1 / -1; }
  .teacher-cash-compact form button { min-height:44px; white-space:normal; }
  .teacher-cash-compact [role="note"] { margin:6px 0; }
}
.role-profesor .workspace:has(.teacher-payroll-shell),
.role-profesor .workspace:has(.teacher-message-shell),
.role-profesor .workspace:has(.teacher-incident-shell),
.role-profesor .workspace:has(.training-course-panel) { align-content:start; gap:14px; }
.role-profesor .workspace:has(.teacher-payroll-shell) .topbar,
.role-profesor .workspace:has(.teacher-message-shell) .topbar,
.role-profesor .workspace:has(.teacher-incident-shell) .topbar { margin-bottom:0; }
.teacher-session-tabs > input { position:absolute; width:1px; height:1px; opacity:0; }
.teacher-session-tab-nav { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:4px; margin-bottom:12px; }
.teacher-session-tab-nav label { min-width:0; padding:10px 2px; text-align:center; border:1px solid var(--line); border-radius:6px; background:white; font-size:13px; font-weight:700; cursor:pointer; }
.teacher-session-tab-panel { display:none; min-width:0; }
#teacher_session_attendance:checked ~ .session-tab-attendance,
#teacher_session_learning:checked ~ .session-tab-learning,
#teacher_session_notices:checked ~ .session-tab-notices,
#teacher_session_details:checked ~ .session-tab-details { display:grid; gap:12px; }
#teacher_session_attendance:checked ~ .teacher-session-tab-nav label[for="teacher_session_attendance"],
#teacher_session_learning:checked ~ .teacher-session-tab-nav label[for="teacher_session_learning"],
#teacher_session_notices:checked ~ .teacher-session-tab-nav label[for="teacher_session_notices"],
#teacher_session_details:checked ~ .teacher-session-tab-nav label[for="teacher_session_details"] { background:var(--brand); color:white; border-color:var(--brand); }
#teacher_session_attendance:focus-visible ~ .teacher-session-tab-nav label[for="teacher_session_attendance"],
#teacher_session_learning:focus-visible ~ .teacher-session-tab-nav label[for="teacher_session_learning"],
#teacher_session_notices:focus-visible ~ .teacher-session-tab-nav label[for="teacher_session_notices"],
#teacher_session_details:focus-visible ~ .teacher-session-tab-nav label[for="teacher_session_details"] { outline:2px solid var(--brand); outline-offset:2px; }
.teacher-session-tabs .teacher-coverage-panel > .section-details-body,
.teacher-session-tabs .teacher-provisional-attendance { padding:14px; }
.teacher-session-tabs .teacher-coverage-panel .form-grid,
.teacher-session-tabs .teacher-provisional-attendance .form-grid { margin:0; grid-template-columns:minmax(0,1fr); }
.teacher-session-tabs .teacher-coverage-panel .form-actions,
.teacher-session-tabs .teacher-provisional-attendance .form-actions { min-width:0; }
.teacher-session-top-actions {
  display: flex;
  justify-content: flex-start;
  margin-top: -4px;
}
.teacher-session-top-actions .table-action {
  min-height: 36px;
  padding: 0 11px;
  background: #ffffff;
  color: var(--brand);
}
.teacher-attendance-focus-hero {
  min-width: 0;
  display: grid;
  grid-template-columns: minmax(0, 1fr) 112px;
  gap: 12px;
  align-items: center;
  margin-bottom: 10px;
  padding: 15px;
  border: 1px solid #bfd6d2;
  border-left: 6px solid var(--brand);
  border-radius: 8px;
  background: #f4faf8;
}
.teacher-attendance-focus-hero div:first-child {
  min-width: 0;
  display: grid;
  gap: 4px;
}
.teacher-attendance-focus-hero span {
  color: #176b73;
  font-size: 12px;
  font-weight: 950;
  text-transform: uppercase;
}
.teacher-attendance-focus-hero strong {
  min-width: 0;
  color: #173f45;
  font-size: 23px;
  line-height: 1.1;
  overflow-wrap: anywhere;
}
.teacher-attendance-focus-hero small {
  color: #45565c;
  font-weight: 850;
  line-height: 1.35;
  overflow-wrap: anywhere;
}
.teacher-attendance-count {
  display: grid;
  place-items: center;
  min-height: 88px;
  padding: 10px;
  border-radius: 8px;
  background: #ffffff;
  border: 1px solid #b8d6d1;
}
.teacher-attendance-count strong {
  color: #173f45;
  font-size: 18px;
  line-height: 1.15;
  text-align: center;
}
.teacher-attendance-progress {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
  margin-bottom: 12px;
}
.teacher-attendance-progress span {
  min-width: 0;
  min-height: 38px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0 8px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #ffffff;
  color: #315155;
  font-size: 13px;
  font-weight: 900;
  text-align: center;
}
.teacher-attendance-state {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 12px;
  align-items: center;
  padding: 14px;
  border: 1px solid #f0c78a;
  border-radius: 8px;
  background: #fff8ec;
}
.teacher-attendance-state > div {
  min-width: 0;
  display: grid;
  gap: 3px;
}
.teacher-attendance-state strong {
  color: #173f45;
  font-size: 19px;
}
.teacher-attendance-state span,
.teacher-session-guidance {
  color: #45565c;
  font-weight: 850;
  line-height: 1.35;
}
.teacher-session-guidance {
  margin: 0;
}
.teacher-attendance-state-done {
  border-color: #badcc6;
  background: #f3fbf6;
}
.teacher-attendance-state-cancelled,
.teacher-attendance-state-readonly {
  border-color: #d5dde2;
  background: #f7faf9;
}
.teacher-session-primary-action {
  min-width: min(220px, 100%);
}
.teacher-session-primary-action form {
  margin: 0;
}
.teacher-session-primary-action .table-action,
.teacher-session-primary-action .teacher-live-finish {
  width: 100%;
  min-height: 52px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 8px;
}
.teacher-session-primary-action .table-action {
  background: var(--brand);
  color: #ffffff;
  font-weight: 950;
}
.teacher-session-context {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}
.teacher-session-context .panel {
  margin-bottom: 0;
}
.teacher-session-secondary-actions {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  align-items: center;
}
.teacher-session-secondary-actions .table-action {
  min-height: 38px;
  padding: 0 12px;
  background: #ffffff;
  color: var(--brand);
}
.teacher-attendance-complete {
  display: grid;
  gap: 3px;
  margin-bottom: 12px;
  padding: 12px 14px;
  border: 1px solid #badcc6;
  border-radius: 8px;
  background: #f3fbf6;
}
.teacher-attendance-complete strong {
  color: #176b3f;
  font-size: 18px;
}
.teacher-attendance-complete span {
  color: #315155;
  font-weight: 850;
}
.teacher-attendance-incomplete {
  border-color: #f0c78a;
  background: #fff8ec;
}
.teacher-attendance-incomplete strong {
  color: #7a5200;
}
.teacher-attendance-complete .table-action {
  width: fit-content;
  margin-top: 6px;
}
.teacher-live-shell {
  display: grid;
  gap: 12px;
}
.teacher-closing-note { display: grid; gap: 6px; margin-top: 12px; }
.teacher-session-notes { margin: 12px 0; overflow-wrap: anywhere; }
.teacher-session-notes h3 { font-size: 15px; margin: 0 0 6px; }
.teacher-session-notes p { white-space: pre-wrap; margin: 0; }
.teacher-plan-mobile { min-width: 0; }
.teacher-plan-list { margin: 12px 0; padding: 0; list-style: none; }
.teacher-plan-entry { display: grid; gap: 6px; padding: 12px 0; border-top: 1px solid #dce5e5; overflow-wrap: anywhere; }
.teacher-plan-entry p { margin: 0; white-space: pre-wrap; }
.teacher-live-summary-card {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 116px;
  gap: 12px;
  align-items: center;
  border-left: 6px solid var(--brand);
  background: #f4faf8;
}
.teacher-live-summary-card .details {
  margin: 0;
}
.teacher-live-summary-card:not(:has(.teacher-live-timer)) {
  grid-template-columns: minmax(0, 1fr);
}
.teacher-live-hero {
  min-width: 0;
  display: grid;
  grid-template-columns: minmax(0, 1fr) 116px;
  gap: 12px;
  align-items: center;
  padding: 15px;
  border: 1px solid #bfd6d2;
  border-left: 6px solid var(--brand);
  border-radius: 8px;
  background: #f4faf8;
}
.teacher-live-hero div:first-child {
  min-width: 0;
  display: grid;
  gap: 4px;
}
.teacher-live-hero span {
  color: #176b73;
  font-size: 12px;
  font-weight: 950;
  text-transform: uppercase;
}
.teacher-live-hero strong {
  min-width: 0;
  color: #173f45;
  font-size: 23px;
  line-height: 1.1;
  overflow-wrap: anywhere;
}
.teacher-live-hero small {
  color: #45565c;
  font-weight: 850;
  line-height: 1.35;
}
.teacher-live-timer {
  display: grid;
  place-items: center;
  min-height: 86px;
  border: 1px solid #b8d6d1;
  border-radius: 8px;
  background: #ffffff;
}
.teacher-live-timer strong {
  color: #173f45;
  font-size: 24px;
  line-height: 1;
}
.teacher-live-timer span {
  color: #45565c;
  font-size: 11px;
  font-weight: 900;
}
.teacher-pickup-panel {
  display: grid;
  gap: 12px;
}
.teacher-pickup-panel p {
  margin: 0;
  color: #45565c;
  font-weight: 850;
  line-height: 1.4;
}
.teacher-pickup-countdown {
  display: grid;
  place-items: center;
  min-height: 132px;
  border: 1px solid #b8d6d1;
  border-radius: 8px;
  background: #f3fbf6;
}
.teacher-pickup-countdown strong {
  color: #173f45;
  font-size: 54px;
  line-height: 1;
}
.teacher-pickup-countdown span {
  color: #45565c;
  font-size: 12px;
  font-weight: 950;
  text-transform: uppercase;
}
.teacher-live-status,
.teacher-live-attendance-ok,
.teacher-live-next {
  display: grid;
  gap: 4px;
  padding: 13px 14px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #ffffff;
}
.teacher-live-status strong,
.teacher-live-attendance-ok strong,
.teacher-live-next strong {
  color: #173f45;
  font-size: 18px;
}
.teacher-live-status span,
.teacher-live-attendance-ok span,
.teacher-live-next span {
  color: #45565c;
  font-weight: 850;
}
.teacher-live-final-summary,
.teacher-content-card-list {
  display: grid;
  gap: 10px;
}
.teacher-live-final-summary {
  padding: 13px 14px;
  border: 1px solid #badcc6;
  border-radius: 8px;
  background: #f3fbf6;
}
.teacher-live-final-summary strong {
  color: #173f45;
  font-size: 18px;
}
.teacher-live-final-summary span {
  color: #45565c;
  font-weight: 850;
}
.teacher-content-card {
  display: grid;
  gap: 4px;
  padding: 14px;
  border: 1px solid #cbd7d5;
  border-radius: 8px;
  background: #ffffff;
  color: inherit;
  text-decoration: none;
}
.teacher-content-card span {
  color: #176b73;
  font-size: 12px;
  font-weight: 950;
  text-transform: uppercase;
}
.teacher-content-card strong {
  color: #173f45;
  font-size: 18px;
}
.teacher-content-card small {
  color: #45565c;
  font-weight: 850;
}
.teacher-live-attendance-ok.done {
  border-color: #badcc6;
  background: #f3fbf6;
}
.teacher-live-attendance-ok.pending {
  border-color: #f0c78a;
  background: #fff8ec;
}
.teacher-live-shell.is-warning .teacher-live-status {
  border-color: #e0a23b;
  background: #fff6dd;
}
.teacher-live-shell.is-ended .teacher-live-status,
.teacher-live-status-ended,
.teacher-live-clockout {
  border-color: #badcc6;
  background: #f3fbf6;
}
.teacher-live-actions {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: 10px;
}
.teacher-live-primary-actions {
  grid-template-columns: 1fr;
}
.teacher-live-actions form {
  margin: 0;
}
.teacher-live-actions .table-action,
.teacher-live-finish,
.teacher-live-closing,
.teacher-live-next .table-action {
  width: 100%;
  min-height: 50px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  text-align: center;
}
.teacher-live-finish {
  border: 1px solid #b8c2d4;
  border-radius: 8px;
  background: #ffffff;
  color: #1f2937;
  font-weight: 900;
  cursor: pointer;
}
.teacher-live-closing {
  border: 1px solid #b8c2d4;
  border-radius: 8px;
  background: #ffffff;
  color: #1f2937;
  font-weight: 900;
  cursor: pointer;
}
.teacher-live-secondary-actions {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 8px;
  justify-items: center;
}
.teacher-live-secondary-actions .table-action {
  width: min(100%, 460px);
  min-height: 46px;
  padding: 0 14px;
  background: #ffffff;
  color: var(--brand);
  border-color: #b8d6d1;
  font-weight: 900;
}
.teacher-live-next {
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
}
.teacher-live-next span {
  min-width: 0;
  overflow-wrap: anywhere;
}
.teacher-live-next .table-action {
  grid-column: 2;
  grid-row: 1 / span 2;
}
.teacher-finish-delivery-form {
  display: grid;
  gap: 12px;
}
.teacher-finish-delivery-form > .teacher-live-finish {
  min-height: 58px;
}
.teacher-delivery-options {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
}
.teacher-delivery-choice {
  min-width: 0;
}
.teacher-delivery-choice input {
  position: absolute;
  width: 1px !important;
  height: 1px;
  opacity: 0;
  pointer-events: none;
}
.teacher-delivery-choice span,
.teacher-delivery-pill {
  min-height: 42px;
  display: inline-flex;
  width: 100%;
  align-items: center;
  justify-content: center;
  padding: 8px 10px;
  border: 1px solid #cbd7d5;
  border-radius: 8px;
  background: #ffffff;
  color: #173f45;
  font-weight: 900;
  text-align: center;
}
.teacher-delivery-choice input:checked + span {
  border-color: var(--brand);
  background: #eef8f6;
  color: var(--brand-dark);
  box-shadow: inset 0 0 0 1px var(--brand);
}
.teacher-delivery-extra {
  margin-top: 8px;
}
.teacher-delivery-reason {
  display: grid;
  gap: 5px;
  margin-top: 8px;
  color: #315155;
  font-weight: 900;
}
.teacher-delivery-reason textarea {
  width: 100%;
  min-height: 82px;
  resize: vertical;
  box-sizing: border-box;
}
.teacher-delivery-reason[hidden] {
  display: none !important;
}
.teacher-delivery-extra summary {
  cursor: pointer;
  color: var(--brand);
  font-weight: 900;
}
.teacher-delivery-extra-fields {
  display: grid;
  gap: 8px;
  margin-top: 8px;
}
.teacher-delivery-extra-fields label,
.teacher-delivery-extra-fields input {
  min-width: 0;
  max-width: 100%;
}
.teacher-delivery-extra-fields input {
  width: 100% !important;
  box-sizing: border-box;
}
.teacher-attendance-quick-panel {
  display: grid;
  gap: 14px;
}
.teacher-class-detail-secondary {
  margin-bottom: 0;
}
.teacher-session-state-form {
  display: grid;
  gap: 12px;
}
.teacher-quick-attendance-list {
  display: grid;
  gap: 10px;
}
.teacher-attendance-quick-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 10px;
  align-items: center;
  padding: 11px 12px;
  border: 1px solid var(--line);
  border-left: 5px solid #c3ccd0;
  border-radius: 8px;
  background: #fbfdfd;
}
.teacher-attendance-quick-row.status-presente {
  border-left-color: #2f6d4e;
  background: #f3fbf6;
}
.teacher-attendance-quick-row.status-ausente {
  border-left-color: #c76428;
  background: #fff7e8;
}
.teacher-attendance-quick-row strong,
.teacher-attendance-quick-row small {
  display: block;
  min-width: 0;
  overflow-wrap: anywhere;
}
.teacher-attendance-quick-row strong {
  font-size: 17px;
  line-height: 1.2;
}
.teacher-attendance-name-line {
  min-width: 0;
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  align-items: center;
}
.arrival-origin-badge {
  display: inline-flex;
  align-items: center;
  min-height: 22px;
  padding: 0 7px;
  border: 1px solid #d5dde2;
  border-radius: 999px;
  background: #eef4f7;
  color: #24404a;
  font-size: 11px;
  font-weight: 950;
  letter-spacing: 0;
}
.arrival-origin-badge.origin-comedor {
  border-color: #f0c78a;
  background: #fff3d6;
  color: #704900;
}
.arrival-origin-badge.origin-casa {
  border-color: #b8d6d1;
  background: #eef8f5;
  color: #176b73;
}
.attendance-family-notice {
  display: inline-flex;
  align-items: center;
  min-height: 22px;
  border-radius: 999px;
  padding: 3px 8px;
  border: 1px solid #d9c49f;
  background: #fff7e6;
  color: #704900;
  font-size: 11px;
  font-weight: 950;
  letter-spacing: 0;
}
.attendance-family-notice.notice-absence {
  border-color: #dba989;
  background: #fff0e8;
  color: #8a3d18;
}
.attendance-family-notice.notice-late {
  border-color: #d9c49f;
  background: #fff7e6;
  color: #704900;
}
.attendance-family-notice-note {
  display: inline-block;
  margin-left: 4px;
  font-size: 12px;
  color: #704900;
}
.attendance-family-notice-note summary {
  cursor: pointer;
  font-weight: 850;
}
.attendance-family-notice-note p {
  margin: 5px 0 0;
  max-width: 260px;
  line-height: 1.3;
}
.teacher-attendance-origin-warning {
  margin: 7px 0 0;
  color: #704900;
  font-size: 13px;
  font-weight: 850;
  line-height: 1.3;
}
.teacher-attendance-origin-warning.origin-warning-soft {
  color: #176b73;
}
.teacher-provisional-attendance {
  display: grid;
  gap: 12px;
}
.teacher-provisional-current {
  border: 1px solid #f0c78a;
  background: #fff8e8;
  border-radius: 8px;
  padding: 12px;
}
.teacher-provisional-current strong {
  display: block;
  margin-bottom: 5px;
  color: #704900;
}
.teacher-provisional-current ul {
  margin: 0;
  padding-left: 18px;
}
.teacher-provisional-current h3 { margin:0 0 8px; font-size:15px; color:#704900; }
.teacher-provisional-current li { margin:6px 0; overflow-wrap:anywhere; }
.teacher-provisional-current li strong { margin-bottom:2px; }
.teacher-provisional-current li span { display:block; font-size:13px; color:#704900; }
.teacher-attendance-totals { display:flex; flex-wrap:wrap; align-items:baseline; gap:4px 12px; margin:4px 0 12px; }
.teacher-attendance-totals span { font-size:13px; color:var(--muted); }
.teacher-provisional-reminder {
  border: 1px solid #f0c78a;
  background: #fff8e8;
  color: #704900;
  border-radius: 8px;
  padding: 14px;
  display: grid;
  gap: 4px;
}
.teacher-provisional-reminder strong {
  font-size: 15px;
}
.teacher-provisional-reminder span {
  font-size: 14px;
  line-height: 1.35;
}
.teacher-attendance-quick-row small {
  color: var(--muted);
  font-weight: 800;
  margin-top: 3px;
}
.teacher-attendance-buttons {
  display: grid;
  grid-template-columns: repeat(2, minmax(88px, 1fr));
  gap: 7px;
}
.teacher-attendance-buttons form {
  margin: 0;
}
.compact-origin-form {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 6px;
  align-items: center;
}
.compact-origin-form select {
  min-width: 0;
}
.attendance-mark {
  width: 100%;
  min-height: 56px;
  padding: 0 12px;
  border: 1px solid var(--line);
  background: #ffffff;
  color: var(--ink);
  font-size: 15px;
  font-weight: 950;
}
.attendance-mark-presente.active,
.attendance-mark-presente:hover {
  background: #2f6d4e;
  color: #ffffff;
  border-color: #2f6d4e;
}
.attendance-mark-ausente.active,
.attendance-mark-ausente:hover {
  background: #c76428;
  color: #ffffff;
  border-color: #c76428;
}
.family-home-hero {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
  margin-bottom: 16px;
}
.family-focus-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
  margin-bottom: 16px;
}
.family-focus-card {
  min-width: 0;
  min-height: 132px;
  display: flex;
  align-items: flex-start;
  gap: 12px;
  padding: 16px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #ffffff;
  color: var(--ink);
  text-decoration: none;
  box-shadow: 0 10px 24px rgba(20, 39, 42, 0.07);
}
.family-focus-calendar {
  border-color: #9fc5c0;
  background: #edf8f6;
}
.family-focus-payments {
  border-color: #e1c2ad;
  background: #fff4ec;
}
.family-focus-notice {
  border-color: #edc6a4;
  background: #fff7e8;
}
.family-focus-children {
  border-color: #c3ccd0;
  background: #f1f5f6;
}
.family-focus-card:hover {
  border-color: var(--brand);
  box-shadow: 0 12px 26px rgba(23, 107, 115, 0.12);
}
.family-focus-icon {
  flex: 0 0 44px;
  width: 44px;
  height: 44px;
  display: grid;
  place-items: center;
  border-radius: 999px;
  background: var(--brand);
  color: #ffffff;
  font-size: 18px;
  font-weight: 900;
}
.family-focus-payments .family-focus-icon { background: #8f4f2b; }
.family-focus-notice .family-focus-icon { background: #c76428; }
.family-focus-children .family-focus-icon { background: #314d54; }
.student-focus-grid .family-focus-card {
  min-height: 118px;
}
.family-focus-copy {
  min-width: 0;
  display: grid;
  gap: 6px;
}
.family-focus-copy small {
  color: var(--muted);
  font-size: 12px;
  font-style: normal;
  font-weight: 900;
  line-height: 1.1;
  text-transform: uppercase;
}
.family-focus-copy strong {
  font-size: 20px;
  line-height: 1.15;
  overflow-wrap: anywhere;
}
.family-focus-copy em {
  color: var(--muted);
  font-size: 13px;
  font-style: normal;
  font-weight: 700;
  line-height: 1.25;
}
.responsible-home-intro {
  display: grid;
  gap: 4px;
  margin-bottom: 12px;
}
.responsible-home-intro span {
  color: var(--brand);
  font-size: 12px;
  font-weight: 950;
  text-transform: uppercase;
}
.responsible-home-intro strong {
  font-size: 24px;
  line-height: 1.12;
}
.responsible-home-intro small {
  color: var(--muted);
  font-weight: 850;
}
.responsible-next-hero {
  min-width: 0;
  display: grid;
  grid-template-columns: minmax(0, 1.1fr) minmax(0, 1.8fr) auto;
  gap: 14px;
  align-items: center;
  padding: 18px;
  margin-bottom: 14px;
  border: 1px solid #9fc5c0;
  border-left: 7px solid var(--brand);
  border-radius: 8px;
  background: #edf8f6;
  box-shadow: 0 12px 26px rgba(20, 39, 42, 0.08);
}
.responsible-next-hero.is-cancelled {
  border-color: #e1c2ad;
  border-left-color: #c76428;
  background: #fff1e5;
}
.responsible-next-hero.no-class {
  grid-template-columns: minmax(0, 1fr) auto;
  border-color: var(--line);
  border-left-color: #9aa7ac;
  background: #f7faf9;
}
.responsible-next-main {
  min-width: 0;
  display: grid;
  gap: 4px;
}
.responsible-next-main span {
  color: var(--brand);
  font-size: 12px;
  font-weight: 950;
  text-transform: uppercase;
}
.responsible-next-hero.is-cancelled .responsible-next-main span {
  color: #8f3f37;
}
.responsible-next-main strong {
  min-width: 0;
  font-size: 25px;
  line-height: 1.08;
  overflow-wrap: anywhere;
}
.responsible-next-main small {
  color: var(--muted);
  font-weight: 900;
}
.responsible-next-details {
  min-width: 0;
  margin: 0;
  grid-template-columns: repeat(3, minmax(0, 1fr));
}
.responsible-next-details div {
  min-width: 0;
}
.responsible-next-action {
  min-width: 0;
  display: flex;
  justify-content: flex-end;
}
.responsible-next-actions {
  flex-wrap: wrap;
  gap: 8px;
}
.responsible-next-alert {
  min-width: 0;
  display: grid;
  gap: 4px;
  padding: 10px;
  border: 1px solid #d99d76;
  border-radius: 8px;
  background: #fff8ef;
  color: #8f3f37;
}
.responsible-next-alert strong,
.responsible-next-alert span {
  min-width: 0;
  overflow-wrap: anywhere;
}
.responsible-secondary-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
  margin-bottom: 14px;
}
.responsible-info-card {
  min-width: 0;
  display: grid;
  gap: 6px;
  padding: 15px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #ffffff;
  color: var(--ink);
  text-decoration: none;
  box-shadow: 0 8px 18px rgba(20, 39, 42, 0.05);
}
.responsible-info-payments {
  border-color: #e1c2ad;
  background: #fff4ec;
}
.responsible-info-students {
  border-color: #c3ccd0;
  background: #f1f5f6;
}
.responsible-info-card span {
  color: var(--muted);
  font-size: 12px;
  font-weight: 950;
  text-transform: uppercase;
}
.responsible-info-card strong {
  font-size: 20px;
  line-height: 1.12;
  overflow-wrap: anywhere;
}
.responsible-info-card em {
  color: var(--ink);
  font-size: 18px;
  font-style: normal;
  font-weight: 950;
}
.responsible-info-card small {
  color: var(--muted);
  font-weight: 750;
  line-height: 1.25;
  overflow-wrap: anywhere;
}
.responsible-info-card b {
  width: fit-content;
  margin-top: 4px;
  padding: 7px 10px;
  border-radius: 999px;
  background: var(--brand);
  color: #ffffff;
  font-size: 12px;
  font-weight: 950;
}
.responsible-sent-notices-panel {
  background: #ffffff;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 14px;
  margin-bottom: 14px;
  box-shadow: 0 8px 18px rgba(20, 39, 42, 0.05);
}
.responsible-sent-notice-list {
  display: grid;
  gap: 9px;
}
.responsible-sent-notice-card {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 10px;
  align-items: center;
  border: 1px solid #d8e6e2;
  background: #f7fbfa;
  border-radius: 8px;
  padding: 10px 12px;
}
.responsible-sent-notice-card strong,
.responsible-sent-notice-card span,
.responsible-sent-notice-card small {
  display: block;
}
.responsible-sent-notice-card strong {
  color: #24404a;
  font-size: 15px;
}
.responsible-sent-notice-card span {
  color: #4e6268;
  font-size: 13px;
  line-height: 1.35;
}
.responsible-sent-notice-card small {
  margin-top: 3px;
  color: var(--muted);
  font-size: 12px;
  line-height: 1.3;
}
.responsible-sent-notice-card aside {
  display: grid;
  justify-items: end;
  gap: 5px;
}
.responsible-sent-notice-card aside span,
.responsible-sent-notice-card aside em {
  display: inline-flex;
  border-radius: 999px;
  padding: 4px 8px;
  font-size: 11px;
  font-style: normal;
  font-weight: 900;
  white-space: nowrap;
}
.responsible-sent-notice-card aside span {
  background: #fff7e6;
  color: #704900;
}
.responsible-sent-notice-card aside em {
  background: #e7f4ef;
  color: #176b73;
}
.responsible-quick-actions {
  min-width: 0;
  display: grid;
  gap: 10px;
  padding: 14px;
  margin-bottom: 14px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #ffffff;
  box-shadow: 0 8px 18px rgba(20, 39, 42, 0.05);
}
.responsible-action-row {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
}
.responsible-action-row .family-focus-card {
  min-height: 98px;
  padding: 12px;
  box-shadow: none;
}
.responsible-action-row .family-focus-icon {
  width: 36px;
  height: 36px;
  flex-basis: 36px;
  font-size: 14px;
}
.responsible-action-row .family-focus-copy strong {
  font-size: 16px;
}
.responsible-student-hero {
  min-width: 0;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 14px;
  align-items: center;
  padding: 18px;
  margin-bottom: 14px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #ffffff;
  box-shadow: 0 10px 24px rgba(20, 39, 42, 0.06);
}
.responsible-student-hero span {
  color: var(--brand);
  font-size: 12px;
  font-weight: 950;
  text-transform: uppercase;
}
.responsible-student-hero strong {
  display: block;
  margin-top: 4px;
  font-size: 26px;
  line-height: 1.08;
  overflow-wrap: anywhere;
}
.responsible-student-hero small {
  display: block;
  margin-top: 5px;
  color: var(--muted);
  font-weight: 850;
  overflow-wrap: anywhere;
}
.responsible-student-actions {
  min-width: 0;
  display: grid;
  grid-template-columns: repeat(3, max-content);
  gap: 8px;
}
.emergency-contact-panel {
  max-width: 720px;
  margin-inline: auto;
}
.emergency-contact-details {
  margin-top: 16px;
}
.emergency-phone-link {
  display: inline-flex;
  min-height: 44px;
  align-items: center;
  padding: 8px 12px;
  border-radius: 7px;
  background: var(--brand);
  color: #ffffff;
  font-size: 18px;
  font-weight: 900;
  text-decoration: none;
}
.responsible-student-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: 14px;
  margin-bottom: 14px;
}
.responsible-student-panel {
  min-width: 0;
  display: grid;
  gap: 10px;
  padding: 14px;
  margin-bottom: 14px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #ffffff;
  box-shadow: 0 8px 18px rgba(20, 39, 42, 0.05);
}
.responsible-attendance-list {
  display: grid;
  gap: 8px;
}
.responsible-attendance-card {
  min-width: 0;
  display: grid;
  grid-template-columns: 86px minmax(0, 1fr);
  gap: 8px;
  align-items: center;
  padding: 10px;
  border: 1px solid var(--line);
  border-left: 5px solid #9aa7ac;
  border-radius: 8px;
  background: #f8fbfa;
}
.responsible-attendance-card.status-presente {
  border-left-color: #2f6d4e;
  background: #eef7f1;
}
.responsible-attendance-card.status-ausente {
  border-left-color: #c76428;
  background: #fff4ec;
}
.responsible-attendance-card span,
.responsible-attendance-card small {
  color: var(--muted);
  font-size: 12px;
  font-weight: 850;
  overflow-wrap: anywhere;
}
.responsible-attendance-card strong {
  min-width: 0;
  font-size: 16px;
  line-height: 1.12;
  overflow-wrap: anywhere;
}
.responsible-attendance-card small {
  grid-column: 1 / -1;
}
.responsible-payment-mini {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  margin: 0;
}
.responsible-student-payments .family-payment-card {
  box-shadow: none;
}
.parent-notice-form-panel {
  max-width: 760px;
}
.parent-notice-context {
  min-width: 0;
  display: grid;
  gap: 5px;
  padding: 14px;
  border: 1px solid #9fc5c0;
  border-left: 6px solid var(--brand);
  border-radius: 8px;
  background: #edf8f6;
}
.parent-notice-context span {
  color: var(--brand);
  font-size: 12px;
  font-weight: 950;
  text-transform: uppercase;
}
.parent-notice-context strong {
  min-width: 0;
  font-size: 21px;
  line-height: 1.12;
  overflow-wrap: anywhere;
}
.parent-notice-context small,
.parent-notice-context em {
  min-width: 0;
  color: var(--muted);
  font-style: normal;
  font-weight: 850;
  line-height: 1.25;
  overflow-wrap: anywhere;
}
.family-main-action {
  min-width: 0;
  min-height: 142px;
  display: grid;
  align-content: space-between;
  gap: 10px;
  padding: 18px;
  border-radius: 8px;
  text-decoration: none;
  color: #ffffff;
  box-shadow: 0 14px 28px rgba(20, 39, 42, 0.14);
}
.family-main-calendar { background: #176b73; }
.family-main-payments { background: #8f4f2b; }
.family-main-action span {
  font-size: 13px;
  font-weight: 900;
  text-transform: uppercase;
  opacity: .86;
}
.family-main-action strong {
  display: block;
  font-size: 22px;
  line-height: 1.15;
  overflow-wrap: anywhere;
}
.family-main-action small {
  display: block;
  color: rgba(255,255,255,.86);
  font-weight: 800;
  line-height: 1.35;
}
.family-week-panel {
  background: var(--panel);
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 16px;
  margin-bottom: 16px;
  box-shadow: 0 10px 24px rgba(20, 39, 42, 0.06);
}
.student-next-hero,
.student-self-hero {
  min-width: 0;
  display: flex;
  justify-content: space-between;
  gap: 16px;
  align-items: center;
  padding: 18px;
  margin-bottom: 16px;
  border: 1px solid var(--line);
  border-left: 6px solid var(--brand);
  border-radius: 8px;
  background: #ffffff;
  box-shadow: 0 10px 24px rgba(20, 39, 42, 0.06);
}
.student-next-hero span,
.student-self-hero span {
  color: var(--brand);
  font-size: 12px;
  font-weight: 900;
  text-transform: uppercase;
}
.student-next-hero strong,
.student-self-hero strong {
  display: block;
  margin-top: 4px;
  font-size: 24px;
  line-height: 1.15;
  overflow-wrap: anywhere;
}
.student-next-hero small,
.student-self-hero small {
  display: block;
  margin-top: 5px;
  color: var(--muted);
  font-weight: 800;
  overflow-wrap: anywhere;
}
.student-self-actions {
  display: grid;
  grid-template-columns: repeat(3, max-content);
  gap: 8px;
}
.student-mini-metrics {
  margin-bottom: 16px;
}
.family-week-strip {
  display: grid;
  grid-template-columns: repeat(7, minmax(0, 1fr));
  gap: 7px;
}
.family-week-day {
  min-width: 0;
  min-height: 74px;
  display: grid;
  align-content: center;
  justify-items: center;
  gap: 5px;
  padding: 8px 4px;
  border: 1px solid var(--line);
  border-radius: 8px;
  text-decoration: none;
  background: #f8fbfa;
}
.family-week-day strong {
  width: 28px;
  height: 28px;
  display: grid;
  place-items: center;
  border-radius: 999px;
  color: var(--muted);
  background: #edf3f1;
}
.family-week-day span {
  color: var(--muted);
  font-size: 11px;
  font-weight: 800;
  text-align: center;
  line-height: 1.15;
}
.family-week-day.has-class {
  border-color: #9fc5c0;
  background: #eef7f5;
}
.family-week-day.has-class strong {
  color: #ffffff;
  background: var(--brand);
}
.family-week-day.today { border-color: #c76428; }
.family-month-calendar {
  display: grid;
  gap: 8px;
}
.family-month-title {
  color: var(--ink);
  font-weight: 900;
}
.family-month-weekdays,
.family-month-grid {
  display: grid;
  grid-template-columns: repeat(7, minmax(0, 1fr));
  gap: 5px;
}
.family-month-weekdays span {
  color: var(--muted);
  font-size: 11px;
  font-weight: 900;
  text-align: center;
}
.family-month-day {
  min-width: 0;
  aspect-ratio: 1 / 1;
  display: grid;
  place-items: center;
  gap: 1px;
  padding: 4px 1px;
  border: 1px solid var(--line);
  border-radius: 7px;
  background: #ffffff;
  color: var(--ink);
  text-decoration: none;
}
.family-month-day strong {
  font-size: 13px;
  line-height: 1;
}
.family-month-day small {
  min-height: 13px;
  color: var(--muted);
  font-size: 10px;
  font-weight: 900;
  line-height: 1;
}
.family-month-day.has-class {
  border-color: #8dbab4;
  background: #e7f4f2;
}
.family-month-day.has-class strong { color: #14565d; }
.family-month-day.has-cancelled {
  border-color: #c76428;
  background: #fff1e5;
}
.family-month-day.has-cancelled strong { color: #8f3f37; }
.family-month-day.today {
  border-color: #c76428;
  box-shadow: inset 0 0 0 1px #c76428;
}
.family-month-empty {
  border-color: transparent;
  background: transparent;
  pointer-events: none;
}
.family-day-hero {
  min-width: 0;
  display: grid;
  gap: 8px;
  padding: 16px;
  margin-bottom: 12px;
  border-radius: 8px;
  background: #176b73;
  color: #ffffff;
}
.family-day-hero span,
.family-day-hero small {
  font-weight: 900;
  opacity: 0.9;
}
.family-day-hero h2 {
  margin: 0;
  color: #ffffff;
  font-size: 28px;
  line-height: 1.05;
}
.family-day-actions {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
  margin-top: 4px;
}
.family-day-actions .table-action {
  width: 100%;
  min-width: 0;
  justify-content: center;
  background: #ffffff;
  color: #176b73;
  border-color: #ffffff;
}
.family-day-section {
  min-width: 0;
  display: grid;
  gap: 10px;
  padding: 14px;
  margin-bottom: 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #ffffff;
  box-shadow: 0 8px 18px rgba(20, 39, 42, 0.05);
}
.family-day-class-list,
.family-day-context-list {
  min-width: 0;
  display: grid;
  gap: 10px;
}
.family-day-class-card {
  min-width: 0;
  display: grid;
  grid-template-columns: 92px minmax(0, 1fr) auto;
  gap: 12px;
  align-items: center;
  padding: 12px;
  border: 1px solid #bfd6d2;
  border-left: 5px solid #176b73;
  border-radius: 8px;
  background: #f4faf8;
}
.family-day-class-card.is-cancelled {
  border-color: #e1c2ad;
  border-left-color: #c76428;
  background: #fff7e8;
}
.family-day-class-card.is-cancelled .family-day-class-time strong,
.family-day-class-card.is-cancelled .family-day-class-main strong {
  color: #8f3f37;
}
.family-day-class-time,
.family-day-class-main,
.family-day-class-action {
  min-width: 0;
}
.family-day-class-action .table-action {
  min-width: 72px;
  justify-content: center;
}
.family-day-class-time strong,
.family-day-class-time span,
.family-day-class-main strong,
.family-day-class-main span,
.family-day-class-main small {
  display: block;
  min-width: 0;
  overflow-wrap: anywhere;
}
.family-day-class-time strong {
  color: #176b73;
  font-size: 16px;
  font-weight: 950;
}
.family-day-class-time span {
  margin-top: 3px;
  color: var(--muted);
  font-size: 11px;
  font-weight: 900;
  text-transform: uppercase;
}
.family-day-class-main strong {
  font-size: 17px;
  line-height: 1.18;
}
.family-day-class-main span {
  margin-top: 3px;
  color: #314d54;
  font-weight: 900;
}
.family-day-class-main small {
  margin-top: 3px;
  color: var(--muted);
  font-weight: 800;
}
.activity-status-badge {
  display: inline-flex;
  align-items: center;
  width: fit-content;
  margin-left: 7px;
  padding: 2px 6px;
  border-radius: 999px;
  font-size: 10px;
  font-weight: 950;
  line-height: 1.2;
  text-transform: uppercase;
}
.activity-status-badge.is-cancelled {
  background: #fce6e2;
  color: #8f3f37;
}
.activity-cancel-reason {
  color: #8f3f37 !important;
  font-weight: 950 !important;
}
.family-day-context-card {
  min-width: 0;
  display: grid;
  gap: 3px;
  padding: 11px;
  border: 1px solid #e1c2ad;
  border-left: 5px solid #c76428;
  border-radius: 8px;
  background: #fff7e8;
}
.family-day-context-card strong,
.family-day-context-card span,
.family-day-context-card small {
  min-width: 0;
  overflow-wrap: anywhere;
}
.family-day-context-card span {
  color: #8f4f2b;
  font-weight: 900;
}
.family-day-context-card small {
  color: var(--muted);
  font-weight: 800;
}
.family-day-footer {
  display: flex;
  justify-content: flex-end;
}
.family-event-detail {
  min-width: 0;
  display: grid;
  gap: 14px;
  padding: 18px;
  border: 1px solid var(--line);
  border-left: 6px solid #176b73;
  border-radius: 8px;
  background: #ffffff;
  box-shadow: 0 10px 24px rgba(20, 39, 42, 0.07);
}
.family-event-detail.is-cancelled {
  border-left-color: #c76428;
  background: #fffaf4;
}
.family-event-detail > span,
.family-event-detail > small {
  color: var(--muted);
  font-weight: 900;
  text-transform: uppercase;
}
.family-event-detail h2 {
  margin: 0;
  font-size: 28px;
  line-height: 1.08;
}
.family-event-alert {
  display: grid;
  gap: 4px;
  padding: 12px;
  border: 1px solid #e1c2ad;
  border-radius: 8px;
  background: #fff1e5;
  color: #8f3f37;
}
.family-event-alert strong,
.family-event-alert span {
  min-width: 0;
  overflow-wrap: anywhere;
}
.family-event-details {
  margin: 0;
}
.parent-next-list {
  min-width: 0;
  display: grid;
  gap: 10px;
}
.parent-next-card {
  min-width: 0;
  display: grid;
  grid-template-columns: 98px minmax(0, 1fr) auto;
  gap: 10px;
  align-items: center;
  padding: 12px;
  border: 1px solid #bfd6d2;
  border-left: 5px solid #176b73;
  border-radius: 8px;
  background: #f4faf8;
}
.parent-next-campamento {
  border-color: #e1c2ad;
  border-left-color: #8f4f2b;
  background: #fff4ec;
}
.parent-next-taller {
  border-color: #edc6a4;
  border-left-color: #c76428;
  background: #fff7e8;
}
.parent-next-card.is-cancelled {
  border-color: #e1c2ad;
  border-left-color: #c76428;
  background: #fff1e5;
}
.parent-next-card.is-cancelled .parent-next-date strong,
.parent-next-card.is-cancelled .parent-next-main strong {
  color: #8f3f37;
}
.parent-next-date,
.parent-next-main {
  min-width: 0;
}
.parent-next-date strong,
.parent-next-date span,
.parent-next-main strong,
.parent-next-main span,
.parent-next-main small {
  display: block;
  min-width: 0;
  overflow-wrap: anywhere;
}
.parent-next-date strong {
  color: #176b73;
  font-size: 15px;
  font-weight: 950;
}
.parent-next-date span {
  margin-top: 3px;
  color: var(--muted);
  font-size: 11px;
  font-weight: 900;
  text-transform: uppercase;
}
.parent-next-main strong {
  font-size: 16px;
  line-height: 1.18;
}
.parent-next-main span {
  margin-top: 3px;
  color: #314d54;
  font-weight: 900;
}
.parent-next-main small {
  margin-top: 3px;
  color: var(--muted);
  font-weight: 800;
}
.parent-next-card .table-action {
  min-width: 54px;
  justify-content: center;
}
.family-action-section { margin-bottom: 14px; }
.family-action-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}
.family-action-grid a {
  min-width: 0;
  min-height: 82px;
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 13px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #ffffff;
  color: var(--ink);
  text-decoration: none;
  box-shadow: 0 8px 18px rgba(20, 39, 42, 0.05);
}
.family-action-grid a:first-child,
.family-action-grid a:nth-child(2) {
  border-color: #b8d6d1;
  background: #f2faf8;
}
.family-action-grid a:nth-child(5) {
  grid-column: 1 / -1;
}
.family-action-icon {
  flex: 0 0 42px;
  width: 42px;
  height: 42px;
  display: grid;
  place-items: center;
  border-radius: 999px;
  background: var(--brand);
  color: #ffffff;
  font-size: 19px;
  font-weight: 900;
}
.family-action-grid a:nth-child(2) .family-action-icon {
  background: #8f4f2b;
}
.family-action-grid a:nth-child(3) .family-action-icon,
.family-action-grid a:nth-child(4) .family-action-icon {
  background: #c76428;
}
.family-action-copy {
  min-width: 0;
  display: grid;
  gap: 3px;
}
.family-action-grid strong {
  font-size: 16px;
  line-height: 1.15;
}
.family-action-grid small {
  color: var(--muted);
  font-size: 13px;
  font-weight: 700;
  line-height: 1.25;
}
.family-secondary-links {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-bottom: 12px;
}
.notice-choice-panel {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
  margin-bottom: 14px;
}
.notice-choice {
  min-height: 132px;
  display: grid;
  align-content: center;
  gap: 8px;
  padding: 18px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #ffffff;
  color: var(--ink);
  text-decoration: none;
  box-shadow: 0 10px 24px rgba(20, 39, 42, 0.07);
}
.notice-choice strong {
  font-size: 22px;
  line-height: 1.15;
}
.notice-choice span {
  color: var(--muted);
  font-weight: 700;
  line-height: 1.3;
}
.notice-choice-absence { border-left: 5px solid #c76428; }
.notice-choice-late { border-left: 5px solid var(--brand); }
.notice-choice-message { border-left: 5px solid #314d54; }
.family-payment-hero {
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(0, .85fr);
  gap: 12px;
  margin-bottom: 16px;
}
.family-next-payment,
.family-payment-summary,
.family-payment-section {
  min-width: 0;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #ffffff;
  box-shadow: 0 10px 24px rgba(20, 39, 42, 0.07);
}
.family-next-payment {
  min-height: 154px;
  display: grid;
  align-content: space-between;
  gap: 8px;
  padding: 18px;
  color: #ffffff;
  text-decoration: none;
  background: #176b73;
}
.family-next-payment.paid {
  background: #2f6d4e;
}
.family-next-payment span {
  font-size: 12px;
  font-weight: 900;
  text-transform: uppercase;
  opacity: .86;
}
.family-next-payment strong {
  font-size: 30px;
  line-height: 1.05;
}
.family-next-payment small,
.family-next-payment em {
  color: rgba(255,255,255,.88);
  font-style: normal;
  font-weight: 800;
  line-height: 1.3;
}
.family-payment-summary {
  display: grid;
  gap: 8px;
  padding: 12px;
}
.family-payment-summary article {
  min-width: 0;
  display: flex;
  justify-content: space-between;
  gap: 10px;
  align-items: center;
  padding: 10px;
  border-radius: 7px;
  background: #f7faf9;
}
.family-payment-summary span {
  color: var(--muted);
  font-size: 13px;
  font-weight: 900;
}
.family-payment-summary strong {
  font-size: 18px;
  line-height: 1.1;
}
.family-payment-section {
  padding: 16px;
  margin-bottom: 16px;
}
.family-student-payment-section {
  display: grid;
  gap: 12px;
}
.family-student-payment-head {
  min-width: 0;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 12px;
  align-items: center;
}
.family-student-payment-head h2 {
  margin: 0 0 4px;
  font-size: 22px;
  line-height: 1.12;
}
.family-student-payment-head span {
  color: var(--muted);
  font-weight: 850;
  overflow-wrap: anywhere;
}
.family-student-payment-head dl {
  display: grid;
  grid-template-columns: repeat(2, minmax(84px, 1fr));
  gap: 8px;
  margin: 0;
}
.family-student-payment-head dl div {
  padding: 10px;
  border-radius: 8px;
  background: #f7faf9;
}
.family-student-payment-head dt {
  color: var(--muted);
  font-size: 11px;
  font-weight: 950;
  text-transform: uppercase;
}
.family-student-payment-head dd {
  margin: 2px 0 0;
  font-size: 18px;
  font-weight: 950;
}
.family-payment-list {
  display: grid;
  gap: 10px;
}
.family-payment-card {
  min-width: 0;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 7px 12px;
  padding: 13px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fbfdfd;
  color: var(--ink);
  text-decoration: none;
}
.family-payment-card strong,
.family-payment-card small {
  min-width: 0;
  overflow-wrap: anywhere;
}
.family-payment-card strong {
  font-size: 16px;
  line-height: 1.2;
}
.family-payment-card small,
.family-payment-date {
  color: var(--muted);
  font-size: 13px;
  font-weight: 800;
}
.family-payment-discount {
  color: #27636b;
  font-size: 12px;
  font-weight: 850;
  overflow-wrap: anywhere;
}
.family-payment-card mark {
  justify-self: end;
  grid-column: 2;
  grid-row: 1;
  padding: 5px 7px;
  border-radius: 999px;
  background: #e8f3f1;
  color: #175c63;
  font-size: 11px;
  font-weight: 900;
  text-transform: uppercase;
}
.family-payment-money {
  grid-column: 1 / -1;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
  margin-top: 3px;
}
.family-payment-money div {
  min-width: 0;
  padding: 9px;
  border-radius: 7px;
  background: #f7faf9;
}
.family-payment-money span {
  display: block;
  color: var(--muted);
  font-size: 11px;
  font-weight: 950;
  text-transform: uppercase;
}
.family-payment-money strong {
  display: block;
  margin-top: 2px;
  font-size: 17px;
  line-height: 1.1;
}
.payment-amount-breakdown {
  min-width: 0;
  display: grid;
  gap: 2px;
  line-height: 1.2;
}
.payment-amount-breakdown strong {
  font-size: 1em;
  font-weight: 900;
}
.payment-amount-breakdown small,
.payment-amount-breakdown em {
  display: block;
  color: var(--muted);
  font-size: 12px;
  font-style: normal;
  font-weight: 800;
}
.family-payment-pending {
  border-left: 5px solid #c76428;
}
.family-payment-paid {
  border-left: 5px solid #2f6d4e;
}
.family-payment-paid mark {
  background: #e4f4ec;
  color: #1f6849;
}
.family-payment-receipt {
  grid-column: 1 / -1;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  justify-content: flex-start;
  padding-top: 4px;
}
.teacher-secondary-section {
  box-shadow: none;
}
.student-search-results {
  grid-column: 1 / -1;
  display: none;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #ffffff;
  max-height: 260px;
  overflow-y: auto;
}
.student-search-results.has-results {
  display: grid;
}
.student-search-results button {
  display: grid;
  gap: 3px;
  width: 100%;
  text-align: left;
  border: 0;
  border-bottom: 1px solid var(--line);
  border-radius: 0;
  background: #ffffff;
  color: var(--ink);
  padding: 14px;
  min-height: 58px;
}
.student-search-results button:last-child {
  border-bottom: 0;
}
.student-search-results button strong {
  font-size: 15px;
}
.student-search-results button span {
  color: var(--muted);
  font-size: 13px;
}
.student-search-results button:hover,
.student-search-results button:focus {
  background: var(--soft);
}
.family-search-results {
  max-height: 220px;
  gap: 0;
}
.family-search-results button {
  gap: 6px;
  line-height: 1.3;
}
.family-search-results button strong {
  font-size: 16px;
}
.family-search-results button span {
  font-size: 14px;
}
.student-create-steps {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
  margin-bottom: 14px;
}
.student-create-steps span {
  min-height: 36px;
  display: grid;
  place-items: center;
  padding: 6px 8px;
  border: 1px solid #bfd6d2;
  border-radius: 999px;
  background: #edf8f6;
  color: var(--brand);
  font-size: 13px;
  font-weight: 900;
  text-align: center;
}
.duplicate-warning {
  grid-column: 1 / -1;
  border: 1px solid #f3b05c;
  border-radius: 8px;
  background: #fff8ed;
  padding: 12px;
  display: grid;
  gap: 8px;
}
.duplicate-warning[hidden] {
  display: none;
}
.duplicate-warning > strong {
  color: #78501e;
}
.duplicate-warning div {
  display: grid;
  gap: 6px;
  max-height: 150px;
  overflow-y: auto;
}
.duplicate-warning a {
  display: grid;
  gap: 2px;
  text-decoration: none;
  border: 1px solid #f0d5ac;
  border-radius: 6px;
  background: #ffffff;
  padding: 8px;
}
.duplicate-warning a strong {
  color: var(--ink);
}
.duplicate-warning a span {
  color: var(--muted);
  font-size: 13px;
}
.priority-list {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
}
.priority-list a {
  display: grid;
  gap: 4px;
  text-decoration: none;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 12px;
  background: #fbfdfd;
}
.priority-list strong { color: var(--ink); }
.priority-list span { color: var(--muted); line-height: 1.4; }
.priority-list a:hover { border-color: #9fc5c0; }
.dashboard-summary .panel { margin-bottom: 0; }
.compact-form-panel p {
  margin-top: 0;
}
.next-steps-panel {
  border-left: 6px solid #f3b05c;
  background: #fffdf8;
}
.feature-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
  margin-bottom: 18px;
}
.feature-card {
  min-height: 118px;
  display: grid;
  align-content: start;
  gap: 8px;
  text-decoration: none;
  background: var(--panel);
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 14px;
  box-shadow: 0 8px 18px rgba(20, 39, 42, 0.05);
}
.feature-card span {
  width: max-content;
  max-width: 100%;
  color: #24595f;
  background: #e8f3f1;
  border-radius: 999px;
  padding: 4px 8px;
  font-size: 11px;
  font-weight: 900;
  text-transform: uppercase;
}
.feature-card.pendiente span {
  color: #78501e;
  background: #fff0d8;
}
.feature-card strong {
  color: var(--ink);
  font-size: 18px;
}
.feature-card p {
  color: var(--muted);
  margin: 0;
  line-height: 1.4;
  font-size: 14px;
}
.feature-card:hover { border-color: #9fc5c0; }
.teacher-calendar-toolbar .form-actions {
  align-items: end;
  gap: 8px;
}
.teacher-calendar-toolbar .form-actions .table-action,
.teacher-calendar-toolbar .form-actions button {
  min-height: 42px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin: 0;
}
.teacher-calendar-panel {
  padding: 0;
  overflow: hidden;
}
.teacher-calendar-grid {
  display: grid;
  grid-template-columns: repeat(7, minmax(0, 1fr));
}
.teacher-calendar-weekdays {
  border-bottom: 1px solid var(--line);
  background: #fbfdfd;
}
.teacher-calendar-weekdays div {
  padding: 10px;
  color: var(--muted);
  font-size: 12px;
  font-weight: 900;
  text-align: center;
  text-transform: uppercase;
}
.teacher-calendar-day {
  min-height: 132px;
  border-right: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
  background: #ffffff;
  padding: 8px;
  display: grid;
  grid-template-rows: auto 1fr;
  gap: 6px;
}
.teacher-calendar-day:nth-child(7n) {
  border-right: 0;
}
.teacher-calendar-day.is-outside {
  background: #f7faf9;
}
.teacher-calendar-day.is-outside .teacher-calendar-date {
  color: #9aa9ab;
}
.teacher-calendar-day.is-today .teacher-calendar-date span {
  background: var(--brand);
  color: #ffffff;
}
.teacher-calendar-date {
  display: flex;
  justify-content: flex-end;
  color: var(--ink);
  font-weight: 900;
}
.teacher-calendar-date span {
  min-width: 28px;
  min-height: 28px;
  border-radius: 999px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
.teacher-calendar-events {
  display: grid;
  align-content: start;
  gap: 4px;
  min-width: 0;
}
.teacher-calendar-event {
  min-width: 0;
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 5px;
  align-items: center;
  border-radius: 5px;
  padding: 4px 6px;
  font-size: 12px;
  font-weight: 800;
  text-decoration: none;
  background: #e8f3f1;
  color: #1f555b;
}
.teacher-calendar-event strong {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.teacher-calendar-event span {
  color: inherit;
  font-weight: 900;
}
.teacher-calendar-event small {
  grid-column: 1 / -1;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: inherit;
  opacity: .82;
  font-size: 10px;
  font-weight: 800;
}
.teacher-calendar-event.event-vacation {
  background: #fff0d8;
  color: #78501e;
}
.teacher-calendar-event.event-vacation-pending {
  background: #edf1f4;
  color: #5c6670;
  border: 1px dashed #aab6bd;
}
.teacher-calendar-event.event-holiday {
  background: #fce6e2;
  color: #8f3f37;
}
.teacher-calendar-event.event-work {
  background: #edf1f4;
  color: #45565c;
}
.teacher-calendar-event.event-activity {
  background: #e7f0fb;
  color: #25527a;
}
.teacher-calendar-event.event-activity-provisional,
.teacher-calendar-event.is-provisional {
  background: #fff4d6;
  color: #785d16;
  border: 1px dashed #c9a33b;
}
.teacher-calendar-event.event-inactive {
  background: #e8edf8;
  color: #34466f;
  border: 1px solid #8294bd;
}
.teacher-calendar-event.event-planning-conflict {
  background: #fff0e7;
  color: #88401f;
  border: 1px solid #b56335;
}
.teacher-calendar-event.is-cancelled {
  grid-template-columns: auto minmax(0, 1fr) auto;
  background: #fce6e2;
  color: #8f3f37;
}
.teacher-calendar-event em {
  min-width: 0;
  padding: 1px 5px;
  border-radius: 999px;
  background: rgba(143, 63, 55, 0.12);
  font-size: 9px;
  font-style: normal;
  font-weight: 950;
  text-transform: uppercase;
}
.teacher-calendar-event:hover {
  filter: brightness(.97);
}
.teacher-calendar-more {
  color: var(--muted);
  font-size: 12px;
  font-weight: 900;
  padding: 2px 6px;
}
.teacher-calendar-metrics {
  margin-top: 14px;
}
.teacher-assigned-activity-list {
  display: grid;
  gap: 8px;
}
.teacher-assigned-activity {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 12px;
  align-items: center;
  border: 1px solid var(--line);
  border-left: 4px solid #3979ad;
  border-radius: 7px;
  padding: 11px 12px;
  background: #f8fbff;
}
.teacher-assigned-activity div { display: grid; gap: 3px; min-width: 0; }
.teacher-assigned-activity span,
.teacher-assigned-activity small { color: var(--muted); }
.teacher-assigned-activity em {
  font-style: normal;
  font-weight: 900;
  font-size: 11px;
  text-transform: uppercase;
}
.teacher-assigned-activity.is-provisional { border-left-color: #c9a33b; background: #fffaf0; }
.teacher-assigned-activity.is-cancelled { border-left-color: #b9574f; background: #fff6f4; opacity: .78; }
@media (max-width: 700px) {
  .teacher-assigned-activity { grid-template-columns: 1fr; gap: 7px; }
}
.teacher-upcoming-panel {
  margin-top: 14px;
}
.teacher-upcoming-list {
  display: grid;
  gap: 10px;
}
.teacher-upcoming-card {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 12px;
  align-items: center;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
  padding: 12px;
}
.teacher-upcoming-card strong,
.teacher-upcoming-card span,
.teacher-upcoming-card small {
  display: block;
}
.teacher-upcoming-card strong {
  color: #173f45;
  font-size: 15px;
}
.teacher-upcoming-card span {
  color: var(--text);
  font-weight: 900;
  overflow-wrap: anywhere;
}
.teacher-upcoming-card small {
  color: var(--muted);
  font-weight: 800;
}
.teacher-upcoming-actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 8px;
  flex-wrap: wrap;
}
.teacher-session-status-badge {
  border-radius: 999px;
  padding: 6px 9px;
  font-size: 12px;
  font-weight: 900;
}
.teacher-session-status-badge.status-programada {
  background: #e7f7ef;
  color: #14613d;
}
.teacher-session-status-badge.status-realizada {
  background: #fff4cc;
  color: #6a4a00;
}
.teacher-session-status-badge.status-cancelada {
  background: #ffe2df;
  color: #8a2418;
}
.teacher-upcoming-all {
  margin-top: 12px;
}
.metrics {
  display: grid;
  grid-template-columns: repeat(5, minmax(140px, 1fr));
  gap: 14px;
  margin-bottom: 18px;
}
.metric, .panel {
  min-width: 0;
  max-width: 100%;
  background: var(--panel);
  border: 1px solid var(--line);
  border-radius: 8px;
  box-shadow: 0 10px 24px rgba(20, 39, 42, 0.06);
}
.metric { padding: 16px; }
.metric span { display: block; color: var(--muted); font-weight: 800; font-size: 13px; }
.metric strong { display: block; margin-top: 8px; font-size: 24px; }
.metric em { display: block; margin-top: 6px; color: var(--muted); font-size: 12px; font-style: normal; font-weight: 750; line-height: 1.3; }
.metric-link {
  display: block;
  color: inherit;
  text-decoration: none;
}
.metric-link:hover {
  border-color: var(--brand);
  box-shadow: 0 12px 26px rgba(20, 39, 42, 0.1);
}
.metric-unavailable strong {
  font-size: 20px;
}
.grid { display: grid; gap: 16px; }
.grid.two { grid-template-columns: repeat(2, minmax(0, 1fr)); align-items: start; }
.panel { padding: 18px; margin-bottom: 16px; }
.compact-intro-panel {
  padding: 14px 16px;
}
.compact-intro-panel p {
  margin: 0;
}
.panel h2 { margin: 0 0 12px; font-size: 20px; }
.panel p { color: var(--muted); line-height: 1.5; }
.panel-head { display: flex; justify-content: space-between; gap: 12px; align-items: center; margin-bottom: 12px; }
.panel-head h2 { margin: 0; }
.panel-head span { color: var(--muted); font-weight: 700; }
.course-panel-hero {
  min-width: 0;
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(220px, 320px);
  gap: 16px;
  align-items: end;
  padding: 18px;
  margin-bottom: 16px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #ffffff;
  box-shadow: 0 10px 24px rgba(20, 39, 42, 0.06);
}
.course-panel-hero h2 {
  margin: 0;
  font-size: 26px;
}
.course-panel-hero p {
  max-width: 760px;
  margin: 8px 0 0;
  color: var(--muted);
  line-height: 1.45;
}
.course-year-kicker {
  display: block;
  margin-bottom: 5px;
  color: var(--muted);
  font-size: 12px;
  font-weight: 900;
  text-transform: uppercase;
}
.course-year-form {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 8px;
  align-items: end;
}
.course-area-panel .metrics {
  margin-bottom: 0;
}
.course-area-metrics {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}
.course-students-panel .course-area-metrics,
.course-groups-metrics-panel .course-area-metrics {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}
.course-attention-list {
  display: grid;
  gap: 8px;
  margin: 0;
  padding: 0;
  list-style: none;
}
.course-attention-item {
  min-width: 0;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 10px;
  align-items: center;
  padding: 10px 12px;
  border: 1px solid var(--line);
  border-left-width: 4px;
  border-radius: 8px;
  background: #fbfdfd;
}
.course-attention-item div {
  min-width: 0;
  display: grid;
  gap: 3px;
}
.course-attention-item span {
  color: var(--muted);
  font-size: 12px;
  text-transform: uppercase;
}
.course-attention-item strong,
.course-attention-item small {
  min-width: 0;
  overflow-wrap: anywhere;
}
.course-attention-critical { border-left-color: #b42318; }
.course-attention-attention { border-left-color: #b7791f; }
.course-attention-info { border-left-color: #286f7d; }
.course-attention-empty {
  margin: 0;
}
.course-secondary-detail {
  margin: 10px 0 0;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fbfdfd;
  padding: 10px 12px;
}
.course-secondary-detail summary {
  cursor: pointer;
  font-weight: 900;
  color: #304346;
}
.treasury-account-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
  gap: 12px;
}
.treasury-operational-center {
  display: grid;
  gap: 16px;
}
.treasury-operational-block {
  display: grid;
  gap: 10px;
}
.treasury-operational-block h3 {
  margin: 0;
  color: #173f45;
  font-size: 16px;
}
.treasury-operational-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 10px;
}
.treasury-operational-card {
  min-width: 0;
  display: grid;
  gap: 7px;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fbfdfd;
  color: inherit;
  text-decoration: none;
}
.treasury-operational-card span,
.treasury-operational-card strong,
.treasury-operational-card small,
.treasury-operational-card em {
  min-width: 0;
  overflow-wrap: anywhere;
}
.treasury-operational-card span {
  color: var(--muted);
  font-weight: 850;
  font-size: 13px;
}
.treasury-operational-card strong {
  color: #173f45;
  font-size: 24px;
}
.treasury-operational-card small {
  color: var(--muted);
  line-height: 1.35;
}
.treasury-operational-card em {
  color: var(--accent);
  font-style: normal;
  font-weight: 850;
}
.treasury-operational-status strong {
  font-size: 18px;
}
.treasury-operational-empty {
  background: #f7fbfa;
}
.treasury-account-card {
  min-width: 0;
  display: grid;
  gap: 12px;
  padding: 14px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fbfdfd;
}
.treasury-account-card > span,
.treasury-account-card small,
.treasury-account-card dd,
.treasury-account-card strong {
  min-width: 0;
  overflow-wrap: anywhere;
}
.treasury-account-card > span {
  color: var(--muted);
  font-weight: 850;
  font-size: 13px;
}
.treasury-account-card strong {
  color: #173f45;
  font-size: 18px;
}
.treasury-account-card dl {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
  margin: 0;
}
.treasury-account-card dl div {
  min-width: 0;
  padding: 9px;
  border: 1px solid #d8e4e1;
  border-radius: 8px;
  background: #ffffff;
}
.treasury-account-card dt {
  color: var(--muted);
  font-weight: 850;
  font-size: 12px;
}
.treasury-account-card dd {
  margin: 4px 0 0;
  color: var(--ink);
  font-weight: 850;
}
.course-attention-panel ul,
.course-enrollment-distribution {
  display: grid;
  gap: 8px;
  padding: 0;
  margin: 0;
  list-style: none;
}
.course-attention-panel li,
.course-enrollment-distribution li {
  min-width: 0;
  display: flex;
  justify-content: space-between;
  gap: 10px;
  padding: 10px 12px;
  border: 1px solid #d8e4e1;
  border-radius: 8px;
  background: #f7fbfa;
  font-weight: 850;
}
.course-groups-panel > .table-panel {
  margin-bottom: 0;
  padding: 0;
  border: 0;
  box-shadow: none;
}
.course-group-cards {
  display: none;
  gap: 10px;
}
.course-group-card {
  min-width: 0;
  display: grid;
  gap: 12px;
  padding: 14px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fbfdfd;
}
.course-group-card strong,
.course-group-card small,
.course-group-card span,
.course-group-card dd {
  min-width: 0;
  overflow-wrap: anywhere;
}
.course-group-card strong {
  display: block;
  margin-top: 3px;
  color: #173f45;
  font-size: 17px;
}
.course-group-card small,
.course-group-card span {
  color: var(--muted);
  font-weight: 800;
}
.course-group-card dl,
.course-enrollment-summary {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
  margin: 0;
}
.course-group-card dl div,
.course-enrollment-summary > div {
  min-width: 0;
  display: grid;
  gap: 3px;
  padding: 10px;
  border-radius: 8px;
  background: #f0f6f4;
}
.course-group-card dt {
  color: var(--muted);
  font-size: 12px;
  font-weight: 900;
}
.course-group-card dd {
  margin: 0;
  font-weight: 900;
}
.course-enrollment-summary {
  grid-template-columns: repeat(4, minmax(0, 1fr));
  margin-bottom: 14px;
}
.course-enrollment-summary strong {
  font-size: 22px;
}
.course-enrollment-summary span {
  color: var(--muted);
  font-weight: 800;
}
.course-enrollment-panel h3 {
  margin: 8px 0 10px;
  font-size: 16px;
}
.course-limitation {
  margin: 12px 0 0;
  padding: 10px 12px;
  border: 1px solid #e1c2ad;
  border-radius: 8px;
  background: #fff8eb;
  color: #70420a;
  font-weight: 800;
}
.created-confirmation .table-actions {
  margin-top: 16px;
}
.employee-requests-hero .metrics {
  margin-bottom: 10px;
}
.employee-requests-layout {
  margin-bottom: 16px;
}
.employee-requests-layout > .panel {
  margin-bottom: 0;
}
.employee-request-card-list {
  display: grid;
  gap: 10px;
}
.employee-request-admin-list {
  display: grid;
  gap: 10px;
}
.metrics.employee-request-admin-summary {
  grid-template-columns: repeat(5, minmax(100px, 1fr));
  gap: 10px;
}
.employee-request-admin-summary .metric {
  padding: 12px 14px;
}
.employee-request-admin-summary .metric strong {
  margin-top: 4px;
  font-size: 20px;
}
.employee-request-card {
  min-width: 0;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 12px;
  align-items: center;
  padding: 14px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fbfdfd;
}
.employee-request-card-main {
  min-width: 0;
  display: grid;
  gap: 5px;
}
.employee-request-card-main strong {
  color: #173f45;
  font-size: 18px;
}
.employee-request-card-main small {
  color: var(--muted);
  font-weight: 700;
  overflow-wrap: anywhere;
}
.employee-request-status-help {
  color: #315155;
}
.employee-request-status-note {
  margin: 0 0 12px;
  padding: 10px 12px;
  border: 1px solid #bfd6d2;
  border-radius: 8px;
  background: #f4faf8;
  color: #315155;
  font-weight: 800;
}
.employee-request-status {
  width: fit-content;
  display: inline-flex;
  align-items: center;
  min-height: 24px;
  padding: 0 9px;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 950;
  text-transform: uppercase;
}
.employee-request-status-pending {
  color: #7a4a0d;
  background: #fff1cc;
}
.panel-head .employee-request-status-pending {
  color: #7a4a0d;
}
.employee-request-status-approved {
  color: #176b3f;
  background: #dff5e7;
}
.panel-head .employee-request-status-approved {
  color: #176b3f;
}
.employee-request-status-rejected {
  color: #8c2631;
  background: #ffe1e5;
}
.panel-head .employee-request-status-rejected {
  color: #8c2631;
}
.employee-request-status-cancelled {
  color: #53606a;
  background: #e8edf0;
}
.panel-head .employee-request-status-cancelled {
  color: #53606a;
}
.employee-request-card-actions {
  display: flex;
  justify-content: flex-end;
}
.form-help {
  margin: 0 0 12px;
  color: var(--muted);
  font-weight: 700;
}
.calendar-review-list {
  min-width: 0;
  display: grid;
  gap: 10px;
}
.calendar-review-row,
.calendar-review-info-row {
  min-width: 0;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 10px;
  align-items: center;
  padding: 12px;
  border: 1px solid #bfd6d2;
  border-radius: 8px;
  background: #f4faf8;
}
.calendar-review-info-row {
  grid-template-columns: minmax(0, 1fr) auto;
  border-color: #e1c2ad;
  background: #fff7e8;
}
.calendar-review-row input {
  width: 22px;
  height: 22px;
}
.calendar-review-actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 8px;
}
.calendar-review-actions label {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  min-width: 0;
  padding: 7px 9px;
  border: 1px solid #bfd6d2;
  border-radius: 8px;
  background: #ffffff;
  color: #173f45;
  font-size: 12px;
  font-weight: 900;
}
.calendar-review-row span,
.calendar-review-info-row strong,
.calendar-review-info-row small {
  min-width: 0;
  overflow-wrap: anywhere;
}
.calendar-review-row strong,
.calendar-review-row small,
.calendar-review-info-row strong,
.calendar-review-info-row small {
  display: block;
}
.calendar-review-row small,
.calendar-review-info-row small {
  margin-top: 3px;
  color: var(--muted);
  font-weight: 800;
}
.calendar-review-row em,
.calendar-review-info-row em {
  color: #176b73;
  font-size: 12px;
  font-style: normal;
  font-weight: 900;
}
@media (max-width: 640px) {
  .employee-report-technical-path { grid-template-columns: minmax(0, 1fr); align-items: stretch; }
  .employee-report-copy-path { width: 100%; justify-content: center; }
  .employee-report-copy-status { grid-column: 1; }
  .calendar-review-row,
  .calendar-review-info-row {
    grid-template-columns: minmax(0, 1fr);
  }
  .calendar-review-actions {
    justify-content: stretch;
  }
  .calendar-review-actions label {
    flex: 1 1 120px;
    justify-content: center;
  }
  .employee-clock-review-grid {
    grid-template-columns: 1fr;
  }
  .employee-clock-month-kpis,
  .employee-clock-month-grid,
  .employee-clock-month-card dl {
    grid-template-columns: 1fr;
  }
  .clock-employee-review-grid {
    grid-template-columns: 1fr;
  }
  .clock-employee-home {
    grid-template-columns: 1fr;
  }
  .clock-personal-review-layout {
    grid-template-columns: 1fr;
  }
  .clock-close-checklist {
    grid-template-columns: 1fr;
  }
  .clock-personal-review-layout > .clock-personal-review-panel:last-child {
    grid-column: auto;
  }
  .clock-employee-home-hero {
    padding: 14px;
  }
  .clock-employee-home-hero strong {
    font-size: 23px;
  }
  .clock-support-grid {
    grid-template-columns: 1fr;
  }
  .clock-footer-row {
    align-items: stretch;
    flex-direction: column;
  }
  .clock-footer-row .table-action {
    width: 100%;
    justify-content: center;
  }
  .clock-employee-day-hero {
    grid-template-columns: 1fr;
    padding: 15px;
  }
  .clock-employee-day-hero .table-actions,
  .clock-employee-day-hero .table-action,
  .clock-day-card-actions .table-action {
    width: 100%;
    justify-content: center;
  }
  .clock-focus-hero {
    padding: 15px;
  }
  .clock-focus-hero strong {
    font-size: 28px;
  }
  .employee-overtime-overview,
  .employee-clock-preclose-grid,
  .employee-overtime-card dl {
    grid-template-columns: 1fr;
  }
  .employee-clock-review-card small {
    min-height: 0;
  }
  .employee-clock-review-tray,
  .employee-clock-preclose-panel,
  .employee-clock-tab-intro {
    padding: 11px;
  }
  .employee-clock-review-card,
  .employee-clock-preclose-card,
  .employee-overtime-card,
  .employee-overtime-metric {
    padding: 10px;
  }
  .employee-clock-review-card strong,
  .employee-clock-preclose-card strong {
    font-size: 22px;
  }
  .employee-clock-tabs .student-tab-content {
    overflow: hidden;
  }
  .employee-clock-incident-actions {
    display: grid;
    grid-template-columns: 1fr;
  }
  .employee-clock-incident-actions .table-action {
    width: 100%;
    justify-content: center;
  }
}
.clock-workspace {
  max-width: 720px;
  display: grid;
  gap: 12px;
}
.clock-card {
  overflow: hidden;
}
.clock-actions {
  display: grid;
  gap: 12px;
}
.clock-actions-simple {
  gap: 10px;
}
.clock-focus-hero {
  display: grid;
  gap: 6px;
  margin-bottom: 14px;
  border: 1px solid #d7e4e2;
  border-left: 6px solid var(--brand);
  border-radius: 8px;
  padding: 18px;
  background: #f7fbfa;
  color: #173f45;
}
.clock-focus-hero span {
  color: var(--muted);
  font-size: 12px;
  font-weight: 900;
  text-transform: uppercase;
}
.clock-focus-hero strong {
  font-size: 34px;
  line-height: 1.05;
}
.clock-focus-hero small {
  color: #45565c;
  font-weight: 900;
  line-height: 1.35;
}
.clock-focus-hero.tone-open {
  border-color: #9bc8bd;
  border-left-color: #176b73;
  background: #eefaf6;
}
.clock-focus-hero.tone-closed {
  border-color: #cfe5d8;
  border-left-color: #2f7d52;
  background: #f3fbf5;
}
.clock-focus-hero.tone-review {
  border-color: #ffd37d;
  border-left-color: #b46f00;
  background: #fff7df;
}
.clock-primary-action {
  margin-bottom: 14px;
}
.clock-unplanned-warning {
  display: grid;
  gap: 10px;
  border: 1px solid #e4bc68;
  border-left: 6px solid #9a6200;
  border-radius: 8px;
  padding: 16px;
  background: #fff8e6;
  color: #533600;
}
.clock-unplanned-warning > span {
  color: #79530c;
  font-size: 12px;
  font-weight: 900;
  text-transform: uppercase;
}
.clock-unplanned-warning > strong { font-size: 18px; line-height: 1.3; }
.clock-unplanned-warning p { margin: 0; color: #654b1d; }
.clock-unplanned-warning textarea { width: 100%; box-sizing: border-box; }
.clock-support-compact { display:grid; gap:10px; margin-bottom:14px; min-width:0; }
.clock-month-heading { display:grid; grid-template-columns:auto minmax(0, 1fr); align-items:center; gap:8px; }
.clock-month-heading h2 { font-size:18px; }
.clock-month-heading form { margin:0 0 0 auto; width:100%; max-width:200px; min-width:0; }
.clock-month-heading input { width:100%; min-width:0; min-height:42px; box-sizing:border-box; font-size:14px; padding:6px; }
.clock-calendar-return { display:inline-block; margin-top:12px; font-size:14px; }
.clock-expected-compact { display:grid; gap:4px; min-width:0; overflow-wrap:anywhere; }
.clock-expected-compact small { color:var(--muted); font-size:12px; }
.clock-location-link { display:block; padding:6px 0; font-size:12px; font-weight:400; color:var(--muted); text-decoration:underline; }
.clock-support-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
  margin-bottom: 14px;
}
.clock-support-grid .clock-expected-work,
.clock-support-grid .clock-gps-status {
  height: 100%;
  margin: 0;
}
.clock-footer-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  border-top: 1px solid #e6eeee;
  padding-top: 12px;
}
.clock-footer-row span {
  min-width: 0;
  color: var(--muted);
  font-weight: 800;
  overflow-wrap: anywhere;
}
.clock-now-state {
  margin: 0 0 14px;
  border: 1px solid #d7e4e2;
  border-radius: 8px;
  padding: 14px;
  background: #ffffff;
  color: #173f45;
}
.clock-now-state span {
  display: block;
  margin-bottom: 4px;
  color: var(--muted);
  font-size: 13px;
  font-weight: 900;
  text-transform: uppercase;
}
.clock-now-state strong {
  display: block;
  font-size: 24px;
  line-height: 1.1;
}
.clock-open-shift {
  margin: 0 0 14px;
  border: 1px solid #ffd37d;
  border-radius: 8px;
  padding: 12px;
  background: #fff7df;
  color: #654400;
}
.clock-open-shift span,
.clock-open-shift small {
  display: block;
  font-weight: 800;
}
.clock-open-shift strong {
  display: block;
  margin: 4px 0;
  font-size: 18px;
}
.clock-expected-work {
  display: grid;
  gap: 4px;
  margin: 0 0 14px;
  border: 1px solid #bfd6d2;
  border-radius: 8px;
  padding: 12px;
  background: #f4faf8;
  color: #173f45;
}
.clock-expected-work span,
.clock-expected-work small,
.clock-expected-work em {
  display: block;
  font-weight: 800;
}
.clock-expected-work strong {
  font-size: 18px;
}
.clock-expected-work small {
  color: #45565c;
}
.clock-expected-work em {
  color: #176b73;
  font-style: normal;
}
.clock-gps-status {
  display: grid;
  gap: 4px;
  margin: 0 0 14px;
  border: 1px solid #d7e4e2;
  border-radius: 8px;
  padding: 12px;
  background: #ffffff;
  color: #173f45;
}
.clock-gps-status span,
.clock-gps-status small {
  display: block;
  font-weight: 800;
}
.clock-gps-status span {
  color: var(--muted);
  font-size: 12px;
  text-transform: uppercase;
}
.clock-gps-status strong {
  font-size: 17px;
  line-height: 1.2;
}
.clock-gps-status small {
  color: #45565c;
}
.clock-gps-status.is-searching {
  border-color: #bfd6d2;
  background: #f4faf8;
}
.clock-gps-status.is-ready {
  border-color: #9bc8bd;
  background: #eefaf6;
}
.clock-gps-status.is-ready strong {
  color: #176b73;
}
.clock-gps-status.is-error {
  border-color: #ffd37d;
  background: #fff7df;
}
.clock-gps-status.is-error strong {
  color: #654400;
}
.clock-created-card {
  max-width: 680px;
  overflow: hidden;
}
.clock-created-hero {
  display: grid;
  gap: 4px;
  margin-bottom: 14px;
  border: 1px solid #9bc8bd;
  border-radius: 8px;
  padding: 16px;
  background: #eefaf6;
  color: #173f45;
  text-align: center;
}
.clock-created-card.status-review .clock-created-hero {
  border-color: #ffd37d;
  background: #fff7df;
}
.clock-created-hero span {
  color: #176b73;
  font-size: 13px;
  font-weight: 900;
  text-transform: uppercase;
}
.clock-created-card.status-review .clock-created-hero span {
  color: #654400;
}
.clock-created-hero strong {
  font-size: 42px;
  line-height: 1;
}
.clock-created-hero small {
  color: #45565c;
  font-weight: 900;
}
.clock-created-details {
  display: grid;
  gap: 10px;
  margin: 0 0 14px;
}
.clock-created-details div {
  display: grid;
  gap: 4px;
  border: 1px solid #d7e4e2;
  border-radius: 8px;
  padding: 10px;
  background: #ffffff;
}
.clock-created-details dt {
  color: var(--muted);
  font-size: 12px;
  font-weight: 900;
  text-transform: uppercase;
}
.clock-created-details dd {
  margin: 0;
  color: #173f45;
  font-weight: 900;
  overflow-wrap: anywhere;
}
.clock-created-actions {
  display: grid;
  gap: 8px;
  margin-bottom: 14px;
}
.clock-created-actions .table-action {
  min-height: 48px;
}
.clock-created-secondary-links {
  display: flex;
  justify-content: center;
  gap: 16px;
  margin-top: 10px;
}
.clock-created-secondary-links a {
  color: var(--muted);
  font-size: 13px;
  font-weight: 850;
  text-decoration: none;
}
.clock-created-secondary-links a:hover {
  color: var(--brand);
  text-decoration: underline;
}
.teacher-flow-primary {
  min-height: 58px;
  border-color: var(--brand) !important;
  background: var(--brand) !important;
  color: #ffffff !important;
  font-size: 17px;
  font-weight: 950;
  box-shadow: 0 10px 20px rgba(23, 107, 115, 0.18);
}
.clock-employee-day-hero {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 14px;
  align-items: center;
  margin-bottom: 14px;
  padding: 18px;
  border: 1px solid #d7e4e2;
  border-left: 6px solid var(--brand);
  border-radius: 8px;
  background: #ffffff;
  box-shadow: 0 10px 24px rgba(20, 39, 42, 0.06);
}
.clock-employee-day-hero span {
  color: var(--muted);
  font-size: 12px;
  font-weight: 900;
  text-transform: uppercase;
}
.clock-employee-day-hero h2 {
  margin: 4px 0;
  color: #173f45;
  font-size: 30px;
  line-height: 1.05;
}
.clock-employee-day-hero p {
  margin: 0;
  color: #45565c;
  font-weight: 900;
}
.clock-employee-day-notices ul {
  margin: 0;
  padding-left: 18px;
  color: #45565c;
  font-weight: 800;
}
.clock-employee-day-list {
  display: grid;
  gap: 10px;
}
.clock-employee-day-card {
  display: grid;
  gap: 5px;
  border: 1px solid #d7e4e2;
  border-radius: 8px;
  padding: 12px;
  background: #f7fbfa;
}
.clock-employee-day-card span {
  color: var(--muted);
  font-size: 12px;
  font-weight: 900;
  text-transform: uppercase;
}
.clock-employee-day-card strong {
  color: #173f45;
  font-size: 22px;
  line-height: 1.1;
}
.clock-employee-day-card small,
.clock-employee-day-card p {
  margin: 0;
  color: #45565c;
  font-weight: 800;
  line-height: 1.35;
}
.clock-form {
  min-width: 0;
  display: grid;
}
.clock-button {
  width: 100%;
  min-height: 76px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  font-size: 20px;
  font-weight: 900;
}
.clock-button:disabled {
  cursor: not-allowed;
  opacity: 0.45;
  filter: grayscale(0.35);
}
.clock-action-hint {
  margin: 0 0 14px;
  color: var(--muted);
  font-weight: 800;
}
.clock-exit {
  background: #8f3f37;
}
.clock-list {
  min-height: 72px;
  background: #45565c;
  font-size: 17px;
}
.message-thread {
  display: grid;
  gap: 12px;
}
.message-conversation { min-width:0; }
.message-conversation-head { padding:0 0 14px; }
.message-conversation-head h2, .message-reply h2 { font-size:18px; margin:0 0 10px; overflow-wrap:anywhere; }
.message-conversation-tools, .message-incident-status { display:flex; flex-wrap:wrap; gap:8px 12px; align-items:center; justify-content:space-between; }
.message-conversation-tools > span { color:var(--muted); font-size:14px; }
.message-conversation-tools button { min-height:40px; }
.message-incident-status { margin-top:10px; }
.message-conversation .message-item { min-width:0; overflow-wrap:anywhere; }
.message-conversation .message-item > div:first-child { flex-wrap:wrap; gap:4px 12px; }
.message-conversation .message-item > div:first-child > span { white-space:nowrap; }
.message-reply { margin-top:18px; padding-top:14px; border-top:1px solid var(--line); }
.role-profesor .workspace:has(.message-conversation) { padding-top:12px; }
.role-profesor .workspace:has(.message-conversation) .topbar { margin-bottom:12px; }
.message-item {
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 12px;
  background: #ffffff;
}
.message-item div {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  color: var(--muted);
  font-size: 13px;
  font-weight: 800;
}
.message-item p {
  margin: 10px 0 0;
  color: var(--ink);
  white-space: pre-wrap;
}
.message-related-clock-panel {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 12px;
  align-items: center;
  margin-bottom: 16px;
  padding: 14px;
  border: 1px solid #b8d6d1;
  border-radius: 8px;
  background: #f2faf8;
}
.message-related-clock-panel div:first-child {
  min-width: 0;
  display: grid;
  gap: 3px;
}
.message-related-clock-panel span {
  color: #176b73;
  font-size: 12px;
  font-weight: 900;
  text-transform: uppercase;
}
.message-related-clock-panel strong {
  color: #173f45;
  font-size: 19px;
  line-height: 1.15;
}
.message-related-clock-panel small {
  color: #45565c;
  font-weight: 800;
  overflow-wrap: anywhere;
}
.manual-body {
  white-space: pre-wrap;
  line-height: 1.65;
  color: var(--ink);
  font-size: 16px;
}
.manual-test-form {
  gap: 16px;
}
.manual-test-question {
  grid-column: 1 / -1;
  display: grid;
  gap: 9px;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 14px;
  margin: 0;
}
.manual-test-question legend {
  padding: 0 6px;
  font-weight: 900;
  color: var(--ink);
}
.manual-test-option {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  padding: 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #ffffff;
}
.manual-test-option input {
  width: auto;
  min-height: auto;
  margin-top: 4px;
}
.student-tabs {
  display: grid;
  gap: 14px;
  min-width: 0;
  max-width: 100%;
}
.student-tabs > input {
  position: absolute;
  width: 1px;
  height: 1px;
  min-height: 0;
  padding: 0;
  border: 0;
  margin: 0;
  opacity: 0;
  pointer-events: none;
  overflow: hidden;
}
.student-tab-nav {
  display: flex;
  gap: 8px;
  overflow-x: auto;
  padding: 2px 0 6px;
  scrollbar-width: thin;
}
.student-tab-nav label {
  flex: 0 0 auto;
  min-height: 42px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0 14px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #ffffff;
  color: var(--muted);
  font-weight: 900;
  cursor: pointer;
}
.teacher-requests-shell { min-width: 0; }
.teacher-inventory-shell { min-width: 0; }
.teacher-inventory-shell .form-actions { flex-wrap: wrap; gap: 8px; }
.teacher-inventory-shell .form-grid label { min-width: 0; }
.workday-tabs > input[type=radio], .workday-tab { display: none; }
#workday_schedule:checked ~ .workday-tab-schedule,
#workday_activity:checked ~ .workday-tab-activity,
#workday_notes:checked ~ .workday-tab-notes { display: block; }
#workday_schedule:checked ~ .student-tab-nav label[for=workday_schedule],
#workday_activity:checked ~ .student-tab-nav label[for=workday_activity],
#workday_notes:checked ~ .student-tab-nav label[for=workday_notes] { background: #e8f5ef; color: #175d41; border-bottom: 2px solid #247a55; }
.workday-tracks { display: grid; gap: 12px; margin: 12px 0; }
.workday-tracks dt, .workday-totals dt { font-size: 13px; color: #555; }
.workday-tracks dd, .workday-totals dd { margin: 4px 0 0; overflow-wrap: anywhere; font-weight: 600; }
.workday-totals { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.workday-comparison { min-width: 0; }
.workday-tabs .student-tab-nav { display: flex; flex-wrap: wrap; }
.teacher-request-filters {
  display: flex;
  align-items: end;
  flex-wrap: wrap;
  gap: 12px;
  margin: 12px 0;
}
.teacher-request-filters label { width: 160px; max-width: 100%; }
.teacher-requests-shell .employee-request-card { grid-template-columns: minmax(0, 1fr); }
.employee-request-detail-summary .panel-head { margin-bottom: 8px; }
.employee-request-period { margin: 0 0 12px; font-weight: 600; }
.employee-request-result { border-left: 3px solid var(--brand); padding-left: 12px; margin: 12px 0; }
.employee-request-result p, .employee-request-comment p { margin: 5px 0 0; white-space: pre-wrap; overflow-wrap: anywhere; }
.employee-request-comment { margin: 14px 0; }
.employee-request-created { font-size: 13px; margin: 12px 0; }
.employee-request-detail-actions { align-items: center; gap: 12px; }
.employee-request-extra { margin-top: 6px; }
.employee-request-extra summary { cursor: pointer; color: var(--muted); font-size: 13px; }
.student-detail-tabs > .student-tab-nav {
  flex-wrap: wrap;
  overflow-x: visible;
}
.student-detail-tabs > .student-tab-nav label {
  flex: 1 1 150px;
  min-width: min(100%, 150px);
  white-space: normal;
  text-align: center;
}
.student-tab-content {
  display: none;
  box-sizing: border-box;
  max-width: 100%;
  min-width: 0;
}
.student-tutor-tab-nav {
  display: flex;
  gap: 8px;
  overflow-x: auto;
  padding-bottom: 8px;
}
.student-tutor-tab-nav button {
  min-height: 38px;
  padding: 0 13px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #ffffff;
  color: var(--muted);
  font-weight: 900;
}
.student-tutor-tab-nav button.active {
  background: var(--brand);
  border-color: var(--brand);
  color: #ffffff;
}
.tutor-overview-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
}
.tutor-overview-card {
  display: grid;
  align-content: start;
  gap: 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #ffffff;
  padding: 14px;
  min-width: 0;
}
.tutor-overview-role {
  min-width: 0;
  display: flex;
  justify-content: space-between;
  gap: 10px;
  align-items: baseline;
}
.tutor-overview-role h3 {
  margin: 0;
  font-size: 14px;
  line-height: 1.2;
  text-transform: uppercase;
}
.tutor-overview-role span {
  color: var(--muted);
  font-size: 12px;
  font-weight: 900;
  white-space: nowrap;
}
.tutor-overview-person {
  display: grid;
  gap: 3px;
  min-width: 0;
}
.tutor-overview-person strong,
.tutor-overview-person span {
  min-width: 0;
  overflow-wrap: anywhere;
}
.tutor-overview-person span {
  color: var(--muted);
}
.tutor-overview-empty {
  min-height: 34px;
  display: flex;
  align-items: center;
  color: var(--muted);
  font-weight: 800;
}
button.table-action {
  cursor: pointer;
  font: inherit;
}
.tutor-panel-grid {
  display: grid;
  grid-template-columns: minmax(420px, 1.25fr) minmax(360px, 0.95fr);
  gap: 14px;
  align-items: start;
}
.tutor-person-card,
.tutor-search-result {
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #ffffff;
  padding: 12px;
}
.tutor-person-card + .tutor-person-card,
.tutor-search-result + .tutor-search-result {
  margin-top: 10px;
}
.tutor-person-card .details {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}
.tutor-search-box {
  display: grid;
  gap: 10px;
  margin-bottom: 12px;
}
.tutor-search-results {
  display: grid;
  gap: 8px;
  max-height: 320px;
  overflow: auto;
}
.tutor-search-result {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}
.tutor-search-result small {
  display: block;
  color: var(--muted);
}
.student-family-links-panel .muted {
  color: var(--muted);
  margin: 0 0 12px;
}
.student-relation-list,
.student-friend-results {
  display: grid;
  gap: 10px;
}
.student-relation-card,
.student-friend-results form {
  align-items: center;
  background: #ffffff;
  border: 1px solid var(--line);
  border-radius: 8px;
  display: flex;
  gap: 12px;
  justify-content: space-between;
  padding: 12px;
}
.student-relation-card span,
.student-friend-results small {
  color: var(--muted);
  display: block;
  margin-top: 3px;
}
.student-sibling-card {
  color: var(--ink);
  display: grid;
  grid-template-columns: 38px minmax(0, 1fr);
  justify-content: start;
  text-decoration: none;
}
.student-sibling-card:hover {
  border-color: var(--brand);
  background: #f2faf8;
}
.student-person-icon {
  align-items: center;
  border: 1px solid var(--line);
  border-radius: 50%;
  display: inline-flex;
  height: 38px;
  justify-content: center;
  margin: 0;
  width: 38px;
}
.student-person-icon svg {
  fill: none;
  height: 22px;
  stroke: var(--muted);
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 1.8;
  width: 22px;
}
.student-sibling-list {
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
}
.student-relation-card-subtle {
  background: #f8fafc;
}
.student-friend-picker {
  border-top: 1px solid var(--line);
  margin-top: 14px;
  padding-top: 14px;
}
.student-friend-picker input {
  margin-top: 6px;
}
.student-activity-filter {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 12px 0;
}
.student-activity-filter button {
  min-height: 36px;
  padding: 0 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #ffffff;
  color: var(--muted);
  font-weight: 900;
}
.student-activity-filter button.active {
  background: var(--brand);
  border-color: var(--brand);
  color: #ffffff;
}
.student-activity-status {
  display: inline-flex;
  align-items: center;
  min-height: 26px;
  padding: 0 9px;
  border: 1px solid #cddbd8;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 900;
  white-space: nowrap;
}
.student-activity-status.activity-status-current {
  color: #245a40;
  background: #f2faf8;
  border-color: #b8d6d1;
}
.student-activity-status.activity-status-past {
  color: #555555;
  background: #f2f2f2;
  border-color: #d6d6d6;
}
#student_tab_basic:checked ~ .student-tab-nav label[for="student_tab_basic"],
#student_tab_advanced:checked ~ .student-tab-nav label[for="student_tab_advanced"],
#student_tab_tutors:checked ~ .student-tab-nav label[for="student_tab_tutors"],
#student_tab_siblings:checked ~ .student-tab-nav label[for="student_tab_siblings"],
#student_tab_sepa:checked ~ .student-tab-nav label[for="student_tab_sepa"],
#student_tab_payments:checked ~ .student-tab-nav label[for="student_tab_payments"],
#student_tab_activities:checked ~ .student-tab-nav label[for="student_tab_activities"],
#student_tab_authorizations:checked ~ .student-tab-nav label[for="student_tab_authorizations"],
#student_tab_technical:checked ~ .student-tab-nav label[for="student_tab_technical"],
#profile_tab_data:checked ~ .student-tab-nav label[for="profile_tab_data"],
#profile_tab_contract:checked ~ .student-tab-nav label[for="profile_tab_contract"],
#profile_tab_payrolls:checked ~ .student-tab-nav label[for="profile_tab_payrolls"],
#profile_tab_bank:checked ~ .student-tab-nav label[for="profile_tab_bank"],
#profile_tab_security:checked ~ .student-tab-nav label[for="profile_tab_security"],
#profile_tab_access:checked ~ .student-tab-nav label[for="profile_tab_access"],
#clock_tab_summary:checked ~ .student-tab-nav label[for="clock_tab_summary"],
#clock_tab_days:checked ~ .student-tab-nav label[for="clock_tab_days"],
#clock_tab_incidents:checked ~ .student-tab-nav label[for="clock_tab_incidents"],
#clock_tab_downloads:checked ~ .student-tab-nav label[for="clock_tab_downloads"],
#clock_tab_close:checked ~ .student-tab-nav label[for="clock_tab_close"],
#employee_clock_tab_summary:checked ~ .student-tab-nav label[for="employee_clock_tab_summary"],
#employee_clock_tab_incidents:checked ~ .student-tab-nav label[for="employee_clock_tab_incidents"],
#employee_clock_tab_overtime:checked ~ .student-tab-nav label[for="employee_clock_tab_overtime"],
#employee_clock_tab_mileage:checked ~ .student-tab-nav label[for="employee_clock_tab_mileage"],
#employee_clock_tab_close:checked ~ .student-tab-nav label[for="employee_clock_tab_close"],
#employee_clock_tab_corrections:checked ~ .student-tab-nav label[for="employee_clock_tab_corrections"],
#employee_clock_tab_payroll:checked ~ .student-tab-nav label[for="employee_clock_tab_payroll"],
#employee_detail_tab_personal:checked ~ .student-tab-nav label[for="employee_detail_tab_personal"],
#employee_detail_tab_contract:checked ~ .student-tab-nav label[for="employee_detail_tab_contract"],
#employee_detail_tab_groups:checked ~ .student-tab-nav label[for="employee_detail_tab_groups"],
#employee_detail_tab_calendar:checked ~ .student-tab-nav label[for="employee_detail_tab_calendar"],
#employee_detail_tab_vacations:checked ~ .student-tab-nav label[for="employee_detail_tab_vacations"],
#employee_detail_tab_hours:checked ~ .student-tab-nav label[for="employee_detail_tab_hours"],
#employee_detail_tab_payrolls:checked ~ .student-tab-nav label[for="employee_detail_tab_payrolls"],
#employee_detail_tab_training:checked ~ .student-tab-nav label[for="employee_detail_tab_training"],
#employee_detail_tab_technical:checked ~ .student-tab-nav label[for="employee_detail_tab_technical"],
#employee_self_tab_personal:checked ~ .student-tab-nav label[for="employee_self_tab_personal"],
#employee_self_tab_work:checked ~ .student-tab-nav label[for="employee_self_tab_work"],
#employee_self_tab_groups:checked ~ .student-tab-nav label[for="employee_self_tab_groups"],
#employee_self_tab_calendar:checked ~ .student-tab-nav label[for="employee_self_tab_calendar"],
#employee_self_tab_vacations:checked ~ .student-tab-nav label[for="employee_self_tab_vacations"],
#employee_self_tab_hours:checked ~ .student-tab-nav label[for="employee_self_tab_hours"],
#employee_self_tab_payrolls:checked ~ .student-tab-nav label[for="employee_self_tab_payrolls"],
#employee_self_tab_training:checked ~ .student-tab-nav label[for="employee_self_tab_training"],
#employee_self_tab_security:checked ~ .student-tab-nav label[for="employee_self_tab_security"],
#group_tab_info:checked ~ .student-tab-nav label[for="group_tab_info"],
#group_tab_students:checked ~ .student-tab-nav label[for="group_tab_students"],
#group_tab_payments:checked ~ .student-tab-nav label[for="group_tab_payments"],
#group_tab_calendar:checked ~ .student-tab-nav label[for="group_tab_calendar"],
#group_tab_teaching:checked ~ .student-tab-nav label[for="group_tab_teaching"],
#group_tab_organization:checked ~ .student-tab-nav label[for="group_tab_organization"],
#group_tab_management:checked ~ .student-tab-nav label[for="group_tab_management"] {
  background: var(--brand);
  border-color: var(--brand);
  color: #ffffff;
}
#student_tab_basic:checked ~ .student-tab-basic,
#student_tab_advanced:checked ~ .student-tab-advanced,
#student_tab_tutors:checked ~ .student-tab-tutors,
#student_tab_siblings:checked ~ .student-tab-siblings,
#student_tab_sepa:checked ~ .student-tab-sepa,
#student_tab_payments:checked ~ .student-tab-payments,
#student_tab_activities:checked ~ .student-tab-activities,
#student_tab_authorizations:checked ~ .student-tab-authorizations,
#student_tab_technical:checked ~ .student-tab-technical,
#profile_tab_data:checked ~ .profile-tab-data,
#profile_tab_contract:checked ~ .profile-tab-contract,
#profile_tab_payrolls:checked ~ .profile-tab-payrolls,
#profile_tab_bank:checked ~ .profile-tab-bank,
#profile_tab_security:checked ~ .profile-tab-security,
#profile_tab_access:checked ~ .profile-tab-access,
#clock_tab_summary:checked ~ .clock-tab-summary,
#clock_tab_days:checked ~ .clock-tab-days,
#clock_tab_incidents:checked ~ .clock-tab-incidents,
#clock_tab_downloads:checked ~ .clock-tab-downloads,
#clock_tab_close:checked ~ .clock-tab-close,
#employee_clock_tab_summary:checked ~ .employee-clock-tab-summary,
#employee_clock_tab_incidents:checked ~ .employee-clock-tab-incidents,
#employee_clock_tab_overtime:checked ~ .employee-clock-tab-overtime,
#employee_clock_tab_mileage:checked ~ .employee-clock-tab-mileage,
#employee_clock_tab_close:checked ~ .employee-clock-tab-close,
#employee_clock_tab_corrections:checked ~ .employee-clock-tab-corrections,
#employee_clock_tab_payroll:checked ~ .employee-clock-tab-payroll,
#employee_detail_tab_personal:checked ~ .employee-detail-tab-personal,
#employee_detail_tab_contract:checked ~ .employee-detail-tab-contract,
#employee_detail_tab_groups:checked ~ .employee-detail-tab-groups,
#employee_detail_tab_calendar:checked ~ .employee-detail-tab-calendar,
#employee_detail_tab_vacations:checked ~ .employee-detail-tab-vacations,
#employee_detail_tab_hours:checked ~ .employee-detail-tab-hours,
#employee_detail_tab_payrolls:checked ~ .employee-detail-tab-payrolls,
#employee_detail_tab_training:checked ~ .employee-detail-tab-training,
#employee_detail_tab_technical:checked ~ .employee-detail-tab-technical,
#employee_self_tab_personal:checked ~ .employee-self-tab-personal,
#employee_self_tab_work:checked ~ .employee-self-tab-work,
#employee_self_tab_groups:checked ~ .employee-self-tab-groups,
#employee_self_tab_calendar:checked ~ .employee-self-tab-calendar,
#employee_self_tab_vacations:checked ~ .employee-self-tab-vacations,
#employee_self_tab_hours:checked ~ .employee-self-tab-hours,
#employee_self_tab_payrolls:checked ~ .employee-self-tab-payrolls,
#employee_self_tab_training:checked ~ .employee-self-tab-training,
#employee_self_tab_security:checked ~ .employee-self-tab-security,
#group_tab_info:checked ~ .group-tab-info,
#group_tab_students:checked ~ .group-tab-students,
#group_tab_payments:checked ~ .group-tab-payments,
#group_tab_calendar:checked ~ .group-tab-calendar,
#group_tab_teaching:checked ~ .group-tab-teaching,
#group_tab_organization:checked ~ .group-tab-organization,
#group_tab_management:checked ~ .group-tab-management {
  display: block;
}
.profile-tabs .panel {
  margin: 0;
}
.clock-history-tabs .panel {
  margin: 0;
}
.employee-clock-tabs .panel {
  margin: 0;
}
.employee-detail-tabs .panel,
.employee-detail-tabs .metrics,
.group-detail-tabs .panel,
.group-detail-tabs .metrics {
  margin-top: 0;
}
.employee-week-summary { display:flex; justify-content:flex-end; margin:14px 0 8px; color:var(--brand-dark); }
.employee-week-calendar { display:grid; grid-template-columns:repeat(5,minmax(190px,1fr)); gap:10px; overflow-x:auto; padding-bottom:8px; }
.employee-week-day { min-width:190px; border:1px solid var(--line); border-radius:8px; background:#f7faf9; overflow:hidden; }
.employee-week-day h3 { margin:0; padding:11px 12px; border-bottom:3px solid var(--brand); background:#fff; color:var(--brand-dark); font-size:15px; }
.employee-week-work,.employee-week-free { display:grid; gap:4px; margin:9px; padding:10px; border-radius:7px; }
.employee-week-work { border-left:5px solid var(--accent); background:#fff4e8; }
.employee-week-work.is-research { border-left-color:var(--brand); background:#edf8f6; }
.employee-week-work > span,.employee-week-free > span,.employee-week-group > span { color:var(--muted); font-size:12px; font-weight:900; }
.employee-week-work > strong,.employee-week-free > strong { color:var(--ink); font-size:14px; }
.employee-week-work > small { color:var(--muted); }
.employee-week-free { min-height:44px; border:1px dashed #9fc8b6; background:#f4fbf7; }
.employee-week-free strong { color:#24613f; }
.employee-week-group { display:grid; gap:3px; margin-top:8px; padding-top:8px; border-top:1px solid #ead8c6; }
.employee-week-group > strong { overflow-wrap:anywhere; font-size:13px; }
.employee-week-group > small { overflow-wrap:anywhere; color:var(--muted); }
.employee-week-group .table-actions { gap:5px; margin-top:4px; }
.employee-week-group .table-action { min-height:30px; padding:5px 7px; font-size:11px; }
.employee-empty-groups { margin-top:14px; border-top:1px solid var(--line); padding-top:12px; }
.employee-empty-groups summary { cursor:pointer; color:var(--muted); font-weight:900; }
.employee-empty-groups article { display:flex; justify-content:space-between; gap:12px; align-items:center; padding:10px 0; border-bottom:1px solid var(--line); }
.employee-empty-groups article div:first-child { display:grid; gap:3px; min-width:0; }
.employee-empty-groups article strong,.employee-empty-groups article small { overflow-wrap:anywhere; }
@media (max-width: 760px) {
  .employee-week-calendar { grid-template-columns:repeat(5,minmax(168px,1fr)); }
  .employee-week-day { min-width:168px; }
  .employee-empty-groups article { align-items:flex-start; flex-direction:column; }
}
.group-information-form {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}
.group-information-form [data-group-confirm][hidden] { display: none !important; }
.group-information-form { align-items: start; }
.group-information-form label { align-content: start; }
.group-control-field, .group-room-field { display: grid; gap: 6px; min-width: 0; align-content: start; }
.group-control-field small, .group-room-field small { font-size: 12px; }
.group-information-form input:not([type="checkbox"]), .group-information-form select:not([multiple]) { height: 42px; box-sizing: border-box; }
.group-information-form datalist { display: none; }
.group-information-form .group-enrollment-fee-block { grid-template-columns: minmax(0, 1fr); }
.group-enrollment-fee-block > label { max-width: 190px; }
.group-enrollment-periods { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; }
.group-enrollment-periods[hidden] { display: none !important; }
[data-add-modality] [hidden] { display: none !important; }
.group-information-form .group-enrollment-period { grid-template-columns: minmax(0, 1fr); }
.group-date-control { display: grid; grid-template-columns: minmax(0, 1fr) 36px 24px; align-items: center; min-width: 0; height: 42px; border: 1px solid #cdd7d6; border-radius: 6px; background: white; }
.group-date-control output { font-size: 14px; padding-left: 10px; white-space: nowrap; }
.group-information-form .group-date-control input { width: 36px; padding: 5px; border: 0; background: transparent; box-shadow: none; }
.group-date-control input::-webkit-datetime-edit { display: none; }
.group-date-control input::-webkit-calendar-picker-indicator { cursor: pointer; padding: 4px; }
.group-date-control button { background: transparent; padding: 0; border: 0; color: var(--muted); font-size: 18px; height: 32px; }
.group-method-options { min-width: 0; margin: 0; border: 0; padding: 0; display: grid; gap: 8px; align-content: start; grid-template-columns: repeat(2, minmax(0, 1fr)); }
.group-method-options legend { font-weight: 700; margin-bottom: 8px; }
.group-information-form .group-method-options .checkbox-row { display: flex; flex-direction: row; align-items: center; gap: 8px; font-weight: 400; min-height: 32px; align-self: start; overflow-wrap: anywhere; }
.group-method-options input[type="checkbox"] { width: 16px; height: 16px; margin: 0; }
.group-admin-title small a { color: inherit; text-decoration: underline; }
@media (max-width: 1000px) { .group-enrollment-periods { grid-template-columns: minmax(0, 1fr); } }
.group-field-save-status { display: block; min-height: 17px; font-size: 12px; font-weight: 400; color: var(--muted); }
.group-field-save-status[data-state="error"] { color: var(--danger); }
.group-field-save-status[data-state="saved"] { color: var(--brand); }
.group-information-form .readonly-field {
  display: grid;
  gap: 6px;
  align-content: start;
  min-height: 42px;
  padding: 10px 12px;
  border: 1px solid #d7e4e2;
  border-radius: 8px;
  background: #f7fbfa;
}
.group-information-form .readonly-field span {
  color: var(--muted);
  font-size: 12px;
  font-weight: 900;
}
.group-information-form .readonly-field strong {
  color: var(--ink);
  font-size: 15px;
}
.group-information-subblock {
  grid-column: 1 / -1;
  display: grid;
  grid-template-columns: 190px repeat(3, minmax(0, 1fr));
  gap: 12px;
  align-items: start;
  margin: 4px 0;
  padding: 14px;
  border: 1px solid #d7e4e2;
  border-radius: 8px;
  background: #fbfdfd;
}
.group-information-subblock legend {
  padding: 0 6px;
  color: var(--brand-dark);
  font-weight: 900;
}
.group-enrollment-period {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}
.group-enrollment-period h3 {
  grid-column: 1 / -1;
  margin: 0;
  color: var(--muted);
  font-size: 12px;
  font-weight: 900;
  text-transform: uppercase;
}
.clock-history-tabs .metrics {
  margin-top: 0;
}
.clock-history-head {
  margin-bottom: 12px;
}
.clock-employee-home {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 220px;
  gap: 12px;
  align-items: stretch;
  margin-bottom: 12px;
}
.clock-employee-home-hero {
  min-width: 0;
  display: grid;
  gap: 5px;
  padding: 16px;
  border: 1px solid #d7e4e2;
  border-left: 6px solid var(--brand);
  border-radius: 8px;
  background: #f7fbfa;
}
.clock-employee-home-hero span {
  color: var(--muted);
  font-size: 12px;
  font-weight: 900;
  text-transform: uppercase;
}
.clock-employee-home-hero strong {
  color: #173f45;
  font-size: 27px;
  line-height: 1.08;
  overflow-wrap: anywhere;
}
.clock-employee-home-hero small {
  color: #45565c;
  font-weight: 900;
  line-height: 1.35;
}
.clock-employee-main-actions {
  min-width: 0;
  display: grid;
  gap: 8px;
}
.clock-employee-main-actions .table-action {
  width: 100%;
  min-height: 44px;
  justify-content: center;
  text-align: center;
  cursor: pointer;
}
.clock-summary-grid-simple {
  margin-bottom: 0;
}
.clock-employee-review-tray {
  display: grid;
  gap: 12px;
  margin: 14px 0;
  padding: 14px;
  border: 1px solid #d7e4e2;
  border-radius: 8px;
  background: #ffffff;
  box-shadow: 0 10px 24px rgba(20, 39, 42, 0.06);
}
.clock-employee-review-grid {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 10px;
}
.clock-employee-review-card {
  min-width: 0;
  display: grid;
  gap: 6px;
  padding: 12px;
  border: 1px solid #d7e4e2;
  border-radius: 8px;
  background: #f8fbfa;
}
.clock-employee-review-card span {
  color: var(--muted);
  font-size: 12px;
  font-weight: 900;
  text-transform: uppercase;
}
.clock-employee-review-card strong {
  color: #173f45;
  font-size: 21px;
  line-height: 1.08;
  overflow-wrap: anywhere;
}
.clock-employee-review-card small {
  color: #45565c;
  font-weight: 800;
  line-height: 1.25;
}
.clock-employee-review-card.tone-warning {
  border-color: #edc6a4;
  background: #fff7e8;
}
.clock-employee-review-card.tone-money {
  border-color: #d9c3ac;
  background: #fbf5ee;
}
.clock-employee-review-card.tone-travel {
  border-color: #b8d6d1;
  background: #f2faf8;
}
.clock-employee-review-card.tone-review {
  border-color: #c3ccd0;
  background: #f1f5f6;
}
.clock-employee-review-card.tone-ok {
  border-color: #cfe5d8;
  background: #f3fbf5;
}
.employee-clock-tabs,
.employee-clock-tabs .student-tab-content,
.employee-clock-tabs .table-panel,
.employee-clock-tabs .table-wrap {
  min-width: 0;
  max-width: 100%;
}
.employee-clock-tabs .metrics {
  margin-top: 0;
}
.employee-clock-tab-intro {
  display: grid;
  gap: 4px;
  margin-bottom: 10px;
  padding: 12px 14px;
  border: 1px solid #d7e4e2;
  border-radius: 8px;
  background: #f7fbfa;
}
.employee-clock-tab-intro strong {
  color: #173f45;
  font-size: 17px;
  line-height: 1.15;
}
.employee-clock-tab-intro small {
  color: var(--muted);
  font-weight: 800;
  line-height: 1.3;
}
.employee-clock-review-tray {
  display: grid;
  gap: 12px;
  margin: 14px 0;
  padding: 14px;
  border: 1px solid #d7e4e2;
  border-radius: 8px;
  background: #ffffff;
  box-shadow: 0 10px 24px rgba(20, 39, 42, 0.06);
}
.employee-clock-review-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
}
.employee-clock-incident-summary {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}
.employee-clock-incidents-filter {
  display: inline-flex;
  flex-direction: row;
  align-items: center;
  align-self: end;
  gap: 8px;
  min-height: 44px;
}
.employee-clock-incidents-filter input[type="checkbox"] {
  width: 18px;
  height: 18px;
  min-width: 18px;
  min-height: 18px;
  margin: 0;
  padding: 0;
}
.employee-clock-close-table table {
  min-width: 920px;
}
.employee-clock-review-card {
  min-width: 0;
  display: grid;
  gap: 8px;
  align-content: start;
  padding: 13px;
  border: 1px solid #d7e4e2;
  border-radius: 8px;
  background: #f8fbfa;
}
.employee-clock-review-card span {
  color: var(--muted);
  font-size: 12px;
  font-weight: 900;
  text-transform: uppercase;
}
.employee-clock-review-card strong {
  color: #173f45;
  font-size: 30px;
  line-height: 1;
}
.employee-clock-review-card small {
  min-height: 44px;
  color: #45565c;
  font-weight: 800;
  line-height: 1.25;
}
.employee-clock-review-card .table-action {
  width: 100%;
  justify-content: center;
  text-align: center;
}
.employee-clock-review-card.tone-danger {
  border-color: #efb3aa;
  background: #fff1ee;
}
.employee-clock-review-card.tone-warning {
  border-color: #edc6a4;
  background: #fff7e8;
}
.employee-clock-review-card.tone-money {
  border-color: #d9c3ac;
  background: #fbf5ee;
}
.employee-clock-review-card.tone-travel {
  border-color: #b8d6d1;
  background: #f2faf8;
}
.employee-clock-review-card.tone-review {
  border-color: #c3ccd0;
  background: #f1f5f6;
}
.employee-clock-review-card.tone-ok {
  border-color: #cfe5d8;
  background: #f3fbf5;
}
.employee-clock-review-note {
  margin: 0;
  padding: 10px 12px;
  border-radius: 8px;
  background: #fff7e8;
  color: #7a5200;
  font-weight: 800;
}
.employee-clock-month-kpis {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
  margin-bottom: 14px;
}
.employee-clock-month-kpi,
.employee-clock-month-card {
  min-width: 0;
  border: 1px solid #d7e4e2;
  border-radius: 8px;
  background: #ffffff;
  box-shadow: 0 8px 20px rgba(20, 39, 42, 0.05);
}
.employee-clock-month-kpi {
  display: grid;
  gap: 5px;
  padding: 14px;
}
.employee-clock-month-kpi span,
.employee-clock-month-card span {
  color: var(--muted);
  font-size: 12px;
  font-weight: 900;
  text-transform: uppercase;
}
.employee-clock-month-kpi strong {
  color: #173f45;
  font-size: 24px;
  line-height: 1.1;
}
.employee-clock-month-kpi small,
.employee-clock-month-card small {
  color: #52666b;
  font-weight: 800;
}
.employee-clock-month-kpi.tone-pending,
.employee-clock-month-card.tone-warning {
  border-color: #f2d186;
  background: #fffaf0;
}
.employee-clock-month-kpi.tone-history {
  border-color: #d9d3f4;
  background: #f7f5ff;
}
.employee-clock-month-kpi.tone-mileage {
  border-color: #cde1f7;
  background: #f3f8ff;
}
.employee-clock-month-kpi.tone-ok,
.employee-clock-month-card.tone-ok {
  border-color: #cfe5d8;
  background: #f7fbf8;
}
.employee-clock-month-panel {
  margin-bottom: 14px;
}
.employee-clock-month-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}
.employee-clock-month-card {
  display: grid;
  gap: 12px;
  padding: 14px;
}
.employee-clock-month-card header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 10px;
}
.employee-clock-month-card header div {
  min-width: 0;
  display: grid;
  gap: 4px;
}
.employee-clock-month-card header strong {
  color: #173f45;
  font-size: 18px;
  line-height: 1.15;
  overflow-wrap: anywhere;
}
.employee-clock-month-card dl {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
  margin: 0;
}
.employee-clock-month-card dt {
  color: var(--muted);
  font-size: 11px;
  font-weight: 900;
  text-transform: uppercase;
}
.employee-clock-month-card dd {
  margin: 2px 0 0;
  color: #173f45;
  font-weight: 900;
}
.employee-clock-month-card p {
  margin: 0;
  color: #45565c;
  font-weight: 800;
  line-height: 1.35;
}
.employee-overtime-overview {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 10px;
  margin-bottom: 12px;
}
.employee-overtime-metric,
.employee-overtime-card {
  min-width: 0;
  border: 1px solid #d7e4e2;
  border-radius: 8px;
  background: #ffffff;
}
.employee-overtime-metric {
  display: grid;
  gap: 5px;
  padding: 12px;
}
.employee-overtime-metric span,
.employee-overtime-card header span {
  color: var(--muted);
  font-size: 12px;
  font-weight: 900;
  text-transform: uppercase;
}
.employee-overtime-metric strong {
  color: #173f45;
  font-size: 21px;
  line-height: 1.1;
}
.employee-overtime-metric small,
.employee-overtime-reviewed {
  color: #45565c;
  font-weight: 800;
}
.employee-overtime-sections {
  align-items: start;
  margin-bottom: 16px;
}
.employee-overtime-card-list {
  display: grid;
  gap: 10px;
}
.employee-overtime-card {
  display: grid;
  gap: 10px;
  padding: 12px;
}
.employee-overtime-card header {
  display: flex;
  justify-content: space-between;
  gap: 10px;
  align-items: start;
}
.employee-overtime-card header strong {
  min-width: 0;
  color: #173f45;
  font-size: 17px;
  overflow-wrap: anywhere;
}
.employee-overtime-card dl {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 8px;
  margin: 0;
}
.employee-overtime-card dt {
  color: var(--muted);
  font-size: 11px;
  font-weight: 900;
  text-transform: uppercase;
}
.employee-overtime-card dd {
  margin: 3px 0 0;
  color: var(--ink);
  font-weight: 900;
}
.employee-overtime-card p {
  margin: 0;
  color: #45565c;
  font-weight: 800;
  line-height: 1.3;
}
.employee-overtime-card-actions .table-actions {
  align-items: stretch;
}
.employee-overtime-card-actions,
.employee-overtime-card-actions .table-actions,
.employee-overtime-card-actions .inline-form {
  min-width: 0;
  max-width: 100%;
}
.employee-overtime-card-actions .inline-form input {
  min-width: 0;
}
.employee-overtime-card.status-pendiente {
  border-color: #edc6a4;
  background: #fff7e8;
}
.employee-overtime-card.status-aprobado {
  border-color: #cfe5d8;
  background: #f3fbf5;
}
.employee-overtime-card.status-parcial {
  border-color: #b8d6d1;
  background: #f2faf8;
}
.employee-overtime-card.status-rechazado {
  border-color: #efb3aa;
  background: #fff1ee;
}
.employee-clock-preclose-panel {
  display: grid;
  gap: 12px;
  margin-bottom: 14px;
  padding: 14px;
  border: 1px solid #d7e4e2;
  border-radius: 8px;
  background: #ffffff;
  box-shadow: 0 10px 24px rgba(20, 39, 42, 0.06);
}
.employee-clock-preclose-panel > p {
  margin: 0;
}
.employee-clock-preclose-grid {
  display: grid;
  grid-template-columns: repeat(7, minmax(0, 1fr));
  gap: 8px;
}
.employee-clock-preclose-card {
  min-width: 0;
  display: grid;
  gap: 5px;
  padding: 11px;
  border: 1px solid #d7e4e2;
  border-radius: 8px;
  background: #f8fbfa;
}
.employee-clock-preclose-card span {
  color: var(--muted);
  font-size: 11px;
  font-weight: 900;
  text-transform: uppercase;
}
.employee-clock-preclose-card strong {
  color: #173f45;
  font-size: 24px;
  line-height: 1;
}
.employee-clock-preclose-card small {
  color: #45565c;
  font-size: 12px;
  font-weight: 800;
  line-height: 1.22;
}
.employee-clock-preclose-card.tone-warning {
  border-color: #edc6a4;
  background: #fff7e8;
}
.employee-clock-preclose-card.tone-money {
  border-color: #d9c3ac;
  background: #fbf5ee;
}
.employee-clock-preclose-card.tone-travel {
  border-color: #b8d6d1;
  background: #f2faf8;
}
.employee-clock-preclose-card.tone-review,
.employee-clock-preclose-card.tone-history {
  border-color: #c3ccd0;
  background: #f1f5f6;
}
.employee-clock-preclose-card.tone-ok {
  border-color: #cfe5d8;
  background: #f3fbf5;
}
.employee-clock-preclose-note {
  padding: 10px 12px;
  border-radius: 8px;
  background: #f4f7f8;
  color: #45565c;
  font-weight: 900;
}
.employee-clock-incident-hero {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 220px;
  gap: 16px;
  align-items: stretch;
  margin-bottom: 16px;
  padding: 18px;
  border: 1px solid #d7e4e2;
  border-left: 6px solid var(--brand);
  border-radius: 8px;
  background: #ffffff;
  box-shadow: 0 10px 24px rgba(20, 39, 42, 0.06);
}
.employee-clock-incident-hero div {
  min-width: 0;
}
.employee-clock-incident-hero span,
.employee-clock-incident-hero small {
  color: var(--muted);
  font-size: 12px;
  font-weight: 900;
  text-transform: uppercase;
}
.employee-clock-incident-hero h2 {
  margin: 5px 0;
  color: #173f45;
  font-size: 28px;
  line-height: 1.1;
  overflow-wrap: anywhere;
}
.employee-clock-incident-hero p {
  margin: 0;
  color: #45565c;
  font-weight: 800;
  line-height: 1.35;
}
.employee-clock-incident-hero aside {
  display: grid;
  align-content: center;
  gap: 4px;
  padding: 14px;
  border-radius: 8px;
  background: #f4faf8;
  text-align: center;
}
.employee-clock-incident-hero aside strong {
  color: #173f45;
  font-size: 24px;
}
.employee-clock-incident-grid {
  align-items: start;
}
.employee-clock-incident-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.employee-clock-day-hero {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 16px;
  align-items: center;
  margin-bottom: 16px;
  padding: 18px;
  border: 1px solid #d7e4e2;
  border-left: 6px solid var(--brand);
  border-radius: 8px;
  background: #ffffff;
  box-shadow: 0 10px 24px rgba(20, 39, 42, 0.06);
}
.employee-clock-day-hero span {
  color: var(--muted);
  font-size: 12px;
  font-weight: 900;
  text-transform: uppercase;
}
.employee-clock-day-hero h2 {
  margin: 5px 0;
  color: #173f45;
  font-size: 28px;
  line-height: 1.1;
  overflow-wrap: anywhere;
}
.employee-clock-day-hero p {
  margin: 0;
  color: #45565c;
  font-weight: 900;
}
.employee-clock-day-incidents ul {
  margin: 0;
  padding-left: 18px;
  color: #45565c;
  font-weight: 800;
}
.clock-summary-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}
.clock-summary-card {
  min-width: 0;
  display: grid;
  gap: 5px;
  border: 1px solid #d7e4e2;
  border-radius: 8px;
  padding: 13px;
  background: #ffffff;
}
.clock-summary-card span {
  color: var(--muted);
  font-size: 12px;
  font-weight: 900;
  text-transform: uppercase;
}
.clock-summary-card strong {
  color: #173f45;
  font-size: 22px;
  line-height: 1.12;
  overflow-wrap: anywhere;
}
.clock-summary-card small {
  color: #45565c;
  font-weight: 800;
  line-height: 1.25;
  overflow-wrap: anywhere;
}
.clock-summary-card.tone-state {
  border-color: #bfd6d2;
  background: #f4faf8;
}
.clock-summary-card.tone-pending {
  border-color: #ffd37d;
  background: #fffaf0;
}
.clock-summary-card.tone-mileage {
  border-color: #c3ccd0;
  background: #f1f5f6;
}
.clock-history-tabs,
.clock-history-tabs .student-tab-content,
.clock-history-tabs .table-panel,
.clock-history-tabs .table-wrap {
  min-width: 0;
  max-width: 100%;
}
.clock-history-tabs .student-tab-nav {
  margin-bottom: 8px;
}
.clock-technical-table .panel-head span {
  white-space: nowrap;
}
.clock-technical-table table {
  min-width: 760px;
}
.clock-day-panel {
  overflow: hidden;
}
.clock-month-calendar-panel {
  overflow: hidden;
  margin-bottom: 14px;
}
.clock-month-weekdays,
.clock-month-grid {
  display: grid;
  grid-template-columns: repeat(7, minmax(0, 1fr));
  gap: 6px;
}
.clock-month-weekdays {
  margin-bottom: 6px;
  color: var(--muted);
  font-size: 12px;
  font-weight: 900;
  text-align: center;
}
.clock-month-day {
  min-width: 0;
  min-height: 74px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #ffffff;
}
.clock-month-day a,
.clock-month-day div {
  min-height: 72px;
  padding: 7px 5px;
  display: flex;
  flex-direction: column;
  gap: 4px;
  color: inherit;
  text-decoration: none;
}
.clock-month-day strong {
  color: #173f45;
  font-size: 14px;
}
.clock-month-day span {
  color: #176b73;
  font-size: 11px;
  font-weight: 900;
  line-height: 1.15;
}
.clock-month-day small {
  margin-top: auto;
  color: var(--muted);
  font-size: 11px;
  line-height: 1.15;
}
.clock-month-day.outside-month {
  opacity: 0.35;
  background: #f6f8f8;
}
.clock-month-day.status-pendiente-revision,
.clock-month-day.status-incidencia,
.clock-month-day.status-jornada-abierta {
  background: #fffaf0;
  border-color: #f0d494;
}
.clock-month-day.status-trabajado {
  background: #f3fbf8;
  border-color: #bfe4d4;
}
.employee-labor-legend {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-bottom: 10px;
  color: var(--muted);
  font-weight: 900;
}
.employee-labor-month-tools {
  display: flex;
  flex-wrap: wrap;
  align-items: end;
  justify-content: space-between;
  gap: 10px;
  margin-bottom: 12px;
}
.employee-labor-month-form {
  display: flex;
  flex-wrap: wrap;
  align-items: end;
  gap: 8px;
  margin: 0;
}
.employee-labor-month-form label {
  display: grid;
  gap: 4px;
  color: var(--muted);
  font-size: 12px;
  font-weight: 900;
}
.employee-labor-month-form select,
.employee-labor-month-form button,
.employee-labor-month-tools .table-action {
  min-height: 40px;
}
.employee-labor-legend span {
  display: inline-flex;
  align-items: center;
  gap: 6px;
}
.employee-labor-legend i {
  width: 10px;
  height: 10px;
  border-radius: 999px;
  border: 1px solid var(--line);
}
.employee-labor-legend .status-school, .employee-labor-day.status-school { background: #e4f4f2; border-color: #3d8881; }
.employee-labor-legend .status-review, .employee-labor-day.status-review { background: #fff0e7; border-color: #b56335; }
.employee-labor-legend .status-inactive, .employee-labor-day.status-inactive { background: #e8edf8; border-color: #8294bd; }
.employee-labor-legend .status-unknown, .employee-labor-day.status-unknown { background: #f3f3f3; border-color: #bbb; }
.employee-labor-legend .status-absence, .employee-labor-day.status-absence { background: #fbe8ed; border-color: #b24a65; }
.employee-labor-legend .status-work,
.employee-labor-day.status-work {
  background: #eef6ff;
  border-color: #93c5fd;
}
.employee-labor-legend .status-vacation,
.employee-labor-day.status-vacation {
  background: #ecfdf3;
  border-color: #86efac;
}
.employee-labor-legend .status-free,
.employee-labor-day.status-free {
  background: #fffbeb;
  border-color: #facc15;
}
.employee-labor-day.today {
  box-shadow: inset 0 0 0 2px #176b73;
}
.teacher-labor-detail > summary {
  padding: 14px 0;
  cursor: pointer;
  font-weight: 700;
}
@media (max-width: 400px) {
  .teacher-profile-shell .employee-labor-calendar-panel .clock-month-heading { grid-template-columns: 1fr; }
}
@media (max-width: 600px) {
  .teacher-profile-shell .employee-labor-grid .employee-labor-day span,
  .teacher-profile-shell .employee-labor-grid .employee-labor-day small { display: none; }
  .teacher-profile-shell .employee-labor-grid .employee-labor-day { min-height: 44px; }
  .teacher-profile-shell .employee-labor-grid .employee-labor-day a,
  .teacher-profile-shell .employee-labor-grid .employee-labor-day div {
    min-height: 44px; padding: 8px 2px; align-items: center; justify-content: center;
  }
  .teacher-profile-shell .employee-labor-legend { font-size: 12px; gap: 8px; font-weight: 600; }
  .teacher-profile-shell .employee-labor-month-tools { margin-bottom: 8px; }
}
.clock-day-card-list {
  display: grid;
  gap: 10px;
}
.clock-day-card {
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 12px;
  background: #ffffff;
  min-width: 0;
}
.clock-day-card header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  margin-bottom: 10px;
}
.clock-day-card header strong {
  color: #173f45;
  font-size: 17px;
}
.clock-day-card header span {
  flex: 0 0 auto;
  border-radius: 999px;
  padding: 5px 8px;
  background: #edf6f4;
  color: #176b73;
  font-size: 12px;
  font-weight: 900;
}
.clock-day-card.status-incidencia header span,
.clock-day-card.status-jornada-abierta header span {
  background: #fff7df;
  color: #654400;
}
.clock-day-card dl {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
  margin: 0;
}
.clock-day-card dt {
  color: var(--muted);
  font-size: 12px;
  font-weight: 900;
}
.clock-day-card dd {
  margin: 2px 0 0;
  color: var(--text);
  font-weight: 900;
  overflow-wrap: anywhere;
}
.clock-day-detail {
  margin-top: 12px;
  border-top: 1px solid #edf1f2;
  padding-top: 10px;
}
.clock-day-detail summary {
  cursor: pointer;
  color: #176b73;
  font-weight: 900;
}
.clock-day-detail-list {
  display: grid;
  gap: 8px;
  margin-top: 10px;
}
.clock-day-detail-row {
  display: grid;
  gap: 8px;
  border: 1px solid #d7e4e2;
  border-radius: 8px;
  padding: 10px;
  background: #fbfdfd;
}
.clock-day-detail-row header {
  margin: 0;
}
.clock-day-detail-row header strong {
  font-size: 15px;
}
.clock-day-detail-row header span {
  background: #f1f5f6;
  color: #45565c;
}
.clock-day-detail-row dl {
  grid-template-columns: 1fr;
  gap: 7px;
}
.clock-manual-correction {
  display: grid;
  gap: 3px;
  margin-top: 8px;
  padding: 10px;
  border: 1px solid #edc6a4;
  border-radius: 8px;
  background: #fff7e8;
}
.clock-manual-correction span {
  color: #8f4f2b;
  font-size: 11px;
  font-weight: 900;
  text-transform: uppercase;
}
.clock-manual-correction strong {
  color: #173f45;
  font-size: 14px;
  line-height: 1.25;
  overflow-wrap: anywhere;
}
.clock-manual-correction small {
  color: #45565c;
  font-weight: 800;
  overflow-wrap: anywhere;
}
.clock-personal-review-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr);
  gap: 12px;
}
.clock-personal-review-layout > .clock-personal-review-panel:last-child {
  grid-column: 1 / -1;
}
.clock-personal-review-list {
  display: grid;
  gap: 10px;
}
.clock-personal-review-card {
  min-width: 0;
  display: grid;
  gap: 6px;
  border: 1px solid #d7e4e2;
  border-radius: 8px;
  padding: 12px;
  background: #f8fbfa;
}
.clock-personal-review-card span {
  color: var(--muted);
  font-size: 12px;
  font-weight: 900;
  text-transform: uppercase;
}
.clock-personal-review-card strong {
  color: #173f45;
  font-size: 16px;
  line-height: 1.2;
  overflow-wrap: anywhere;
}
.clock-personal-review-card small,
.clock-personal-review-card p {
  margin: 0;
  color: #45565c;
  font-weight: 800;
  line-height: 1.35;
}
.clock-personal-review-card.type-missing-exit,
.clock-personal-review-card.type-missing-entry,
.clock-personal-review-card.status-pendiente {
  border-color: #ffd37d;
  background: #fff7df;
}
.clock-personal-review-card.type-duplicate {
  border-color: #efb3aa;
  background: #fff1ee;
}
.clock-personal-review-card.type-gps {
  border-color: #b8d6d1;
  background: #f2faf8;
}
.clock-personal-review-card.type-overtime {
  border-color: #d9c3ac;
  background: #fbf5ee;
}
.clock-personal-review-card.type-message {
  border-color: #cde1f7;
  background: #f3f8ff;
}
.clock-day-card,
.clock-incident-card,
.clock-download-card,
.clock-close-summary article,
.clock-close-confirmed,
.clock-close-notes article {
  max-width: 100%;
  overflow-wrap: anywhere;
}
.clock-incident-panel {
  overflow: hidden;
}
.clock-incident-list {
  display: grid;
  gap: 10px;
}
.clock-incident-card {
  display: grid;
  gap: 6px;
  border: 1px solid #ffd37d;
  border-left: 5px solid #d68b00;
  border-radius: 8px;
  padding: 12px;
  background: #fffaf0;
  color: #4b3500;
}
.clock-incident-card span {
  font-size: 12px;
  font-weight: 900;
  text-transform: uppercase;
}
.clock-incident-card strong {
  font-size: 15px;
  line-height: 1.35;
  overflow-wrap: anywhere;
}
.clock-incident-card small {
  color: #6f5a24;
  font-weight: 800;
  line-height: 1.3;
}
.clock-incident-card.type-missing-exit,
.clock-incident-card.type-missing-entry {
  border-color: #ffd37d;
  border-left-color: #d68b00;
  background: #fff7df;
}
.clock-incident-card.type-duplicate {
  border-color: #d7c5d7;
  border-left-color: #8a5b8a;
  background: #faf4fa;
  color: #49364d;
}
.clock-incident-card.type-gps {
  border-color: #b8d6d1;
  border-left-color: #176b73;
  background: #f2faf8;
  color: #173f45;
}
.clock-incident-card.type-overtime {
  border-color: #edc6a4;
  border-left-color: #8f4f2b;
  background: #fff7e8;
  color: #4b2b17;
}
.clock-incident-card.type-review {
  border-color: #c3ccd0;
  border-left-color: #45565c;
  background: #f1f5f6;
  color: #273c3f;
}
.clock-download-panel {
  overflow: hidden;
}
.clock-download-month-form {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 10px;
  align-items: end;
  margin-bottom: 14px;
}
.clock-download-month-form label {
  min-width: 0;
  display: grid;
  gap: 6px;
  color: var(--muted);
  font-weight: 900;
}
.clock-download-actions {
  display: grid;
  gap: 10px;
}
.clock-download-card {
  display: grid;
  gap: 4px;
  min-width: 0;
  border: 1px solid #bfd6d2;
  border-radius: 8px;
  padding: 14px;
  background: #f4faf8;
  color: #173f45;
  text-decoration: none;
}
.clock-download-card span {
  color: #176b73;
  font-size: 12px;
  font-weight: 900;
  text-transform: uppercase;
}
.clock-download-card strong {
  font-size: 18px;
  line-height: 1.2;
}
.clock-download-card small {
  color: #45565c;
  font-weight: 800;
}
.clock-download-footer {
  margin-top: 12px;
}
.clock-close-panel {
  overflow: hidden;
}
.clock-close-hero {
  display: grid;
  gap: 5px;
  margin-bottom: 14px;
  border: 1px solid #d7e4e2;
  border-left: 6px solid var(--brand);
  border-radius: 8px;
  padding: 16px;
  background: #f7fbfa;
}
.clock-close-hero span {
  color: var(--muted);
  font-size: 12px;
  font-weight: 900;
  text-transform: uppercase;
}
.clock-close-hero strong {
  color: #173f45;
  font-size: 24px;
  line-height: 1.1;
}
.clock-close-hero small {
  color: #45565c;
  font-weight: 900;
  line-height: 1.35;
}
.clock-close-summary {
  display: grid;
  gap: 10px;
  margin-bottom: 14px;
}
.clock-close-summary article,
.clock-close-checklist article,
.clock-close-confirmed,
.clock-close-notes article {
  display: grid;
  gap: 4px;
  min-width: 0;
  border: 1px solid #d7e4e2;
  border-radius: 8px;
  padding: 12px;
  background: #ffffff;
}
.clock-close-summary span,
.clock-close-checklist span,
.clock-close-confirmed span,
.clock-close-notes span {
  color: var(--muted);
  font-size: 12px;
  font-weight: 900;
  text-transform: uppercase;
}
.clock-close-summary strong,
.clock-close-checklist strong,
.clock-close-confirmed strong,
.clock-close-notes strong {
  color: #173f45;
  font-size: 16px;
  line-height: 1.25;
  overflow-wrap: anywhere;
}
.clock-close-summary small,
.clock-close-checklist small,
.clock-close-confirmed small {
  color: #45565c;
  font-weight: 800;
}
.clock-close-checklist {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
  margin-bottom: 14px;
}
.clock-close-checklist article {
  background: #fbfdfd;
}
.clock-close-explain {
  display: grid;
  gap: 5px;
  margin-bottom: 12px;
  border: 1px solid #bfd6d2;
  border-radius: 8px;
  padding: 12px;
  background: #f4faf8;
  color: #173f45;
}
.clock-close-explain span {
  color: #176b73;
  font-size: 12px;
  font-weight: 900;
  text-transform: uppercase;
}
.clock-close-explain strong {
  font-size: 16px;
  line-height: 1.25;
}
.clock-close-explain small {
  color: #45565c;
  font-weight: 800;
  line-height: 1.35;
}
.clock-close-form {
  display: grid;
  gap: 10px;
  margin-top: 12px;
}
.clock-close-form label {
  display: grid;
  gap: 6px;
  color: var(--muted);
  font-weight: 900;
}
.clock-close-form button {
  min-height: 54px;
}
.clock-close-confirmed {
  border-color: #bfd6d2;
  background: #f4faf8;
}
.clock-close-notes {
  display: grid;
  gap: 10px;
  margin-top: 12px;
}
.page-mis-datos {
  max-width: 100%;
  overflow-x: clip;
}
.page-mis-datos > * {
  max-width: 100%;
}
.profile-tabs,
.profile-tabs .student-tab-content,
.profile-autosave-form {
  min-width: 0;
  max-width: 100%;
}
.profile-tabs .panel-head {
  flex-wrap: wrap;
}
.profile-tabs .panel-head span,
.profile-autosave-form input,
.readonly-field strong {
  min-width: 0;
  overflow-wrap: anywhere;
}
.profile-tab-nav {
  width: 100%;
  overflow-x: hidden;
}
.profile-tab-nav label {
  flex: 1 1 0;
  min-width: 0;
}
.employee-personal-heading {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 8px 20px;
  margin-bottom: 12px;
}
.employee-personal-heading nav { display: flex; flex-wrap: wrap; gap: 16px; }
.employee-personal-shell .profile-tab-nav label { padding: 9px 12px; font-size: 14px; }
.teacher-professional-header {
  display: flex;
  align-items: center;
  gap: 16px;
}
.teacher-professional-avatar {
  flex: 0 0 64px;
  width: 64px;
  height: 64px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  background: var(--brand);
  color: #fff;
  font-size: 28px;
  font-weight: 850;
}
.teacher-professional-header span {
  color: var(--muted);
  font-size: 13px;
  font-weight: 750;
  text-transform: uppercase;
}
.teacher-professional-header h2,
.teacher-professional-header p {
  margin: 4px 0 0;
}
.readonly-field {
  display: grid;
  gap: 7px;
  min-height: 44px;
  padding: 10px 12px;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: var(--soft);
}
.readonly-field span {
  color: var(--muted);
  font-size: 13px;
  font-weight: 800;
}
.readonly-field strong {
  color: var(--ink);
  font-size: 15px;
}
.seniority-panel {
  margin-top: 12px;
  border-left: 6px solid var(--brand);
  background: #f7fbfa;
}
.seniority-value {
  display: grid;
  gap: 5px;
}
.seniority-value strong {
  color: var(--ink);
  font-size: 24px;
  line-height: 1.15;
}
.seniority-value small {
  color: var(--muted);
  font-weight: 800;
}
.autosave-status {
  grid-column: 1 / -1;
  min-height: 18px;
  margin: -2px 0 0;
  color: var(--muted);
  font-size: 13px;
  font-weight: 800;
}
.autosave-status[data-state="saved"] {
  color: var(--brand);
}
.autosave-status[data-state="error"] {
  color: var(--danger);
}
.section-details {
  padding: 0;
  overflow: hidden;
}
.section-details summary {
  cursor: pointer;
  list-style: none;
  display: flex;
  justify-content: space-between;
  gap: 12px;
  align-items: center;
  padding: 16px 18px;
}
.section-details summary::-webkit-details-marker { display: none; }
.section-details summary span {
  font-size: 18px;
  font-weight: 900;
}
.section-details summary small {
  color: var(--muted);
  font-weight: 800;
}
.section-details summary::after {
  content: "+";
  color: var(--brand);
  font-weight: 900;
}
.section-details[open] summary::after { content: "-"; }
.section-details-body {
  border-top: 1px solid var(--line);
  padding: 0;
}
.section-details-body > .panel {
  border: 0;
  border-radius: 0;
  box-shadow: none;
  margin-bottom: 0;
  padding: 14px;
}
.section-details-body > .table-panel {
  padding-left: 0;
  padding-right: 0;
}
.section-details-body > .table-panel .panel-head,
.section-details-body > .table-panel .panel-footer {
  padding-left: 14px;
  padding-right: 14px;
}
.table-panel {
  overflow: hidden;
}
.group-student-sort {
  display: flex;
  align-items: end;
  gap: 10px;
  flex-wrap: wrap;
  margin: 10px 0 6px;
}
.group-student-sort label {
  display: grid;
  gap: 4px;
  min-width: min(230px, 100%);
}
.group-student-actions {
  align-items: center;
  flex-wrap: wrap;
}
.group-student-actions .inline-form { min-width: 0; width: auto; }
.group-student-actions .danger-secondary { background: #b74438; }
.group-student-actions .danger-secondary:hover { background: #94352d; }
.group-students-table th:first-child,
.group-students-table td:first-child { width: 118px; white-space: nowrap; }
@media (max-width: 600px) {
  .teacher-cash-page .panel-head { display: flex; flex-direction: column; align-items: flex-start; gap: 6px; }
  .teacher-cash-page .panel-head h2,
  .teacher-cash-page .panel-head span { width: 100%; max-width: 100%; overflow-wrap: anywhere; }
  .teacher-mobile-table .table-wrap { overflow: visible; }
  .teacher-mobile-table table,
  .teacher-mobile-table tbody { display: block; width: 100%; min-width: 0; }
  .teacher-mobile-table thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); }
  .teacher-mobile-table tr { display: block; padding: 12px 0; border-bottom: 1px solid #dce3e0; }
  .teacher-mobile-table td { display: block; width: auto; max-width: 100%; padding: 6px 12px; white-space: normal; overflow-wrap: anywhere; border: 0; }
  .teacher-mobile-table td::before { content: attr(data-label); display: block; font-size: 12px; font-weight: 600; color: #52635d; margin-bottom: 3px; }
  .teacher-mobile-table td[data-label="Accion"]::before { display: none; }
  .teacher-mobile-table form.inline-form { min-width: 0 !important; max-width: none !important; width: 100%; }
  .teacher-mobile-table select,
  .teacher-mobile-table input { max-width: 100%; }
  .group-student-sort { display: grid; grid-template-columns: 1fr; }
  .group-student-sort label { min-width: 0; }
  .group-student-actions { justify-content: flex-start; }
}
.table-wrap {
  width: 100%;
  max-width: 100%;
  overflow-x: auto;
  overflow-y: hidden;
  -webkit-overflow-scrolling: touch;
  overscroll-behavior-x: contain;
}
.group-list-panel .table-wrap {
  max-height: 470px;
  overflow-y: auto;
}
.group-list-panel th {
  position: sticky;
  top: 0;
  z-index: 1;
}
table { width: 100%; border-collapse: collapse; min-width: 680px; }
.student-list-panel .table-wrap {
  overflow-x: hidden;
}
.student-list-panel table {
  min-width: 0;
  table-layout: fixed;
}
.teacher-attendance-panel .table-wrap {
  overflow-x: hidden;
}
.teacher-attendance-panel table {
  min-width: 0;
  table-layout: fixed;
}
.training-list-panel .table-wrap {
  overflow-x: hidden;
}
.training-history-panel .table-wrap {
  overflow-x: hidden;
}
.parent-class-panel .table-wrap {
  overflow-x: hidden;
}
.training-list-panel table,
.training-history-panel table,
.parent-class-panel table {
  min-width: 0;
  table-layout: fixed;
}
.student-list-panel th:first-child,
.student-list-panel td:first-child {
  width: auto;
}
.training-list-panel th,
.training-list-panel td,
.training-history-panel th,
.training-history-panel td,
.parent-class-panel th,
.parent-class-panel td {
  white-space: normal;
  overflow-wrap: anywhere;
}
.training-list-panel th:first-child,
.training-list-panel td:first-child {
  width: auto;
}
.training-list-panel th:nth-child(2),
.training-list-panel td:nth-child(2) {
  width: 96px;
}
.training-list-panel th:nth-child(3),
.training-list-panel td:nth-child(3) {
  width: 78px;
}
.training-list-panel th:last-child,
.training-list-panel td:last-child {
  width: 66px;
  text-align: right;
}
.training-history-panel th:first-child,
.training-history-panel td:first-child {
  width: 35%;
}
.training-history-panel th:nth-child(2),
.training-history-panel td:nth-child(2) {
  width: 112px;
}
.parent-class-panel th:first-child,
.parent-class-panel td:first-child {
  width: 24%;
}
.parent-class-panel th:nth-child(3),
.parent-class-panel td:nth-child(3) {
  width: 62px;
}
.parent-class-panel th:nth-child(4),
.parent-class-panel td:nth-child(4) {
  width: 72px;
}
.teacher-attendance-panel th:first-child,
.teacher-attendance-panel td:first-child {
  width: 82px;
}
.student-list-panel th:last-child,
.student-list-panel td:last-child {
  width: 92px;
  text-align: right;
}
.teacher-attendance-panel th:last-child,
.teacher-attendance-panel td:last-child {
  width: 108px;
  text-align: right;
}
.student-list-panel .table-action {
  width: 74px;
  padding: 0 8px;
}
.student-directory-table th:last-child,
.student-directory-table td:last-child {
  width: 24%;
  text-align: left;
}
.student-directory-table .text-link,
.student-directory-footer .text-link {
  display: inline;
}
.text-link {
  color: var(--accent);
  font-weight: 700;
  text-decoration: underline;
  text-underline-offset: 3px;
}
.text-link:hover,
.text-link:focus {
  color: var(--brand-dark);
}
.economic-context-links {
  margin-top: 8px;
  font-size: 13px;
  overflow-wrap: anywhere;
}
.metrics.group-detail-metrics {
  grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));
}
.group-detail-metrics .metric { padding: 12px; }
.group-detail-metrics .metric strong { font-size: 18px; }
.inline-form.group-payment-inline-form {
  display: grid;
  grid-template-columns: repeat(2, minmax(140px, 1fr));
  gap: 8px;
  min-width: 290px;
  max-width: 420px;
}
.group-payment-inline-form select { min-width: 0; width: 100%; }
.payment-sepa-inline, .group-payment-confirm { grid-column: 1 / -1; }
.payment-sepa-inline { display: grid; gap: 8px; }
.payment-sepa-inline[hidden] { display: none; }
.payment-sepa-inline label { min-width: 0; }
.payment-sepa-inline .economic-context-links { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px; }
.payment-sepa-inline small:empty { display: none; }
.student-quick-search-panel {
  max-width: 780px;
}
.student-quick-search {
  display: grid;
  gap: 10px;
}
.student-quick-search label {
  color: var(--text);
  font-weight: 700;
}
.student-quick-search input {
  margin-top: 6px;
  width: 100%;
}
.student-quick-results {
  max-height: 360px;
  overflow-y: auto;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
}
.student-quick-result {
  display: block;
  padding: 10px 12px;
  border-bottom: 1px solid var(--line);
  color: var(--text);
  text-decoration: none;
}
.student-quick-result:last-child {
  border-bottom: 0;
}
.student-quick-result strong,
.student-quick-result span {
  display: block;
}
.student-quick-result span {
  margin-top: 2px;
  color: var(--muted);
  font-size: 0.9rem;
}
.student-quick-result:hover,
.student-quick-result:focus {
  background: var(--soft);
}
.student-directory-footer {
  margin-top: 12px;
}
.activity-select-card-list {
  display: grid;
  gap: 10px;
}
.activity-select-filter {
  margin-bottom: 14px;
}
.activity-select-card {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 10px;
  align-items: center;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #ffffff;
  padding: 12px;
}
.activity-select-card span {
  display: inline-flex;
  width: fit-content;
  margin-bottom: 4px;
  border-radius: 999px;
  background: #edf8f6;
  color: var(--brand);
  padding: 3px 8px;
  font-size: 12px;
  font-weight: 900;
}
.activity-select-card strong {
  display: block;
  color: var(--ink);
  font-size: 16px;
}
.activity-select-card small {
  display: block;
  color: var(--muted);
  overflow-wrap: anywhere;
}
.activity-select-card em {
  color: var(--brand-dark);
  font-style: normal;
  font-weight: 900;
  white-space: nowrap;
}
.activity-select-actions {
  grid-column: 1 / -1;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.activity-select-actions .inline-form {
  margin: 0;
}
.friend-referral-fields {
  grid-column: 1 / -1;
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 8px;
  padding: 10px;
  border: 1px dashed #9bc8bd;
  border-radius: 8px;
  background: #f6fbfa;
}
.friend-referral-fields label {
  margin: 0;
}
.activity-select-actions button,
.activity-select-actions .table-action {
  min-height: 36px;
  padding: 0 12px;
}
.admin-calendar-nav {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-bottom: 12px;
}
.admin-calendar-grid {
  display: grid;
  grid-template-columns: repeat(7, minmax(0, 1fr));
  gap: 4px;
}
.admin-calendar-weekdays {
  margin-bottom: 4px;
}
.admin-calendar-weekdays div {
  padding: 7px 2px;
  color: var(--muted);
  font-size: 12px;
  font-weight: 900;
  text-align: center;
}
.admin-calendar-day {
  min-height: 54px;
  display: grid;
  gap: 3px;
  align-content: center;
  justify-items: center;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #ffffff;
  color: var(--ink);
  text-decoration: none;
}
.admin-calendar-day strong {
  width: 28px;
  height: 28px;
  display: grid;
  place-items: center;
  border-radius: 999px;
  font-size: 14px;
}
.admin-calendar-day small {
  min-height: 16px;
  color: var(--brand);
  font-size: 12px;
  font-weight: 900;
}
.admin-calendar-day.is-outside {
  opacity: .38;
}
.admin-calendar-day.is-today strong {
  background: #f3b05c;
  color: var(--brand-dark);
}
.admin-calendar-day.is-selected {
  border-color: var(--brand);
  background: #edf8f6;
}
.admin-calendar-day.is-day-off {
  border-color: #b46a1f;
  background: #fff7e8;
}
.admin-calendar-day.has-context {
  box-shadow: inset 0 -4px 0 #f3b05c;
}
.central-calendar-day {
  min-height: 66px;
  padding: 4px;
}
.central-calendar-day small {
  max-width: 100%;
  display: block;
  overflow-wrap: anywhere;
  text-align: center;
  line-height: 1.2;
}
.central-calendar-events {
  display: grid;
  gap: 10px;
}
.central-calendar-event {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 10px;
  align-items: center;
  padding: 12px;
  border: 1px solid var(--line);
  border-left: 5px solid var(--brand);
  border-radius: 8px;
  background: #fff;
}
.central-calendar-event.event-class { border-left-color: #2f6d4e; }
.central-calendar-event.event-employee { border-left-color: #b46a1f; }
.central-calendar-event.event-case { border-left-color: #315155; }
.central-calendar-event.event-context { border-left-color: #b46a1f; background: #fffaf0; }
.calendar-day-off-context,
.calendar-affected-classes {
  display: grid;
  gap: 8px;
  margin-top: 12px;
}
.calendar-day-off-disclosure {
  margin-top: 18px;
  margin-bottom: 18px;
}
.calendar-day-off-context h3,
.calendar-affected-classes h3 {
  margin: 0;
  color: var(--ink);
  font-size: 13px;
  letter-spacing: 0;
}
.central-calendar-event span,
.central-calendar-event em,
.central-calendar-event small {
  display: block;
  color: var(--muted);
  font-size: 12px;
  font-style: normal;
  overflow-wrap: anywhere;
}
.central-calendar-event strong {
  display: block;
  color: var(--ink);
  overflow-wrap: anywhere;
}
.employee-activity-hero .form-grid {
  margin-top: 10px;
}
.employee-activity-hero .employee-activity-personal-selector {
  display: flex;
  flex-wrap: wrap;
  align-items: end;
  gap: 12px;
}
.employee-activity-personal-selector > label { flex: 0 1 220px; }
.employee-activity-personal-selector .form-actions { margin: 0; padding: 0; }
.employee-activity-list,
.employee-activity-notes {
  display: grid;
  gap: 10px;
}
.employee-activity-event {
  display: grid;
  grid-template-columns: 82px minmax(0, 1fr) auto;
  gap: 12px;
  align-items: center;
  padding: 12px;
  border: 1px solid var(--line);
  border-left: 5px solid var(--brand);
  border-radius: 6px;
  background: #fff;
}
.employee-activity-event.event-clase { border-left-color: #2f6d4e; }
.employee-activity-event.event-fichaje { border-left-color: #315155; }
.employee-activity-event.event-incidencia { border-left-color: #b83232; }
.employee-activity-event.event-vacaciones { border-left-color: #b46a1f; }
.employee-activity-event.event-nota { border-left-color: #5b5f66; }
.employee-activity-event span,
.employee-activity-event small,
.employee-activity-note span {
  color: var(--muted);
  font-size: 13px;
  font-weight: 800;
}
.employee-activity-event strong,
.employee-activity-note strong {
  display: block;
  color: var(--ink);
  overflow-wrap: anywhere;
}
.employee-activity-event small {
  display: block;
  margin-top: 3px;
  overflow-wrap: anywhere;
}
.employee-activity-note {
  display: grid;
  gap: 5px;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: var(--soft);
}
.employee-activity-note p {
  margin: 0;
  overflow-wrap: anywhere;
}
.employee-activity-note-form {
  margin-top: 12px;
}
.teacher-attendance-panel .table-action {
  width: 92px;
  padding: 0 8px;
}
.training-list-panel .table-action {
  width: 52px;
  padding: 0 6px;
}
th, td {
  text-align: left;
  border-bottom: 1px solid var(--line);
  padding: 11px 10px;
  vertical-align: top;
}
th {
  color: #315155;
  font-size: 13px;
  background: var(--soft);
}
td { color: #273c3f; }
.empty { text-align: center; color: var(--muted); padding: 24px; }
.table-action {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 34px;
  padding: 0 12px;
  border-radius: 6px;
  background: var(--brand);
  color: white;
  font-weight: 800;
  text-decoration: none;
}
.table-action:hover { background: var(--brand-dark); }
.compact-payment-status {
  display: grid;
  gap: 5px;
  min-width: 160px;
}
.compact-payment-status strong {
  font-size: 13px;
  line-height: 1.25;
}
.compact-payment-status small {
  color: var(--muted);
  font-weight: 700;
}
.compact-payment-status .table-action {
  width: fit-content;
  min-height: 30px;
  padding: 0 9px;
  font-size: 12px;
}
.compact-data-status {
  display: grid;
  gap: 4px;
  min-width: 150px;
}
.compact-data-status strong {
  font-size: 13px;
  line-height: 1.25;
}
.compact-data-status.warning strong { color: #8a4b00; }
.compact-data-status ul {
  margin: 0;
  padding-left: 16px;
  color: var(--muted);
  font-size: 12px;
}
.group-setup-status {
  display: grid;
  gap: 4px;
  min-width: 180px;
}
.group-setup-status strong {
  font-size: 13px;
  line-height: 1.25;
}
.group-setup-status.ready strong {
  color: #1f6f43;
}
.group-setup-status.pending strong {
  color: #8a4b00;
}
.group-setup-status ul {
  margin: 0;
  padding-left: 16px;
  color: var(--muted);
  font-size: 12px;
}
.group-setup-status a {
  color: inherit;
  font-weight: 700;
}
.group-setup-status small {
  color: var(--muted);
  font-size: 12px;
  font-weight: 700;
}
.panel-footer {
  display: flex;
  justify-content: flex-end;
  padding-top: 12px;
}
.table-actions {
  display: grid;
  gap: 8px;
  min-width: 240px;
}
.table-actions form {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  align-items: center;
}
.table-actions input,
.table-actions select {
  min-height: 34px;
  padding: 6px 8px;
}
.table-actions input[name="amount"] { width: 84px; }
.table-actions input[name="payment_date"] { width: 138px; }
.table-actions button { min-height: 34px; padding: 0 10px; }
.student-payment-panel .table-actions {
  min-width: 0;
  max-width: 100%;
  white-space: normal;
}
.student-payment-panel .table-actions button {
  max-width: 100%;
  padding: 7px 10px;
  white-space: normal;
}
.student-payment-activity-settings { display: grid; gap: 12px; margin-top: 18px; }
.student-payment-activity-setting { border-top: 1px solid var(--line); padding-top: 14px; }
.student-payment-activity-heading { display: flex; justify-content: space-between; gap: 16px; align-items: flex-start; }
.student-payment-activity-heading h3 { margin: 0; font-size: 1rem; }
.student-payment-activity-heading p { margin: 4px 0 0; color: var(--muted); }
.student-payment-activity-heading > span { color: var(--muted); font-size: .88rem; text-align: right; }
.student-payment-activity-form { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)) auto; gap: 10px; align-items: end; margin-top: 12px; }
.student-payment-activity-form label { display: grid; gap: 5px; font-weight: 700; }
.student-payment-activity-form select { width: 100%; min-height: 40px; }
.student-payment-activity-form button { min-height: 40px; white-space: nowrap; }
@media (max-width: 600px) {
  .student-payment-activity-heading { display: grid; gap: 6px; }
  .student-payment-activity-heading > span { text-align: left; overflow-wrap: anywhere; }
  .student-payment-activity-form { grid-template-columns: 1fr; }
  .student-payment-activity-form button { width: 100%; }
}
.review-form {
  display: grid;
  gap: 6px;
  min-width: 260px;
}
.review-form select,
.review-form input {
  min-height: 34px;
  padding: 6px 8px;
}
.review-form button { min-height: 34px; }
.clean { margin: 0; padding-left: 18px; color: var(--muted); line-height: 1.6; }
code { background: #eef3f2; padding: 2px 5px; border-radius: 4px; }
.details { display: grid; gap: 10px; margin: 0; }
.details div { display: grid; grid-template-columns: 110px 1fr; gap: 12px; }
.details dt { color: var(--muted); font-weight: 800; }
.details dd { margin: 0; }
.admin-class-shell .admin-class-tabs { grid-template-columns:repeat(4,minmax(0,1fr)); margin:8px 0 16px; }
.admin-class-shell .panel-head p { margin:6px 0 0; }
.admin-class-shell .class-substitution-panel > .details { grid-template-columns:repeat(3,minmax(0,1fr)); margin-bottom:16px; }
.admin-class-shell .class-substitution-panel > .details div { grid-template-columns:1fr; gap:4px; }
.admin-class-shell .class-inline-notice { padding:12px 0; border-top:1px solid var(--line); }
.admin-class-shell .class-inline-notice .details { grid-template-columns:repeat(2,minmax(0,1fr)); margin:8px 0; }
.admin-class-shell .class-inline-notice .details div { grid-template-columns:110px minmax(0,1fr); }
.admin-class-shell .section-details { margin:12px 0; }
.admin-class-shell .class-substitution-panel .section-details { box-shadow:none; border:0; padding:0; }
.admin-class-shell .class-substitution-panel .form-grid { margin-top:12px; }
.admin-class-shell .class-substitution-panel .details dd { overflow-wrap:anywhere; }
.form-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
}
.form-grid .wide { grid-column: 1 / -1; }
.employee-password-reveal {
  display: grid;
  gap: 10px;
  font-weight: 700;
}
.employee-password-reveal code {
  display: block;
  max-width: 100%;
  padding: 10px 12px;
  overflow-wrap: anywhere;
  font-size: 16px;
}
.employee-password-reveal .table-action { justify-self: start; }
.employee-password-toggle {
  grid-template-columns: auto minmax(0, 1fr);
  align-items: center;
  justify-content: start;
}
.employee-password-toggle input[type="checkbox"] {
  width: 20px;
  height: 20px;
  min-height: 20px;
  margin: 0;
  padding: 0;
}
.employee-role-selector {
  min-width: 0;
  margin: 0;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 6px;
}
.employee-role-selector legend {
  padding: 0 5px;
  color: var(--muted);
  font-size: 13px;
  font-weight: 800;
}
.employee-role-options {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(170px, 1fr));
  gap: 8px;
}
.employee-role-option {
  display: flex;
  min-width: 0;
  min-height: 44px;
  align-items: center;
  gap: 9px;
  padding: 9px 11px;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: #fff;
  color: var(--ink);
  font-weight: 800;
  cursor: pointer;
}
.employee-role-option:has(input:checked) {
  border-color: var(--brand);
  background: #eef7f4;
}
.employee-role-option input[type="checkbox"] {
  width: 20px;
  height: 20px;
  min-height: 20px;
  flex: 0 0 20px;
  margin: 0;
  padding: 0;
}
.employee-role-help { margin: 8px 0 0; }
.employee-role-history { margin: 10px 0 0; }
.field-with-inline-link {
  display: grid;
  gap: 6px;
}
.field-label-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  color: var(--muted);
  font-weight: 800;
  font-size: 13px;
}
.field-label-row a {
  color: var(--brand);
  font-weight: 800;
  text-decoration: none;
}
.field-label-row a:hover { text-decoration: underline; }
.extraescolar-modality-list {
  display: grid;
  gap: 8px;
}
.extraescolar-modality-row {
  display: grid;
  grid-template-columns: auto minmax(140px, 1fr) 120px minmax(220px, 2fr);
  gap: 10px;
  align-items: center;
  min-height: 0;
  padding: 8px 10px;
  border: 1px solid var(--border);
  border-radius: 8px;
  background: #fff;
}
.extraescolar-modality-row input[type="checkbox"] {
  width: 16px;
  height: 16px;
}
.extraescolar-modality-row input[inputmode="decimal"] {
  min-height: 34px;
  padding: 6px 8px;
}
.extraescolar-modality-row small {
  color: var(--muted);
  font-weight: 700;
}
.extraescolar-payment-simulation {
  display: grid;
  gap: 14px;
}
.extraescolar-requirement-list {
  display: grid;
  gap: 8px;
}
.extraescolar-requirement-row {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 10px;
  align-items: center;
  padding: 7px 9px;
  border: 1px solid var(--border);
  border-radius: 8px;
  background: #fff;
}
.extraescolar-requirement-row input {
  width: 16px;
  height: 16px;
}
.extraescolar-compact-details {
  margin-top: 10px;
}
.extraescolar-compact-details summary {
  color: var(--brand);
  cursor: pointer;
  font-weight: 800;
}
.extraescolar-compact-details .extraescolar-requirement-list {
  margin-top: 8px;
}
.extraescolar-simulation-block h3 {
  margin: 0 0 8px;
}
.extraescolar-preview-intro,
.extraescolar-preview-create {
  display: flex;
  justify-content: space-between;
  gap: 18px;
  align-items: center;
}
.extraescolar-preview-intro h2,
.extraescolar-preview-create h2 {
  margin: 0 0 4px;
}
.extraescolar-preview-intro p,
.extraescolar-preview-create p {
  margin: 0;
  color: var(--muted);
}
.extraescolar-preview-intro strong {
  text-align: right;
  font-size: 18px;
}
.extraescolar-preview-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
}
.extraescolar-preview-details {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
  margin: 0;
}
.extraescolar-preview-details div {
  min-width: 0;
}
.extraescolar-preview-details dt {
  margin-bottom: 3px;
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
  text-transform: uppercase;
}
.extraescolar-preview-details dd {
  margin: 0;
  font-weight: 800;
  overflow-wrap: anywhere;
}
.extraescolar-preview-list {
  margin: 0;
  padding-left: 18px;
}
.extraescolar-preview-list li {
  margin: 5px 0;
}
.extraescolar-preview-main {
  margin: 0 0 10px;
  font-weight: 800;
}
.extraescolar-preview-alerts {
  border-color: #e7b85b;
  background: #fff9ec;
}
.birth-date-fields {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
}
.birth-title {
  grid-column: 1 / -1;
  display: flex;
  justify-content: space-between;
  gap: 12px;
  align-items: center;
  color: var(--muted);
  font-weight: 800;
  font-size: 13px;
}
.birth-title strong {
  color: var(--ink);
  font-size: 14px;
}
.number-stepper {
  display: grid;
  gap: 6px;
}
.number-stepper > span {
  color: var(--muted);
  font-weight: 800;
  font-size: 13px;
}
.number-stepper > div {
  display: grid;
  grid-template-columns: 38px minmax(0, 1fr) 38px;
  gap: 5px;
  align-items: stretch;
}
.number-stepper button {
  min-height: 42px;
  padding: 0;
  border-radius: 6px;
  background: #e8f3f1;
  color: #1f555b;
  font-size: 20px;
  line-height: 1;
}
.number-stepper button:hover {
  background: #d6ebe7;
}
.number-stepper input {
  text-align: center;
  font-weight: 800;
  min-width: 0;
}
.birth-summary {
  grid-column: 1 / -1;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fbfdfd;
  color: var(--muted);
  padding: 10px 12px;
  font-weight: 800;
  display: grid;
  gap: 4px;
}
.birth-summary strong {
  color: var(--ink);
}
.birth-summary small {
  color: var(--muted);
  font-weight: 700;
  line-height: 1.35;
}
.guardian-options {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
  align-content: start;
}
.guardian-options > span {
  grid-column: 1 / -1;
  color: var(--muted);
  font-weight: 800;
  font-size: 13px;
}
.guardian-options label {
  min-height: 44px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #ffffff;
  font-weight: 800;
}
.guardian-options label:has(input:checked) {
  border-color: var(--brand);
  background: #e8f3f1;
  color: #1f555b;
}
.guardian-options input {
  width: auto;
  min-height: auto;
}
.checkbox-row {
  display: flex;
  align-items: center;
  gap: 10px;
  min-height: 44px;
}
.checkbox-row input {
  width: auto;
  min-height: auto;
}
.form-actions {
  grid-column: 1 / -1;
  display: flex;
  justify-content: flex-end;
}
.inline-form { display: inline-flex; margin: 0 10px 0 0; }
.calendar-entry-status-form {
  margin: 0;
}
.calendar-entry-status-form button {
  min-height: 34px;
  padding: 0 10px;
  white-space: nowrap;
}
.calendar-entry-disable {
  background: #c76428;
}
.calendar-entry-disable:hover {
  background: #a94f18;
}
.calendar-entry-enable {
  background: #176b73;
}
.calendar-entry-enable:hover {
  background: #11525a;
}
.danger-zone button { background: var(--danger); }
.danger-zone button:hover { background: #94352d; }
.class-reactivation-panel {
  border-left: 5px solid #c76428;
  background: #fffaf4;
}
.class-discount-warning-panel {
  border-left: 5px solid #8f4f2b;
  background: #fff7e8;
}
.class-pending-resolution-panel {
  border-left: 5px solid #b74438;
  background: #fff6f5;
}
.class-pending-resolution-panel p {
  margin-top: 0;
}
.class-discount-warning-panel p {
  margin-top: 0;
}
.class-reactivation-panel p {
  margin-top: 0;
}
button.danger-secondary, .group-delete-access .danger-secondary {
  background: #c76428;
}
button.danger-secondary:hover, .group-delete-access .danger-secondary:hover {
  background: #a94f18;
}
.attendance-list {
  display: grid;
  gap: 10px;
  margin: 16px 0;
}
.attendance-row {
  display: grid;
  grid-template-columns: minmax(180px, 1fr) 170px minmax(180px, 1fr);
  gap: 10px;
  align-items: end;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fbfdfd;
}
.attendance-row strong,
.attendance-row small { display: block; }
.attendance-row small {
  color: var(--muted);
  margin-top: 4px;
}
@media (max-width: 900px) {
  .app-shell { grid-template-columns: 1fr; }
  .app-shell.role-profesor:has(.teacher-session-attendance-shell),
  .app-shell.role-profesor:has(.teacher-live-shell),
  .app-shell.role-profesor:has(.teacher-incident-shell),
  .app-shell.role-profesor:has(.teacher-message-shell),
  .app-shell.role-profesor:has(.teacher-payroll-shell),
  .app-shell.role-profesor:has(.teacher-requests-shell),
  .app-shell.role-profesor:has(.employee-request-detail-summary),
  .app-shell.role-profesor:has(.teacher-inventory-shell),
  .app-shell.role-profesor:has(.training-course-panel),
  .app-shell.role-profesor:has(.manual-panel) { grid-template-rows: auto 1fr; }
  .group-information-form,
  .group-information-subblock,
  .group-enrollment-period {
    grid-template-columns: 1fr;
  }
  .sidebar {
    position: sticky;
    top: 0;
    height: auto;
    overflow-y: visible;
    z-index: 5;
    padding: 8px 10px;
    box-shadow: 0 8px 22px rgba(18, 45, 49, .18);
  }
  .nav-details {
    position: relative;
  }
  .header-more-details {
    position: static;
  }
  .header-more-menu {
    position: fixed;
    top: 58px;
    left: 10px;
    right: 10px;
    width: auto;
    max-height: min(72vh, 560px);
    overflow-y: auto;
  }
  .header-more-menu-grouped {
    width: auto;
  }
  .nav-details summary {
    display: flex;
    flex-wrap: nowrap;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
  }
  .app-logo-link {
    flex: 0 1 auto;
  }
  .role-profesor .app-logo-link {
    justify-content: flex-start;
  }
  .brand { padding: 0; }
  .app-logo {
    width: auto;
    max-width: min(156px, 46vw);
    height: 42px;
    padding: 4px 6px;
  }
  .user-avatar { width: 40px; height: 40px; }
  .user-menu-meta { display: none; }
  .brand-mark { width: 34px; height: 34px; }
  .brand strong { font-size: 15px; }
  .brand small { font-size: 12px; }
  .menu-toggle {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
    min-height: 44px;
    cursor: pointer;
  }
  .nav-details:not([open]) nav { display: none; }
  .sidebar nav {
    position: absolute;
    top: calc(100% + 8px);
    right: 0;
    left: auto;
    z-index: 20;
    width: min(280px, calc(100vw - 20px));
    max-height: calc(100vh - 74px);
    overflow-y: auto;
    grid-template-columns: 1fr;
    gap: 8px;
    margin-top: 0;
    padding: 8px;
    border: 1px solid rgba(255,255,255,.16);
    border-radius: 8px;
    background: var(--brand-dark);
    box-shadow: 0 14px 30px rgba(0,0,0,.26);
  }
  .sidebar nav a {
    background: rgba(255,255,255,.08);
    min-height: 42px;
    display: flex;
    align-items: center;
  }
  .side-nav-group {
    padding: 8px 0;
  }
  .workspace { padding: 18px; }
  .employee-report-trigger {
    right: 14px;
    bottom: 14px;
  }
  .employee-report-overlay { padding: 10px; }
  .employee-report-dialog {
    width: 100%;
    max-height: calc(100vh - 20px);
    padding: 16px;
  }
  .page-pasar-lista, .workspace:has(.teacher-session-attendance-shell) {
    padding-top: 8px;
  }
  .topbar {
    flex-direction: row;
    align-items: center;
    margin-bottom: 16px;
  }
  .temporary-role-notice {
    align-items: stretch;
    flex-direction: column;
    margin-top: 0;
  }
  .temporary-role-notice .table-action { text-align: center; }
  .page-pasar-lista .topbar, .workspace:has(.teacher-session-attendance-shell) .topbar {
    margin-bottom: 10px;
  }
  .page-inline-actions {
    margin: -56px 0 12px;
    min-height: 38px;
  }
  .page-inline-actions .table-action {
    min-height: 38px;
    padding: 0 12px;
  }
  .topbar h1 { font-size: 22px; }
  .topbar .eyebrow { margin-bottom: 4px; }
  .metrics, .grid.two, .feature-grid { grid-template-columns: 1fr; }
  .course-panel-hero {
    grid-template-columns: 1fr;
    align-items: stretch;
    padding: 14px;
  }
  .course-year-form {
    grid-template-columns: 1fr;
  }
  .course-metrics {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .course-area-metrics,
  .course-students-panel .course-area-metrics,
  .course-groups-metrics-panel .course-area-metrics {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .course-groups-table {
    display: none;
  }
  .course-group-cards {
    display: grid;
  }
  .course-enrollment-summary {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .category-grid { grid-template-columns: 1fr; gap: 10px; }
  .admin-hero {
    align-items: stretch;
    flex-direction: column;
    padding: 14px;
  }
  .admin-hero h2 { font-size: 23px; }
  .admin-hero-actions {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
  .admin-hero-actions .table-action {
    min-height: 42px;
    text-align: center;
  }
  .admin-today-grid {
    grid-template-columns: 1fr;
  }
  .admin-today-routine {
    grid-template-columns: 1fr;
    align-items: stretch;
  }
  .admin-today-routine button {
    width: 100%;
  }
  .work-case-card,
  .work-case-control-grid,
  .work-case-summary-grid {
    grid-template-columns: 1fr;
  }
  .work-case-card .table-action,
  .work-case-control-grid button,
  .work-case-control-grid .table-action {
    width: 100%;
    text-align: center;
  }
  .day-control-hero {
    grid-template-columns: 1fr;
    padding: 14px;
  }
  .day-control-hero strong {
    font-size: 24px;
  }
  .day-control-hero .table-action {
    width: 100%;
    text-align: center;
  }
  .day-control-summary {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .day-control-summary .day-control-metric:last-child {
    grid-column: 1 / -1;
  }
  .day-control-attention,
  .day-control-teachers {
    padding: 12px;
  }
  .day-control-attention-item {
    grid-template-columns: 1fr auto;
    padding: 11px;
  }
  .day-control-teacher-grid {
    grid-template-columns: 1fr;
  }
  .admin-clock-shortcuts {
    grid-template-columns: 1fr;
    align-items: stretch;
    margin: 10px 0 14px;
    padding: 12px;
  }
  .admin-clock-actions {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
  .admin-clock-actions .table-action {
    min-width: 0;
    justify-content: center;
    text-align: center;
  }
  .admin-search-panel form {
    grid-template-columns: 1fr;
  }
  .admin-main-actions {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .admin-main-actions-primary {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .employee-clock-review-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .employee-clock-month-kpis,
  .employee-clock-month-grid {
    grid-template-columns: 1fr;
  }
  .employee-clock-month-card dl {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .employee-clock-tabs {
    overflow: hidden;
  }
  .employee-clock-tab-nav {
    gap: 6px;
    padding-bottom: 8px;
  }
  .employee-clock-tab-nav label {
    min-height: 38px;
    padding: 0 11px;
    font-size: 13px;
  }
  .employee-clock-tabs .table-panel {
    overflow: hidden;
  }
  .employee-clock-tabs .table-wrap {
    max-width: 100%;
    overflow-x: auto;
  }
  .employee-clock-tabs .form-grid {
    grid-template-columns: 1fr;
  }
  .employee-clock-tabs .form-actions,
  .employee-clock-incident-review .form-actions {
    display: grid;
    grid-template-columns: 1fr;
    align-items: stretch;
  }
  .employee-clock-tabs .form-actions button,
  .employee-clock-tabs .form-actions .table-action,
  .employee-clock-incident-review .form-actions button {
    width: 100%;
    justify-content: center;
  }
  .clock-employee-day-hero,
  .employee-clock-day-hero {
    grid-template-columns: 1fr;
  }
  .clock-employee-day-hero > div { min-width: 0; }
  .clock-employee-day-hero .table-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
  }
  .clock-month-day.status-sin-fichajes span,
  .clock-month-day.status-sin-fichajes small { display: none; }
  .clock-month-day { min-height: 48px; }
  .clock-month-day a,
  .clock-month-day div { min-height: 46px; overflow-wrap: anywhere; }
  .employee-clock-day-hero .table-actions,
  .employee-clock-day-hero .table-action {
    width: 100%;
  }
  .clock-employee-review-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .employee-overtime-overview {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .employee-clock-preclose-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .employee-overtime-card dl {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .employee-overtime-card-actions .table-actions {
    display: grid;
    grid-template-columns: 1fr;
  }
  .employee-overtime-card-actions .inline-form {
    grid-template-columns: 1fr;
    margin: 0;
  }
  .employee-overtime-card-actions .inline-form input,
  .employee-overtime-card-actions .inline-form button {
    width: 100%;
  }
  .employee-clock-incident-hero {
    grid-template-columns: 1fr;
  }
  .message-related-clock-panel {
    grid-template-columns: 1fr;
    align-items: stretch;
  }
  .message-related-clock-panel .table-actions {
    justify-content: stretch;
  }
  .admin-main-action {
    min-height: 104px;
  }
  .admin-focus-grid {
    grid-template-columns: 1fr;
  }
  .admin-search-result-list {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .student-admin-overview,
  .group-admin-overview {
    grid-template-columns: 1fr;
    align-items: stretch;
  }
  .student-admin-actions,
  .group-admin-actions {
    min-width: 0;
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
  .admin-payment-card {
    grid-template-columns: 82px minmax(0, 1fr) auto;
  }
  .accounting-action-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .admin-payment-card mark {
    justify-self: start;
  }
  .message-inbox-summary,
  .notice-work-summary {
    grid-template-columns: 1fr;
  }
  .message-role-header {
    grid-template-columns: 1fr;
  }
  .message-role-header h2 {
    font-size: 21px;
  }
  .message-role-actions {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .message-role-action {
    min-height: 44px;
    font-size: 13px;
  }
  .notice-card .inline-form {
    grid-template-columns: 1fr;
  }
  .notice-detail-hero {
    grid-template-columns: 1fr;
    padding: 14px;
  }
  .notice-detail-badges {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    justify-items: stretch;
  }
  .notice-detail-badges strong,
  .notice-detail-badges span {
    width: 100%;
  }
  .notice-detail-grid,
  .notice-resolution-form,
  .notice-resolve-inline {
    grid-template-columns: 1fr;
  }
  .notice-context-block .details div {
    grid-template-columns: 82px minmax(0, 1fr);
  }
  .notice-resolution-form .form-actions,
  .notice-resolution-form button,
  .notice-resolve-inline button {
    width: 100%;
  }
  .admin-secondary-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .admin-work-item {
    grid-template-columns: 76px minmax(0, 1fr);
  }
  .admin-work-meta {
    grid-column: 1 / -1;
    grid-template-columns: 1fr auto;
    justify-items: stretch;
    align-items: center;
  }
  .admin-work-meta b {
    justify-content: center;
  }
  .category-card {
    min-height: 108px;
    padding: 14px;
  }
  .category-card strong { font-size: 22px; }
  .category-card p { font-size: 14px; }
  .quick-actions { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .payroll-action-panel {
    grid-template-columns: 1fr;
  }
  .teacher-action-grid,
  .teacher-action-grid-primary {
    grid-template-columns: 1fr;
  }
  .teacher-action-grid-secondary {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .family-home-hero {
    grid-template-columns: 1fr;
    gap: 10px;
  }
  .family-focus-grid {
    grid-template-columns: 1fr;
    gap: 10px;
  }
  .responsible-home-intro strong {
    font-size: 21px;
  }
  .responsible-next-hero,
  .responsible-next-hero.no-class {
    grid-template-columns: 1fr;
    gap: 10px;
    padding: 14px;
  }
  .responsible-next-main strong {
    font-size: 22px;
  }
  .responsible-next-details {
    grid-template-columns: 1fr 1fr;
  }
  .responsible-next-action {
    justify-content: stretch;
  }
  .responsible-next-action .table-action {
    width: 100%;
    justify-content: center;
  }
  .responsible-next-actions {
    display: grid;
    grid-template-columns: 1fr;
  }
  .responsible-secondary-grid,
  .responsible-action-row {
    grid-template-columns: 1fr;
  }
  .responsible-action-row .family-focus-card {
    min-height: 78px;
  }
  .responsible-student-hero {
    grid-template-columns: 1fr;
    padding: 14px;
  }
  .responsible-student-hero strong {
    font-size: 22px;
  }
  .responsible-student-actions {
    grid-template-columns: 1fr;
  }
  .responsible-student-actions .table-action {
    width: 100%;
    justify-content: center;
  }
  .responsible-student-grid {
    grid-template-columns: 1fr;
    gap: 10px;
  }
  .responsible-attendance-card {
    grid-template-columns: 76px minmax(0, 1fr);
  }
  .family-payment-hero {
    grid-template-columns: 1fr;
  }
  .family-student-payment-head {
    grid-template-columns: 1fr;
  }
  .family-student-payment-head dl {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .family-payment-money {
    grid-template-columns: 1fr;
  }
  .family-focus-card {
    min-height: 104px;
    padding: 14px;
  }
  .family-focus-copy strong {
    font-size: 18px;
  }
  .family-main-action {
    min-height: 112px;
    padding: 16px;
  }
  .family-week-panel {
    padding: 14px;
  }
  .parent-next-card {
    grid-template-columns: 1fr auto;
  }
  .parent-next-date {
    grid-column: 1 / -1;
  }
  .family-day-class-card {
    grid-template-columns: 1fr;
  }
  .family-day-class-action .table-action {
    width: 100%;
  }
  .student-next-hero,
  .student-self-hero {
    align-items: stretch;
    flex-direction: column;
    padding: 14px;
  }
  .student-self-actions {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
  .student-self-actions .table-action {
    min-height: 42px;
    text-align: center;
  }
  .teacher-home-hero {
    grid-template-columns: 1fr;
  }
  .teacher-home-hero-link {
    width: 100%;
  }
  .teacher-now-header,
  .teacher-now-card,
  .teacher-now-grid {
    grid-template-columns: 1fr;
  }
  .teacher-now-primary,
  .teacher-now-action .teacher-live-finish,
  .teacher-now-header .table-action {
    width: 100%;
  }
  .teacher-next-class-panel {
    grid-template-columns: 1fr;
  }
  .teacher-next-class-panel .table-action {
    width: 100%;
  }
  .teacher-attendance-day-hero {
    grid-template-columns: 1fr;
  }
  .teacher-attendance-day-hero .table-action {
    width: 100%;
  }
  .teacher-date-form {
    grid-template-columns: 1fr;
  }
  .admin-clock-actions {
    grid-template-columns: 1fr;
  }
  .teacher-home-hero .table-action {
    width: 100%;
  }
  .family-week-strip {
    gap: 5px;
  }
  .family-week-day {
    min-height: 64px;
    padding: 6px 2px;
  }
  .family-week-day strong {
    width: 24px;
    height: 24px;
    font-size: 13px;
  }
  .family-week-day span {
    font-size: 10px;
  }
  .teacher-action-card {
    min-height: 92px;
    padding: 14px;
  }
  .teacher-action-grid-primary .teacher-action-card {
    min-height: 112px;
  }
  .teacher-today-card {
    grid-template-columns: 1fr auto;
  }
  .teacher-class-select-card {
    grid-template-columns: 1fr auto;
  }
  .teacher-assigned-group-list {
    grid-template-columns: 1fr;
  }
  .teacher-assigned-group-card {
    grid-template-columns: 1fr auto;
  }
  .teacher-class-select-card small {
    grid-column: 1;
  }
  .teacher-class-select-card .table-action {
    grid-column: 2;
    grid-row: 1 / span 2;
  }
  .teacher-assigned-group-card .table-actions {
    grid-column: 1 / -1;
    grid-row: auto;
    width: 100%;
    min-width: 0;
  }
  .teacher-session-choice-card {
    grid-template-columns: 1fr;
    align-items: stretch;
  }
  .teacher-session-choice-card .table-action {
    width: 100%;
    justify-content: center;
  }
  .employee-request-card {
    grid-template-columns: 1fr;
    align-items: stretch;
  }
  .employee-request-card-actions,
  .employee-request-card-actions .table-action {
    width: 100%;
  }
  .teacher-today-card small {
    grid-column: 1;
  }
  .teacher-today-card .table-action {
    grid-column: 2;
    grid-row: 1 / span 3;
  }
  .teacher-date-actions {
    justify-content: center;
    gap: 8px;
  }
  .priority-list { grid-template-columns: 1fr; }
  .teacher-calendar-day { min-height: 104px; padding: 6px; }
  .teacher-calendar-event {
    grid-template-columns: 1fr;
    gap: 1px;
    padding: 4px 5px;
  }
  .teacher-calendar-event span { font-size: 11px; }
  .teacher-upcoming-card {
    grid-template-columns: 1fr;
  }
  .teacher-upcoming-actions {
    justify-content: flex-start;
  }
  .table-wrap { margin-left: -2px; margin-right: -2px; }
  table { min-width: 620px; }
  .clock-history-tabs .table-wrap {
    margin-left: 0;
    margin-right: 0;
  }
  .clock-technical-table table {
    min-width: 720px;
  }
  .tutor-overview-grid {
    grid-template-columns: 1fr;
  }
  .tutor-panel-grid {
    grid-template-columns: 1fr;
  }
  .tutor-person-card .details {
    grid-template-columns: 1fr;
  }
  .tutor-search-result {
    align-items: flex-start;
    flex-direction: column;
  }
  .student-list-panel table { min-width: 0; }
  .attendance-row { grid-template-columns: 1fr; }
}
@media (max-width: 560px) {
  .quick-grid, .sidebar nav { grid-template-columns: 1fr; }
  .form-grid { grid-template-columns: 1fr; }
  .login-panel { padding: 20px; }
  .topbar { align-items: flex-start; }
  .course-metrics,
  .course-area-metrics,
  .course-students-panel .course-area-metrics,
  .course-groups-metrics-panel .course-area-metrics,
  .course-group-card dl,
  .course-enrollment-summary,
  .treasury-account-card dl {
    grid-template-columns: 1fr;
  }
  .central-calendar-grid {
    gap: 3px;
  }
  .central-calendar-day {
    min-height: 48px;
    padding: 2px;
  }
  .central-calendar-day strong {
    width: 24px;
    height: 24px;
    font-size: 12px;
  }
  .central-calendar-day small {
    font-size: 10px;
    line-height: 1.1;
  }
  .central-calendar-event {
    grid-template-columns: 1fr;
  }
  .employee-activity-event {
    grid-template-columns: 1fr;
    align-items: stretch;
  }
  .employee-activity-event .table-action {
    width: 100%;
  }
  .birth-date-fields { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .number-stepper > div {
    grid-template-columns: 1fr;
    gap: 4px;
  }
  .number-stepper button {
    min-height: 32px;
  }
  .guardian-options { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .quick-actions { grid-template-columns: 1fr; }
  .teacher-action-grid-primary {
    grid-template-columns: 1fr;
  }
  .teacher-action-grid-secondary { grid-template-columns: 1fr; }
  .teacher-now-card {
    gap: 10px;
    padding: 14px;
    border-left-width: 5px;
  }
  .teacher-now-main strong {
    font-size: 22px;
  }
  .teacher-now-main small {
    font-size: 13px;
  }
  .teacher-now-context,
  .teacher-now-mini,
  .teacher-after-panel {
    padding: 11px;
  }
  .teacher-secondary-links {
    display: grid;
    grid-template-columns: 1fr;
  }
  .teacher-attendance-focus-hero {
    grid-template-columns: 1fr;
    gap: 7px;
    margin-bottom: 7px;
    padding: 10px;
    border-left-width: 4px;
  }
  .teacher-attendance-focus-hero div:first-child {
    gap: 2px;
  }
  .teacher-attendance-focus-hero span {
    font-size: 11px;
  }
  .teacher-attendance-focus-hero strong {
    font-size: 19px;
  }
  .teacher-attendance-focus-hero small {
    font-size: 12px;
    line-height: 1.25;
  }
  .teacher-attendance-count {
    min-height: auto;
    grid-template-columns: auto 1fr;
    justify-content: start;
    justify-items: start;
    gap: 7px;
    padding: 8px 10px;
  }
  .teacher-attendance-count strong {
    font-size: 17px;
  }
  .teacher-live-hero {
    grid-template-columns: 1fr;
  }
  .teacher-live-summary-card {
    grid-template-columns: 1fr;
  }
  .teacher-live-timer {
    min-height: 70px;
  }
  .teacher-live-actions {
    grid-template-columns: 1fr;
  }
  .teacher-live-secondary-actions {
    display: grid;
  }
  .teacher-live-secondary-actions .table-action {
    width: 100%;
  }
  .teacher-live-next {
    grid-template-columns: 1fr;
  }
  .teacher-live-next .table-action {
    grid-column: auto;
    grid-row: auto;
  }
  .teacher-delivery-options {
    grid-template-columns: 1fr;
  }
  .teacher-finish-delivery-form .teacher-delivery-extra-fields input {
    width: calc(100vw - 76px) !important;
    max-width: 100% !important;
  }
  .teacher-attendance-progress {
    grid-template-columns: 1fr;
    gap: 5px;
    margin-bottom: 8px;
  }
  .teacher-attendance-progress span {
    min-height: 28px;
    font-size: 12px;
  }
  .teacher-attendance-state {
    grid-template-columns: 1fr;
    gap: 9px;
    padding: 11px;
  }
  .teacher-attendance-state strong {
    font-size: 17px;
  }
  .teacher-session-primary-action {
    width: 100%;
  }
  .teacher-session-context {
    grid-template-columns: 1fr;
  }
  .teacher-session-secondary-actions {
    display: grid;
    grid-template-columns: 1fr;
  }
  .teacher-attendance-summary { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .teacher-attendance-quick-row {
    grid-template-columns: 1fr;
  }
  .teacher-attendance-buttons {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .family-action-grid { grid-template-columns: 1fr; }
  .family-payment-card {
    grid-template-columns: 1fr;
  }
  .student-self-actions {
    grid-template-columns: 1fr;
  }
  .notice-choice-panel { grid-template-columns: 1fr; }
  .admin-hero-actions { grid-template-columns: 1fr; }
  .admin-main-actions { grid-template-columns: 1fr; }
  .admin-main-actions-primary { grid-template-columns: 1fr; }
  .admin-secondary-grid { grid-template-columns: 1fr; }
  .admin-main-action {
    min-height: 88px;
    flex-direction: row;
    align-items: center;
    justify-content: flex-start;
  }
  .admin-focus-item {
    grid-template-columns: 72px minmax(0, 1fr);
  }
  .admin-search-result-list {
    grid-template-columns: 1fr;
  }
  .student-admin-stats,
  .group-admin-badges {
    grid-template-columns: 1fr;
  }
  .student-admin-actions,
  .group-admin-actions {
    grid-template-columns: 1fr;
  }
  .admin-payment-card {
    grid-template-columns: 1fr;
    align-items: stretch;
  }
  .accounting-action-grid {
    grid-template-columns: 1fr;
  }
  .remittance-actions,
  .remittance-card,
  .bank-movement-card,
  .bank-movement-card .review-form,
  .billing-payment-card,
  .expense-card {
    grid-template-columns: 1fr;
  }
  .remittance-card em,
  .bank-movement-card em,
  .billing-payment-card em,
  .expense-card em {
    white-space: normal;
  }
  .admin-directory-card {
    grid-template-columns: 1fr;
    align-items: stretch;
  }
  .training-course-card {
    grid-template-columns: 1fr;
    align-items: stretch;
  }
  .admin-directory-card .table-action,
  .training-course-card .table-action {
    width: 100%;
  }
  .activity-select-card {
    grid-template-columns: 1fr;
    align-items: stretch;
  }
  .activity-select-card em {
    white-space: normal;
  }
  .admin-work-item {
    grid-template-columns: 1fr;
  }
  .admin-work-meta {
    grid-template-columns: 1fr;
    justify-items: start;
  }
  .metrics { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
  .metric { padding: 12px; }
  .metric strong { font-size: 20px; }
  .student-learning-hero,
  .student-learning-summary-card,
  .student-learning-event-card {
    grid-template-columns: 1fr;
    align-items: stretch;
  }
  .student-learning-hero {
    display: grid;
  }
  .student-learning-actions,
  .student-learning-event-actions {
    justify-content: stretch;
  }
  .student-learning-actions .table-action,
  .student-learning-event-actions .table-action {
    width: 100%;
    justify-content: center;
    text-align: center;
  }
  .clock-card,
  .clock-history-tabs {
    margin-left: 0;
    margin-right: 0;
  }
  .clock-card .panel-head,
  .clock-history-tabs .panel-head {
    align-items: flex-start;
  }
  .clock-card .panel-head span,
  .clock-history-tabs .panel-head span {
    text-align: right;
    overflow-wrap: anywhere;
  }
  .clock-history-tab-nav {
    gap: 6px;
    padding-bottom: 8px;
  }
  .clock-history-tab-nav label {
    min-height: 38px;
    padding: 0 10px;
    font-size: 13px;
  }
  .clock-summary-grid {
    grid-template-columns: 1fr;
  }
  .clock-day-card dl,
  .clock-close-summary {
    grid-template-columns: 1fr;
  }
  .clock-day-card header {
    align-items: flex-start;
  }
  .clock-day-card header span {
    max-width: 48%;
    white-space: normal;
    text-align: center;
  }
  .clock-download-month-form {
    grid-template-columns: 1fr;
  }
  .clock-download-month-form button,
  .clock-close-form button {
    width: 100%;
  }
  .extraescolar-modality-row {
    grid-template-columns: auto 1fr;
  }
  .extraescolar-modality-row input[inputmode="decimal"],
  .extraescolar-modality-row small {
    grid-column: 2;
  }
  .extraescolar-preview-grid {
    grid-template-columns: 1fr;
  }
  .extraescolar-preview-intro,
  .extraescolar-preview-create {
    display: grid;
  }
  .extraescolar-preview-intro strong {
    text-align: left;
  }
  .extraescolar-preview-details {
    grid-template-columns: 1fr;
  }
  .tutor-overview-grid {
    grid-template-columns: 1fr;
  }
  .tutor-panel-grid {
    grid-template-columns: 1fr;
  }
  .tutor-person-card .details {
    grid-template-columns: 1fr;
  }
  .tutor-search-result {
    align-items: flex-start;
    flex-direction: column;
  }
  .clock-technical-table {
    padding-left: 0;
    padding-right: 0;
  }
  .clock-technical-table .panel-head {
    padding-left: 14px;
    padding-right: 14px;
  }
  .clock-technical-table table {
    min-width: 680px;
  }
  .teacher-calendar-panel {
    margin-left: -8px;
    margin-right: -8px;
  }
  .teacher-calendar-weekdays div {
    padding: 8px 2px;
    font-size: 11px;
  }
  .teacher-calendar-day {
    min-height: 92px;
    padding: 4px;
  }
  .teacher-calendar-date span {
    min-width: 24px;
    min-height: 24px;
    font-size: 12px;
  }
  .teacher-calendar-event {
    font-size: 11px;
    padding: 3px 4px;
  }
  .teacher-calendar-more {
    font-size: 11px;
    padding: 1px 4px;
  }
  .panel { padding: 14px; }
  .section-details { padding: 0; }
  .section-details summary { padding: 14px; }
  .section-details-body > .panel { padding: 12px; }
  .section-details-body > .table-panel {
    padding-left: 0;
    padding-right: 0;
  }
  .section-details-body > .table-panel .panel-head,
  .section-details-body > .table-panel .panel-footer {
    padding-left: 12px;
    padding-right: 12px;
  }
  table { min-width: 560px; }
  .student-list-panel table { min-width: 0; }
  .student-list-panel th:last-child,
  .student-list-panel td:last-child {
    width: 84px;
  }
}

.teacher-action-tutorial {
  border-color: #96c9c1;
  background: #edf8f6;
}
.tutorial-shell {
  display: grid;
  gap: 16px;
  max-width: 980px;
  margin: 0 auto;
}
.tutorial-banner {
  position: sticky;
  top: 10px;
  z-index: 20;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 14px;
  align-items: center;
  padding: 14px 16px;
  color: #fff;
  background: #174f56;
  border: 2px solid #0d353a;
  border-radius: 8px;
  box-shadow: 0 10px 24px rgba(13, 53, 58, .22);
}
.tutorial-banner > div { display: grid; gap: 2px; }
.tutorial-banner strong { font-size: 16px; }
.tutorial-banner span { color: #d7efeb; font-weight: 750; }
.tutorial-banner form { margin: 0; }
.tutorial-exit {
  min-height: 42px;
  padding: 0 14px;
  color: #173f45;
  background: #fff;
  border: 0;
  border-radius: 8px;
  font-weight: 900;
  cursor: pointer;
}
.tutorial-progress,
.tutorial-class-header {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(180px, 36%);
  gap: 16px;
  align-items: center;
  padding: 16px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
}
.tutorial-progress > div,
.tutorial-class-header > div { display: grid; gap: 4px; min-width: 0; }
.tutorial-progress strong,
.tutorial-class-header span,
.tutorial-live span,
.tutorial-complete > span {
  color: #176b73;
  font-size: 12px;
  font-weight: 950;
  text-transform: uppercase;
}
.tutorial-progress span { color: var(--muted); font-weight: 800; }
.tutorial-progress progress { width: 100%; height: 14px; accent-color: #176b73; }
.tutorial-focus,
.tutorial-live,
.tutorial-complete {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(220px, auto);
  gap: 20px;
  align-items: center;
  padding: 24px;
  border: 1px solid #b9d5d1;
  border-left: 8px solid #176b73;
  border-radius: 8px;
  background: #f2faf8;
  box-shadow: 0 14px 30px rgba(20, 39, 42, .1);
}
.tutorial-focus > div:first-child,
.tutorial-live > div:first-child { min-width: 0; }
.tutorial-focus span {
  color: #176b73;
  font-size: 12px;
  font-weight: 950;
  text-transform: uppercase;
}
.tutorial-focus h2,
.tutorial-live h2,
.tutorial-complete h2,
.tutorial-class-header h2 { margin: 4px 0 8px; color: #173f45; overflow-wrap: anywhere; }
.tutorial-focus p,
.tutorial-live p,
.tutorial-complete p,
.tutorial-class-header p { margin: 0; color: #45565c; font-weight: 750; line-height: 1.45; }
.tutorial-highlight {
  display: grid;
  gap: 7px;
  padding: 10px;
  border: 3px solid #d07b2c;
  border-radius: 8px;
  background: #fffaf1;
  box-shadow: 0 0 0 5px rgba(208, 123, 44, .12);
}
.tutorial-highlight form { margin: 0; }
.tutorial-highlight small { color: #6d4c2d; font-weight: 850; text-align: center; }
.tutorial-primary {
  min-height: 52px;
  width: 100%;
  padding: 0 18px;
  color: #fff;
  background: #176b73;
  border: 0;
  border-radius: 8px;
  font-size: 16px;
  font-weight: 950;
  cursor: pointer;
}
.tutorial-primary:hover { background: #115860; }
.tutorial-primary:focus-visible,
.tutorial-exit:focus-visible { outline: 3px solid #d07b2c; outline-offset: 3px; }
.tutorial-primary:active { background: #0d454b; transform: translateY(1px); }
.tutorial-class-header { grid-template-columns: minmax(0, 1fr) auto; }
.tutorial-class-header em {
  padding: 7px 10px;
  color: #684114;
  background: #fff2d9;
  border-radius: 6px;
  font-size: 12px;
  font-style: normal;
  font-weight: 900;
}
.tutorial-instruction {
  padding: 16px;
  border-left: 6px solid #d07b2c;
  background: #fff8ec;
}
.tutorial-instruction p { margin: 4px 0 0; }
.tutorial-attendance-form { display: grid; gap: 16px; }
.tutorial-student-list {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}
.tutorial-student {
  min-width: 0;
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(145px, auto);
  gap: 10px;
  align-items: center;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
}
.tutorial-student span { min-width: 0; font-weight: 900; overflow-wrap: anywhere; }
.tutorial-student select { min-height: 42px; width: 100%; }
.tutorial-summary {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
}
.tutorial-summary > div {
  display: grid;
  gap: 4px;
  padding: 14px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
}
.tutorial-summary span { color: var(--muted); font-size: 12px; font-weight: 850; }
.tutorial-summary strong { font-size: 24px; }
.tutorial-live small { display: block; margin-top: 12px; color: var(--muted); font-weight: 800; }
.tutorial-complete { grid-template-columns: 1fr; border-left-color: #2f6e54; }
.tutorial-complete dl { display: flex; flex-wrap: wrap; gap: 10px; margin: 0; }
.tutorial-complete dl div { min-width: 150px; padding: 10px; background: #fff; border: 1px solid var(--line); border-radius: 8px; }
.tutorial-complete dt { color: var(--muted); font-size: 12px; font-weight: 850; }
.tutorial-complete dd { margin: 3px 0 0; font-size: 20px; font-weight: 950; }
.tutorial-complete-actions,
.tutorial-footer-actions { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; }
.tutorial-complete-actions form,
.tutorial-footer-actions form { margin: 0; }
.tutorial-complete-actions .table-action,
.tutorial-footer-actions .table-action { min-height: 44px; }
.tutorial-secondary-action {
  min-height: 44px;
  padding: 0 14px;
  color: #fff;
  background: #176b73;
  border: 0;
  border-radius: 8px;
  font-weight: 900;
  cursor: pointer;
}
.tutorial-secondary-action:hover { background: #115860; }
.tutorial-secondary-action:focus-visible { outline: 3px solid #d07b2c; outline-offset: 3px; }

@media (max-width: 700px) {
  .tutorial-banner,
  .tutorial-progress,
  .tutorial-focus,
  .tutorial-live,
  .tutorial-class-header { grid-template-columns: 1fr; }
  .tutorial-banner { position: relative; top: auto; }
  .tutorial-exit { width: 100%; }
  .tutorial-student-list { grid-template-columns: 1fr; }
  .tutorial-summary { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .tutorial-focus,
  .tutorial-live,
  .tutorial-complete { padding: 18px; }
  .tutorial-footer-actions,
  .tutorial-complete-actions { display: grid; grid-template-columns: 1fr; }
  .tutorial-footer-actions form,
  .tutorial-footer-actions button,
  .tutorial-footer-actions .table-action,
  .tutorial-complete-actions form,
  .tutorial-complete-actions .table-action,
  .tutorial-complete-actions button { width: 100%; }
}

@media (max-width: 430px) {
  .tutorial-student { grid-template-columns: 1fr; }
  .tutorial-summary { grid-template-columns: 1fr; }
  .tutorial-focus h2,
  .tutorial-live h2,
  .tutorial-complete h2,
  .tutorial-class-header h2 { font-size: 22px; }
}
.tutorial-mode-frame { display: grid; gap: 14px; }
.tutorial-mode-frame .tutorial-banner {
  grid-template-columns: minmax(0, 1fr) minmax(150px, 220px) auto;
  align-items: center;
}
.tutorial-banner-progress { display: grid; gap: 4px; min-width: 0; }
.tutorial-banner-progress strong { font-size: 13px; }
.tutorial-banner-progress progress { width: 100%; accent-color: #f5b56e; }
.tutorial-coach {
  display: grid;
  gap: 4px;
  padding: 13px 15px;
  border: 1px solid #edc17f;
  border-left: 6px solid #d07b2c;
  border-radius: 8px;
  background: #fff8ec;
}
.tutorial-coach span { color: #7a5200; font-size: 12px; font-weight: 950; text-transform: uppercase; }
.tutorial-coach strong { color: #173f45; font-size: 18px; }
.tutorial-coach p { margin: 0; color: #45565c; font-weight: 750; line-height: 1.4; }
.tutorial-mode-highlight { outline: 3px solid #d07b2c; outline-offset: 3px; }
.tutorial-action-form { margin: 0; min-width: 0; }
.tutorial-action-form > button { cursor: pointer; }
.tutorial-mode-frame .clock-created-actions .tutorial-action-form,
.tutorial-mode-frame .clock-created-actions button,
.tutorial-mode-frame .teacher-now-action .tutorial-action-form,
.tutorial-mode-frame .teacher-now-action button,
.tutorial-mode-frame .teacher-session-primary-action .tutorial-action-form,
.tutorial-mode-frame .teacher-session-primary-action button { width: 100%; }
.tutorial-mode-frame .teacher-live-next .tutorial-action-form { grid-column: 2; grid-row: 1 / span 2; }
.tutorial-mode-frame .teacher-live-next .tutorial-action-form .table-action { min-height: 50px; width: 100%; }
.tutorial-mode-frame [aria-disabled="true"] { cursor: default; opacity: .72; }
.tutorial-complete-note { max-width: 680px; border-left: 6px solid #2f7d52; }
.tutorial-complete-note h2 { margin-top: 0; }
@media (max-width: 700px) {
  .tutorial-mode-frame .tutorial-banner { grid-template-columns: 1fr; }
  .tutorial-mode-frame .teacher-live-next .tutorial-action-form { grid-column: 1; grid-row: auto; width: 100%; }
  .tutorial-mode-frame .teacher-live-next .tutorial-action-form button { width: 100%; }
}

/* Annual Robotics plan */
.robotics-course-plan { display: grid; gap: 16px; }
.robotics-plan-intro { margin-bottom: 0; }
.robotics-plan-intro .panel-head > div { min-width: 0; }
.robotics-plan-intro .panel-head p { margin: 4px 0 0; }
.robotics-plan-filters {
  display: grid;
  grid-template-columns: repeat(3, minmax(150px, 1fr)) auto;
  gap: 10px;
  align-items: end;
  margin: 14px 0;
}
.robotics-plan-filters label { display: grid; gap: 5px; font-weight: 800; }
.robotics-plan-filters select,
.robotics-plan-filters input,
.robotics-session-edit select { width: 100%; min-width: 0; }
.robotics-plan-week {
  padding: 16px;
  border: 1px solid #d8e2e3;
  border-radius: 8px;
  background: #f7faf9;
}
.robotics-teacher-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.robotics-teacher-week { min-width: 0; padding: 12px; border: 1px solid #ceddde; border-radius: 8px; background: #fff; }
.robotics-teacher-week > header { display: flex; justify-content: space-between; gap: 10px; align-items: flex-start; margin-bottom: 10px; }
.robotics-teacher-week > header h3 { margin: 0; font-size: 17px; }
.robotics-teacher-week > header span { color: #176b73; font-size: 12px; font-weight: 900; text-align: right; }
.robotics-session-card { padding: 10px 0; border-top: 1px solid #e4ecec; }
.robotics-session-card:first-of-type { border-top: 0; }
.robotics-session-card > div { display: flex; justify-content: space-between; gap: 8px; }
.robotics-session-card > div span { color: #5a6a6d; font-size: 12px; text-align: right; overflow-wrap: anywhere; }
.robotics-session-card h4 { margin: 6px 0 2px; font-size: 15px; }
.robotics-session-card p { margin: 0 0 6px; font-size: 13px; }
.robotics-session-card details { margin-top: 7px; }
.robotics-session-edit { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 7px; margin-top: 7px; }

@media (max-width: 800px) {
  .robotics-plan-filters { grid-template-columns: 1fr 1fr; }
  .robotics-plan-filters button { width: 100%; }
  .robotics-teacher-grid { grid-template-columns: 1fr; }
}
@media (max-width: 430px) {
  .robotics-plan-filters { grid-template-columns: 1fr; }
  .robotics-plan-week { padding: 12px; }
  .robotics-teacher-week > header,
  .robotics-session-card > div { display: grid; grid-template-columns: 1fr; }
  .robotics-teacher-week > header span,
  .robotics-session-card > div span { text-align: left; }
  .robotics-session-edit { grid-template-columns: 1fr; }
}