:root {
  --color-bg: #edf1f6;
  --color-bg-soft: #e4eaf2;
  --color-surface: #ffffff;
  --color-surface-alt: #f7f9fc;
  --color-border: #4f5d73;
  --color-text: #172235;
  --color-muted: #566274;
  --color-primary: #2f6fd8;
  --color-primary-dark: #1f4f9a;
  --color-accent: #4a86e8;
  --color-whatsapp: #2f6fd8;
  --color-danger: #4f5d73;
  --color-success: #2f6fd8;
  --radius-lg: 1.25rem;
  --radius-md: 1rem;
  --shadow-soft: 0 18px 38px rgba(28, 34, 46, 0.12);
}

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

html,
body {
  margin: 0;
  min-height: 100%;
}

body {
  font-family: "Outfit", "Segoe UI", sans-serif;
  color: var(--color-text);
}

a {
  color: inherit;
}

code {
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", monospace;
}

.auth-body {
  background:
    radial-gradient(circle at 88% 8%, rgba(47, 111, 216, 0.14), transparent 34%),
    radial-gradient(circle at 10% 80%, rgba(74, 134, 232, 0.12), transparent 36%),
    linear-gradient(180deg, var(--color-bg), var(--color-bg-soft));
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 1.25rem;
}

.auth-shell {
  width: min(980px, 100%);
}

.auth-card {
  background: linear-gradient(160deg, rgba(255, 255, 255, 0.96), rgba(247, 250, 255, 0.96));
  border: 1px solid rgba(79, 93, 115, 0.45);
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-soft);
  padding: clamp(1.4rem, 2vw, 2.2rem);
  width: min(520px, 100%);
  margin: 0 auto;
}

.auth-card-setup {
  width: min(780px, 100%);
}

.brand-row {
  margin-bottom: 1rem;
}

.brand-link {
  display: inline-flex;
  align-items: center;
  gap: 0.55rem;
  text-decoration: none;
  font-weight: 800;
  color: var(--color-primary-dark);
}

.brand-mark {
  width: 44px;
  height: 44px;
  border-radius: 12px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: #e4e4e4;
  border: 1px solid rgba(79, 93, 115, 0.42);
  box-shadow: 0 10px 22px rgba(31, 79, 154, 0.16);
  overflow: hidden;
}

.brand-mark img {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
}

.auth-kicker {
  margin: 0;
  text-transform: uppercase;
  letter-spacing: 0.12em;
  font-size: max(var(--ui-font-min), 0.75rem);
  font-weight: 800;
  color: var(--color-accent);
}

.auth-card h1 {
  margin: 0.45rem 0 0.7rem;
  font-family: "Sora", "Segoe UI", sans-serif;
  font-size: max(var(--ui-font-min), clamp(1.8rem, 4vw, 2.5rem));
  line-height: 1.1;
}

.auth-lead {
  margin: 0 0 1.25rem;
  color: var(--color-muted);
  max-width: 56ch;
}

.auth-form {
  display: grid;
  gap: 0.55rem;
}

.auth-form label {
  font-weight: 700;
  color: var(--color-primary-dark);
}

.auth-form input[type="text"] {
  width: 100%;
  min-height: 48px;
  border-radius: var(--radius-md);
  border: 1px solid rgba(79, 93, 115, 0.35);
  background: #ffffff;
  padding: 0.75rem 0.95rem;
  font-size: max(var(--ui-font-min), 1rem);
  color: var(--color-text);
  outline: none;
  transition: border-color 180ms ease, box-shadow 180ms ease;
}

.auth-form input[type="text"]:focus-visible {
  border-color: rgba(79, 93, 115, 0.7);
  box-shadow: 0 0 0 3px rgba(31, 79, 143, 0.15);
}

.auth-form small {
  color: var(--color-muted);
}

.admin-password-group {
  display: grid;
  gap: 0.45rem;
  margin-top: 0.2rem;
  padding: 0.8rem;
  border-radius: var(--radius-md);
  border: 1px solid rgba(79, 93, 115, 0.3);
  background: rgba(220, 233, 248, 0.26);
}

.admin-password-group[hidden] {
  display: none !important;
}

.admin-password-group label {
  color: var(--color-primary-dark);
  font-weight: 700;
}

.admin-password-group input[type="password"] {
  width: 100%;
  min-height: 46px;
  border-radius: var(--radius-md);
  border: 1px solid rgba(79, 93, 115, 0.35);
  background: #fff;
  padding: 0.72rem 0.95rem;
  font-size: max(var(--ui-font-min), 1rem);
  color: var(--color-text);
  outline: none;
  transition: border-color 180ms ease, box-shadow 180ms ease;
}

.admin-password-group input[type="password"]:focus-visible {
  border-color: rgba(79, 93, 115, 0.7);
  box-shadow: 0 0 0 3px rgba(31, 79, 143, 0.15);
}

.btn-primary {
  margin-top: 0.45rem;
  border: 1px solid transparent;
  border-radius: 999px;
  min-height: 48px;
  font-weight: 800;
  font-family: "Outfit", "Segoe UI", sans-serif;
  padding: 0.7rem 1.15rem;
  background: linear-gradient(135deg, #2f6fd8, #1f4f9a);
  color: #fff;
  cursor: pointer;
  transition: transform 180ms ease, box-shadow 180ms ease, opacity 180ms ease;
  box-shadow: 0 12px 24px rgba(31, 79, 154, 0.22);
}

.btn-primary:hover {
  transform: translateY(-1px);
}

.btn-primary:disabled {
  opacity: 0.75;
  cursor: wait;
  transform: none;
}

.auth-feedback {
  min-height: 1.2rem;
  margin-top: 0.35rem;
  font-size: max(var(--ui-font-min), 0.95rem);
  color: var(--color-muted);
}

.auth-feedback p {
  margin: 0 0 0.25rem;
}

.auth-feedback.is-error,
.auth-feedback-error {
  color: var(--color-danger);
}

.auth-feedback.is-success,
.auth-feedback-success {
  color: var(--color-success);
}

.auth-feedback.is-info {
  color: var(--color-primary-dark);
}

.admin-virtual-modal-feedback {
  margin-top: 0.75rem;
  text-align: left;
}

.admin-virtual-modal-feedback[hidden] {
  display: none !important;
}

.sample-credentials {
  margin: 1rem 0 1.25rem;
  padding: 1rem;
  border-radius: var(--radius-md);
  background: rgba(220, 233, 248, 0.34);
  border: 1px solid rgba(79, 93, 115, 0.24);
}

.sample-credentials h2 {
  margin: 0 0 0.25rem;
  font-family: "Sora", "Segoe UI", sans-serif;
  font-size: max(var(--ui-font-min), 1.2rem);
}

.sample-credentials p {
  margin: 0 0 0.55rem;
  color: var(--color-muted);
}

.sample-credentials ul {
  margin: 0;
  padding-left: 1rem;
}

.sample-credentials li {
  margin: 0.2rem 0;
}

.setup-form {
  margin-top: 1rem;
}

.setup-form label {
  display: block;
  margin-bottom: 0.35rem;
  color: var(--color-primary-dark);
  font-weight: 700;
}

.setup-form input[type="password"] {
  width: 100%;
  min-height: 44px;
  border-radius: var(--radius-md);
  border: 1px solid rgba(79, 93, 115, 0.35);
  background: #fff;
  padding: 0.7rem 0.9rem;
  font-size: max(var(--ui-font-min), 0.98rem);
  color: var(--color-text);
  outline: none;
  margin-bottom: 0.45rem;
}

.setup-form input[type="password"]:focus-visible {
  border-color: rgba(79, 93, 115, 0.7);
  box-shadow: 0 0 0 3px rgba(31, 79, 143, 0.15);
}

.setup-note {
  margin: 1rem 0 0;
  color: var(--color-muted);
}

.setup-note a {
  color: var(--color-primary-dark);
  font-weight: 700;
}

.panel-body {
  background:
    radial-gradient(circle at 90% 10%, rgba(47, 111, 216, 0.14), transparent 28%),
    linear-gradient(180deg, #edf1f6, #e4eaf2);
}

.panel-topbar {
  position: sticky;
  top: 0;
  z-index: 10;
  border-bottom: 1px solid rgba(79, 93, 115, 0.45);
  background: rgba(247, 250, 255, 0.92);
  backdrop-filter: blur(12px);
}

.panel-topbar-inner {
  width: min(1100px, 100%);
  margin: 0 auto;
  padding: 0.85rem 1.25rem;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
}

.panel-brand {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  color: var(--color-primary-dark);
}

.brand-mark-sm {
  width: 28px;
  height: 28px;
  border-radius: 7px;
  object-fit: contain;
  display: inline-block;
  border: 1px solid rgba(79, 93, 115, 0.35);
  background: #e4e4e4;
}

.panel-menu {
  display: flex;
  align-items: center;
  gap: 0.5rem;
}

.panel-menu a {
  text-decoration: none;
  color: #4f5868;
  font-weight: 700;
  padding: 0.45rem 0.9rem;
  border-radius: 999px;
  border: 1px solid transparent;
}

.panel-menu .topbar-account-btn {
  min-height: 34px;
  padding: 0.38rem 0.85rem;
  margin: 0;
}

.panel-menu .topbar-account-btn-student {
  color: var(--color-primary-dark);
  background: rgba(31, 79, 143, 0.1);
  border-color: rgba(31, 79, 143, 0.25);
}

.panel-menu a.active {
  color: var(--color-primary-dark);
  background: rgba(31, 79, 143, 0.1);
}

.panel-menu .logout-link {
  color: #fff;
  background: linear-gradient(135deg, #1f4f8f, #16345d);
}

.panel-shell {
  width: min(1100px, 100%);
  margin: 0 auto;
  padding: 1.1rem 1.25rem 2rem;
  display: grid;
  gap: 0.9rem;
}

.panel-card {
  border-radius: var(--radius-lg);
  border: 1px solid rgba(79, 93, 115, 0.45);
  background: linear-gradient(160deg, rgba(255, 255, 255, 0.96), rgba(247, 250, 255, 0.96));
  box-shadow: var(--shadow-soft);
  padding: clamp(1.2rem, 2vw, 1.9rem);
}

.panel-kicker {
  margin: 0;
  text-transform: uppercase;
  letter-spacing: 0.12em;
  font-size: max(var(--ui-font-min), 0.75rem);
  font-weight: 800;
  color: var(--color-accent);
}

.panel-card h1 {
  margin: 0.35rem 0 0.5rem;
  font-family: "Sora", "Segoe UI", sans-serif;
  font-size: max(var(--ui-font-min), clamp(1.55rem, 3vw, 2.2rem));
}

.panel-lead {
  margin: 0 0 1.25rem;
  color: var(--color-muted);
}

.admin-workspace {
  display: grid;
  gap: 1rem;
}

.admin-overview {
  padding: 0.2rem 0.1rem 0;
}

.admin-overview h1 {
  margin: 0.35rem 0 0.5rem;
  font-family: "Sora", "Segoe UI", sans-serif;
  font-size: max(var(--ui-font-min), clamp(1.55rem, 3vw, 2.2rem));
}

.admin-overview .panel-lead {
  margin: 0;
}

.admin-year-banner {
  margin-top: 0.75rem;
  border: 1px solid rgba(79, 93, 115, 0.28);
  border-radius: 0.95rem;
  background: linear-gradient(160deg, rgba(255, 255, 255, 0.96), rgba(242, 247, 255, 0.98));
  padding: 0.7rem 0.8rem;
  display: grid;
  gap: 0.65rem;
}

.admin-year-badge {
  margin: 0;
  color: var(--color-primary-dark);
  font-weight: 800;
  font-size: max(var(--ui-font-min), 0.96rem);
}

.admin-year-note {
  display: block;
  margin: 0.2rem 0 0;
  color: var(--color-muted);
  font-size: max(var(--ui-font-min), 0.84rem);
}

.admin-year-controls {
  display: grid;
  gap: 0.35rem;
}

.admin-year-controls label {
  color: var(--color-primary-dark);
  font-size: max(var(--ui-font-min), 0.82rem);
  font-weight: 700;
}

.admin-year-controls-row {
  display: grid;
  grid-template-columns: minmax(0, 220px);
  gap: 0.5rem;
  align-items: center;
}

.admin-module-nav {
  margin: 0 0 0.72rem;
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 0.32rem;
  border: 1px solid rgba(47, 111, 216, 0.34);
  border-radius: 0.95rem;
  background: linear-gradient(145deg, #edf4ff, #f8fbff);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.78);
  padding: 0.28rem;
}

.admin-module-btn {
  min-height: 40px;
  border-radius: 0.74rem;
  border: 0;
  background: transparent;
  color: #365c96;
  font-weight: 700;
  letter-spacing: 0.01em;
  font-family: "Outfit", "Segoe UI", sans-serif;
  padding: 0.44rem 0.75rem;
  cursor: pointer;
  transition: background 180ms ease, color 180ms ease, transform 180ms ease, box-shadow 180ms ease;
}

.admin-module-btn:hover {
  background: rgba(47, 111, 216, 0.08);
}

.admin-module-btn:focus-visible {
  outline: 2px solid rgba(47, 111, 216, 0.42);
  outline-offset: 1px;
}

.admin-module-btn.is-active {
  background: linear-gradient(135deg, #2f6fd8, #1f4f9a);
  color: #fff;
  box-shadow: 0 8px 14px rgba(31, 79, 154, 0.24);
  transform: translateY(-1px);
}

.admin-module-section {
  display: block;
}

.admin-module-section[hidden] {
  display: none !important;
}

.panel-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.8rem;
}

.panel-grid article {
  background: rgba(220, 233, 248, 0.3);
  border: 1px solid rgba(79, 93, 115, 0.24);
  border-radius: var(--radius-md);
  padding: 0.95rem;
}

.panel-grid h2 {
  margin: 0 0 0.2rem;
  font-size: max(var(--ui-font-min), 0.98rem);
  color: var(--color-primary-dark);
}

.panel-grid p {
  margin: 0;
  color: var(--color-text);
}

.btn-small {
  min-height: 38px;
  padding: 0.5rem 0.9rem;
  font-size: max(var(--ui-font-min), 0.92rem);
}

.admin-panel-card {
  border: 1px solid rgba(79, 93, 115, 0.35);
  border-radius: var(--radius-md);
  background: linear-gradient(160deg, rgba(255, 255, 255, 0.98), rgba(247, 250, 255, 0.95));
  box-shadow: var(--shadow-soft);
  padding: 1rem 1rem 1.1rem;
  display: flex;
  flex-direction: column;
  min-height: 72vh;
}

.sim-layout {
  display: grid;
  gap: 0.8rem;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.sim-block {
  border: 1px solid rgba(79, 93, 115, 0.25);
  border-radius: var(--radius-md);
  background: #fff;
  padding: 0.8rem;
  display: grid;
  gap: 0.5rem;
}

.sim-block[hidden] {
  display: none !important;
}

.sim-block h3 {
  margin: 0;
  color: var(--color-primary-dark);
  font-size: max(var(--ui-font-min), 1.02rem);
  font-family: "Sora", "Segoe UI", sans-serif;
}

.sim-flow-hint {
  margin: 0.15rem 0 0;
  padding: 0.55rem 0.65rem;
  border-radius: 0.72rem;
  border: 1px solid rgba(79, 93, 115, 0.22);
  background: rgba(220, 233, 248, 0.22);
  color: var(--color-primary-dark);
  font-size: max(var(--ui-font-min), 0.9rem);
  font-weight: 600;
}

.sim-grade-picker {
  margin-top: 0.25rem;
  padding: 0.65rem;
  border: 1px solid rgba(79, 93, 115, 0.25);
  border-radius: 0.85rem;
  background: rgba(220, 233, 248, 0.18);
  display: grid;
  gap: 0.45rem;
}

.sim-grade-picker p {
  margin: 0;
  font-weight: 700;
  color: var(--color-primary-dark);
}

.sim-grade-list {
  display: flex;
  flex-wrap: wrap;
  gap: 0.4rem;
}

.sim-grade-list .sim-empty {
  padding: 0;
}

.sim-grade-chip {
  border: 1px solid rgba(79, 93, 115, 0.35);
  border-radius: 999px;
  background: #fff;
  color: var(--color-text);
  padding: 0.35rem 0.7rem;
  font-size: max(var(--ui-font-min), 0.86rem);
  font-weight: 700;
  line-height: 1.2;
  cursor: pointer;
  transition: background-color 180ms ease, border-color 180ms ease, color 180ms ease, box-shadow 180ms ease;
}

.sim-grade-chip:hover {
  border-color: rgba(47, 111, 216, 0.55);
  color: #1f4f8f;
}

.sim-grade-chip:focus-visible {
  outline: none;
  border-color: rgba(47, 111, 216, 0.72);
  box-shadow: 0 0 0 3px rgba(31, 79, 143, 0.14);
}

.sim-grade-chip.is-active {
  background: #1f4f8f;
  border-color: #1f4f8f;
  color: #fff;
}

.sim-block input[type="text"],
.sim-block input[type="date"],
.sim-block input[type="search"],
.sim-block select {
  width: 100%;
  min-height: 42px;
  border-radius: 0.78rem;
  border: 1px solid rgba(79, 93, 115, 0.35);
  background: #fff;
  color: var(--color-text);
  padding: 0.62rem 0.78rem;
  font-size: max(var(--ui-font-min), 0.94rem);
  outline: none;
  transition: border-color 180ms ease, box-shadow 180ms ease;
}

.sim-block input[type="text"]:focus-visible,
.sim-block input[type="date"]:focus-visible,
.sim-block input[type="search"]:focus-visible,
.sim-block select:focus-visible {
  border-color: rgba(79, 93, 115, 0.72);
  box-shadow: 0 0 0 3px rgba(31, 79, 143, 0.14);
}

.sim-participants-block {
  grid-column: 1 / -1;
}

.sim-help {
  margin: 0;
  color: var(--color-muted);
  font-size: max(var(--ui-font-min), 0.92rem);
}

.sim-areas {
  margin-top: 0.35rem;
  padding: 0.65rem;
  border: 1px solid rgba(79, 93, 115, 0.25);
  border-radius: 0.85rem;
  background: rgba(220, 233, 248, 0.24);
  display: grid;
  gap: 0.5rem;
}

.sim-areas p {
  margin: 0;
  font-weight: 700;
  color: var(--color-primary-dark);
}

.sim-areas-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.35rem 0.5rem;
}

.sim-area-check {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  font-size: max(var(--ui-font-min), 0.91rem);
  color: var(--color-text);
}

.sim-area-check input {
  accent-color: #2f6fd8;
}

.sim-participant-tools {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 0.5rem;
}

.sim-search-results {
  border: 1px solid rgba(79, 93, 115, 0.24);
  border-radius: 0.85rem;
  background: #fff;
  padding: 0.6rem;
  display: grid;
  gap: 0.45rem;
  min-height: 54px;
  align-content: start;
  align-items: start;
  grid-auto-rows: max-content;
}

.sim-search-results > * {
  align-self: start;
}

.sim-search-results > * + * {
  margin-top: 0.1rem;
  padding-top: 0.55rem;
  border-top: 1px dashed rgba(79, 93, 115, 0.24);
}

.sim-search-item {
  border: 1px solid rgba(79, 93, 115, 0.22);
  border-radius: 0.75rem;
  background: #fbfdff;
  padding: 0.55rem 0.65rem;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.5rem;
}

.sim-search-item strong {
  display: block;
  color: var(--color-primary-dark);
  margin-bottom: 0.1rem;
  font-size: max(var(--ui-font-min), 0.95rem);
}

.sim-search-meta {
  color: var(--color-muted);
  font-size: max(var(--ui-font-min), 0.84rem);
}

.sim-external-box {
  border: 1px solid rgba(79, 93, 115, 0.25);
  border-radius: 0.85rem;
  background: rgba(220, 233, 248, 0.2);
  padding: 0.65rem;
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 0.5rem;
  align-items: end;
}

.sim-external-box[hidden] {
  display: none !important;
}

.sim-external-box label {
  grid-column: 1 / -1;
  color: var(--color-primary-dark);
  font-weight: 700;
}

.sim-external-box input {
  min-height: 40px;
  border-radius: 0.75rem;
  border: 1px solid rgba(79, 93, 115, 0.35);
  background: #fff;
  color: var(--color-text);
  padding: 0.55rem 0.75rem;
  font-size: max(var(--ui-font-min), 0.95rem);
  outline: none;
}

.sim-external-box input:focus-visible {
  border-color: rgba(79, 93, 115, 0.72);
  box-shadow: 0 0 0 3px rgba(31, 79, 143, 0.14);
}

.sim-results-wrap {
  border: 1px solid rgba(79, 93, 115, 0.25);
  border-radius: 0.9rem;
  background: #fff;
  overflow: auto;
}

.sim-results-table {
  width: 100%;
  border-collapse: collapse;
  min-width: 980px;
}

.sim-results-table th,
.sim-results-table td {
  border-bottom: 1px solid rgba(79, 93, 115, 0.2);
  padding: 0.5rem;
  vertical-align: middle;
  text-align: left;
}

.sim-results-table th:nth-child(n + 2):nth-child(-n + 7),
.sim-results-table td:nth-child(n + 2):nth-child(-n + 7) {
  text-align: center;
}

.sim-results-table th {
  background: #f4f8ff;
  color: var(--color-primary-dark);
  font-size: max(var(--ui-font-min), 0.82rem);
  letter-spacing: 0.03em;
  text-transform: uppercase;
  white-space: nowrap;
}

.sim-results-table tbody tr:hover {
  background: rgba(220, 233, 248, 0.24);
}

.sim-participant-cell strong {
  display: block;
  color: var(--color-primary-dark);
}

.sim-participant-cell small {
  color: var(--color-muted);
  font-size: max(var(--ui-font-min), 0.82rem);
}

.sim-score-input {
  width: 82px;
  min-height: 34px;
  border-radius: 0.66rem;
  border: 1px solid rgba(79, 93, 115, 0.34);
  background: #fff;
  color: var(--color-text);
  padding: 0.4rem 0.5rem;
  font-size: max(var(--ui-font-min), 0.92rem);
  text-align: center;
  outline: none;
}

.sim-score-input:focus-visible {
  border-color: rgba(79, 93, 115, 0.72);
  box-shadow: 0 0 0 3px rgba(31, 79, 143, 0.14);
}

.sim-score-disabled {
  display: inline-flex;
  align-items: center;
  border-radius: 999px;
  border: 1px solid rgba(79, 93, 115, 0.3);
  background: #eef2f8;
  color: #415067;
  font-size: max(var(--ui-font-min), 0.76rem);
  font-weight: 700;
  letter-spacing: 0.02em;
  padding: 0.2rem 0.45rem;
}

.sim-global-cell strong {
  display: block;
  color: var(--color-primary-dark);
}

.sim-global-preview {
  color: var(--color-muted);
  font-size: max(var(--ui-font-min), 0.78rem);
}

.sim-empty {
  margin: 0;
  padding: 0.75rem;
  color: var(--color-muted);
}

.student-notes-block {
  margin-top: 1rem;
  border: 1px solid rgba(79, 93, 115, 0.24);
  border-radius: var(--radius-md);
  background: #fff;
  padding: 0.9rem;
}

.student-notes-block h2 {
  margin: 0 0 0.3rem;
  font-family: "Sora", "Segoe UI", sans-serif;
  font-size: max(var(--ui-font-min), 1.15rem);
  color: var(--color-primary-dark);
}

.student-notes-table-wrap {
  overflow: auto;
  border: 1px solid rgba(79, 93, 115, 0.2);
  border-radius: 0.85rem;
}

.student-notes-table {
  width: 100%;
  border-collapse: collapse;
  min-width: 980px;
}

.student-notes-table th,
.student-notes-table td {
  border-bottom: 1px solid rgba(79, 93, 115, 0.2);
  padding: 0.48rem;
  text-align: left;
  vertical-align: top;
}

.student-notes-table th:nth-child(n + 5):nth-child(-n + 10),
.student-notes-table td:nth-child(n + 5):nth-child(-n + 10) {
  text-align: center;
}

.student-notes-table th {
  background: #f4f8ff;
  color: var(--color-primary-dark);
  font-size: max(var(--ui-font-min), 0.82rem);
  letter-spacing: 0.03em;
  text-transform: uppercase;
  white-space: nowrap;
}

.student-finance-shell {
  display: grid;
  gap: 0.65rem;
}

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

.student-finance-actions {
  margin-top: 0.1rem;
  flex-wrap: wrap;
}

.student-finance-row {
  border: 1px solid rgba(79, 93, 115, 0.26);
  border-radius: 0.85rem;
  padding: 0.75rem;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.65rem;
}

.student-finance-row.is-ok {
  background: rgba(232, 248, 236, 0.88);
  border-color: rgba(96, 170, 122, 0.45);
}

.student-finance-row.is-pending {
  background: rgba(255, 245, 214, 0.9);
  border-color: rgba(208, 171, 74, 0.5);
}

.student-finance-row-main {
  min-width: 0;
}

.student-finance-row-main h3 {
  margin: 0;
  color: var(--color-primary-dark);
  font-size: max(var(--ui-font-min), 1rem);
}

.student-finance-status {
  margin: 0.2rem 0 0;
  font-weight: 700;
  color: #1f4f8f;
}

.student-finance-meta {
  margin: 0.18rem 0 0;
  color: var(--color-muted);
  font-size: max(var(--ui-font-min), 0.88rem);
}

.finance-form-wrap {
  border: 1px solid rgba(79, 93, 115, 0.28);
  border-radius: 0.9rem;
  background: rgba(244, 248, 255, 0.72);
  padding: 0.75rem;
  display: grid;
  gap: 0.45rem;
}

.finance-form-wrap[hidden] {
  display: none !important;
}

.student-core-fields-wrap {
  display: grid;
  gap: 0.45rem;
}

.student-core-fields-wrap[hidden] {
  display: none !important;
}

.create-user-dynamic-fields {
  display: grid;
  gap: 0.45rem;
}

.create-user-dynamic-fields[hidden] {
  display: none !important;
}

.professor-form-wrap {
  border: 1px solid rgba(79, 93, 115, 0.28);
  border-radius: 0.9rem;
  background: linear-gradient(180deg, rgba(245, 251, 255, 0.92), rgba(236, 245, 255, 0.72));
  padding: 0.75rem;
  display: grid;
  gap: 0.45rem;
}

.professor-form-wrap[hidden] {
  display: none !important;
}

.professor-form-wrap textarea {
  width: 100%;
  border-radius: var(--radius-md);
  border: 1px solid rgba(79, 93, 115, 0.35);
  background: #fff;
  padding: 0.7rem 0.9rem;
  font-size: max(var(--ui-font-min), 0.95rem);
  color: var(--color-text);
  resize: vertical;
  min-height: 108px;
}

.professor-form-wrap textarea:focus-visible {
  border-color: rgba(79, 93, 115, 0.7);
  box-shadow: 0 0 0 3px rgba(31, 79, 143, 0.15);
  outline: none;
}

.professor-form-wrap input[type="file"] {
  width: 100%;
  border: 1px dashed rgba(79, 93, 115, 0.36);
  border-radius: 0.5rem;
  background: #fff;
  padding: 0.6rem;
}

.professor-current-photo-wrap {
  margin-top: 0.35rem;
  display: flex;
  align-items: center;
  justify-content: flex-start;
}

.professor-current-photo-wrap[hidden] {
  display: none !important;
}

.professor-current-photo-wrap img {
  width: 104px;
  height: 104px;
  border-radius: 0.9rem;
  object-fit: cover;
  border: 1px solid rgba(79, 93, 115, 0.28);
  box-shadow: 0 10px 24px rgba(15, 35, 56, 0.14);
}

.admin-finance-panel {
  width: min(1040px, 100%);
  margin-inline: auto;
  min-width: 0;
  min-height: auto;
}

.admin-tools-panel {
  width: min(1040px, 100%);
  margin-inline: auto;
  min-width: 0;
  min-height: auto;
}

.tools-block {
  border: 1px solid rgba(79, 93, 115, 0.24);
  border-radius: 0.9rem;
  background: #fff;
  padding: 0.72rem;
  min-width: 0;
}

.tools-block + .tools-block {
  margin-top: 0.75rem;
}

.tools-verify-block {
  background: linear-gradient(160deg, rgba(255, 255, 255, 0.99), rgba(242, 248, 255, 0.96));
}

.tools-verify-toolbar {
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
}

.tools-editor-shell {
  border: 1px solid rgba(79, 93, 115, 0.26);
  border-radius: 0.9rem;
  background: #f8fbff;
  padding: 0.6rem;
  display: grid;
  gap: 0.45rem;
}

.tools-editor-toolbar {
  display: flex;
  flex-wrap: wrap;
  gap: 0.35rem;
}

.tools-editor-btn.is-active {
  color: #fff;
  background: linear-gradient(135deg, #2f6fd8, #1f4f9a);
  border-color: rgba(31, 79, 154, 0.9);
}

.tools-editor {
  width: 100%;
  min-height: 280px;
  max-height: 52vh;
  border-radius: 0.95rem;
  border: 1px solid rgba(79, 93, 115, 0.3);
  background: linear-gradient(180deg, #ffffff 0%, #fbfdff 100%);
  color: var(--color-text);
  padding: 0.95rem 1rem;
  font-size: max(var(--ui-font-min), 0.98rem);
  line-height: 1.62;
  outline: none;
  white-space: pre-wrap;
  overflow-wrap: anywhere;
  overflow: auto;
  font-family: "Outfit", sans-serif;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.9);
  transition: border-color 0.2s ease, box-shadow 0.2s ease, background 0.2s ease;
}

.tools-editor:focus-visible {
  border-color: rgba(47, 111, 216, 0.68);
  box-shadow: 0 0 0 3px rgba(47, 111, 216, 0.16);
  background: #fff;
}

.tools-editor:empty::before {
  content: attr(data-placeholder);
  color: #7d8aa0;
  font-style: italic;
}

.tools-editor p {
  margin: 0 0 0.8rem;
}

.tools-editor p:last-child {
  margin-bottom: 0;
}

.tools-editor::-webkit-scrollbar {
  width: 9px;
}

.tools-editor::-webkit-scrollbar-thumb {
  background: rgba(79, 93, 115, 0.35);
  border-radius: 999px;
}

.tools-editor::-webkit-scrollbar-track {
  background: rgba(79, 93, 115, 0.08);
  border-radius: 999px;
}

#adminToolsCertificateContent.tools-editor {
  border: 1px solid rgba(79, 93, 115, 0.34);
  background: linear-gradient(180deg, #ffffff 0%, #fbfdff 100%);
}

#adminToolsCertificateContent.tools-editor:focus-visible {
  border-color: rgba(47, 111, 216, 0.68);
}

.tools-verify-result {
  border: 1px solid rgba(79, 93, 115, 0.24);
  border-radius: 0.85rem;
  background: #fff;
  padding: 0.75rem;
  max-height: 62vh;
  overflow: auto;
  color: var(--color-text);
}

.tools-verify-result pre {
  margin: 0.65rem 0 0;
  padding: 0.6rem;
  border-radius: 0.7rem;
  border: 1px solid rgba(79, 93, 115, 0.22);
  background: #f8fbff;
  font-size: max(var(--ui-font-min), 0.84rem);
  white-space: pre-wrap;
}

.tools-verify-result section + section {
  margin-top: 0.6rem;
}

.tools-verify-result h4 {
  margin: 0 0 0.35rem;
  color: var(--color-primary-dark);
  font-size: max(var(--ui-font-min), 0.9rem);
}

.tools-verify-result p {
  margin: 0.22rem 0;
}

.tools-certificates-list {
  max-height: min(58vh, 460px);
  overflow: auto;
}

.finance-toolbar {
  grid-template-columns: minmax(180px, 0.75fr) minmax(180px, 0.7fr) minmax(220px, 1fr) auto;
  align-items: center;
}

.finance-year-picker {
  display: grid;
  gap: 0.28rem;
  color: var(--color-primary-dark);
  font-size: max(var(--ui-font-min), 0.86rem);
  font-weight: 700;
}

.finance-year-picker .admin-filter-select {
  min-height: 38px;
}

.finance-year-sync {
  margin: 0;
  padding: 0.58rem 0.72rem;
  border: 1px solid rgba(79, 93, 115, 0.28);
  border-radius: 0.5rem;
  background: #f4f8ff;
  color: var(--color-primary-dark);
  font-weight: 700;
}

.finance-year-notice {
  margin: 0;
  padding: 0.58rem 0.72rem;
  border: 1px solid rgba(185, 83, 37, 0.35);
  border-radius: 0.5rem;
  background: #fff7ed;
  color: #9a3412;
  font-weight: 800;
}

.finance-year-notice[hidden] {
  display: none !important;
}

.finance-kpi-grid {
  margin: 0.15rem 0 0.75rem;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0.55rem;
}

.finance-kpi-card {
  border: 1px solid rgba(79, 93, 115, 0.26);
  border-radius: 0.85rem;
  background: linear-gradient(160deg, #ffffff, #f7fbff);
  padding: 0.65rem 0.72rem;
  display: grid;
  gap: 0.2rem;
}

.finance-kpi-label {
  margin: 0;
  color: var(--color-muted);
  font-size: max(var(--ui-font-min), 0.84rem);
}

.finance-kpi-value {
  color: var(--color-primary-dark);
  font-size: max(var(--ui-font-min), 1.02rem);
}

.finance-split-grid {
  display: grid;
  grid-template-columns: minmax(240px, 320px) minmax(0, 1fr);
  gap: 0.75rem;
  min-width: 0;
}

.finance-split-grid > * {
  min-width: 0;
}

.finance-debtors-card,
.finance-report-card,
.finance-modal-block {
  border: 1px solid rgba(79, 93, 115, 0.24);
  border-radius: 0.9rem;
  background: #fff;
  padding: 0.72rem;
  min-width: 0;
}

.finance-debtors-scroll {
  border: 1px solid rgba(79, 93, 115, 0.2);
  border-radius: 0.8rem;
  background: #fff;
  padding: 0.55rem;
  display: grid;
  gap: 0.48rem;
  min-height: 220px;
  max-height: 56vh;
  overflow-y: auto;
  align-content: start;
  align-items: start;
  grid-auto-rows: max-content;
}

.finance-debtors-scroll > * {
  align-self: start;
}

.finance-debtors-scroll > * + * {
  margin-top: 0.1rem;
  padding-top: 0.55rem;
  border-top: 1px dashed rgba(79, 93, 115, 0.24);
}

.finance-debtor-item {
  border: 1px solid rgba(79, 93, 115, 0.2);
  border-radius: 0.75rem;
  background: #fbfdff;
  padding: 0.5rem 0.58rem;
  display: grid;
  gap: 0.18rem;
}

.finance-debtor-item strong {
  color: var(--color-primary-dark);
}

.finance-debtor-item p {
  margin: 0;
  color: var(--color-muted);
  font-size: max(var(--ui-font-min), 0.84rem);
}

.finance-debtor-amount {
  color: #965b12;
  font-weight: 700;
  font-size: max(var(--ui-font-min), 0.9rem);
}

.finance-modal-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.65rem;
  margin-bottom: 0.65rem;
}

.finance-modal-grid-single {
  grid-template-columns: minmax(0, 1fr);
}

.finance-payment-modal-form {
  max-width: 420px;
  width: 100%;
  margin-inline: auto;
}

.finance-modal-block h3 {
  margin: 0 0 0.45rem;
  color: var(--color-primary-dark);
  font-size: max(var(--ui-font-min), 0.98rem);
}

.finance-inline-summary {
  margin-bottom: 0.7rem;
}

.finance-summary-card {
  border: 1px solid rgba(79, 93, 115, 0.22);
  border-radius: 0.8rem;
  background: #f8fbff;
  padding: 0.62rem 0.68rem;
  display: grid;
  gap: 0.18rem;
}

.finance-summary-card p {
  margin: 0;
  color: var(--color-text);
  font-size: max(var(--ui-font-min), 0.92rem);
}

.finance-summary-card.is-success {
  background: rgba(232, 248, 236, 0.88);
  border-color: rgba(96, 170, 122, 0.45);
}

.finance-summary-card.is-warning {
  background: rgba(255, 245, 214, 0.9);
  border-color: rgba(208, 171, 74, 0.5);
}

.finance-payments-list {
  display: grid;
  gap: 0.45rem;
  align-content: start;
  align-items: start;
  grid-auto-rows: max-content;
  max-height: 46vh;
  overflow-y: auto;
}

.finance-payments-list:not(.sim-search-results) > * {
  align-self: start;
}

.finance-history-toolbar {
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
}

.finance-history-status {
  font-weight: 700;
  letter-spacing: 0.01em;
}

.finance-history-status.is-active {
  color: #1f5f3a;
}

.finance-history-status.is-deleted {
  color: #9a2f2f;
}

.finance-subsection-title {
  margin: 0.75rem 0 0.4rem;
  font-size: max(var(--ui-font-min), 0.98rem);
  letter-spacing: 0.01em;
  color: #2f425f;
}

.finance-payments-list:not(.sim-search-results) > * + * {
  margin-top: 0.1rem;
  padding-top: 0.55rem;
  border-top: 1px dashed rgba(79, 93, 115, 0.24);
}

.finance-payment-item {
  border: 1px solid rgba(79, 93, 115, 0.2);
  border-radius: 0.78rem;
  background: #fbfdff;
  padding: 0.55rem 0.62rem;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.62rem;
}

.finance-payment-main {
  min-width: 0;
}

.finance-payment-main strong {
  display: block;
  color: var(--color-primary-dark);
  font-size: max(var(--ui-font-min), 0.94rem);
}

.finance-payment-main p {
  margin: 0.12rem 0 0;
  color: var(--color-muted);
  font-size: max(var(--ui-font-min), 0.83rem);
}

.finance-invoice-frame {
  width: 100%;
  min-height: 70vh;
  border: 1px solid rgba(79, 93, 115, 0.28);
  border-radius: 0.9rem;
  background: #f7faff;
}

.admin-user-row-finance-ok {
  background: linear-gradient(165deg, #ffffff, #effcf2);
  border-color: rgba(96, 170, 122, 0.45);
}

.admin-user-row-finance-debt {
  background: linear-gradient(165deg, #fffdf6, #fff7e1);
  border-color: rgba(208, 171, 74, 0.45);
}

.admin-user-finance-meta {
  margin: 0.5rem 0 0;
  border: 1px solid rgba(79, 93, 115, 0.24);
  border-radius: 0.82rem;
  background: #f9fcff;
  padding: 0.58rem 0.64rem;
  display: grid;
  gap: 0.42rem;
}

.admin-user-finance-meta.is-ok {
  background: rgba(232, 248, 236, 0.86);
  border-color: rgba(96, 170, 122, 0.45);
}

.admin-user-finance-meta.is-debt {
  background: rgba(255, 245, 214, 0.9);
  border-color: rgba(208, 171, 74, 0.5);
}

.admin-user-finance-headline {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.45rem;
  flex-wrap: wrap;
}

.admin-user-finance-title {
  color: var(--color-primary-dark);
  font-size: max(var(--ui-font-min), 0.92rem);
  letter-spacing: 0.01em;
}

.admin-user-finance-state {
  display: inline-flex;
  align-items: center;
  border-radius: 999px;
  padding: 0.18rem 0.52rem;
  font-size: max(var(--ui-font-min), 0.76rem);
  font-weight: 700;
  border: 1px solid rgba(79, 93, 115, 0.3);
  background: #eef2f8;
  color: #415067;
}

.admin-user-finance-state.is-ok {
  border-color: rgba(96, 170, 122, 0.45);
  background: #e9f8ef;
  color: #2c7d4f;
}

.admin-user-finance-state.is-debt {
  border-color: rgba(208, 171, 74, 0.54);
  background: #fff6dc;
  color: #805a17;
}

.admin-user-finance-metrics {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));
  gap: 0.42rem;
}

.admin-user-finance-metric {
  border: 1px solid rgba(79, 93, 115, 0.2);
  border-radius: 0.68rem;
  background: rgba(255, 255, 255, 0.72);
  padding: 0.38rem 0.48rem;
  display: grid;
  gap: 0.15rem;
}

.admin-user-finance-metric-label {
  font-size: max(var(--ui-font-min), 0.75rem);
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: #5f6980;
  font-weight: 700;
}

.admin-user-finance-metric-value {
  color: #1f2f49;
  font-size: max(var(--ui-font-min), 0.9rem);
}

.admin-panel-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.6rem;
  margin-bottom: 0.55rem;
}

.admin-panel-head-actions {
  display: inline-flex;
  flex-wrap: wrap;
  gap: 0.45rem;
  justify-content: flex-end;
}

.admin-panel-head h2 {
  margin: 0;
  font-family: "Sora", "Segoe UI", sans-serif;
  font-size: max(var(--ui-font-min), 1.16rem);
  color: var(--color-primary-dark);
}

.sim-list-toolbar {
  grid-template-columns: minmax(0, 1fr) minmax(150px, 220px) auto;
  align-items: center;
}

.school-sim-toolbar {
  grid-template-columns: minmax(0, 1fr) auto;
}

.school-list-toolbar {
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
}

.sim-list {
  min-height: 360px;
  max-height: clamp(360px, calc(100vh - 320px), 640px);
  overflow-y: auto;
  align-content: start;
  align-items: start;
  grid-auto-rows: max-content;
}

.admin-simulacros-panel {
  width: min(1020px, 100%);
  margin-inline: auto;
}

.sim-schools-panel {
  border: 1px solid rgba(79, 93, 115, 0.24);
  border-radius: 0.95rem;
  background: #f8fbff;
  padding: 0.75rem;
  margin: 0 0 0.8rem;
}

.admin-school-list-in-sim {
  min-height: 240px;
  max-height: min(52vh, 420px);
}

.sim-card-row {
  display: grid;
  gap: 0.65rem;
  border-color: rgba(79, 93, 115, 0.22);
  background: linear-gradient(160deg, #ffffff, #fbfdff);
  min-height: 128px;
  align-content: start;
}

.sim-card-row.is-clickable {
  cursor: pointer;
}

.sim-card-row.is-clickable:hover {
  border-color: rgba(47, 111, 216, 0.46);
  background: #f4f8ff;
}

.sim-card-main {
  min-width: 0;
}

.sim-card-main h3 {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.sim-card-row .admin-user-meta {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.sim-card-actions {
  justify-content: flex-end;
  flex-wrap: wrap;
  align-items: center;
}

.sim-grade-sublist {
  border-top: 1px dashed rgba(79, 93, 115, 0.3);
  padding-top: 0.6rem;
  margin-top: 0.15rem;
  display: grid;
  gap: 0.45rem;
}

.sim-grade-row {
  border: 1px solid rgba(79, 93, 115, 0.22);
  border-radius: 0.8rem;
  background: #f8fbff;
  padding: 0.6rem;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.6rem;
}

.sim-grade-row-main strong {
  color: var(--color-primary-dark);
}

.sim-results-modal-subtitle {
  margin: 0.2rem 0 0.75rem;
  color: var(--color-muted);
  font-size: max(var(--ui-font-min), 0.92rem);
}

.sim-results-modal-actions {
  margin-bottom: 0.7rem;
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
}

.sim-results-modal-actions[hidden],
.sim-results-modal-actions.is-hidden {
  display: none !important;
}

.sim-comments-grid {
  margin-bottom: 0.75rem;
  display: grid;
  gap: 0.65rem;
}

.sim-comments-block {
  border: 1px solid rgba(79, 93, 115, 0.24);
  border-radius: 0.85rem;
  background: #f8fbff;
  padding: 0.65rem;
  display: grid;
  gap: 0.45rem;
}

.sim-comments-block h3 {
  margin: 0;
  color: var(--color-primary-dark);
  font-size: max(var(--ui-font-min), 0.96rem);
}

.sim-comment-entry {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 0.45rem;
}

.sim-comment-item {
  border: 1px solid rgba(79, 93, 115, 0.2);
  border-radius: 0.75rem;
  background: #fff;
  padding: 0.55rem 0.65rem;
  display: grid;
  gap: 0.35rem;
}

.sim-comment-text {
  margin: 0;
  color: var(--color-text);
  font-size: max(var(--ui-font-min), 0.92rem);
  word-break: break-word;
}

.sim-comment-meta {
  margin: 0;
  color: var(--color-muted);
  font-size: max(var(--ui-font-min), 0.8rem);
}

.sim-comment-actions {
  display: inline-flex;
  gap: 0.4rem;
  justify-content: flex-end;
}

.admin-modal-card-wide {
  width: min(1280px, 100%);
}

.sim-results-wrap {
  max-height: 62vh;
}

#adminSimCreateSchoolWrap,
#adminSimEditSchoolWrap {
  display: grid;
  gap: 0.45rem;
  margin-top: 0.2rem;
}

#adminSimCreateSchoolWrap[hidden],
#adminSimEditSchoolWrap[hidden] {
  display: none !important;
}

.sim-stats-table th:first-child,
.sim-stats-table td:first-child {
  min-width: 180px;
}

.sim-metric-help {
  margin-left: 0.3rem;
  width: 22px;
  height: 22px;
  border-radius: 50%;
  border: 1px solid rgba(79, 93, 115, 0.35);
  background: #eef4ff;
  color: var(--color-primary-dark);
  font-weight: 800;
  line-height: 1;
  cursor: pointer;
}

.sim-top10-grid {
  margin-top: 0.8rem;
  display: grid;
  grid-template-columns: 1fr;
  gap: 0.7rem;
}

.sim-top10-card {
  border: 1px solid rgba(79, 93, 115, 0.24);
  border-radius: 0.85rem;
  background: #fff;
  padding: 0.55rem;
}

.sim-top10-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.45rem;
  margin-bottom: 0.35rem;
}

.sim-top10-head h3 {
  margin: 0;
  font-size: max(var(--ui-font-min), 0.96rem);
  color: var(--color-primary-dark);
}

.sim-top10-table {
  min-width: 0;
}

.sim-chart-card {
  border: 1px solid rgba(79, 93, 115, 0.24);
  border-radius: 0.85rem;
  background: #fff;
  padding: 0.55rem;
}

.sim-stats-chart-grid {
  margin-top: 0.85rem;
  display: grid;
  grid-template-columns: 1fr;
  gap: 0.75rem;
}

.sim-chart-canvas {
  width: 100%;
  border: 1px solid rgba(79, 93, 115, 0.24);
  border-radius: 0.85rem;
  background: #f6f9ff;
}

.admin-password-field-wrap {
  display: grid;
  gap: 0.4rem;
  margin-top: 0.1rem;
}

.admin-password-field-wrap[hidden] {
  display: none !important;
}

.admin-password-field-wrap small {
  color: var(--color-muted);
}

.password-input-wrap {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 0.45rem;
  align-items: center;
}

.password-toggle-btn {
  min-height: 40px;
  padding-inline: 0.8rem;
  white-space: nowrap;
}

.sim-areas-fieldset {
  margin: 0.2rem 0 0.1rem;
  padding: 0.6rem 0.65rem;
  border: 1px solid rgba(79, 93, 115, 0.27);
  border-radius: 0.85rem;
  background: rgba(220, 233, 248, 0.2);
  display: grid;
  gap: 0.45rem;
}

.sim-areas-fieldset legend {
  padding: 0 0.25rem;
  color: var(--color-primary-dark);
  font-weight: 700;
  font-size: max(var(--ui-font-min), 0.92rem);
}

.student-overview-modal-grid {
  margin-top: 0.8rem;
  display: grid;
  grid-template-columns: 1fr;
  gap: 0.8rem;
}

.student-overview-modal-grid-single-pane {
  margin-top: 0;
  grid-template-columns: minmax(0, 1fr);
}

.student-overview-modal-grid section {
  border: 1px solid rgba(79, 93, 115, 0.2);
  border-radius: 0.85rem;
  background: #fff;
  padding: 0.6rem;
}

.student-overview-modal-grid h3 {
  margin: 0 0 0.45rem;
  color: var(--color-primary-dark);
  font-size: max(var(--ui-font-min), 1rem);
}

#adminStudentOverviewPaneNotes .student-notes-table-wrap,
#adminStudentOverviewPaneComments .sim-search-results {
  width: 100%;
}

.student-overview-identity {
  margin: 0.15rem 0 0.72rem;
  border: 1px solid rgba(47, 111, 216, 0.36);
  border-radius: 0.95rem;
  background: linear-gradient(145deg, #eef5ff, #f8fbff 58%, #eef8f1);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.75);
  padding: 0.72rem 0.8rem;
  display: grid;
  gap: 0.42rem;
}

.student-overview-identity-main {
  display: grid;
  gap: 0.18rem;
}

.student-overview-identity-label {
  margin: 0;
  color: #365c96;
  font-size: max(var(--ui-font-min), 0.76rem);
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.student-overview-identity-main strong {
  color: #17345f;
  font-size: max(var(--ui-font-min), 1.15rem);
  line-height: 1.2;
}

.student-overview-identity-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 0.45rem 0.6rem;
}

.student-overview-identity-meta span {
  display: inline-flex;
  align-items: center;
  border: 1px solid rgba(79, 93, 115, 0.26);
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.78);
  padding: 0.28rem 0.56rem;
  color: #364a68;
  font-size: max(var(--ui-font-min), 0.8rem);
  font-weight: 700;
}

.student-overview-tabs {
  margin: 0 0 0.72rem;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0.32rem;
  border: 1px solid rgba(47, 111, 216, 0.34);
  border-radius: 0.95rem;
  background: linear-gradient(145deg, #edf4ff, #f8fbff);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.78);
  padding: 0.28rem;
}

.student-portal-tabs {
  margin-top: 1rem;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  border: 1px solid rgba(27, 77, 153, 0.24);
  border-radius: 1rem;
  background: linear-gradient(145deg, rgba(234, 243, 255, 0.95), rgba(247, 251, 255, 0.95));
  box-shadow: 0 16px 30px rgba(15, 33, 61, 0.1);
  padding: 0.42rem;
}

.student-overview-tab {
  min-height: 40px;
  border-radius: 0.74rem;
  border: 0;
  background: transparent;
  color: #365c96;
  font-weight: 700;
  letter-spacing: 0.01em;
  padding: 0.44rem 0.75rem;
  cursor: pointer;
  transition: background 180ms ease, color 180ms ease, transform 180ms ease, box-shadow 180ms ease;
}

.student-overview-tab:hover {
  background: rgba(47, 111, 216, 0.08);
}

.student-overview-tab.is-active {
  background: linear-gradient(135deg, #2f6fd8, #1f4f9a);
  color: #fff;
  box-shadow: 0 8px 14px rgba(31, 79, 154, 0.24);
  transform: translateY(-1px);
}

.student-portal-tabs .student-overview-tab {
  min-height: 46px;
  border: 1px solid rgba(37, 89, 168, 0.14);
  border-radius: 0.82rem;
  background: linear-gradient(160deg, rgba(255, 255, 255, 0.94), rgba(244, 249, 255, 0.94));
  color: #1f467f;
  font-weight: 750;
  box-shadow: 0 6px 14px rgba(16, 45, 87, 0.08);
}

.student-portal-tabs .student-overview-tab:hover {
  border-color: rgba(37, 89, 168, 0.36);
  background: linear-gradient(160deg, #ffffff, #edf5ff);
  transform: translateY(-1px);
}

.student-portal-tabs .student-overview-tab:focus-visible {
  outline: none;
  border-color: rgba(37, 89, 168, 0.7);
  box-shadow: 0 0 0 3px rgba(37, 89, 168, 0.18);
}

.student-portal-tabs .student-overview-tab.is-active {
  border-color: rgba(18, 60, 123, 0.78);
  box-shadow: 0 12px 22px rgba(16, 58, 120, 0.34);
}

.student-overview-pane[hidden] {
  display: none !important;
}

.student-portal-pane {
  margin-top: 0;
}

.student-dashboard-grid-tab {
  gap: 0.95rem;
}

.student-portal-sections {
  margin-top: 1rem;
  display: grid;
  gap: 0.95rem;
}

.student-portal-tabs-card {
  margin: 0 0 0.55rem;
  padding: 0;
  border: 0;
  background: transparent;
  box-shadow: none;
}

.student-portal-tabs-card .student-overview-tabs {
  margin: 0;
  gap: 0.52rem;
}

.student-portal-priority-grid {
  display: grid;
  gap: 0.95rem;
}

.student-priority-card {
  border-width: 2px;
  box-shadow: 0 14px 28px rgba(15, 28, 46, 0.12);
}

.student-priority-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.5rem;
}

.student-priority-head h2 {
  margin: 0;
}

.student-priority-tag {
  display: inline-flex;
  align-items: center;
  border-radius: 999px;
  padding: 0.2rem 0.6rem;
  font-size: max(var(--ui-font-min), 0.75rem);
  font-weight: 800;
  letter-spacing: 0.03em;
  text-transform: uppercase;
}

.student-priority-finance {
  border-color: rgba(47, 111, 216, 0.45);
  background: linear-gradient(160deg, rgba(238, 245, 255, 0.96), rgba(247, 251, 255, 0.94));
}

.student-priority-finance .student-priority-tag {
  background: rgba(47, 111, 216, 0.14);
  color: #1f4f9a;
}

.student-priority-comments {
  border-color: rgba(189, 71, 71, 0.45);
  background: linear-gradient(160deg, rgba(255, 241, 241, 0.95), rgba(255, 249, 244, 0.95));
}

.student-priority-comments .student-priority-tag {
  background: rgba(189, 71, 71, 0.14);
  color: #982f2f;
}

.student-inactive-notice {
  margin: 0 0 0.95rem;
  border: 1px solid rgba(190, 18, 60, 0.34);
  border-radius: 0.85rem;
  background: #fff1f2;
  padding: 0.9rem 1rem;
  color: #be123c;
  font-weight: 700;
}

.student-inactive-notice h2 {
  margin: 0 0 0.25rem;
  font-size: max(var(--ui-font-min), 1.02rem);
  color: #8b3d1f;
}

.student-inactive-notice p {
  margin: 0;
  color: #654b34;
}

.student-unregistered-notice {
  margin: 0 0 0.95rem;
  border: 1px solid rgba(37, 99, 235, 0.24);
  border-radius: 0.85rem;
  background: #eff6ff;
  padding: 0.9rem 1rem;
  color: #1d4ed8;
  font-weight: 700;
}

.student-portal-notes-card {
  border: 1px solid rgba(79, 93, 115, 0.25);
  border-radius: 0.9rem;
  background: #fff;
}

.student-simulator-card {
  border: 1px solid rgba(79, 93, 115, 0.25);
  border-radius: 0.9rem;
  background: #fff;
}

.student-simulator-modal-card {
  width: min(560px, 100%);
  padding: 0.85rem 0.9rem;
}

.student-simulator-form {
  display: grid;
  gap: 0.75rem;
}

.student-simulator-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 0.55rem;
}

.student-simulator-grid label {
  display: grid;
  gap: 0.28rem;
  color: var(--color-primary-dark);
  font-weight: 700;
  font-size: max(var(--ui-font-min), 0.9rem);
}

.student-simulator-grid input[type="number"] {
  width: 100%;
  border: 1px solid rgba(79, 93, 115, 0.32);
  border-radius: 0.75rem;
  padding: 0.52rem 0.62rem;
  font-size: max(var(--ui-font-min), 0.94rem);
  color: var(--color-text);
  background: #fff;
  outline: none;
}

.student-simulator-grid input[type="number"]:focus-visible {
  border-color: rgba(47, 111, 216, 0.72);
  box-shadow: 0 0 0 3px rgba(47, 111, 216, 0.15);
}

.student-simulator-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.45rem;
}

.student-simulator-result {
  margin-top: 0.7rem;
  border: 1px solid rgba(79, 93, 115, 0.2);
  border-radius: 0.78rem;
  background: #f8fbff;
  padding: 0.62rem 0.68rem;
  color: var(--color-text);
  font-weight: 700;
  min-height: 44px;
  display: flex;
  align-items: center;
}

.student-simulator-result.is-success {
  border-color: rgba(96, 170, 122, 0.45);
  background: rgba(232, 248, 236, 0.88);
  color: #1f5f3a;
}

.student-simulator-result.is-error {
  border-color: rgba(178, 73, 73, 0.4);
  background: rgba(255, 238, 238, 0.9);
  color: #8a2b2b;
}

@media (max-width: 900px) {
  .student-simulator-modal-card {
    width: 100%;
    padding: 0.72rem;
  }
}

.student-overview-footer-actions {
  margin-top: 0.85rem;
  padding-top: 0.7rem;
  border-top: 1px dashed rgba(79, 93, 115, 0.28);
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-start;
  gap: 0.5rem;
}

.student-overview-footer-actions .btn-secondary,
.student-overview-footer-actions .btn-danger,
.student-overview-footer-actions .btn-primary {
  box-shadow: 0 7px 14px rgba(15, 28, 46, 0.12);
}

.student-overview-danger-btn {
  border-radius: 999px;
  font-weight: 700;
  color: #9a2f2f;
  background: #fff1f1;
  border-color: rgba(167, 79, 79, 0.4);
}

.student-overview-danger-btn:hover {
  background: #ffe5e5;
}

.student-dashboard-grid {
  display: grid;
  gap: 0.95rem;
}

.topbar-account-btn {
  min-height: 36px;
}

.professor-workspace .admin-users-scroll {
  min-height: 50vh;
}

@media (min-width: 960px) {
  .sim-stats-chart-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

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

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

  .student-overview-modal-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .student-overview-modal-grid-single-pane {
    grid-template-columns: minmax(0, 1fr);
  }

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

  .student-portal-priority-grid {
    grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr);
  }

  .student-finance-block {
    grid-column: 1 / -1;
  }
}

.sim-results-table .sim-participant-cell {
  min-width: 220px;
}

.sim-results-table th:last-child,
.sim-results-table td:last-child {
  text-align: right;
}

.sim-results-table td:last-child .admin-user-actions {
  justify-content: flex-end;
  flex-wrap: wrap;
}

.sim-score-disabled {
  justify-content: center;
}

.admin-floating-toast {
  position: fixed;
  right: 1rem;
  bottom: 1rem;
  z-index: 1800;
  border-radius: 0.85rem;
  border: 1px solid rgba(79, 93, 115, 0.32);
  background: #f6fbff;
  color: var(--color-primary-dark);
  font-weight: 700;
  box-shadow: 0 14px 30px rgba(15, 28, 46, 0.22);
  padding: 0.6rem 0.85rem;
  max-width: min(360px, calc(100vw - 2rem));
}

.admin-floating-toast.is-success {
  border-color: #9fd6b4;
  background: #eaf7ef;
  color: #2e7f53;
}

.admin-floating-toast.is-error {
  border-color: #e6a9a9;
  background: #fdeeee;
  color: #a24949;
}

.admin-users-scroll {
  flex: 1;
  overflow-y: auto;
  border: 1px solid rgba(79, 93, 115, 0.28);
  border-radius: var(--radius-md);
  background: #fff;
  padding: 0.7rem;
  display: grid;
  gap: 0.65rem;
  min-height: 420px;
  max-height: 72vh;
  align-content: start;
  align-items: start;
  grid-auto-rows: max-content;
}

.admin-users-scroll > * {
  align-self: start;
}

.admin-users-scroll > * + * {
  margin-top: 0.1rem;
  padding-top: 0.6rem;
  border-top: 1px dashed rgba(79, 93, 115, 0.24);
}

.admin-users-empty {
  margin: 0;
  color: var(--color-muted);
}

.admin-users-toolbar {
  display: grid;
  grid-template-columns: 2fr repeat(3, minmax(0, 1fr));
  gap: 0.55rem;
  margin: 0 0 0.8rem;
}

.admin-users-header-card {
  min-height: auto;
  padding: 0.95rem;
}

.admin-users-header-card .admin-panel-head {
  margin-bottom: 0.35rem;
}

.admin-users-header-card .panel-lead {
  margin: 0;
  color: var(--color-muted);
}

.admin-users-separated-grid {
  margin-top: 0.9rem;
  display: grid;
  gap: 0.95rem;
}

.admin-users-group-card {
  min-height: auto;
  padding: 0.78rem;
}

.admin-users-groups {
  display: grid;
  gap: 0.95rem;
}

.admin-users-group {
  border: 1px solid rgba(79, 93, 115, 0.24);
  border-radius: 0.95rem;
  background: rgba(255, 255, 255, 0.9);
  padding: 0.7rem;
}

.admin-users-group-head {
  margin: 0 0 0.55rem;
}

.admin-users-group-head h3 {
  margin: 0;
  font-size: max(var(--ui-font-min), 1.02rem);
  color: var(--color-primary-dark);
}

.user-list-toolbar {
  grid-template-columns: 2fr repeat(2, minmax(0, 1fr)) auto;
  align-items: center;
}

.student-list-toolbar {
  grid-template-columns: minmax(180px, 1.5fr) repeat(4, minmax(118px, 0.78fr)) auto;
  gap: 0.42rem;
}

.user-role-toolbar {
  grid-template-columns: 2fr minmax(0, 1fr);
  align-items: center;
}

.admin-users-scroll-compact {
  min-height: 250px;
  max-height: 50vh;
}

.year-rollover-target-banner {
  display: grid;
  gap: 0.2rem;
  border-radius: 1rem;
  border: 1px solid rgba(31, 79, 143, 0.28);
  background: linear-gradient(135deg, #e8f3ff 0%, #f8fbff 45%, #eef9f3 100%);
  box-shadow: 0 10px 24px rgba(31, 79, 143, 0.12);
  padding: 0.8rem 0.95rem;
}

.year-rollover-target-label {
  font-size: max(var(--ui-font-min), 0.76rem);
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: #466a94;
  font-weight: 700;
}

.year-rollover-target-value {
  font-family: "Sora", "Segoe UI", sans-serif;
  font-size: max(var(--ui-font-min), clamp(1.65rem, 3vw, 2.05rem));
  line-height: 1;
  color: #204568;
}

.year-rollover-target-help {
  color: #486582;
  font-size: max(var(--ui-font-min), 0.82rem);
}

.rollover-list {
  max-height: 44vh;
  overflow-y: auto;
}

.rollover-item {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 0.55rem;
  align-items: start;
}

.rollover-item input[type="checkbox"] {
  margin-top: 0.2rem;
}

.admin-search-input,
.admin-filter-select {
  min-height: 42px;
  width: 100%;
  border-radius: 0.85rem;
  border: 1px solid rgba(79, 93, 115, 0.35);
  background: #fff;
  color: var(--color-text);
  padding: 0.65rem 0.8rem;
  font-size: max(var(--ui-font-min), 0.94rem);
  outline: none;
  transition: border-color 180ms ease, box-shadow 180ms ease;
}

.student-list-toolbar .admin-search-input,
.student-list-toolbar .admin-filter-select {
  min-height: 38px;
  border-radius: 0.68rem;
  padding: 0.48rem 0.66rem;
  font-size: max(var(--ui-font-min), 0.86rem);
}

.admin-search-input.is-filter-active,
.admin-filter-select.is-filter-active {
  border-color: rgba(13, 91, 255, 0.72);
  background: linear-gradient(180deg, #eef6ff, #ffffff);
  box-shadow: 0 0 0 2px rgba(13, 91, 255, 0.14), inset 3px 0 0 rgba(13, 91, 255, 0.62);
}

.admin-search-input:focus-visible,
.admin-filter-select:focus-visible {
  border-color: rgba(79, 93, 115, 0.72);
  box-shadow: 0 0 0 3px rgba(31, 79, 143, 0.14);
}

.admin-filter-select option:disabled {
  color: #8a95a6;
  background: #f1f4f8;
}

.admin-user-row {
  border: 1px solid rgba(79, 93, 115, 0.26);
  border-radius: 0.9rem;
  background: #fff;
  padding: 0.75rem;
}

.admin-user-row-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.6rem;
}

.admin-user-row h3 {
  margin: 0;
  font-size: max(var(--ui-font-min), 1rem);
  color: var(--color-primary-dark);
}

.admin-user-role {
  display: inline-flex;
  border-radius: 999px;
  border: 1px solid rgba(79, 93, 115, 0.35);
  background: #e5efff;
  color: var(--color-primary-dark);
  font-size: max(var(--ui-font-min), 0.75rem);
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  padding: 0.22rem 0.55rem;
}

.admin-user-meta,
.admin-user-extra {
  margin: 0.4rem 0 0;
  color: var(--color-muted);
  font-size: max(var(--ui-font-min), 0.92rem);
}

.admin-school-key-meta {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.admin-user-row-footer {
  margin-top: 0.68rem;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.6rem;
}

.admin-user-status {
  display: inline-flex;
  align-items: center;
  border-radius: 999px;
  border: 1px solid rgba(79, 93, 115, 0.3);
  background: #eef2f8;
  color: #415067;
  font-size: max(var(--ui-font-min), 0.75rem);
  font-weight: 700;
  letter-spacing: 0.03em;
  text-transform: uppercase;
  padding: 0.22rem 0.55rem;
}

.admin-user-status.is-active {
  background: #eaf7ef;
  border-color: #9fd6b4;
  color: #2e7f53;
}

.admin-user-status.is-inactive {
  background: #fdeeee;
  border-color: #e6a9a9;
  color: #a24949;
}

.admin-user-row-prof-active {
  background: #eefcf2;
  border-color: #a4d9b8;
}

.admin-user-row-prof-inactive {
  background: #fff1f1;
  border-color: #e3aaaa;
}

.admin-user-actions {
  display: inline-flex;
  gap: 0.45rem;
}

.btn-xsmall {
  min-height: 34px;
  padding: 0.35rem 0.72rem;
  font-size: max(var(--ui-font-min), 0.85rem);
  border-radius: 999px;
  border: 1px solid transparent;
  font-weight: 700;
  cursor: pointer;
  transition: transform 160ms ease, box-shadow 160ms ease, opacity 160ms ease;
}

.btn-xsmall:hover {
  transform: translateY(-1px);
}

.btn-xsmall:disabled {
  opacity: 0.6;
  cursor: not-allowed;
  transform: none;
}

.btn-secondary {
  color: var(--color-primary-dark);
  background: #f3f7ff;
  border-color: rgba(79, 93, 115, 0.36);
}

.btn-subtle {
  background: rgba(79, 93, 115, 0.08);
  border-color: rgba(79, 93, 115, 0.24);
  color: #2f425f;
  box-shadow: none;
}

.btn-subtle:hover {
  background: rgba(79, 93, 115, 0.14);
}

.btn-danger {
  min-height: 40px;
  border-radius: 999px;
  border: 1px solid rgba(167, 79, 79, 0.4);
  font-weight: 700;
  padding: 0.5rem 1rem;
  cursor: pointer;
  color: #9a2f2f;
  background: #fff1f1;
}

.btn-danger:hover {
  background: #ffe5e5;
}

.admin-form {
  display: grid;
  gap: 0.5rem;
}

.admin-form label {
  font-weight: 700;
  color: var(--color-primary-dark);
}

.admin-form input[type="text"],
.admin-form input[type="password"],
.admin-form input[type="number"],
.admin-form input[type="date"],
.admin-form select {
  width: 100%;
  min-height: 44px;
  border-radius: var(--radius-md);
  border: 1px solid rgba(79, 93, 115, 0.35);
  background: #fff;
  padding: 0.7rem 0.9rem;
  font-size: max(var(--ui-font-min), 0.98rem);
  color: var(--color-text);
  outline: none;
  transition: border-color 180ms ease, box-shadow 180ms ease;
}

.admin-form input[type="text"]:focus-visible,
.admin-form input[type="password"]:focus-visible,
.admin-form input[type="number"]:focus-visible,
.admin-form input[type="date"]:focus-visible,
.admin-form select:focus-visible {
  border-color: rgba(79, 93, 115, 0.7);
  box-shadow: 0 0 0 3px rgba(31, 79, 143, 0.15);
}

.auth-form select,
.setup-form select,
.sim-block select,
.admin-filter-select,
.admin-form select {
  margin: 0;
  font-family: "Outfit", "Segoe UI", sans-serif;
  line-height: 1.25;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  background-image:
    linear-gradient(165deg, rgba(255, 255, 255, 0.96), rgba(241, 248, 255, 0.96)),
    linear-gradient(45deg, transparent 50%, rgba(26, 70, 134, 0.95) 50%),
    linear-gradient(135deg, rgba(26, 70, 134, 0.95) 50%, transparent 50%),
    linear-gradient(to right, rgba(45, 91, 166, 0.18), rgba(45, 91, 166, 0.18));
  background-position:
    0 0,
    calc(100% - 15px) calc(50% - 2px),
    calc(100% - 9px) calc(50% - 2px),
    calc(100% - 2.1rem) 50%;
  background-size:
    100% 100%,
    6px 6px,
    6px 6px,
    1px 58%;
  background-repeat: no-repeat;
  border-color: rgba(43, 86, 153, 0.34);
  color: #153457;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.88), 0 1px 2px rgba(23, 54, 97, 0.08);
  padding-right: 2.35rem;
}

.auth-form select:hover,
.setup-form select:hover,
.sim-block select:hover,
.admin-filter-select:hover,
.admin-form select:hover {
  border-color: rgba(43, 86, 153, 0.5);
}

.auth-form select:disabled,
.setup-form select:disabled,
.sim-block select:disabled,
.admin-filter-select:disabled,
.admin-form select:disabled {
  background-image: linear-gradient(165deg, rgba(241, 245, 251, 0.96), rgba(236, 242, 250, 0.96));
  border-color: rgba(92, 112, 142, 0.24);
  color: #6b7f99;
  box-shadow: none;
  cursor: not-allowed;
}

.auth-form select[multiple],
.setup-form select[multiple],
.sim-block select[multiple],
.admin-filter-select[multiple],
.admin-form select[multiple],
.auth-form select[size]:not([size="1"]),
.setup-form select[size]:not([size="1"]),
.sim-block select[size]:not([size="1"]),
.admin-filter-select[size]:not([size="1"]),
.admin-form select[size]:not([size="1"]) {
  background-image: none;
  padding-right: 0.9rem;
}

.admin-form .btn-primary {
  margin-top: 0.65rem;
}

.admin-form .btn-danger {
  margin-top: 0.2rem;
}

.admin-modal-layer {
  position: fixed;
  inset: 0;
  z-index: 1500;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 1rem;
}

.admin-modal-layer[hidden] {
  display: none !important;
}

.admin-modal-backdrop {
  position: absolute;
  inset: 0;
  background: rgba(18, 31, 50, 0.52);
  backdrop-filter: blur(2px);
}

.admin-modal-card {
  position: relative;
  z-index: 1;
  width: min(620px, 100%);
  max-height: calc(100vh - 2rem);
  overflow: auto;
  border-radius: 1.15rem;
  border: 1px solid rgba(79, 93, 115, 0.4);
  background: linear-gradient(160deg, rgba(255, 255, 255, 0.99), rgba(246, 250, 255, 0.98));
  box-shadow: 0 26px 58px rgba(15, 28, 46, 0.3);
  padding: 1rem;
}

.admin-modal-card.admin-modal-card-wide {
  width: min(1280px, 100%);
}

.admin-modal-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.7rem;
  margin-bottom: 0.7rem;
}

.admin-modal-head h2 {
  margin: 0;
  font-family: "Sora", "Segoe UI", sans-serif;
  font-size: max(var(--ui-font-min), 1.24rem);
  color: var(--color-primary-dark);
}

.admin-modal-close {
  min-width: 36px;
  min-height: 36px;
  border-radius: 50%;
  border: 1px solid rgba(79, 93, 115, 0.35);
  background: #fff;
  color: var(--color-primary-dark);
  font-size: max(var(--ui-font-min), 1rem);
  font-weight: 700;
  cursor: pointer;
}

.admin-confirm-card {
  width: min(470px, 100%);
}

.admin-confirm-card h2 {
  margin: 0 0 0.35rem;
  font-family: "Sora", "Segoe UI", sans-serif;
  font-size: max(var(--ui-font-min), 1.2rem);
}

.admin-confirm-card p {
  margin: 0;
  color: var(--color-muted);
}

.admin-confirm-actions {
  margin-top: 0.95rem;
  display: flex;
  justify-content: flex-end;
  gap: 0.55rem;
}

.admin-switch-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.8rem;
  margin: 0 0 0.9rem;
  padding: 0.85rem;
  border-radius: var(--radius-md);
  border: 1px solid rgba(79, 93, 115, 0.3);
  background: rgba(220, 233, 248, 0.24);
}

.admin-switch-row strong {
  color: var(--color-primary-dark);
}

.admin-switch-status {
  margin: 0.2rem 0 0;
  font-size: max(var(--ui-font-min), 0.92rem);
  font-weight: 700;
}

.admin-switch-status.is-active {
  color: #2e7f53;
}

.admin-switch-status.is-inactive {
  color: #a24949;
}

.admin-switch {
  position: relative;
  width: 56px;
  height: 32px;
  display: inline-flex;
}

.admin-switch input {
  opacity: 0;
  width: 0;
  height: 0;
}

.admin-switch-slider {
  position: absolute;
  inset: 0;
  border-radius: 999px;
  background: #d96666;
  transition: background-color 180ms ease;
}

.admin-switch-slider::before {
  content: "";
  position: absolute;
  width: 24px;
  height: 24px;
  left: 4px;
  top: 4px;
  border-radius: 50%;
  background: #fff;
  transition: transform 180ms ease;
  box-shadow: 0 2px 6px rgba(15, 23, 42, 0.24);
}

.admin-switch input:checked + .admin-switch-slider {
  background: #4ebd7f;
}

.admin-switch input:checked + .admin-switch-slider::before {
  transform: translateX(24px);
}

.btn-secondary {
  min-height: 40px;
  border-radius: 999px;
  border: 1px solid rgba(79, 93, 115, 0.36);
  background: #f3f7ff;
  color: var(--color-primary-dark);
  font-weight: 700;
  padding: 0.5rem 1rem;
  cursor: pointer;
}

.btn-xsmall.btn-secondary {
  min-height: 34px;
  padding: 0.35rem 0.72rem;
  font-size: max(var(--ui-font-min), 0.85rem);
}

.no-scroll {
  overflow: hidden;
}

@media (max-width: 720px) {
  .auth-body {
    padding: 1rem;
  }

  .panel-grid {
    grid-template-columns: 1fr;
  }

  .panel-topbar-inner {
    padding-inline: 1rem;
  }

  .panel-shell {
    padding-inline: 1rem;
  }

  .admin-users-toolbar {
    grid-template-columns: 1fr;
  }

  .user-list-toolbar {
    grid-template-columns: 1fr;
  }

  .user-role-toolbar {
    grid-template-columns: 1fr;
  }

  .sim-list-toolbar {
    grid-template-columns: 1fr;
  }

  .school-sim-toolbar {
    grid-template-columns: 1fr;
  }

  .school-list-toolbar {
    grid-template-columns: 1fr;
  }

  .admin-panel-head-actions {
    width: 100%;
    justify-content: flex-start;
  }

  .admin-module-nav {
    display: flex;
    flex-wrap: nowrap;
    gap: 0.32rem;
    width: 100%;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: thin;
    border-radius: 0.95rem;
    padding: 0.28rem;
  }

  .admin-module-btn {
    flex: 0 0 auto;
    white-space: nowrap;
    min-height: 40px;
    padding-inline: 0.95rem;
  }

  .admin-panel-card {
    min-height: auto;
    padding: 0.85rem;
  }

  .admin-users-scroll {
    min-height: 240px;
    max-height: min(56vh, 430px);
  }

  .admin-users-scroll-compact {
    min-height: 190px;
    max-height: min(48vh, 320px);
  }

  .finance-report-card .student-notes-table {
    min-width: 760px;
  }

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

  .sim-areas-grid {
    grid-template-columns: 1fr;
  }

  .sim-participant-tools {
    grid-template-columns: 1fr;
  }

  .sim-external-box {
    grid-template-columns: 1fr;
  }

  .admin-user-row-footer {
    flex-direction: column;
    align-items: flex-start;
  }

  .sim-card-actions {
    justify-content: flex-start;
  }

  .sim-grade-row {
    flex-direction: column;
    align-items: flex-start;
  }

  .sim-results-modal-actions {
    flex-direction: column;
    align-items: stretch;
  }

  .sim-results-modal-actions .btn-secondary {
    width: 100%;
  }

  .sim-comment-entry {
    grid-template-columns: 1fr;
  }

  .student-overview-tabs {
    display: grid;
    grid-template-columns: 1fr;
    padding: 0.35rem;
  }

  .student-portal-tabs {
    grid-template-columns: 1fr;
  }

  .student-overview-tab {
    width: 100%;
  }

  .student-overview-identity-meta {
    flex-direction: column;
    align-items: stretch;
  }

  .student-overview-footer-actions {
    flex-direction: column;
    align-items: stretch;
  }

  .student-overview-footer-actions .btn-secondary,
  .student-overview-footer-actions .btn-danger,
  .student-overview-footer-actions .btn-primary {
    width: 100%;
  }

  .password-input-wrap {
    grid-template-columns: 1fr;
  }

  .password-toggle-btn {
    width: 100%;
  }

  .finance-toolbar {
    grid-template-columns: 1fr;
  }

  .finance-kpi-grid {
    grid-template-columns: 1fr;
  }

  .finance-split-grid {
    grid-template-columns: 1fr;
  }

  .finance-modal-grid {
    grid-template-columns: 1fr;
  }

  .student-finance-actions {
    width: 100%;
    display: grid;
    grid-template-columns: 1fr;
  }

  .student-finance-actions .btn-secondary {
    width: 100%;
  }

  .finance-payment-item,
  .student-finance-row {
    flex-direction: column;
    align-items: flex-start;
  }

  .admin-year-controls-row {
    grid-template-columns: 1fr;
  }

  .sim-stats-chart-grid {
    grid-template-columns: 1fr;
  }

  .admin-modal-layer {
    padding: 0.65rem;
  }

  .admin-modal-card {
    max-height: calc(100vh - 1.3rem);
  }

  .admin-floating-toast {
    left: 0.75rem;
    right: 0.75rem;
    bottom: 0.75rem;
    max-width: none;
  }
}

@media (min-width: 721px) and (max-width: 991.98px) {
  .admin-panel-card {
    min-height: auto;
  }

  .admin-module-nav {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    width: 100%;
    border-radius: 0.95rem;
  }

  .admin-module-btn {
    text-align: center;
  }

  .admin-users-scroll {
    min-height: 300px;
    max-height: min(60vh, 520px);
  }

  .admin-users-scroll-compact {
    min-height: 220px;
    max-height: min(50vh, 420px);
  }

  .admin-users-toolbar {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .user-list-toolbar {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .user-role-toolbar {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .sim-list-toolbar {
    grid-template-columns: 1fr minmax(140px, 200px) auto;
  }

  .school-sim-toolbar {
    grid-template-columns: 1fr auto;
  }

  .school-list-toolbar {
    grid-template-columns: 1fr auto;
  }

  .student-portal-tabs {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .admin-panel-head-actions {
    width: 100%;
    justify-content: flex-start;
  }

  .sim-card-actions {
    justify-content: flex-start;
  }

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

  .sim-stats-chart-grid {
    grid-template-columns: 1fr;
  }

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

  .finance-split-grid {
    grid-template-columns: 1fr;
  }

  .finance-modal-grid {
    grid-template-columns: 1fr;
  }
}

.admin-virtual-bank-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1rem;
  margin-top: 1rem;
}

.admin-virtual-editor-toolbar {
  display: flex;
  flex-wrap: wrap;
  gap: 0.45rem;
  margin-top: 0.75rem;
}

.admin-virtual-bank-column {
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 0.85rem;
}

.admin-virtual-bank-actions {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 0.8rem;
  margin-top: 1rem;
  padding: 0.85rem;
  border: 1px solid rgba(31, 79, 154, 0.14);
  border-radius: 0.5rem;
  background: #f8fbff;
}

.admin-virtual-bank-actions h3 {
  margin: 0;
  color: var(--text-strong);
}

.admin-virtual-bank-action-buttons {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 0.45rem;
}

.admin-virtual-area-counts {
  display: flex;
  flex-wrap: wrap;
  gap: 0.45rem clamp(1.4rem, 3vw, 2.6rem);
  align-items: center;
  margin-top: 0.7rem;
  padding: 0.6rem 0.85rem;
  border: 1px solid rgba(31, 79, 154, 0.14);
  border-radius: 0.5rem;
  background: #f8fbff;
  color: #17335c;
  font-size: max(var(--ui-font-min), 0.9rem);
  font-weight: 800;
}

.admin-virtual-area-count {
  white-space: nowrap;
}

.admin-virtual-area-count.is-total {
  color: #0f5b43;
  font-weight: 900;
}

.admin-virtual-bank-tree {
  margin-top: 1rem;
  display: grid;
  gap: 1rem;
  align-content: start;
  min-width: 0;
}

.admin-virtual-tree-section {
  border: 1px solid rgba(31, 79, 154, 0.14);
  border-radius: 0.5rem;
  background: #ffffff;
  overflow: hidden;
  min-width: 0;
}

.admin-virtual-tree-section-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  padding: 0.72rem 0.85rem;
  border-bottom: 1px solid rgba(31, 79, 154, 0.12);
  background: #f3f8ff;
}

.admin-virtual-tree-section-head h3 {
  margin: 0;
  color: #153f72;
  font-size: max(var(--ui-font-min), 1rem);
}

.admin-virtual-tree-section-head span {
  color: var(--text-soft);
  font-size: max(var(--ui-font-min), 0.86rem);
  font-weight: 700;
  white-space: nowrap;
}

.admin-virtual-context-row,
.admin-virtual-question-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 0.8rem;
  padding: 0.78rem 0.85rem;
  border-bottom: 1px solid rgba(31, 79, 154, 0.1);
  min-width: 0;
  max-width: 100%;
}

.admin-virtual-context-row {
  background: #ffffff;
}

.admin-virtual-question-row {
  background: #fbfdff;
}

.admin-virtual-question-row.is-compact {
  padding: 0.62rem 0.75rem;
  border: 1px solid rgba(31, 79, 154, 0.1);
  border-radius: 0.5rem;
  background: #ffffff;
}

.admin-virtual-tree-section > .admin-virtual-question-row:last-child,
.admin-virtual-tree-section > .admin-virtual-context-row:last-child {
  border-bottom: 0;
}

.admin-virtual-row-main {
  min-width: 0;
  display: grid;
  gap: 0.32rem;
}

.admin-virtual-row-main h4 {
  margin: 0;
  color: var(--text-strong);
  font-size: max(var(--ui-font-min), 0.98rem);
}

.admin-virtual-row-main p {
  margin: 0;
  color: var(--text-soft);
  font-size: max(var(--ui-font-min), 0.88rem);
  line-height: 1.35;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.admin-virtual-row-pills {
  display: flex;
  flex-wrap: wrap;
  gap: 0.35rem;
}

.admin-virtual-status-pill {
  display: inline-flex;
  align-items: center;
  min-height: 1.45rem;
  padding: 0.18rem 0.5rem;
  border: 1px solid rgba(31, 79, 154, 0.16);
  border-radius: 999px;
  background: #eef5ff;
  color: #1b4d86;
  font-size: max(var(--ui-font-min), 0.75rem);
  font-weight: 800;
  line-height: 1;
  white-space: nowrap;
}

.admin-virtual-status-pill.is-success {
  border-color: rgba(26, 127, 89, 0.22);
  background: #e9f8f1;
  color: #146d4d;
}

.admin-virtual-status-pill.is-muted {
  border-color: rgba(105, 118, 138, 0.24);
  background: #f2f5f8;
  color: #59677a;
}

.admin-virtual-status-pill.is-info {
  border-color: rgba(31, 79, 154, 0.2);
  background: #edf5ff;
  color: #225b9c;
}

.admin-virtual-status-pill.is-area {
  border-color: rgba(91, 83, 186, 0.22);
  background: #f1efff;
  color: #413a91;
}

.admin-virtual-status-pill.is-warning {
  border-color: rgba(185, 120, 18, 0.28);
  background: #fff6df;
  color: #8a5b13;
}

.admin-virtual-row-actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 0.4rem;
}

.admin-virtual-question-list,
.admin-virtual-question-sublist {
  display: grid;
  gap: 0.45rem;
  max-height: min(54vh, 560px);
  overflow-y: auto;
  overflow-x: hidden;
  overscroll-behavior: contain;
  align-content: start;
  min-width: 0;
  scrollbar-width: thin;
}

.admin-virtual-question-list {
  padding: 0.65rem 0.85rem 0.85rem;
  background: #ffffff;
}

.admin-virtual-question-sublist {
  padding: 0.65rem 0.85rem 0.85rem;
  border-bottom: 1px solid rgba(31, 79, 154, 0.1);
  background: #f6f9fe;
}

.admin-virtual-question-list::-webkit-scrollbar,
.admin-virtual-question-sublist::-webkit-scrollbar {
  width: 10px;
}

.admin-virtual-question-list::-webkit-scrollbar-track,
.admin-virtual-question-sublist::-webkit-scrollbar-track {
  border-radius: 999px;
  background: rgba(31, 79, 154, 0.08);
}

.admin-virtual-question-list::-webkit-scrollbar-thumb,
.admin-virtual-question-sublist::-webkit-scrollbar-thumb {
  border: 2px solid rgba(246, 249, 254, 0.96);
  border-radius: 999px;
  background: rgba(31, 79, 154, 0.34);
}

.admin-virtual-question-list::-webkit-scrollbar-thumb:hover,
.admin-virtual-question-sublist::-webkit-scrollbar-thumb:hover {
  background: rgba(31, 79, 154, 0.48);
}

.admin-virtual-question-list .admin-virtual-question-row:last-child {
  border-bottom: 0;
}

.admin-virtual-sublist-empty {
  margin: 0;
  padding: 0.62rem 0.75rem;
  border: 1px dashed rgba(31, 79, 154, 0.22);
  border-radius: 0.5rem;
  color: var(--text-soft);
  background: rgba(255, 255, 255, 0.7);
}

.admin-virtual-modal-section {
  display: grid;
  gap: 0.55rem;
  padding: 0.78rem;
  border: 1px solid rgba(31, 79, 154, 0.13);
  border-radius: 0.5rem;
  background: rgba(248, 251, 255, 0.82);
}

.admin-virtual-modal-section h3 {
  margin: 0;
  color: #153f72;
  font-size: max(var(--ui-font-min), 0.98rem);
}

.admin-virtual-editor-toolbar-modal {
  padding-top: 0.2rem;
  margin-top: 0;
}

.admin-virtual-form {
  gap: 0.55rem;
}

.admin-virtual-row {
  display: grid;
  gap: 0.35rem;
}

.admin-virtual-options-fieldset {
  border: 1px solid var(--line-color);
  border-radius: 0.9rem;
  padding: 0.75rem;
  display: grid;
  gap: 0.75rem;
}

.admin-virtual-option-block {
  border: 1px solid rgba(47, 111, 216, 0.18);
  border-radius: 0.75rem;
  padding: 0.65rem;
  display: grid;
  gap: 0.4rem;
  background: rgba(255, 255, 255, 0.72);
}

.admin-virtual-option-block[hidden] {
  display: none !important;
}

.admin-virtual-option-block.is-hidden {
  display: none !important;
}

.admin-virtual-form #adminVirtualContextContenido,
.admin-virtual-form #adminVirtualQuestionEnunciado,
.admin-virtual-form #adminVirtualQuestionExtraData,
.admin-virtual-form .admin-virtual-extra-json,
.admin-virtual-form .admin-virtual-option-html {
  width: 100%;
  border: 1px solid rgba(31, 79, 154, 0.35);
  border-radius: 0.85rem;
  background: linear-gradient(180deg, #ffffff 0%, #f8fbff 100%);
  padding: 0.72rem 0.78rem;
  font-family: "JetBrains Mono", "Fira Code", "Consolas", monospace;
  font-size: max(var(--ui-font-min), 0.84rem);
  line-height: 1.5;
  color: #17335c;
  resize: vertical;
  tab-size: 2;
  outline: none;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.85);
  transition: border-color 0.18s ease, box-shadow 0.18s ease, background-color 0.18s ease;
}

.admin-virtual-form #adminVirtualContextContenido {
  min-height: 170px;
}

.admin-virtual-form #adminVirtualQuestionEnunciado {
  min-height: 190px;
}

.admin-virtual-form #adminVirtualQuestionExtraData,
.admin-virtual-form .admin-virtual-extra-json {
  min-height: 360px;
}

.admin-virtual-form .admin-virtual-option-html {
  min-height: 110px;
}

.admin-virtual-form #adminVirtualContextContenido:focus-visible,
.admin-virtual-form #adminVirtualQuestionEnunciado:focus-visible,
.admin-virtual-form #adminVirtualQuestionExtraData:focus-visible,
.admin-virtual-form .admin-virtual-extra-json:focus-visible,
.admin-virtual-form .admin-virtual-option-html:focus-visible {
  border-color: rgba(26, 88, 191, 0.9);
  box-shadow: 0 0 0 3px rgba(31, 79, 154, 0.16), inset 0 1px 0 rgba(255, 255, 255, 0.92);
  background: #ffffff;
}

.admin-virtual-form #adminVirtualContextContenido::selection,
.admin-virtual-form #adminVirtualQuestionEnunciado::selection,
.admin-virtual-form #adminVirtualQuestionExtraData::selection,
.admin-virtual-form .admin-virtual-extra-json::selection,
.admin-virtual-form .admin-virtual-option-html::selection {
  background: rgba(47, 111, 216, 0.22);
}

.admin-virtual-option-correct {
  display: inline-flex;
  align-items: center;
  gap: 0.45rem;
  font-weight: 600;
}

.admin-virtual-media-head {
  display: grid;
  gap: 0.2rem;
  margin-top: 0.35rem;
}

.admin-virtual-media-title {
  margin: 0;
  color: #17335c;
  font-weight: 800;
  letter-spacing: 0.01em;
}

.admin-virtual-media-head small {
  color: var(--text-soft);
}

.admin-virtual-media-row {
  display: flex;
  gap: 0.65rem;
  align-items: center;
  flex-wrap: wrap;
}

.admin-virtual-media-row input[type="file"] {
  min-width: 260px;
  max-width: 100%;
}

.admin-virtual-media-dropzone {
  border: 1.5px dashed rgba(47, 111, 216, 0.62);
  border-radius: 1rem;
  background: linear-gradient(145deg, #f9fcff 0%, #edf5ff 100%);
  color: #17335c;
  font-size: max(var(--ui-font-min), 0.9rem);
  padding: 0.95rem 0.9rem;
  text-align: center;
  cursor: pointer;
  display: grid;
  gap: 0.35rem;
  transition: border-color 0.18s ease, background-color 0.18s ease, transform 0.18s ease;
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.72);
}

.admin-virtual-media-dropzone strong {
  font-weight: 800;
  font-size: max(var(--ui-font-min), 0.95rem);
}

.admin-virtual-media-dropzone span {
  color: #335b8f;
  font-size: max(var(--ui-font-min), 0.8rem);
  line-height: 1.35;
  font-weight: 500;
}

.admin-virtual-media-dropzone:hover,
.admin-virtual-media-dropzone:focus-visible {
  border-color: rgba(32, 95, 201, 0.92);
  background: linear-gradient(145deg, #f2f8ff 0%, #e6f0ff 100%);
}

.admin-virtual-media-dropzone.is-dragover {
  border-color: rgba(26, 83, 180, 0.98);
  background: linear-gradient(145deg, #eaf3ff 0%, #dceaff 100%);
  transform: translateY(-2px);
}

.admin-virtual-media-queue {
  border: 1px solid rgba(47, 111, 216, 0.24);
  border-radius: 1rem;
  background: linear-gradient(180deg, #ffffff 0%, #f5f9ff 100%);
  padding: 0.8rem;
  display: grid;
  gap: 0.65rem;
}

.admin-virtual-media-queue-head {
  display: grid;
  gap: 0.45rem;
}

.admin-virtual-media-queue-head p {
  margin: 0;
  color: #194182;
  font-weight: 700;
  font-size: max(var(--ui-font-min), 0.84rem);
}

.admin-virtual-media-queue-progress-track {
  width: 100%;
  height: 10px;
  border-radius: 999px;
  background: rgba(28, 84, 169, 0.14);
  border: 1px solid rgba(28, 84, 169, 0.2);
  overflow: hidden;
}

.admin-virtual-media-queue-progress-bar {
  width: 0%;
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, #1d66d8 0%, #2ea1ff 100%);
  transition: width 0.22s ease;
}

.admin-virtual-media-queue-items {
  display: grid;
  gap: 0.55rem;
}

.admin-virtual-media-queue-item {
  border: 1px solid rgba(15, 34, 66, 0.14);
  border-radius: 0.85rem;
  padding: 0.55rem 0.6rem;
  background: #ffffff;
  display: grid;
  gap: 0.34rem;
}

.admin-virtual-media-queue-item.is-uploading {
  border-color: rgba(33, 97, 201, 0.35);
  box-shadow: 0 8px 22px rgba(22, 64, 136, 0.08);
}

.admin-virtual-media-queue-item.is-success {
  border-color: rgba(24, 138, 93, 0.35);
  background: linear-gradient(180deg, #ffffff 0%, #f4fcf8 100%);
}

.admin-virtual-media-queue-item.is-error {
  border-color: rgba(201, 52, 52, 0.32);
  background: linear-gradient(180deg, #ffffff 0%, #fff6f6 100%);
}

.admin-virtual-media-queue-item-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.55rem;
}

.admin-virtual-media-queue-item-head strong {
  color: #17335c;
  font-size: max(var(--ui-font-min), 0.8rem);
  max-width: 68%;
  overflow-wrap: anywhere;
}

.admin-virtual-media-queue-status {
  border-radius: 999px;
  padding: 0.13rem 0.52rem;
  font-size: max(var(--ui-font-min), 0.68rem);
  font-weight: 700;
  letter-spacing: 0.02em;
  white-space: nowrap;
}

.admin-virtual-media-queue-status.is-pending {
  color: #34577f;
  background: rgba(57, 105, 167, 0.14);
}

.admin-virtual-media-queue-status.is-uploading {
  color: #1d66d8;
  background: rgba(29, 102, 216, 0.13);
}

.admin-virtual-media-queue-status.is-success {
  color: #0a8552;
  background: rgba(11, 137, 84, 0.14);
}

.admin-virtual-media-queue-status.is-error {
  color: #bb2f2f;
  background: rgba(187, 47, 47, 0.12);
}

.admin-virtual-media-queue-meta {
  margin: 0;
  color: var(--text-soft);
  font-size: max(var(--ui-font-min), 0.73rem);
}

.admin-virtual-media-queue-item-track {
  width: 100%;
  height: 7px;
  border-radius: 999px;
  background: rgba(28, 84, 169, 0.12);
  overflow: hidden;
}

.admin-virtual-media-queue-item-fill {
  width: 0%;
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, #2f6fd8 0%, #39b1ff 100%);
  transition: width 0.2s ease;
}

.admin-virtual-media-queue-item.is-error .admin-virtual-media-queue-item-fill {
  background: linear-gradient(90deg, #f56c6c 0%, #d84c4c 100%);
}

.admin-virtual-media-queue-item.is-success .admin-virtual-media-queue-item-fill {
  background: linear-gradient(90deg, #22a36b 0%, #48c78e 100%);
}

.admin-virtual-media-queue-error {
  margin: 0;
  color: #a83939;
  font-size: max(var(--ui-font-min), 0.74rem);
}

.admin-virtual-media-library {
  border: 1px solid rgba(47, 111, 216, 0.24);
  border-radius: 1rem;
  background: linear-gradient(180deg, #ffffff 0%, #f5f9ff 100%);
  padding: 0.8rem;
  display: grid;
  gap: 0.65rem;
}

.admin-virtual-media-library .panel-lead {
  margin: 0;
  color: #1f4f9a;
  font-weight: 700;
}

.admin-virtual-media-items {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(210px, 1fr));
  gap: 0.7rem;
}

.admin-virtual-media-empty {
  margin: 0;
  border: 1px dashed rgba(47, 111, 216, 0.25);
  border-radius: 0.8rem;
  padding: 0.85rem;
  text-align: center;
  color: #496b99;
  font-size: max(var(--ui-font-min), 0.86rem);
  background: #f8fbff;
}

.admin-virtual-media-card {
  border: 1px solid rgba(15, 34, 66, 0.14);
  border-radius: 0.9rem;
  padding: 0.6rem;
  background: #fff;
  display: grid;
  gap: 0.45rem;
  box-shadow: 0 10px 24px rgba(12, 30, 62, 0.06);
}

.admin-virtual-media-card img {
  width: 100%;
  aspect-ratio: 16 / 10;
  object-fit: cover;
  border-radius: 0.6rem;
  border: 1px solid rgba(15, 34, 66, 0.12);
  background: #f4f7fb;
}

.admin-virtual-media-meta {
  margin: 0;
  font-size: max(var(--ui-font-min), 0.74rem);
  color: var(--text-soft);
  word-break: break-all;
  line-height: 1.32;
}

.admin-virtual-media-name {
  display: inline-flex;
  align-items: center;
  gap: 0.25rem;
  font-family: "JetBrains Mono", "Fira Code", monospace;
  font-size: max(var(--ui-font-min), 0.74rem);
  font-weight: 700;
  color: #1f4f9a;
  background: #eef4ff;
  border: 1px solid rgba(47, 111, 216, 0.22);
  border-radius: 999px;
  padding: 0.16rem 0.48rem;
  width: fit-content;
  max-width: 100%;
  overflow-wrap: anywhere;
}

.admin-virtual-media-snippet {
  margin: 0;
  padding: 0.4rem 0.5rem;
  border-radius: 0.55rem;
  background: #f2f6ff;
  border: 1px solid rgba(47, 111, 216, 0.16);
  color: #254a85;
  font-size: max(var(--ui-font-min), 0.72rem);
  font-family: "JetBrains Mono", "Fira Code", monospace;
  word-break: break-all;
}

.admin-virtual-media-actions {
  display: flex;
  gap: 0.4rem;
  flex-wrap: wrap;
}

.admin-virtual-media-actions .btn-xsmall {
  flex: 1 1 calc(50% - 0.2rem);
}

.admin-images-panel {
  display: grid;
  gap: 0.85rem;
}

.tools-images-block {
  margin-top: 1.15rem !important;
  padding-top: 0.95rem;
  border-top: 3px solid rgba(47, 111, 216, 0.48);
  box-shadow: 0 -7px 0 rgba(47, 111, 216, 0.04);
}

.admin-images-upload-box,
.admin-images-upload-queue,
.admin-images-library {
  border: 1px solid rgba(47, 111, 216, 0.24);
  border-radius: 1rem;
  background: linear-gradient(180deg, #ffffff 0%, #f5f9ff 100%);
  padding: 0.85rem;
  display: grid;
  gap: 0.7rem;
}

.admin-images-upload-head,
.admin-images-library-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 0.75rem;
  flex-wrap: wrap;
}

.admin-images-upload-head h3,
.admin-images-library-head h3 {
  margin: 0 0 0.18rem;
  color: #17335c;
  font-size: max(var(--ui-font-min), 1rem);
}

.admin-images-upload-head .panel-lead,
.admin-images-library-head .panel-lead {
  margin: 0;
}

#adminImagesFileInput {
  display: none;
}

.admin-images-dropzone {
  border: 1.5px dashed rgba(47, 111, 216, 0.62);
  border-radius: 1rem;
  background: linear-gradient(145deg, #f9fcff 0%, #edf5ff 100%);
  color: #17335c;
  padding: 1rem 0.95rem;
  text-align: center;
  cursor: pointer;
  display: grid;
  gap: 0.35rem;
  transition: border-color 0.18s ease, background-color 0.18s ease, transform 0.18s ease;
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.72);
}

.admin-images-dropzone strong {
  font-weight: 800;
  font-size: max(var(--ui-font-min), 0.96rem);
}

.admin-images-dropzone span {
  color: #335b8f;
  font-size: max(var(--ui-font-min), 0.82rem);
  line-height: 1.35;
  font-weight: 500;
}

.admin-images-dropzone:hover,
.admin-images-dropzone:focus-visible {
  border-color: rgba(32, 95, 201, 0.92);
  background: linear-gradient(145deg, #f2f8ff 0%, #e6f0ff 100%);
  outline: none;
}

.admin-images-dropzone.is-dragover {
  border-color: rgba(26, 83, 180, 0.98);
  background: linear-gradient(145deg, #eaf3ff 0%, #dceaff 100%);
  transform: translateY(-2px);
}

.admin-images-upload-queue-head {
  display: grid;
  gap: 0.45rem;
}

.admin-images-upload-queue-head p {
  margin: 0;
  color: #194182;
  font-weight: 700;
  font-size: max(var(--ui-font-min), 0.86rem);
}

.admin-images-upload-progress-track,
.admin-images-upload-item-track {
  width: 100%;
  border-radius: 999px;
  background: rgba(28, 84, 169, 0.14);
  border: 1px solid rgba(28, 84, 169, 0.2);
  overflow: hidden;
}

.admin-images-upload-progress-track {
  height: 10px;
}

.admin-images-upload-item-track {
  height: 7px;
}

.admin-images-upload-progress-bar,
.admin-images-upload-item-fill {
  width: 0%;
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, #1d66d8 0%, #2ea1ff 100%);
  transition: width 0.22s ease;
}

.admin-images-upload-queue-items {
  display: grid;
  gap: 0.55rem;
}

.admin-images-upload-item {
  border: 1px solid rgba(15, 34, 66, 0.14);
  border-radius: 0.85rem;
  padding: 0.55rem 0.6rem;
  background: #ffffff;
  display: grid;
  gap: 0.34rem;
}

.admin-images-upload-item.is-success {
  border-color: rgba(24, 138, 93, 0.35);
  background: linear-gradient(180deg, #ffffff 0%, #f4fcf8 100%);
}

.admin-images-upload-item.is-error {
  border-color: rgba(201, 52, 52, 0.32);
  background: linear-gradient(180deg, #ffffff 0%, #fff6f6 100%);
}

.admin-images-upload-item.is-error .admin-images-upload-item-fill {
  background: linear-gradient(90deg, #f56c6c 0%, #d84c4c 100%);
}

.admin-images-upload-item.is-success .admin-images-upload-item-fill {
  background: linear-gradient(90deg, #22a36b 0%, #48c78e 100%);
}

.admin-images-upload-item-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.55rem;
}

.admin-images-upload-item-head strong {
  color: #17335c;
  font-size: max(var(--ui-font-min), 0.82rem);
  max-width: 68%;
  overflow-wrap: anywhere;
}

.admin-images-upload-status {
  border-radius: 999px;
  padding: 0.13rem 0.52rem;
  font-size: max(var(--ui-font-min), 0.68rem);
  font-weight: 700;
  letter-spacing: 0.02em;
  white-space: nowrap;
}

.admin-images-upload-status.is-pending {
  color: #34577f;
  background: rgba(57, 105, 167, 0.14);
}

.admin-images-upload-status.is-uploading {
  color: #1d66d8;
  background: rgba(29, 102, 216, 0.13);
}

.admin-images-upload-status.is-success {
  color: #0a8552;
  background: rgba(11, 137, 84, 0.14);
}

.admin-images-upload-status.is-error {
  color: #bb2f2f;
  background: rgba(187, 47, 47, 0.12);
}

.admin-images-upload-meta,
.admin-images-upload-error {
  margin: 0;
  font-size: max(var(--ui-font-min), 0.74rem);
}

.admin-images-upload-meta {
  color: var(--text-soft);
}

.admin-images-upload-error {
  color: #a83939;
}

.admin-images-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(210px, 1fr));
  gap: 0.78rem;
}

.admin-images-empty {
  margin: 0;
  border: 1px dashed rgba(47, 111, 216, 0.25);
  border-radius: 0.8rem;
  padding: 0.95rem;
  text-align: center;
  color: #496b99;
  background: #f8fbff;
}

.admin-image-card {
  position: relative;
  border: 1px solid rgba(15, 34, 66, 0.14);
  border-radius: 0.9rem;
  padding: 0.6rem;
  background: #fff;
  display: grid;
  gap: 0.45rem;
  box-shadow: 0 10px 24px rgba(12, 30, 62, 0.06);
  min-width: 0;
}

.admin-image-card-preview {
  position: relative;
  overflow: hidden;
  border-radius: 0.68rem;
  border: 1px solid rgba(15, 34, 66, 0.12);
  background: #f4f7fb;
  aspect-ratio: 16 / 10;
}

.admin-image-card-preview img {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
  object-position: center;
  -webkit-filter: none;
  filter: none;
  opacity: 1;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  -webkit-transform: translateZ(0);
  transform: translateZ(0);
}

.admin-image-card-actions {
  position: absolute;
  top: 0.48rem;
  right: 0.48rem;
  display: inline-flex;
  gap: 0.32rem;
  z-index: 2;
}

.admin-image-card-action {
  width: 34px;
  height: 34px;
  border-radius: 999px;
  border: 1px solid rgba(20, 76, 155, 0.28);
  background: rgba(255, 255, 255, 0.94);
  color: #1e4f89;
  font-weight: 800;
  cursor: pointer;
  display: inline-grid;
  place-items: center;
  box-shadow: 0 8px 18px rgba(15, 45, 91, 0.18);
}

.admin-image-card-action.is-delete {
  border-color: rgba(170, 63, 63, 0.36);
  color: #a03232;
}

.admin-image-card-action:hover,
.admin-image-card-action:focus-visible {
  transform: translateY(-1px);
  outline: none;
  box-shadow: 0 12px 22px rgba(15, 45, 91, 0.24);
}

.admin-image-card-name {
  display: inline-flex;
  align-items: center;
  margin: 0;
  padding: 0.16rem 0.48rem;
  width: fit-content;
  max-width: 100%;
  border: 1px solid rgba(47, 111, 216, 0.22);
  border-radius: 999px;
  background: #eef4ff;
  color: #1f4f9a;
  font-family: "JetBrains Mono", "Fira Code", monospace;
  font-weight: 700;
  font-size: max(var(--ui-font-min), 0.74rem);
  overflow-wrap: anywhere;
}

.admin-image-card-meta {
  margin: 0;
  color: var(--text-soft);
  font-size: max(var(--ui-font-min), 0.76rem);
}

.admin-images-edit-card {
  width: min(1180px, 100%);
}

.admin-images-edit-filename {
  margin: 0.2rem 0 0;
  color: var(--text-soft);
  font-size: max(var(--ui-font-min), 0.82rem);
  overflow-wrap: anywhere;
}

.admin-images-editor-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.35fr) minmax(280px, 0.75fr);
  gap: 0.9rem;
  align-items: stretch;
}

.admin-images-editor-preview-panel,
.admin-images-editor-controls {
  border: 1px solid rgba(47, 111, 216, 0.22);
  border-radius: 1rem;
  background: linear-gradient(180deg, #ffffff 0%, #f5f9ff 100%);
  padding: 0.8rem;
}

.admin-images-editor-preview-panel {
  display: grid;
  place-items: center;
  min-height: min(62vh, 560px);
}

.admin-images-editor-preview-frame {
  width: 100%;
  max-height: min(58vh, 520px);
  aspect-ratio: 16 / 10;
  border-radius: 1rem;
  overflow: hidden;
  border: 1px solid rgba(15, 34, 66, 0.16);
  background: #eef4ff;
  display: grid;
  place-items: center;
}

.admin-images-editor-preview-frame img {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
  object-position: center;
  -webkit-filter: none;
  filter: none;
  opacity: 1;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  -webkit-transform: translateZ(0);
  transform: translateZ(0);
}

.admin-images-editor-controls {
  max-height: min(68vh, 620px);
  overflow-y: auto;
  display: grid;
  gap: 0.72rem;
  align-content: start;
}

.admin-images-editor-controls label {
  display: grid;
  gap: 0.3rem;
  color: #17335c;
  font-weight: 800;
  font-size: max(var(--ui-font-min), 0.86rem);
}

.admin-images-editor-controls input[type="range"] {
  width: 100%;
  min-height: 32px;
  accent-color: #2f6fd8;
  touch-action: pan-y;
}

.admin-images-control-value {
  color: #456188;
  font-weight: 700;
  font-size: max(var(--ui-font-min), 0.74rem);
}

.admin-images-editor-actions {
  position: sticky;
  bottom: -0.8rem;
  background: linear-gradient(180deg, rgba(245, 249, 255, 0.88), #f5f9ff);
  border-top: 1px solid rgba(47, 111, 216, 0.16);
  padding-top: 0.72rem;
  display: flex;
  justify-content: flex-end;
  gap: 0.48rem;
  flex-wrap: wrap;
}

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

@media (max-width: 640px) {
  .admin-virtual-form #adminVirtualContextContenido {
    min-height: 145px;
  }

  .admin-virtual-form #adminVirtualQuestionEnunciado {
    min-height: 165px;
  }

  .admin-virtual-form #adminVirtualQuestionExtraData,
  .admin-virtual-form .admin-virtual-extra-json {
    min-height: 260px;
  }

  .admin-virtual-form .admin-virtual-option-html {
    min-height: 100px;
  }

  .admin-virtual-media-row input[type="file"] {
    min-width: 100%;
  }

  .admin-virtual-media-items {
    grid-template-columns: 1fr;
  }

  .admin-virtual-media-queue-item-head {
    flex-direction: column;
    align-items: flex-start;
  }

  .admin-virtual-media-queue-item-head strong {
    max-width: 100%;
  }

  .admin-virtual-media-actions .btn-xsmall {
    flex: 1 1 100%;
  }

  .admin-images-upload-head,
  .admin-images-library-head {
    display: grid;
  }

  .admin-images-grid {
    grid-template-columns: 1fr;
  }

  .admin-images-upload-item-head {
    flex-direction: column;
    align-items: flex-start;
  }

  .admin-images-upload-item-head strong {
    max-width: 100%;
  }
}

@media (max-width: 820px) {
  .admin-images-editor-layout {
    grid-template-columns: 1fr;
  }

  .admin-images-editor-preview-panel {
    min-height: auto;
  }

  .admin-images-editor-preview-frame {
    max-height: none;
  }

  .admin-images-editor-controls {
    max-height: none;
  }

  .admin-images-editor-actions {
    position: static;
  }
}

.admin-virtual-preview-head {
  margin-top: 0.5rem;
}

.admin-virtual-preview {
  border: 1px dashed rgba(47, 111, 216, 0.35);
  border-radius: 0.9rem;
  padding: 0.9rem;
  background: #f8fbff;
  display: grid;
  gap: 0.8rem;
}

.admin-virtual-item-card {
  border: 1px solid var(--line-color);
  border-radius: 0.9rem;
  padding: 0.75rem;
  background: #fff;
  margin-bottom: 0.7rem;
}

.admin-virtual-item-card h4 {
  margin: 0;
  color: var(--text-strong);
}

.admin-virtual-item-card p {
  margin: 0.35rem 0;
  color: var(--text-soft);
  font-size: max(var(--ui-font-min), 0.92rem);
}

.student-virtual-attempt-modal {
  max-width: min(1080px, 96vw);
  border-radius: 1.05rem;
  border: 1px solid rgba(31, 79, 143, 0.24);
  background:
    radial-gradient(circle at top right, rgba(47, 111, 216, 0.12), transparent 42%),
    linear-gradient(165deg, #ffffff, #f5f9ff);
}

.student-virtual-start-wrap {
  margin-top: 0.45rem;
}

.student-virtual-scope {
  margin: 0.15rem 0 0.5rem;
  color: var(--text-soft);
  font-weight: 600;
}

.student-virtual-config {
  border: 1px solid rgba(34, 84, 158, 0.2);
  border-radius: 0.96rem;
  background: linear-gradient(155deg, rgba(247, 252, 255, 0.98), rgba(236, 245, 255, 0.95));
  box-shadow: 0 14px 24px rgba(17, 41, 73, 0.11);
  padding: 0.86rem;
  margin-bottom: 0.72rem;
  display: grid;
  gap: 0.52rem;
}

.student-virtual-config-title {
  margin: 0;
  font-weight: 800;
  color: #143f75;
  letter-spacing: 0.01em;
}

.student-virtual-config-modes {
  display: grid;
  gap: 0.5rem;
}

.student-virtual-config-choice {
  display: flex;
  align-items: flex-start;
  gap: 0.6rem;
  color: #193b66;
  font-weight: 650;
  border: 1px solid rgba(42, 93, 171, 0.25);
  border-radius: 0.84rem;
  padding: 0.62rem 0.72rem;
  background: linear-gradient(165deg, rgba(255, 255, 255, 0.98), rgba(238, 246, 255, 0.95));
  box-shadow: 0 10px 18px rgba(18, 42, 76, 0.08);
  cursor: pointer;
  transition: border-color 0.16s ease, background-color 0.16s ease, box-shadow 0.16s ease, transform 0.16s ease;
}

.student-virtual-config-choice:hover {
  border-color: rgba(42, 93, 171, 0.5);
  background: linear-gradient(165deg, rgba(255, 255, 255, 0.98), rgba(230, 241, 255, 0.95));
  transform: translateY(-1px);
}

.student-virtual-config-choice input[type="radio"] {
  margin-top: 0.2rem;
  accent-color: #1f56a7;
}

.student-virtual-config-choice:has(input[type="radio"]:checked) {
  border-color: rgba(25, 71, 140, 0.84);
  background: linear-gradient(160deg, rgba(225, 239, 255, 0.96), rgba(241, 248, 255, 0.98));
  box-shadow: 0 0 0 2px rgba(37, 89, 168, 0.18), 0 14px 22px rgba(15, 45, 91, 0.18);
}

.student-virtual-config-choice span {
  line-height: 1.35;
}

.student-virtual-config-select {
  display: grid;
  gap: 0.35rem;
  color: #1a3d69;
  font-weight: 700;
  margin-top: 0.2rem;
}

.student-virtual-config-select select {
  max-width: 420px;
  border-radius: 0.72rem;
}

.student-virtual-config-select select:disabled {
  background: #f3f6fb;
  color: #6f7f95;
  cursor: not-allowed;
}

.student-virtual-progress {
  margin: 0 0 0.35rem;
  display: inline-flex;
  align-items: center;
  width: fit-content;
  padding: 0.36rem 0.65rem;
  border-radius: 999px;
  border: 1px solid rgba(29, 87, 166, 0.27);
  background: rgba(233, 243, 255, 0.9);
  font-weight: 780;
  color: #16447d;
}

.student-virtual-attempt-toolbar {
  position: sticky;
  top: 0;
  z-index: 8;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: start;
  gap: 0.7rem;
  margin: -0.15rem 0 0.8rem;
  padding: 0.72rem;
  border: 1px solid rgba(24, 79, 152, 0.22);
  border-radius: 0.82rem;
  background: rgba(248, 252, 255, 0.96);
  box-shadow: 0 14px 24px rgba(14, 42, 84, 0.12);
  backdrop-filter: blur(12px);
}

.student-virtual-attempt-toolbar-main,
.student-virtual-attempt-toolbar-actions {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 0.5rem;
  min-width: 0;
}

.student-virtual-attempt-toolbar-actions {
  justify-content: flex-end;
}

.student-virtual-timer {
  margin: 0 0 0.46rem;
  display: inline-flex;
  align-items: center;
  width: fit-content;
  padding: 0.4rem 0.72rem;
  border-radius: 0.7rem;
  border: 1px solid rgba(22, 78, 152, 0.28);
  background: linear-gradient(145deg, rgba(230, 242, 255, 0.96), rgba(244, 250, 255, 0.96));
  color: #124683;
  font-weight: 800;
  letter-spacing: 0.01em;
}

.student-virtual-area {
  margin: 0 0 0.72rem;
  color: #3a5b86;
  font-weight: 700;
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 0.45rem;
}

.student-virtual-area-main,
.student-virtual-area-part {
  display: inline-flex;
  align-items: center;
  width: fit-content;
  min-height: 2rem;
  padding: 0.36rem 0.62rem;
  border-radius: 0.5rem;
  border: 1px solid rgba(29, 87, 166, 0.22);
  background: #eef6ff;
}

.student-virtual-area-part {
  border-color: rgba(36, 120, 91, 0.32);
  background: #edf9f3;
  color: #186449;
}

.student-virtual-navigator {
  display: grid;
  gap: 0.62rem;
  margin: 0 0 0.9rem;
  padding: 0.72rem;
  border: 1px solid rgba(29, 87, 166, 0.18);
  border-radius: 0.82rem;
  background: linear-gradient(160deg, #f7fbff, #ffffff);
}

.student-virtual-navigator[hidden] {
  display: none;
}

.student-virtual-area-tabs {
  display: flex;
  gap: 0.45rem;
  overflow-x: auto;
  padding-bottom: 0.1rem;
  scrollbar-width: thin;
}

.student-virtual-area-tab {
  flex: 0 0 auto;
  display: grid;
  gap: 0.12rem;
  min-width: 10rem;
  padding: 0.56rem 0.65rem;
  border: 1px solid rgba(34, 84, 158, 0.2);
  border-radius: 0.68rem;
  background: #fff;
  color: #1c4775;
  text-align: left;
  cursor: pointer;
}

.student-virtual-area-tab span {
  font-weight: 800;
  line-height: 1.15;
}

.student-virtual-area-tab em,
.student-virtual-area-tab strong {
  font-size: max(var(--ui-font-min), 0.76rem);
  font-style: normal;
  color: #5b738c;
}

.student-virtual-area-tab.is-active {
  border-color: rgba(31, 86, 167, 0.72);
  background: #eaf4ff;
  box-shadow: 0 0 0 2px rgba(31, 86, 167, 0.14);
}

.student-virtual-question-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(4.7rem, 1fr));
  gap: 0.42rem;
}

.student-virtual-question-chip {
  min-height: 3rem;
  border: 1px solid rgba(15, 34, 66, 0.14);
  border-radius: 0.62rem;
  background: #fff;
  color: #1b426e;
  cursor: pointer;
  display: grid;
  place-items: center;
  gap: 0.08rem;
}

.student-virtual-question-chip span {
  font-weight: 900;
}

.student-virtual-question-chip em {
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: max(var(--ui-font-min), 0.68rem);
  font-style: normal;
}

.student-virtual-question-chip.is-answered {
  border-color: rgba(36, 120, 91, 0.28);
  background: #edf8f2;
  color: #176347;
}

.student-virtual-question-chip.is-pending {
  border-color: rgba(191, 75, 50, 0.3);
  background: #fff1ee;
  color: #a33b25;
}

.student-virtual-question-chip.is-current {
  box-shadow: 0 0 0 3px rgba(31, 86, 167, 0.22);
  border-color: rgba(31, 86, 167, 0.8);
}

.student-virtual-area-transition {
  display: grid;
  place-items: center;
  gap: 0.8rem;
  min-height: min(46vh, 360px);
  margin: 1rem 0;
  padding: clamp(1.2rem, 4vw, 2.2rem);
  border: 2px solid rgba(35, 95, 173, 0.24);
  border-radius: 0.75rem;
  background: linear-gradient(155deg, #f5fbff, #ffffff 48%, #f2fbf6);
  box-shadow: 0 18px 32px rgba(14, 42, 84, 0.13);
  text-align: center;
}

.student-virtual-area-transition[hidden] {
  display: none;
}

.student-virtual-area-transition-kicker {
  margin: 0;
  font-size: max(var(--ui-font-min), 0.82rem);
  font-weight: 800;
  text-transform: uppercase;
  color: #24785b;
}

.student-virtual-area-transition h3 {
  margin: 0;
  color: #143c6d;
  font-size: max(var(--ui-font-min), clamp(2rem, 6vw, 4rem));
  line-height: 1.04;
}

.student-virtual-area-transition .btn-primary {
  min-width: min(100%, 220px);
  min-height: 3rem;
  font-size: max(var(--ui-font-min), 1rem);
}

.student-virtual-context-card,
.student-virtual-question-card {
  border: 1px solid rgba(39, 93, 172, 0.2);
  border-radius: 0.78rem;
  background: #ffffff;
  box-shadow: 0 12px 22px rgba(16, 43, 82, 0.08);
  padding: clamp(0.9rem, 2vw, 1.15rem);
  margin-bottom: 0.76rem;
}

.student-virtual-question-card {
  border-left: 5px solid #1f56a7;
  background: linear-gradient(180deg, #ffffff, #f8fbff);
}

.student-virtual-context-card h3,
.student-virtual-context-card h4,
.student-virtual-question-card h4 {
  margin: 0 0 0.52rem;
  color: #184b87;
}

.student-virtual-attempt-modal .sim-results-modal-actions {
  align-items: center;
  justify-content: flex-start;
  flex-wrap: wrap;
  gap: 0.52rem;
}

.student-virtual-timer-secondary {
  margin: 0;
  flex: 1 1 100%;
  justify-content: center;
  background: linear-gradient(145deg, rgba(226, 240, 255, 0.98), rgba(245, 251, 255, 0.98));
}

.student-virtual-timer-floating {
  position: sticky;
  top: 0.25rem;
  z-index: 3;
  width: fit-content;
  margin: 0 0 0.65rem auto;
  padding: 0.42rem 0.76rem;
  border-radius: 999px;
  border: 1px solid rgba(24, 73, 142, 0.33);
  background: linear-gradient(145deg, rgba(22, 76, 148, 0.96), rgba(30, 92, 175, 0.95));
  color: #fff;
  font-weight: 800;
  box-shadow: 0 12px 20px rgba(12, 43, 84, 0.32);
}

.student-virtual-options {
  display: grid;
  gap: 0.68rem;
}

.student-virtual-option-item {
  display: flex;
  align-items: flex-start;
  gap: 0.66rem;
  padding: 0.78rem;
  border: 1px solid rgba(20, 54, 104, 0.2);
  border-radius: 0.9rem;
  background: linear-gradient(160deg, rgba(255, 255, 255, 0.97), rgba(245, 250, 255, 0.95));
  box-shadow: 0 10px 18px rgba(16, 41, 74, 0.08);
  cursor: pointer;
  transition: border-color 0.18s ease, box-shadow 0.18s ease, background 0.18s ease, transform 0.18s ease;
}

.student-virtual-option-item:hover {
  border-color: rgba(29, 87, 168, 0.46);
  box-shadow: 0 14px 24px rgba(15, 46, 92, 0.16);
  transform: translateY(-1px);
}

.student-virtual-option-item:has(input[type="radio"]:checked) {
  border-color: rgba(24, 71, 138, 0.78);
  background: linear-gradient(158deg, rgba(228, 240, 255, 0.95), rgba(243, 249, 255, 0.98));
  box-shadow: 0 0 0 2px rgba(29, 87, 168, 0.19), 0 14px 24px rgba(15, 46, 92, 0.2);
}

.student-virtual-option-item:has(input[type="radio"]:focus-visible) {
  outline: none;
  box-shadow: 0 0 0 3px rgba(29, 87, 168, 0.21), 0 12px 22px rgba(16, 46, 92, 0.18);
}

.student-virtual-option-item input[type="radio"] {
  margin-top: 0.25rem;
  accent-color: #225aa9;
}

.student-virtual-option-letter {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 2rem;
  min-width: 2rem;
  height: 2rem;
  border-radius: 999px;
  background: linear-gradient(145deg, rgba(222, 238, 255, 0.96), rgba(241, 248, 255, 0.96));
  border: 1px solid rgba(37, 89, 168, 0.36);
  color: #1b4f97;
  font-weight: 800;
  font-size: max(var(--ui-font-min), 0.92rem);
  margin-top: 0.05rem;
}

.student-virtual-option-content {
  min-width: 0;
  flex: 1;
  color: #163b66;
  font-weight: 520;
}

.student-virtual-finish-card,
.student-virtual-review-card {
  max-width: min(1100px, 96vw);
}

.student-virtual-finish-preview {
  display: grid;
  gap: 0.85rem;
}

.student-virtual-finish-head {
  padding: 0.85rem;
  border: 1px solid rgba(31, 86, 167, 0.18);
  border-radius: 0.75rem;
  background: #f6fbff;
}

.student-virtual-finish-head h3,
.student-virtual-finish-head p {
  margin: 0;
}

.student-virtual-finish-head p {
  margin-top: 0.3rem;
  color: #4b6680;
}

.student-virtual-finish-area-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
  gap: 0.72rem;
}

.student-virtual-finish-area {
  border: 1px solid rgba(15, 34, 66, 0.12);
  border-radius: 0.78rem;
  background: #fff;
  padding: 0.7rem;
}

.student-virtual-finish-area-head {
  display: flex;
  justify-content: space-between;
  gap: 0.6rem;
  align-items: center;
  margin-bottom: 0.55rem;
}

.student-virtual-finish-area-head h4 {
  margin: 0;
  color: #173f70;
}

.student-virtual-finish-area-head span {
  padding: 0.22rem 0.48rem;
  border-radius: 999px;
  background: #eef6ff;
  color: #1f56a7;
  font-weight: 800;
}

.student-virtual-finish-chip-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(5.6rem, 1fr));
  gap: 0.38rem;
  max-height: 16rem;
  overflow: auto;
  padding-right: 0.15rem;
}

.student-virtual-finish-chip {
  display: grid;
  gap: 0.08rem;
  min-height: 3.2rem;
  border-radius: 0.58rem;
  border: 1px solid rgba(15, 34, 66, 0.14);
  background: #fff;
  cursor: pointer;
  text-align: center;
}

.student-virtual-finish-chip strong {
  font-size: max(var(--ui-font-min), 0.98rem);
}

.student-virtual-finish-chip span {
  font-size: max(var(--ui-font-min), 0.7rem);
  line-height: 1.1;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.student-virtual-finish-chip.is-answered {
  border-color: rgba(36, 120, 91, 0.26);
  background: #edf8f2;
  color: #176347;
}

.student-virtual-finish-chip.is-pending {
  border-color: rgba(191, 75, 50, 0.35);
  background: #fff1ee;
  color: #a33b25;
}

.student-virtual-summary-actions {
  display: flex;
  justify-content: flex-end;
  margin: -0.25rem 0 0.25rem;
}

.student-virtual-review-areas,
.student-virtual-review-question-nav {
  display: flex;
  gap: 0.42rem;
  overflow-x: auto;
  padding: 0.2rem 0 0.45rem;
  scrollbar-width: thin;
}

.student-virtual-review-area-tab,
.student-virtual-review-chip {
  border: 1px solid rgba(31, 86, 167, 0.2);
  border-radius: 999px;
  background: #fff;
  color: #1c4775;
  cursor: pointer;
  font-weight: 800;
}

.student-virtual-review-area-tab {
  flex: 0 0 auto;
  padding: 0.42rem 0.72rem;
}

.student-virtual-review-area-tab.is-active {
  background: #eaf4ff;
  border-color: rgba(31, 86, 167, 0.72);
}

.student-virtual-review-chip {
  flex: 0 0 auto;
  width: 2.45rem;
  height: 2.2rem;
}

.student-virtual-review-chip.is-current {
  box-shadow: 0 0 0 3px rgba(31, 86, 167, 0.2);
}

.student-virtual-review-chip.is-correct {
  background: #edf8f2;
  border-color: rgba(36, 120, 91, 0.28);
  color: #176347;
}

.student-virtual-review-chip.is-incorrect,
.student-virtual-review-chip.is-unanswered {
  background: #fff1ee;
  border-color: rgba(191, 75, 50, 0.32);
  color: #a33b25;
}

.student-virtual-review-content {
  display: grid;
  gap: 0.78rem;
}

.student-virtual-review-status {
  display: flex;
  flex-wrap: wrap;
  gap: 0.42rem;
  align-items: center;
  padding: 0.7rem;
  border-radius: 0.72rem;
  border: 1px solid rgba(15, 34, 66, 0.12);
  background: #f7fbff;
}

.student-virtual-review-status strong,
.student-virtual-review-status em,
.student-virtual-review-status span {
  line-height: 1.2;
}

.student-virtual-review-status em {
  margin-left: auto;
  padding: 0.24rem 0.5rem;
  border-radius: 999px;
  font-style: normal;
  font-weight: 850;
}

.student-virtual-review-status.is-correct em {
  background: #dff5e9;
  color: #176347;
}

.student-virtual-review-status.is-incorrect em,
.student-virtual-review-status.is-unanswered em {
  background: #ffe4de;
  color: #a33b25;
}

.student-virtual-review-options {
  display: grid;
  gap: 0.58rem;
}

.student-virtual-review-option {
  display: flex;
  gap: 0.62rem;
  align-items: flex-start;
  padding: 0.72rem;
  border: 1px solid rgba(20, 54, 104, 0.14);
  border-radius: 0.72rem;
  background: #fff;
}

.student-virtual-review-option.is-selected {
  border-width: 2px;
}

.student-virtual-review-option.is-correct {
  border-color: rgba(36, 120, 91, 0.46);
  background: #edf8f2;
}

.student-virtual-review-option.is-incorrect,
.student-virtual-review-option.is-unanswered {
  border-color: rgba(191, 75, 50, 0.46);
  background: #fff1ee;
}

.student-virtual-summary-content {
  display: grid;
  gap: 0.9rem;
}

.student-virtual-summary-dashboard {
  display: grid;
  gap: 0.9rem;
}

.student-virtual-summary-hero,
.student-virtual-summary-board,
.student-virtual-summary-final-message {
  border: 1px solid rgba(29, 81, 156, 0.18);
  border-radius: 0.7rem;
  background: #fff;
  box-shadow: 0 14px 26px rgba(14, 42, 84, 0.1);
}

.student-virtual-summary-hero {
  display: grid;
  grid-template-columns: auto 1fr;
  align-items: center;
  gap: 1rem;
  padding: 1rem;
  background: linear-gradient(150deg, #f7fbff, #ffffff 54%, #f2fbf7);
}

.student-virtual-summary-score-ring {
  width: 8.2rem;
  aspect-ratio: 1;
  display: grid;
  place-items: center;
  position: relative;
  color: #143c6d;
}

.student-virtual-summary-score-ring svg,
.student-virtual-summary-score-ring strong,
.student-virtual-summary-score-ring > span {
  grid-area: 1 / 1;
}

.student-virtual-summary-score-ring svg {
  width: 100%;
  height: 100%;
}

.student-virtual-summary-score-ring-track,
.student-virtual-summary-score-ring-value {
  fill: none;
  stroke-width: 11;
}

.student-virtual-summary-score-ring-track {
  stroke: #d9e4f1;
}

.student-virtual-summary-score-ring-value {
  stroke: #24785b;
  stroke-linecap: round;
  transform: rotate(-90deg);
  transform-origin: 50% 50%;
}

.student-virtual-summary-score-ring strong {
  font-size: max(var(--ui-font-min), 2.1rem);
  line-height: 1;
}

.student-virtual-summary-score-ring span {
  margin-top: 3.3rem;
  font-size: max(var(--ui-font-min), 0.74rem);
  color: #24785b;
  font-weight: 800;
  text-align: center;
}

.student-virtual-summary-hero h3 {
  margin: 0 0 0.3rem;
  color: #143c6d;
  font-size: max(var(--ui-font-min), 1.6rem);
}

.student-virtual-summary-hero p {
  margin: 0;
  color: #46637f;
}

.student-virtual-summary-chip-row {
  display: flex;
  flex-wrap: wrap;
  gap: 0.45rem;
  margin-top: 0.7rem;
}

.student-virtual-summary-chip-row span {
  padding: 0.38rem 0.58rem;
  border-radius: 0.5rem;
  background: #eef6ff;
  color: #1e528d;
  font-size: max(var(--ui-font-min), 0.85rem);
  font-weight: 750;
}

.student-virtual-summary-board {
  padding: 0.9rem;
}

.student-virtual-summary-section-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.7rem;
  margin-bottom: 0.7rem;
}

.student-virtual-summary-section-head h4 {
  margin: 0;
  color: #173f70;
}

.student-virtual-summary-table-wrap {
  overflow-x: auto;
}

.student-virtual-summary-table {
  width: 100%;
  border-collapse: collapse;
  min-width: 540px;
}

.student-virtual-summary-table th,
.student-virtual-summary-table td {
  padding: 0.58rem 0.62rem;
  border-bottom: 1px solid rgba(15, 34, 66, 0.1);
  text-align: left;
}

.student-virtual-summary-table th {
  color: #496782;
  background: #f4f8fd;
  font-size: max(var(--ui-font-min), 0.82rem);
}

.student-virtual-summary-area-grid,
.student-virtual-summary-metric-groups {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(230px, 1fr));
  gap: 0.82rem;
}

.student-virtual-summary-area-card {
  display: grid;
  grid-template-rows: auto 1fr auto;
  gap: 0.7rem;
  min-height: 10rem;
  padding: 0.9rem;
  border: 1px solid rgba(36, 120, 91, 0.16);
  border-radius: 0.75rem;
  background: linear-gradient(145deg, rgba(255, 255, 255, 0.98), rgba(242, 250, 246, 0.98));
  box-shadow: 0 14px 30px rgba(15, 34, 66, 0.07);
}

.student-virtual-summary-area-card-head {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 0.7rem;
  align-items: center;
}

.student-virtual-summary-area-card h5,
.student-virtual-summary-metric-group h5 {
  margin: 0;
  color: #173f70;
  font-size: max(var(--ui-font-min), 0.96rem);
  line-height: 1.24;
  overflow-wrap: anywhere;
}

.student-virtual-summary-area-card-head > span {
  padding: 0.24rem 0.45rem;
  border-radius: 999px;
  background: #eaf3ff;
  color: #356492;
  font-size: max(var(--ui-font-min), 0.72rem);
  letter-spacing: 0;
  text-transform: uppercase;
}

.student-virtual-summary-area-score {
  align-self: center;
  color: #24785b;
  font-size: max(var(--ui-font-min), 3rem);
  line-height: 0.95;
}

.student-virtual-summary-area-stats {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.5rem;
}

.student-virtual-summary-area-stats span {
  display: grid;
  gap: 0.14rem;
  min-width: 0;
  padding: 0.56rem 0.58rem;
  border-radius: 0.58rem;
  background: #f3f7fb;
  color: #496782;
  font-size: max(var(--ui-font-min), 0.82rem);
  line-height: 1.15;
}

.student-virtual-summary-area-stats span.is-correct {
  background: #edf8f2;
  color: #24785b;
}

.student-virtual-summary-area-stats span.is-wrong {
  background: #fff1ee;
  color: #b94b34;
}

.student-virtual-summary-area-stats em {
  color: inherit;
  font-size: max(var(--ui-font-min), 1.45rem);
  font-style: normal;
  line-height: 1;
}

.student-virtual-summary-metric-group {
  display: grid;
  gap: 0.72rem;
  align-content: start;
  padding: 0.82rem;
  border: 1px solid rgba(15, 34, 66, 0.1);
  border-radius: 0.72rem;
  background: linear-gradient(180deg, #ffffff, #f7faff);
}

.student-virtual-summary-metric-grid {
  display: grid;
  gap: 0.58rem;
}

.student-virtual-summary-metric-card {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 0.75rem;
  align-items: center;
  padding: 0.72rem;
  border: 1px solid rgba(15, 34, 66, 0.1);
  border-radius: 0.62rem;
  background: #ffffff;
}

.student-virtual-summary-metric-copy {
  display: grid;
  gap: 0.26rem;
  min-width: 0;
}

.student-virtual-summary-metric-label {
  color: #173f70;
  font-size: max(var(--ui-font-min), 0.92rem);
  line-height: 1.25;
  overflow-wrap: anywhere;
}

.student-virtual-summary-metric-evidence {
  color: #667f96;
  font-size: max(var(--ui-font-min), 0.8rem);
}

.student-virtual-summary-metric-percent {
  display: inline-grid;
  place-items: center;
  min-width: 4.2rem;
  min-height: 2.5rem;
  padding: 0.35rem 0.5rem;
  border-radius: 0.6rem;
  background: #edf8f2;
  color: #24785b;
  font-size: max(var(--ui-font-min), 1.1rem);
  line-height: 1;
  text-align: center;
}

.student-virtual-summary-recommendation-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 0.7rem;
}

.student-virtual-summary-recommendation-card {
  display: grid;
  gap: 0.42rem;
  align-content: start;
  min-height: 8rem;
  padding: 0.75rem;
  border: 1px solid rgba(36, 120, 91, 0.18);
  border-radius: 0.6rem;
  background: linear-gradient(160deg, #ffffff, #f4fbf7);
}

.student-virtual-summary-recommendation-card span {
  width: fit-content;
  padding: 0.18rem 0.42rem;
  border-radius: 0.42rem;
  background: #e8f6ef;
  color: #24785b;
  font-size: max(var(--ui-font-min), 0.78rem);
  font-weight: 850;
}

.student-virtual-summary-recommendation-card p {
  margin: 0;
  color: #27435f;
}

.student-virtual-summary-recommendation-card strong {
  width: fit-content;
  padding: 0.2rem 0.45rem;
  border-radius: 0.42rem;
  background: #eef6ff;
  color: #1e528d;
  font-size: max(var(--ui-font-min), 0.78rem);
}

.student-virtual-summary-recommendation-card em {
  color: #8a5b00;
  font-size: max(var(--ui-font-min), 0.78rem);
  font-style: normal;
  font-weight: 800;
}

.student-virtual-summary-final-message {
  padding: 0.95rem;
  border-color: rgba(176, 122, 0, 0.24);
  background: linear-gradient(155deg, #fffaf0, #ffffff);
}

.student-virtual-summary-final-message span {
  display: block;
  margin-bottom: 0.3rem;
  color: #8a5b00;
  font-weight: 850;
}

.student-virtual-summary-final-message p {
  margin: 0;
  color: #263f5a;
  font-size: max(var(--ui-font-min), 1rem);
}

.admin-virtual-student-preview {
  display: grid;
  gap: 0.78rem;
}

.admin-virtual-student-preview .student-virtual-context-card,
.admin-virtual-student-preview .student-virtual-question-card {
  margin-bottom: 0;
}

.admin-virtual-student-preview .student-virtual-option-item {
  cursor: default;
}

.admin-virtual-student-preview .student-virtual-option-item:hover {
  border-color: rgba(20, 54, 104, 0.2);
  box-shadow: 0 10px 18px rgba(16, 41, 74, 0.08);
  transform: none;
}

.admin-virtual-student-preview .student-virtual-option-item input[type="radio"] {
  pointer-events: none;
  opacity: 1;
}

.student-virtual-summary-head {
  border: 1px solid rgba(47, 111, 216, 0.2);
  border-radius: 0.85rem;
  background: linear-gradient(160deg, #eef5ff, #f8fbff);
  padding: 0.9rem;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: 0.45rem 0.65rem;
}

.student-virtual-summary-head p {
  margin: 0;
}

.student-virtual-summary-global {
  border: 1px solid rgba(29, 81, 156, 0.22);
  border-radius: 0.85rem;
  padding: 0.9rem;
  background: #fff;
}

.student-virtual-summary-global-student {
  border-width: 2px;
  border-color: rgba(32, 91, 173, 0.24);
  background: linear-gradient(165deg, #ffffff, #f7fbff);
  box-shadow: 0 16px 28px rgba(14, 42, 84, 0.12);
}

.student-virtual-summary-global h3 {
  margin: 0 0 0.45rem;
  color: #15365f;
}

.student-virtual-summary-global p {
  margin: 0.25rem 0;
}

.student-virtual-summary-kpis {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
  gap: 0.55rem;
  margin-top: 0.6rem;
}

.student-virtual-summary-kpi {
  border: 1px solid rgba(15, 34, 66, 0.12);
  border-radius: 0.75rem;
  background: #f7fbff;
  padding: 0.55rem 0.65rem;
}

.student-virtual-summary-kpi strong {
  display: block;
  color: #1a487d;
  font-size: max(var(--ui-font-min), 1rem);
}

.student-virtual-summary-kpi span {
  font-size: max(var(--ui-font-min), 0.82rem);
  color: #58708f;
}

.student-virtual-summary-list-block {
  margin-top: 0.45rem;
}

.student-virtual-summary-list-block p {
  margin: 0;
}

.student-virtual-summary-list-block ul {
  margin: 0.35rem 0 0;
  padding-left: 1rem;
}

.student-virtual-summary-sessions {
  margin-top: 0.55rem;
  display: grid;
  gap: 0.5rem;
}

.student-virtual-summary-session-item {
  border: 1px solid rgba(39, 94, 173, 0.2);
  border-radius: 0.7rem;
  background: #f6faff;
  padding: 0.55rem 0.6rem;
}

.student-virtual-summary-session-item h5 {
  margin: 0 0 0.28rem;
  color: #194577;
  font-size: max(var(--ui-font-min), 0.92rem);
}

.student-virtual-summary-session-item p {
  margin: 0.16rem 0;
  font-size: max(var(--ui-font-min), 0.88rem);
}

.student-virtual-summary-areas {
  display: grid;
  gap: 0.8rem;
}

.student-virtual-summary-area {
  border: 1px solid rgba(15, 34, 66, 0.15);
  border-radius: 0.85rem;
  padding: 0.85rem;
  background: #fff;
}

.student-virtual-summary-area h4 {
  margin: 0 0 0.4rem;
  color: #13375f;
}

.student-virtual-summary-area p {
  margin: 0.24rem 0;
}

.student-virtual-summary-area ul {
  margin: 0.3rem 0 0;
  padding-left: 1.1rem;
}

.student-virtual-summary-review {
  border: 1px solid rgba(180, 84, 35, 0.25);
  border-radius: 0.85rem;
  padding: 0.85rem;
  background: linear-gradient(165deg, #fff9f3, #fff);
}

.student-virtual-summary-review h4 {
  margin: 0 0 0.55rem;
  color: #8f3f0f;
}

.student-virtual-summary-review-item {
  border: 1px solid rgba(180, 84, 35, 0.18);
  border-radius: 0.72rem;
  background: #fff;
  padding: 0.58rem 0.64rem;
  margin-bottom: 0.52rem;
}

.student-virtual-summary-review-item:last-child {
  margin-bottom: 0;
}

.student-virtual-summary-review-item h5 {
  margin: 0 0 0.3rem;
  color: #7a3410;
  font-size: max(var(--ui-font-min), 0.91rem);
}

.student-virtual-summary-review-item p {
  margin: 0.18rem 0;
  font-size: max(var(--ui-font-min), 0.86rem);
}

.virtual-rich-content img {
  display: block;
  margin: 0.75rem auto;
  max-width: min(100%, 460px);
  height: auto;
  border-radius: 0.65rem;
  border: 1px solid rgba(15, 34, 66, 0.14);
  cursor: zoom-in;
}

.virtual-rich-content {
  overflow-wrap: anywhere;
  overflow-x: auto;
  max-width: 100%;
  scrollbar-width: thin;
}

.virtual-rich-content table {
  margin: 0.72rem auto;
  max-width: 100%;
}

.virtual-rich-content table:not([class]):not([style]) {
  border-collapse: collapse;
  background: #fff;
}

.virtual-rich-content table:not([class]):not([style]) th,
.virtual-rich-content table:not([class]):not([style]) td {
  border: 1px solid rgba(15, 34, 66, 0.18);
  padding: 0.45rem 0.5rem;
  vertical-align: top;
  min-width: 56px;
}

.virtual-rich-content table:not([class]):not([style]) thead th {
  background: #f1f6ff;
  color: #1a3b67;
  font-weight: 700;
}

.student-virtual-context-card.virtual-rich-content table:not([class]):not([style]),
.student-virtual-context-card .virtual-rich-content table:not([class]):not([style]) {
  width: max-content;
  min-width: min(620px, 100%);
  max-width: none;
  margin: 1rem auto;
  border-collapse: separate;
  border-spacing: 0;
  overflow: hidden;
  border: 1px solid rgba(36, 86, 159, 0.22);
  border-radius: 0.86rem;
  background: #ffffff;
  box-shadow:
    0 16px 34px rgba(17, 53, 104, 0.12),
    inset 0 1px 0 rgba(255, 255, 255, 0.92);
}

.student-virtual-context-card.virtual-rich-content table:not([class]):not([style]) caption,
.student-virtual-context-card .virtual-rich-content table:not([class]):not([style]) caption {
  caption-side: top;
  padding: 0 0 0.52rem;
  color: #17477f;
  font-weight: 850;
  text-align: left;
}

.student-virtual-context-card.virtual-rich-content table:not([class]):not([style]) th,
.student-virtual-context-card.virtual-rich-content table:not([class]):not([style]) td,
.student-virtual-context-card .virtual-rich-content table:not([class]):not([style]) th,
.student-virtual-context-card .virtual-rich-content table:not([class]):not([style]) td {
  min-width: 6.2rem;
  padding: 0.68rem 0.82rem;
  border: 0;
  border-right: 1px solid rgba(36, 86, 159, 0.14);
  border-bottom: 1px solid rgba(36, 86, 159, 0.14);
  color: #18365f;
  font-size: max(var(--ui-font-min), 0.94rem);
  line-height: 1.35;
  text-align: center;
  vertical-align: middle;
}

.student-virtual-context-card.virtual-rich-content table:not([class]):not([style]) th,
.student-virtual-context-card .virtual-rich-content table:not([class]):not([style]) th {
  background: linear-gradient(180deg, #eaf4ff 0%, #dcecff 100%);
  color: #103f76;
  font-weight: 900;
}

.student-virtual-context-card.virtual-rich-content table:not([class]):not([style]) thead th,
.student-virtual-context-card .virtual-rich-content table:not([class]):not([style]) thead th {
  background: linear-gradient(135deg, #1c5ea8 0%, #2377c7 100%);
  color: #ffffff;
  border-color: rgba(255, 255, 255, 0.22);
  text-shadow: 0 1px 0 rgba(0, 0, 0, 0.12);
}

.student-virtual-context-card.virtual-rich-content table:not([class]):not([style]) tbody tr:nth-child(even) td,
.student-virtual-context-card .virtual-rich-content table:not([class]):not([style]) tbody tr:nth-child(even) td {
  background: #f7fbff;
}

.student-virtual-context-card.virtual-rich-content table:not([class]):not([style]) tbody tr:hover td,
.student-virtual-context-card .virtual-rich-content table:not([class]):not([style]) tbody tr:hover td {
  background: #edf6ff;
}

.student-virtual-context-card.virtual-rich-content table:not([class]):not([style]) th:first-child,
.student-virtual-context-card.virtual-rich-content table:not([class]):not([style]) td:first-child,
.student-virtual-context-card .virtual-rich-content table:not([class]):not([style]) th:first-child,
.student-virtual-context-card .virtual-rich-content table:not([class]):not([style]) td:first-child {
  text-align: left;
  font-weight: 800;
}

.student-virtual-context-card.virtual-rich-content table:not([class]):not([style]) tr:last-child th,
.student-virtual-context-card.virtual-rich-content table:not([class]):not([style]) tr:last-child td,
.student-virtual-context-card .virtual-rich-content table:not([class]):not([style]) tr:last-child th,
.student-virtual-context-card .virtual-rich-content table:not([class]):not([style]) tr:last-child td {
  border-bottom: 0;
}

.student-virtual-context-card.virtual-rich-content table:not([class]):not([style]) th:last-child,
.student-virtual-context-card.virtual-rich-content table:not([class]):not([style]) td:last-child,
.student-virtual-context-card .virtual-rich-content table:not([class]):not([style]) th:last-child,
.student-virtual-context-card .virtual-rich-content table:not([class]):not([style]) td:last-child {
  border-right: 0;
}

#virtualImageModal.virtual-image-modal-layer {
  position: fixed !important;
  inset: 0 !important;
  width: 100vw !important;
  height: 100dvh !important;
  min-height: 100dvh !important;
  z-index: 5000 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: clamp(0.7rem, 2vw, 1.4rem);
  margin: 0 !important;
  overflow: hidden;
  transform: none !important;
}

#virtualImageModal.virtual-image-modal-layer[hidden] {
  display: none !important;
}

.virtual-image-modal-backdrop {
  position: fixed;
  inset: 0;
  background:
    radial-gradient(circle at 18% 16%, rgba(66, 153, 225, 0.28), transparent 30%),
    radial-gradient(circle at 88% 12%, rgba(56, 189, 248, 0.2), transparent 28%),
    linear-gradient(145deg, rgba(5, 11, 24, 0.9), rgba(8, 23, 48, 0.94));
  backdrop-filter: blur(10px);
}

.virtual-image-viewer {
  position: relative;
  z-index: 1;
  width: min(1180px, 100%);
  height: min(820px, calc(100dvh - clamp(1.4rem, 4vw, 2.8rem)));
  min-height: min(680px, calc(100dvh - 1.4rem));
  display: grid;
  grid-template-rows: auto minmax(0, 1fr) auto;
  overflow: hidden;
  border: 1px solid rgba(148, 197, 255, 0.28);
  border-radius: 1.05rem;
  background:
    linear-gradient(180deg, rgba(11, 24, 48, 0.92), rgba(5, 12, 27, 0.96)),
    #07111f;
  box-shadow:
    0 34px 80px rgba(0, 0, 0, 0.48),
    inset 0 1px 0 rgba(255, 255, 255, 0.08);
  color: #f8fbff;
}

.virtual-image-toolbar {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 0.9rem;
  align-items: center;
  padding: 0.8rem 0.9rem;
  border-bottom: 1px solid rgba(255, 255, 255, 0.12);
  background:
    linear-gradient(90deg, rgba(17, 43, 84, 0.9), rgba(10, 24, 48, 0.88));
}

.virtual-image-title-block {
  min-width: 0;
}

.virtual-image-title-block span {
  display: block;
  color: #93c5fd;
  font-size: max(var(--ui-font-min), 0.72rem);
  font-weight: 850;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.virtual-image-title-block h2 {
  margin: 0.12rem 0 0;
  color: #ffffff;
  font-size: max(var(--ui-font-min), 1rem);
  line-height: 1.2;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.virtual-image-modal-actions {
  display: flex;
  gap: 0.42rem;
  align-items: center;
  flex-wrap: wrap;
  justify-content: flex-end;
}

.virtual-image-tool,
.virtual-image-close,
.virtual-image-zoom-value {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 2.25rem;
  border-radius: 0.64rem;
  border: 1px solid rgba(191, 219, 254, 0.25);
  background: rgba(255, 255, 255, 0.08);
  color: #ffffff;
  font-weight: 850;
}

.virtual-image-tool,
.virtual-image-close {
  min-width: 2.35rem;
  padding: 0 0.62rem;
  cursor: pointer;
  transition: background 0.16s ease, border-color 0.16s ease, transform 0.16s ease;
}

.virtual-image-tool:hover,
.virtual-image-close:hover {
  border-color: rgba(191, 219, 254, 0.54);
  background: rgba(147, 197, 253, 0.18);
  transform: translateY(-1px);
}

.virtual-image-tool-wide {
  min-width: 4.6rem;
}

.virtual-image-close {
  border-color: rgba(248, 113, 113, 0.32);
  background: rgba(127, 29, 29, 0.34);
}

.virtual-image-zoom-value {
  min-width: 4.1rem;
  padding: 0 0.62rem;
  color: #bfdbfe;
  background: rgba(15, 23, 42, 0.54);
}

.virtual-image-viewport {
  position: relative;
  min-height: 0;
  overflow: auto;
  display: grid;
  place-items: center;
  padding: 1.2rem;
  background:
    linear-gradient(45deg, rgba(255, 255, 255, 0.035) 25%, transparent 25%),
    linear-gradient(-45deg, rgba(255, 255, 255, 0.035) 25%, transparent 25%),
    linear-gradient(45deg, transparent 75%, rgba(255, 255, 255, 0.035) 75%),
    linear-gradient(-45deg, transparent 75%, rgba(255, 255, 255, 0.035) 75%),
    #07111f;
  background-size: 28px 28px;
  background-position: 0 0, 0 14px, 14px -14px, -14px 0;
  scrollbar-color: rgba(147, 197, 253, 0.7) rgba(15, 23, 42, 0.7);
  cursor: default;
  user-select: none;
  touch-action: none;
}

.virtual-image-viewport.is-loading::after {
  content: "Cargando imagen...";
  position: absolute;
  inset: 50% auto auto 50%;
  transform: translate(-50%, -50%);
  padding: 0.58rem 0.8rem;
  border-radius: 999px;
  background: rgba(15, 23, 42, 0.82);
  color: #bfdbfe;
  font-weight: 850;
  box-shadow: 0 14px 32px rgba(0, 0, 0, 0.28);
}

.virtual-image-viewport.is-zoomed {
  place-items: start;
  cursor: grab;
}

.virtual-image-viewport.is-dragging {
  cursor: grabbing;
}

.virtual-image-viewport img {
  display: block;
  max-width: none;
  height: auto;
  object-fit: contain;
  border-radius: 0.72rem;
  border: 1px solid rgba(255, 255, 255, 0.2);
  background: #ffffff;
  box-shadow: 0 24px 60px rgba(0, 0, 0, 0.38);
  pointer-events: none;
}

.virtual-image-help {
  padding: 0.58rem 0.9rem;
  border-top: 1px solid rgba(255, 255, 255, 0.1);
  color: #bfdbfe;
  font-size: max(var(--ui-font-min), 0.82rem);
  text-align: center;
  background: rgba(3, 7, 18, 0.5);
}

@media (max-width: 991.98px) {
  .virtual-image-viewer {
    height: calc(100dvh - 1.3rem);
    min-height: 0;
    border-radius: 0.82rem;
  }

  .virtual-image-toolbar {
    grid-template-columns: 1fr;
    align-items: start;
  }

  .virtual-image-modal-actions {
    justify-content: flex-start;
  }

  .admin-virtual-bank-grid {
    grid-template-columns: 1fr;
  }

  .admin-virtual-question-list,
  .admin-virtual-question-sublist {
    max-height: min(48vh, 460px);
  }

  .admin-virtual-bank-actions,
  .admin-virtual-context-row,
  .admin-virtual-question-row {
    grid-template-columns: 1fr;
  }

  .admin-virtual-bank-action-buttons,
  .admin-virtual-row-actions {
    justify-content: flex-start;
  }

  .admin-virtual-row-main p {
    white-space: normal;
  }

  .student-virtual-summary-hero {
    grid-template-columns: 1fr;
  }

  .student-virtual-attempt-toolbar {
    grid-template-columns: 1fr;
  }

  .student-virtual-attempt-toolbar-actions {
    justify-content: flex-start;
  }

  .student-virtual-summary-area-grid,
  .student-virtual-summary-metric-groups {
    grid-template-columns: 1fr;
  }

  .student-virtual-summary-score-ring {
    width: 7.4rem;
    justify-self: center;
  }
}

@media (max-width: 640px) {
  .virtual-image-modal-layer {
    padding: 0.45rem;
  }

  .virtual-image-toolbar {
    padding: 0.66rem;
  }

  .virtual-image-title-block h2 {
    font-size: max(var(--ui-font-min), 0.92rem);
  }

  .virtual-image-tool,
  .virtual-image-close,
  .virtual-image-zoom-value {
    min-height: 2.05rem;
    border-radius: 0.54rem;
  }

  .virtual-image-tool-wide {
    min-width: 4rem;
  }

  .virtual-image-viewport {
    padding: 0.7rem;
  }

  .virtual-image-help {
    font-size: max(var(--ui-font-min), 0.76rem);
  }

  .admin-virtual-question-list,
  .admin-virtual-question-sublist {
    max-height: min(42vh, 360px);
    padding-inline: 0.55rem;
  }

  .admin-virtual-bank-action-buttons .btn-small,
  .admin-virtual-row-actions .btn-xsmall {
    flex: 1 1 auto;
  }

  .admin-virtual-tree-section-head {
    align-items: flex-start;
    flex-direction: column;
  }

  .student-virtual-summary-area-score {
    font-size: max(var(--ui-font-min), 2.55rem);
  }

  .student-virtual-area-tab {
    min-width: 8.8rem;
  }

  .student-virtual-question-grid,
  .student-virtual-finish-chip-grid {
    grid-template-columns: repeat(auto-fill, minmax(4.2rem, 1fr));
  }

  .student-virtual-review-status em {
    margin-left: 0;
  }

  .student-virtual-summary-area-stats {
    grid-template-columns: 1fr;
  }

  .student-virtual-summary-metric-card {
    grid-template-columns: 1fr;
  }

  .student-virtual-summary-metric-percent {
    justify-self: start;
  }
}

/* Login Redesign */
.auth-body-login {
  position: relative;
  overflow-x: clip;
  padding: clamp(1rem, 2.7vw, 1.8rem);
  background:
    radial-gradient(circle at 15% 15%, rgba(41, 113, 255, 0.22), transparent 32%),
    radial-gradient(circle at 85% 85%, rgba(71, 223, 191, 0.2), transparent 34%),
    radial-gradient(circle at 78% 18%, rgba(168, 155, 255, 0.18), transparent 28%),
    linear-gradient(165deg, #f6fbff 0%, #e7f2ff 54%, #f9f4ff 100%);
}

.auth-body-login::before,
.auth-body-login::after {
  content: "";
  position: fixed;
  width: clamp(240px, 35vw, 440px);
  aspect-ratio: 1;
  border-radius: 50%;
  filter: blur(10px);
  opacity: 0.42;
  z-index: 0;
  animation: loginBlobFloat 14s ease-in-out infinite;
}

.auth-body-login::before {
  top: -120px;
  right: -80px;
  background: radial-gradient(circle at 30% 30%, rgba(13, 91, 255, 0.42), rgba(13, 91, 255, 0));
}

.auth-body-login::after {
  bottom: -160px;
  left: -110px;
  background: radial-gradient(circle at 30% 30%, rgba(34, 211, 166, 0.35), rgba(34, 211, 166, 0));
  animation-delay: -4.5s;
}

.auth-shell-login {
  width: min(1060px, 100%);
  position: relative;
  z-index: 1;
}

.auth-card-login {
  width: min(100%, 980px);
  position: relative;
  padding: clamp(1.05rem, 2.3vw, 2rem);
  border-radius: clamp(1.25rem, 2vw, 2rem);
  border: 1px solid rgba(47, 96, 175, 0.24);
  background:
    linear-gradient(160deg, rgba(255, 255, 255, 0.92), rgba(246, 251, 255, 0.9)),
    linear-gradient(120deg, rgba(13, 91, 255, 0.08), rgba(34, 211, 166, 0.08));
  box-shadow:
    0 26px 58px rgba(16, 35, 78, 0.16),
    0 6px 16px rgba(64, 91, 156, 0.09);
  overflow: hidden;
}

.auth-card-login::before {
  content: "";
  position: absolute;
  inset: -2px;
  pointer-events: none;
  background:
    conic-gradient(
      from 190deg at 85% 22%,
      rgba(13, 91, 255, 0.18),
      rgba(34, 211, 166, 0.14),
      rgba(168, 155, 255, 0.16),
      rgba(13, 91, 255, 0.08)
    );
  mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  mask-composite: exclude;
  -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  -webkit-mask-composite: xor;
  border-radius: inherit;
  padding: 2px;
}

.brand-row-login {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.85rem;
  margin-bottom: clamp(0.95rem, 1.8vw, 1.45rem);
}

.auth-status-pill {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 36px;
  padding: 0.42rem 0.84rem;
  border-radius: 999px;
  font-weight: 800;
  font-size: max(var(--ui-font-min), 0.82rem);
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: #114a9f;
  border: 1px solid rgba(17, 74, 159, 0.22);
  background: linear-gradient(120deg, rgba(217, 236, 255, 0.92), rgba(255, 255, 255, 0.96));
  box-shadow: 0 10px 18px rgba(17, 74, 159, 0.14);
  animation: loginPillPulse 3.2s ease-in-out infinite;
}

.auth-login-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.05fr) minmax(0, 0.95fr);
  gap: clamp(1rem, 2vw, 1.4rem);
  align-items: stretch;
}

.auth-intro {
  display: grid;
  align-content: start;
  gap: 0.68rem;
  padding: clamp(0.2rem, 1vw, 0.45rem);
}

.auth-body-login .auth-kicker {
  width: fit-content;
  padding: 0.48rem 0.86rem;
  border-radius: 999px;
  letter-spacing: 0.08em;
  font-size: max(var(--ui-font-min), 0.76rem);
  font-weight: 800;
  color: #0b4ba9;
  border: 1px solid rgba(13, 91, 255, 0.22);
  background: linear-gradient(115deg, rgba(217, 236, 255, 0.84), rgba(255, 255, 255, 0.95));
  margin: 0;
}

.auth-body-login .auth-card h1 {
  margin: 0;
  font-size: max(var(--ui-font-min), clamp(1.8rem, 4vw, 2.7rem));
  letter-spacing: -0.02em;
  line-height: 1.03;
  color: #122448;
}

.auth-body-login .auth-lead {
  margin: 0;
  max-width: 44ch;
  color: #344563;
  font-size: max(var(--ui-font-min), clamp(1rem, 1.35vw, 1.09rem));
  line-height: 1.5;
}

.auth-highlight-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.68rem;
  margin-top: 0.42rem;
  max-width: 430px;
}

.auth-highlight {
  display: inline-flex;
  align-items: center;
  gap: 0.46rem;
  border-radius: 0.98rem;
  padding: 0.64rem 0.72rem;
  font-weight: 700;
  font-size: max(var(--ui-font-min), 0.94rem);
  color: #193460;
  border: 1px solid rgba(46, 89, 167, 0.2);
  background: linear-gradient(145deg, rgba(255, 255, 255, 0.96), rgba(226, 242, 255, 0.8));
  box-shadow: 0 9px 18px rgba(16, 52, 110, 0.11);
  transform-origin: center;
}

.auth-highlight--one {
  animation: loginCardFloatA 3.9s ease-in-out infinite;
}

.auth-highlight--two {
  animation: loginCardFloatB 4.3s ease-in-out infinite;
  animation-delay: -1.15s;
}

.auth-highlight--three {
  grid-column: 1 / -1;
  max-width: 260px;
  animation: loginCardFloatC 4.8s ease-in-out infinite;
  animation-delay: -0.7s;
}

.auth-highlight-dot {
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: linear-gradient(145deg, #0d5bff, #19a9ea);
  box-shadow: 0 0 0 4px rgba(13, 91, 255, 0.14);
}

.auth-form-panel {
  border-radius: clamp(1rem, 1.6vw, 1.35rem);
  border: 1px solid rgba(45, 85, 165, 0.2);
  background: linear-gradient(160deg, rgba(255, 255, 255, 0.95), rgba(241, 248, 255, 0.96));
  padding: clamp(0.92rem, 1.8vw, 1.15rem);
  box-shadow:
    inset 0 0 0 1px rgba(255, 255, 255, 0.45),
    0 16px 34px rgba(18, 52, 110, 0.12);
  position: relative;
}

.auth-form-panel::after {
  content: "";
  position: absolute;
  width: clamp(88px, 14vw, 124px);
  height: clamp(88px, 14vw, 124px);
  border-radius: 50%;
  bottom: -34px;
  right: -34px;
  background: radial-gradient(circle at 30% 30%, rgba(34, 211, 166, 0.3), rgba(34, 211, 166, 0));
  pointer-events: none;
}

.auth-body-login .auth-form {
  gap: 0.62rem;
}

.auth-body-login .auth-form label {
  color: #103f86;
  font-size: max(var(--ui-font-min), 0.95rem);
}

.auth-body-login .auth-form input[type="text"],
.auth-body-login .admin-password-group input[type="password"] {
  min-height: 52px;
  border-radius: 0.95rem;
  border: 1px solid rgba(18, 67, 140, 0.23);
  background: linear-gradient(180deg, #fff, #f4f9ff);
  padding: 0.78rem 0.96rem;
  transition: border-color 180ms ease, box-shadow 180ms ease, transform 180ms ease;
}

.auth-body-login .auth-form input[type="text"]:focus-visible,
.auth-body-login .admin-password-group input[type="password"]:focus-visible {
  border-color: rgba(13, 91, 255, 0.68);
  box-shadow: 0 0 0 4px rgba(13, 91, 255, 0.18);
  transform: translateY(-1px);
}

.auth-body-login .auth-form small {
  color: #365277;
  font-size: max(var(--ui-font-min), 0.88rem);
  line-height: 1.44;
}

.auth-body-login .admin-password-group {
  border-style: dashed;
  border-color: rgba(13, 91, 255, 0.26);
  background: linear-gradient(145deg, rgba(235, 246, 255, 0.9), rgba(247, 252, 255, 0.94));
  animation: loginCardFloatB 4.6s ease-in-out infinite;
}

.auth-body-login .btn-primary {
  min-height: 52px;
  border-radius: 0.96rem;
  background: linear-gradient(125deg, #0d5bff, #3e83ff 52%, #28b8e8);
  box-shadow: 0 16px 30px rgba(13, 91, 255, 0.28);
  letter-spacing: 0.02em;
  position: relative;
  overflow: hidden;
}

.auth-body-login .btn-primary::before {
  content: "";
  position: absolute;
  top: 0;
  left: -120%;
  width: 65%;
  height: 100%;
  background: linear-gradient(110deg, rgba(255, 255, 255, 0), rgba(255, 255, 255, 0.38), rgba(255, 255, 255, 0));
  transform: skewX(-20deg);
  transition: left 420ms ease;
}

.auth-body-login .btn-primary:hover::before,
.auth-body-login .btn-primary:focus-visible::before {
  left: 135%;
}

.auth-body-login .btn-primary:hover {
  transform: translateY(-2px);
}

.auth-body-login .auth-feedback {
  min-height: 1.35rem;
  margin-top: 0.24rem;
  font-weight: 600;
}

@keyframes loginBlobFloat {
  0%,
  100% {
    transform: translateY(0) translateX(0) scale(1);
  }
  50% {
    transform: translateY(16px) translateX(-10px) scale(1.05);
  }
}

@keyframes loginPillPulse {
  0%,
  100% {
    transform: translateY(0);
    box-shadow: 0 10px 18px rgba(17, 74, 159, 0.14);
  }
  50% {
    transform: translateY(-2px);
    box-shadow: 0 14px 22px rgba(17, 74, 159, 0.22);
  }
}

@keyframes loginCardFloatA {
  0%,
  100% {
    transform: translateY(0) rotate(-2deg);
  }
  50% {
    transform: translateY(-6px) rotate(-1deg);
  }
}

@keyframes loginCardFloatB {
  0%,
  100% {
    transform: translateY(0) rotate(1.8deg);
  }
  50% {
    transform: translateY(-7px) rotate(3deg);
  }
}

@keyframes loginCardFloatC {
  0%,
  100% {
    transform: translateY(0) rotate(-1deg);
  }
  50% {
    transform: translateY(-8px) rotate(1deg);
  }
}

@media (max-width: 960px) {
  .auth-login-layout {
    grid-template-columns: 1fr;
  }

  .auth-intro {
    gap: 0.6rem;
  }

  .auth-highlight-grid {
    max-width: 100%;
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .auth-highlight--three {
    grid-column: auto;
    max-width: none;
  }
}

@media (max-width: 680px) {
  .auth-body-login {
    align-items: flex-start;
    padding: 0.8rem;
  }

  .auth-card-login {
    padding: 0.86rem;
    border-radius: 1.15rem;
  }

  .brand-row-login {
    gap: 0.62rem;
    margin-bottom: 0.88rem;
  }

  .brand-row-login .brand-mark {
    width: 40px;
    height: 40px;
  }

  .brand-row-login .brand-link {
    font-size: max(var(--ui-font-min), 0.95rem);
  }

  .auth-status-pill {
    min-height: 32px;
    padding: 0.32rem 0.62rem;
    font-size: max(var(--ui-font-min), 0.7rem);
  }

  .auth-body-login .auth-card h1 {
    font-size: max(var(--ui-font-min), 1.55rem);
    line-height: 1.08;
  }

  .auth-body-login .auth-lead {
    font-size: max(var(--ui-font-min), 0.95rem);
  }

  .auth-highlight-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.55rem;
  }

  .auth-highlight {
    font-size: max(var(--ui-font-min), 0.83rem);
    padding: 0.55rem 0.58rem;
    border-radius: 0.86rem;
  }

  .auth-highlight--three {
    grid-column: 1 / -1;
  }

  .auth-form-panel {
    padding: 0.78rem;
    border-radius: 0.95rem;
  }

  .auth-body-login .auth-form input[type="text"],
  .auth-body-login .admin-password-group input[type="password"] {
    min-height: 48px;
    font-size: max(var(--ui-font-min), 0.95rem);
  }

  .auth-body-login .btn-primary {
    min-height: 49px;
    font-size: max(var(--ui-font-min), 0.96rem);
  }
}

@media (prefers-reduced-motion: reduce) {
  .auth-body-login::before,
  .auth-body-login::after,
  .auth-status-pill,
  .auth-highlight--one,
  .auth-highlight--two,
  .auth-highlight--three,
  .auth-body-login .admin-password-group {
    animation: none !important;
  }

  .auth-body-login .btn-primary,
  .auth-body-login .btn-primary::before,
  .auth-body-login .auth-form input[type="text"],
  .auth-body-login .admin-password-group input[type="password"] {
    transition: none !important;
  }
}

/* Student Portal Creative Refresh */
.panel-body-student {
  position: relative;
  overflow-x: clip;
  background:
    radial-gradient(circle at 10% 12%, rgba(13, 91, 255, 0.15), transparent 30%),
    radial-gradient(circle at 90% 82%, rgba(34, 211, 166, 0.16), transparent 32%),
    radial-gradient(circle at 80% 18%, rgba(168, 155, 255, 0.16), transparent 26%),
    linear-gradient(165deg, #f5f9ff 0%, #eaf4ff 52%, #f9f5ff 100%);
}

.panel-body-student::before,
.panel-body-student::after {
  content: "";
  position: fixed;
  width: clamp(220px, 28vw, 360px);
  aspect-ratio: 1;
  border-radius: 50%;
  pointer-events: none;
  filter: blur(8px);
  opacity: 0.45;
  z-index: 0;
  animation: studentAuraFloat 16s ease-in-out infinite;
}

.panel-body-student::before {
  top: -96px;
  right: -84px;
  background: radial-gradient(circle at 38% 35%, rgba(13, 91, 255, 0.34), rgba(13, 91, 255, 0));
}

.panel-body-student::after {
  left: -90px;
  bottom: -110px;
  background: radial-gradient(circle at 38% 35%, rgba(34, 211, 166, 0.3), rgba(34, 211, 166, 0));
  animation-delay: -6s;
}

.panel-body-student > * {
  position: relative;
  z-index: 1;
}

.panel-body-student .panel-topbar {
  border-bottom: 1px solid rgba(19, 66, 141, 0.25);
  background: rgba(248, 252, 255, 0.86);
  backdrop-filter: blur(15px);
}

.panel-body-student .panel-topbar-inner {
  width: min(1220px, 100%);
}

.panel-body-student .panel-menu .topbar-account-btn-student {
  border: 1px solid rgba(21, 78, 168, 0.28);
  background: linear-gradient(130deg, rgba(214, 232, 255, 0.9), rgba(242, 250, 255, 0.95));
  box-shadow: 0 10px 20px rgba(21, 78, 168, 0.14);
}

.panel-body-student .panel-menu .logout-link {
  background: linear-gradient(130deg, #1b5fd0, #143f9a);
  box-shadow: 0 10px 20px rgba(20, 63, 154, 0.24);
}

.panel-body-student .panel-shell {
  width: min(1220px, 100%);
  padding: 1.2rem 1.25rem 2.2rem;
  gap: 1rem;
}

.panel-body-student .student-portal-showcase {
  position: relative;
  overflow: hidden;
  border: 1px solid rgba(21, 78, 168, 0.24);
  border-radius: 1.45rem;
  background:
    radial-gradient(circle at 88% 20%, rgba(34, 211, 166, 0.16), transparent 35%),
    radial-gradient(circle at 12% 82%, rgba(168, 155, 255, 0.2), transparent 30%),
    linear-gradient(150deg, rgba(255, 255, 255, 0.95), rgba(235, 246, 255, 0.92));
  box-shadow:
    0 22px 46px rgba(15, 45, 91, 0.14),
    inset 0 1px 0 rgba(255, 255, 255, 0.8);
  animation: studentShowcaseGlow 12s ease-in-out infinite;
}

.panel-body-student .student-portal-showcase > * {
  position: relative;
  z-index: 2;
}

.panel-body-student .student-portal-showcase::after {
  content: "";
  position: absolute;
  inset: auto -18% -38% auto;
  width: clamp(220px, 32vw, 420px);
  height: clamp(220px, 32vw, 420px);
  border-radius: 50%;
  background: radial-gradient(circle at 30% 30%, rgba(13, 91, 255, 0.22), rgba(13, 91, 255, 0));
  pointer-events: none;
  z-index: 1;
}

.panel-body-student .student-portal-showcase h1 {
  margin: 0.32rem 0 0.5rem;
  font-size: max(var(--ui-font-min), clamp(1.45rem, 2.8vw, 2.18rem));
  line-height: 1.05;
  letter-spacing: -0.02em;
  color: #132a53;
}

.panel-body-student .student-showcase-lead {
  display: block;
  margin: 0;
  max-width: none;
  color: #2f486f;
  font-size: max(var(--ui-font-min), clamp(0.94rem, 1.2vw, 1.04rem));
  line-height: 1.5;
  white-space: normal;
  overflow: visible;
  text-overflow: clip;
}

.student-showcase-orbit {
  margin-top: 0.95rem;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.62rem;
}

.student-showcase-chip {
  border: 1px solid rgba(33, 86, 168, 0.2);
  border-radius: 0.98rem;
  background: linear-gradient(145deg, rgba(255, 255, 255, 0.96), rgba(224, 242, 255, 0.86));
  box-shadow: 0 10px 18px rgba(18, 52, 110, 0.12);
  color: #194173;
  font-size: max(var(--ui-font-min), 0.9rem);
  font-weight: 750;
  line-height: 1.34;
  padding: 0.62rem 0.72rem;
  transform-origin: center;
}

.student-showcase-chip--one {
  animation: studentChipDriftA 6.2s ease-in-out infinite;
}

.student-showcase-chip--two {
  animation: studentChipDriftB 6.9s ease-in-out infinite;
  animation-delay: -1.2s;
}

.student-showcase-chip--three {
  animation: studentChipDriftC 7.4s ease-in-out infinite;
  animation-delay: -2.2s;
}

.student-showcase-chip--four {
  animation: studentChipDriftD 7.7s ease-in-out infinite;
  animation-delay: -1.7s;
}

.panel-body-student .student-portal-tabs-card {
  margin: 0;
  position: relative;
}

.panel-body-student .student-portal-tabs {
  margin-top: 0;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 0.64rem;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  padding: 0;
}

.panel-body-student .student-portal-tabs .student-overview-tab {
  min-height: 66px;
  border-radius: 1rem;
  border: 1px solid rgba(25, 78, 157, 0.2);
  background: linear-gradient(155deg, rgba(255, 255, 255, 0.95), rgba(234, 246, 255, 0.95));
  box-shadow: 0 10px 18px rgba(15, 48, 95, 0.12);
  color: #184179;
  font-weight: 800;
  letter-spacing: 0.01em;
  padding: 0.68rem 0.72rem;
  transition: transform 190ms ease, box-shadow 190ms ease, border-color 190ms ease, background 190ms ease;
  position: relative;
  overflow: hidden;
}

.panel-body-student .student-portal-tabs .student-overview-tab::before {
  content: "";
  position: absolute;
  inset: -40% auto auto -30%;
  width: 48%;
  height: 170%;
  background: linear-gradient(130deg, rgba(255, 255, 255, 0.55), rgba(255, 255, 255, 0));
  transform: rotate(16deg);
  pointer-events: none;
}

.panel-body-student .student-portal-tabs .student-overview-tab:hover {
  transform: translateY(-3px);
  border-color: rgba(20, 72, 148, 0.45);
  box-shadow: 0 16px 24px rgba(15, 48, 95, 0.18);
  background: linear-gradient(155deg, rgba(255, 255, 255, 0.98), rgba(223, 240, 255, 0.96));
}

.panel-body-student .student-portal-tabs .student-overview-tab.is-active {
  color: #fff;
  border-color: rgba(16, 58, 129, 0.82);
  background: linear-gradient(140deg, #1a68df, #2f90ff 52%, #33b8ea);
  box-shadow: 0 18px 32px rgba(15, 72, 158, 0.33);
  transform: translateY(-2px);
}

.panel-body-student .student-portal-tabs .student-overview-tab.is-active::before {
  background: linear-gradient(130deg, rgba(255, 255, 255, 0.35), rgba(255, 255, 255, 0));
}

.panel-body-student .student-portal-pane {
  margin-top: 0.15rem;
  border: 1px solid rgba(31, 84, 159, 0.22);
  border-radius: 1.35rem;
  background:
    radial-gradient(circle at 8% 12%, rgba(13, 91, 255, 0.08), transparent 28%),
    linear-gradient(165deg, rgba(255, 255, 255, 0.98), rgba(236, 247, 255, 0.94));
  box-shadow: 0 20px 36px rgba(15, 45, 91, 0.14);
  padding: clamp(0.9rem, 1.8vw, 1.1rem);
}

.panel-body-student .student-portal-priority-grid {
  gap: 0.92rem;
}

.panel-body-student .student-notes-block {
  margin-top: 0;
  border: 1px solid rgba(33, 82, 155, 0.18);
  border-radius: 1.1rem;
  background: linear-gradient(160deg, rgba(255, 255, 255, 0.95), rgba(238, 248, 255, 0.95));
  box-shadow: 0 14px 28px rgba(15, 45, 91, 0.11);
  padding: clamp(0.84rem, 1.6vw, 1rem);
}

.panel-body-student .student-priority-card {
  position: relative;
  overflow: hidden;
}

.panel-body-student .student-priority-card::before {
  content: "";
  position: absolute;
  width: 180px;
  height: 180px;
  border-radius: 50%;
  top: -82px;
  right: -72px;
  opacity: 0.24;
  pointer-events: none;
}

.panel-body-student .student-priority-finance::before {
  background: radial-gradient(circle at 38% 38%, rgba(13, 91, 255, 0.65), rgba(13, 91, 255, 0));
}

.panel-body-student .student-priority-comments::before {
  background: radial-gradient(circle at 38% 38%, rgba(34, 211, 166, 0.66), rgba(34, 211, 166, 0));
}

.panel-body-student .student-inactive-notice {
  border-color: rgba(190, 18, 60, 0.34);
  background: #fff1f2;
  box-shadow: 0 12px 24px rgba(190, 18, 60, 0.08);
  color: #be123c;
}

.panel-body-student .student-unregistered-notice {
  border-color: rgba(37, 99, 235, 0.24);
  background: #eff6ff;
  box-shadow: 0 12px 24px rgba(37, 99, 235, 0.08);
  color: #1d4ed8;
}

.panel-body-student .student-priority-finance {
  animation: studentCardLiftA 6.8s ease-in-out infinite;
}

.panel-body-student .student-priority-comments {
  animation: studentCardLiftB 7.5s ease-in-out infinite;
  animation-delay: -1.3s;
}

.panel-body-student .student-priority-head h2,
.panel-body-student .student-notes-block h2 {
  color: #113867;
}

.panel-body-student .student-notes-block .panel-lead {
  margin-bottom: 0.8rem;
  color: #36517b;
}

.panel-body-student .admin-user-finance-meta {
  border: 1px solid rgba(29, 79, 149, 0.2);
  border-radius: 1rem;
  background: linear-gradient(155deg, rgba(255, 255, 255, 0.98), rgba(234, 246, 255, 0.9));
  box-shadow: 0 12px 22px rgba(15, 45, 91, 0.1);
  transition: transform 180ms ease, box-shadow 180ms ease, border-color 180ms ease;
}

.panel-body-student .admin-user-finance-meta:hover {
  transform: translateY(-2px);
  border-color: rgba(24, 78, 150, 0.38);
  box-shadow: 0 16px 26px rgba(15, 45, 91, 0.16);
}

.panel-body-student .admin-user-finance-meta.is-ok {
  background: linear-gradient(155deg, rgba(236, 251, 246, 0.98), rgba(223, 249, 237, 0.94));
}

.panel-body-student .admin-user-finance-meta.is-debt {
  background: linear-gradient(155deg, rgba(255, 248, 228, 0.98), rgba(255, 242, 210, 0.95));
}

.panel-body-student .admin-user-finance-state {
  border-radius: 999px;
  padding: 0.24rem 0.58rem;
}

.panel-body-student .admin-user-finance-metric {
  border-radius: 0.72rem;
  background: rgba(255, 255, 255, 0.9);
}

.panel-body-student #studentCommentsList {
  border-radius: 0.96rem;
  border: 1px solid rgba(31, 85, 159, 0.22);
  background: linear-gradient(165deg, rgba(255, 255, 255, 0.96), rgba(237, 248, 255, 0.92));
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.7);
}

.panel-body-student #studentCommentsList .sim-comment-item {
  border-radius: 0.84rem;
  border: 1px solid rgba(31, 85, 159, 0.2);
  background: linear-gradient(145deg, rgba(255, 255, 255, 0.96), rgba(228, 244, 255, 0.86));
}

.panel-body-student #studentCommentsList .sim-comment-meta {
  color: #456089;
}

.panel-body-student .student-portal-notes-card {
  border-color: rgba(31, 85, 159, 0.2);
}

.panel-body-student .student-notes-table-wrap {
  border-radius: 1rem;
  border: 1px solid rgba(31, 85, 159, 0.24);
  box-shadow: 0 10px 20px rgba(15, 45, 91, 0.08);
  background: #fff;
}

.panel-body-student .student-notes-table th {
  background: linear-gradient(150deg, #dceeff, #eaf5ff);
  color: #12427b;
  border-bottom-color: rgba(31, 85, 159, 0.26);
}

.panel-body-student .student-notes-table td {
  border-bottom-color: rgba(31, 85, 159, 0.14);
}

.panel-body-student .student-notes-table tbody tr:nth-child(even) {
  background: rgba(238, 248, 255, 0.46);
}

.panel-body-student .student-notes-table tbody tr:hover {
  background: rgba(220, 239, 255, 0.66);
}

.panel-body-student .student-virtual-summary-btn {
  border-radius: 0.75rem;
  border-color: rgba(24, 79, 152, 0.35);
  background: linear-gradient(145deg, rgba(236, 247, 255, 0.98), rgba(222, 241, 255, 0.9));
}

.panel-body-student .student-virtual-summary-btn:hover {
  border-color: rgba(24, 79, 152, 0.6);
  background: linear-gradient(145deg, rgba(255, 255, 255, 0.98), rgba(210, 234, 255, 0.9));
}

.panel-body-student .student-simulator-modal-card,
.panel-body-student .student-virtual-attempt-modal,
.panel-body-student #studentVirtualSummaryModal .admin-modal-card,
.panel-body-student #studentVirtualFinishConfirmModal .admin-modal-card,
.panel-body-student #studentVirtualReviewModal .admin-modal-card,
.panel-body-student #studentFinanceInvoicesModal .admin-modal-card,
.panel-body-student #studentAccountModal .admin-modal-card {
  border-radius: 1.1rem;
  border: 1px solid rgba(21, 78, 168, 0.22);
  background:
    radial-gradient(circle at top right, rgba(13, 91, 255, 0.1), transparent 40%),
    linear-gradient(165deg, #ffffff, #f5faff);
  box-shadow: 0 22px 42px rgba(15, 45, 91, 0.2);
}

.panel-body-student .student-simulator-grid label {
  color: #1d456f;
}

.panel-body-student .student-simulator-grid input[type="number"] {
  border-color: rgba(21, 78, 168, 0.3);
  background: linear-gradient(180deg, #fff, #f5faff);
}

.panel-body-student .student-simulator-grid input[type="number"]:focus-visible {
  border-color: rgba(13, 91, 255, 0.74);
  box-shadow: 0 0 0 3px rgba(13, 91, 255, 0.16);
}

.panel-body-student .student-simulator-result {
  border-color: rgba(21, 78, 168, 0.24);
  background: linear-gradient(150deg, rgba(238, 248, 255, 0.95), rgba(225, 242, 255, 0.9));
}

.panel-body-student .student-overview-identity {
  margin: 0.2rem 0 0;
  border-color: rgba(21, 78, 168, 0.22);
  border-radius: 1rem;
  background: linear-gradient(150deg, rgba(255, 255, 255, 0.97), rgba(233, 245, 255, 0.92));
}

@keyframes studentAuraFloat {
  0%,
  100% {
    transform: translateY(0) translateX(0) scale(1);
  }
  50% {
    transform: translateY(18px) translateX(-10px) scale(1.05);
  }
}

@keyframes studentShowcaseGlow {
  0%,
  100% {
    box-shadow:
      0 22px 46px rgba(15, 45, 91, 0.14),
      inset 0 1px 0 rgba(255, 255, 255, 0.8);
  }
  50% {
    box-shadow:
      0 28px 54px rgba(15, 45, 91, 0.2),
      inset 0 1px 0 rgba(255, 255, 255, 0.9);
  }
}

@keyframes studentChipDriftA {
  0%,
  100% {
    transform: translateY(0) rotate(-1.4deg);
  }
  50% {
    transform: translateY(-7px) rotate(-0.4deg);
  }
}

@keyframes studentChipDriftB {
  0%,
  100% {
    transform: translateY(0) rotate(1.5deg);
  }
  50% {
    transform: translateY(-8px) rotate(2.6deg);
  }
}

@keyframes studentChipDriftC {
  0%,
  100% {
    transform: translateY(0) rotate(-0.8deg);
  }
  50% {
    transform: translateY(-6px) rotate(0.5deg);
  }
}

@keyframes studentChipDriftD {
  0%,
  100% {
    transform: translateY(0) rotate(1deg);
  }
  50% {
    transform: translateY(-7px) rotate(2deg);
  }
}

@keyframes studentCardLiftA {
  0%,
  100% {
    transform: translateY(0);
  }
  50% {
    transform: translateY(-5px);
  }
}

@keyframes studentCardLiftB {
  0%,
  100% {
    transform: translateY(0);
  }
  50% {
    transform: translateY(-6px);
  }
}

@media (max-width: 980px) {
  .panel-body-student .student-showcase-orbit {
    grid-template-columns: 1fr;
  }

  .panel-body-student .student-portal-tabs {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 720px) {
  .panel-body-student .panel-shell {
    padding: 0.92rem 0.9rem 1.5rem;
    gap: 0.85rem;
  }

  .panel-body-student .student-portal-showcase {
    border-radius: 1.1rem;
    padding: 0.9rem;
  }

  .panel-body-student .student-portal-showcase h1 {
    font-size: max(var(--ui-font-min), 1.5rem);
  }

  .panel-body-student .student-showcase-lead {
    font-size: max(var(--ui-font-min), 0.9rem);
  }

  .panel-body-student .student-showcase-orbit {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.5rem;
  }

  .panel-body-student .student-showcase-chip {
    font-size: max(var(--ui-font-min), 0.8rem);
    padding: 0.5rem 0.54rem;
  }

  .panel-body-student .student-portal-tabs {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.48rem;
  }

  .panel-body-student .student-portal-tabs .student-overview-tab {
    min-height: 58px;
    font-size: max(var(--ui-font-min), 0.86rem);
    border-radius: 0.9rem;
    padding: 0.52rem;
  }

  .panel-body-student .student-portal-pane {
    border-radius: 1.02rem;
    padding: 0.72rem;
  }

  .panel-body-student .student-notes-block {
    border-radius: 0.94rem;
    padding: 0.7rem;
  }

  .panel-body-student .student-notes-table {
    min-width: 840px;
  }
}

@media (max-width: 460px) {
  .panel-body-student .student-showcase-orbit {
    grid-template-columns: 1fr;
  }

  .panel-body-student .student-portal-tabs {
    grid-template-columns: 1fr;
  }
}

@media (prefers-reduced-motion: reduce) {
  .panel-body-student::before,
  .panel-body-student::after,
  .panel-body-student .student-portal-showcase,
  .panel-body-student .student-priority-finance,
  .panel-body-student .student-priority-comments,
  .panel-body-student .student-showcase-chip {
    animation: none !important;
  }

  .panel-body-student .student-portal-tabs .student-overview-tab,
  .panel-body-student .admin-user-finance-meta {
    transition: none !important;
  }
}

/* Admin Panel Creative Refresh */
.panel-body-admin {
  position: relative;
  overflow-x: clip;
  background:
    radial-gradient(circle at 8% 10%, rgba(13, 91, 255, 0.16), transparent 30%),
    radial-gradient(circle at 92% 86%, rgba(34, 211, 166, 0.16), transparent 32%),
    radial-gradient(circle at 84% 18%, rgba(168, 155, 255, 0.15), transparent 28%),
    linear-gradient(165deg, #f5f9ff 0%, #eaf3ff 50%, #f9f5ff 100%);
}

.panel-body-admin::before,
.panel-body-admin::after {
  content: "";
  position: fixed;
  width: clamp(220px, 30vw, 380px);
  aspect-ratio: 1;
  border-radius: 50%;
  pointer-events: none;
  filter: blur(8px);
  opacity: 0.44;
  z-index: 0;
  animation: adminAuraFloat 17s ease-in-out infinite;
}

.panel-body-admin::before {
  top: -110px;
  right: -86px;
  background: radial-gradient(circle at 34% 34%, rgba(13, 91, 255, 0.34), rgba(13, 91, 255, 0));
}

.panel-body-admin::after {
  bottom: -130px;
  left: -96px;
  background: radial-gradient(circle at 34% 34%, rgba(34, 211, 166, 0.3), rgba(34, 211, 166, 0));
  animation-delay: -6.5s;
}

.panel-body-admin > * {
  position: relative;
  z-index: 1;
}

.panel-body-admin .panel-topbar {
  border-bottom: 1px solid rgba(23, 74, 152, 0.22);
  background: rgba(248, 252, 255, 0.84);
  backdrop-filter: blur(16px);
  box-shadow: 0 14px 22px rgba(15, 44, 90, 0.08);
}

.panel-body-admin .panel-topbar-inner {
  width: min(1260px, 100%);
  padding-top: 0.72rem;
  padding-bottom: 0.72rem;
}

.panel-body-admin .panel-brand {
  color: #153a6b;
}

.panel-body-admin .brand-mark-sm {
  border-color: rgba(21, 78, 168, 0.28);
  box-shadow: 0 8px 16px rgba(15, 52, 108, 0.14);
}

.panel-body-admin .panel-menu .topbar-account-btn {
  border-color: rgba(21, 78, 168, 0.25);
  background: linear-gradient(130deg, rgba(218, 235, 255, 0.9), rgba(246, 251, 255, 0.94));
  color: #1b4a82;
  box-shadow: 0 10px 16px rgba(21, 78, 168, 0.12);
}

.panel-body-admin .panel-menu .logout-link {
  background: linear-gradient(130deg, #1a68df, #143f9a);
  box-shadow: 0 10px 20px rgba(19, 64, 155, 0.24);
}

.panel-body-admin .panel-shell {
  width: min(1260px, 100%);
  padding: 1.25rem 1.3rem 2.4rem;
  gap: 1rem;
}

.panel-body-admin .admin-workspace {
  gap: 1.08rem;
}

.panel-body-admin .admin-overview {
  position: relative;
  overflow: hidden;
  border: 1px solid rgba(22, 78, 166, 0.24);
  border-radius: 1.35rem;
  padding: 1rem 1.05rem;
  background:
    radial-gradient(circle at 92% 18%, rgba(34, 211, 166, 0.14), transparent 38%),
    radial-gradient(circle at 12% 82%, rgba(168, 155, 255, 0.2), transparent 32%),
    linear-gradient(150deg, rgba(255, 255, 255, 0.97), rgba(235, 246, 255, 0.92));
  box-shadow:
    0 24px 42px rgba(15, 45, 91, 0.14),
    inset 0 1px 0 rgba(255, 255, 255, 0.8);
  animation: adminOverviewGlow 13s ease-in-out infinite;
}

.panel-body-admin .admin-overview::after {
  content: "";
  position: absolute;
  width: clamp(220px, 30vw, 420px);
  height: clamp(220px, 30vw, 420px);
  right: -24%;
  bottom: -52%;
  border-radius: 50%;
  background: radial-gradient(circle at 30% 30%, rgba(13, 91, 255, 0.22), rgba(13, 91, 255, 0));
  pointer-events: none;
}

.panel-body-admin .admin-overview > * {
  position: relative;
  z-index: 2;
}

.panel-body-admin .panel-kicker {
  color: #0f4aa8;
}

.panel-body-admin .admin-overview h1 {
  color: #112a54;
  letter-spacing: -0.02em;
  margin-bottom: 0.6rem;
}

.panel-body-admin .admin-overview .panel-lead {
  margin-bottom: 0;
  color: #37527b;
  max-width: 84ch;
}

.panel-body-admin .admin-year-banner {
  margin-top: 0.9rem;
  border: 1px solid rgba(23, 79, 161, 0.2);
  border-radius: 1rem;
  background: linear-gradient(155deg, rgba(255, 255, 255, 0.95), rgba(229, 243, 255, 0.92));
  box-shadow: 0 12px 24px rgba(15, 45, 91, 0.09);
  padding: 0.78rem 0.84rem;
  grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr);
  align-items: start;
  gap: 0.8rem;
}

.panel-body-admin .admin-year-badge {
  font-size: max(var(--ui-font-min), 1rem);
  color: #164476;
}

.panel-body-admin .admin-year-note {
  color: #4a6288;
  line-height: 1.4;
}

.panel-body-admin .admin-year-controls {
  border: 1px dashed rgba(22, 78, 166, 0.3);
  border-radius: 0.85rem;
  padding: 0.58rem 0.62rem;
  background: rgba(255, 255, 255, 0.72);
}

.panel-body-admin .admin-module-nav {
  gap: 0.62rem;
  padding: 0;
  border: 0;
  background: transparent;
  box-shadow: none;
}

.panel-body-admin .admin-module-btn {
  min-height: 70px;
  border-radius: 1rem;
  border: 1px solid rgba(25, 82, 165, 0.2);
  background: linear-gradient(155deg, rgba(255, 255, 255, 0.96), rgba(233, 246, 255, 0.92));
  color: #184075;
  font-size: max(var(--ui-font-min), 0.9rem);
  font-weight: 800;
  box-shadow: 0 12px 20px rgba(15, 45, 91, 0.1);
  transition: transform 200ms ease, box-shadow 200ms ease, border-color 200ms ease, background 200ms ease;
}

.panel-body-admin .admin-module-btn:hover {
  transform: translateY(-3px);
  border-color: rgba(20, 72, 148, 0.44);
  box-shadow: 0 18px 28px rgba(15, 45, 91, 0.16);
  background: linear-gradient(155deg, rgba(255, 255, 255, 0.98), rgba(223, 241, 255, 0.95));
}

.panel-body-admin .admin-module-btn.is-active {
  border-color: rgba(16, 58, 129, 0.82);
  background: linear-gradient(140deg, #1a68df, #2f90ff 52%, #33b8ea);
  box-shadow: 0 20px 32px rgba(16, 67, 146, 0.32);
  color: #fff;
  transform: translateY(-2px);
}

.panel-body-admin .admin-module-section:not([hidden]) {
  width: 100%;
  min-width: 0;
  animation: adminSectionReveal 340ms ease;
}

.panel-body-admin .admin-module-section > .admin-panel-card {
  width: 100%;
  max-width: none;
  min-width: 0;
  margin-inline: 0;
}

.panel-body-admin .admin-panel-card {
  border-radius: 1.2rem;
  border: 1px solid rgba(25, 82, 165, 0.18);
  background:
    radial-gradient(circle at 96% 8%, rgba(13, 91, 255, 0.08), transparent 34%),
    linear-gradient(158deg, rgba(255, 255, 255, 0.98), rgba(237, 248, 255, 0.94));
  box-shadow: 0 18px 34px rgba(15, 45, 91, 0.12);
}

.panel-body-admin .admin-users-header-card {
  padding: 1.05rem;
}

.panel-body-admin .admin-panel-head h2,
.panel-body-admin .admin-panel-head h3,
.panel-body-admin .admin-users-group-head h3 {
  color: #153a6b;
}

.panel-body-admin .panel-lead {
  color: #456188;
}

.panel-body-admin .admin-users-toolbar {
  margin-bottom: 0.75rem;
}

.panel-body-admin .admin-search-input,
.panel-body-admin .admin-filter-select,
.panel-body-admin .admin-form input[type="text"],
.panel-body-admin .admin-form input[type="password"],
.panel-body-admin .admin-form input[type="number"],
.panel-body-admin .admin-form input[type="date"],
.panel-body-admin .admin-form select,
.panel-body-admin .sim-block input[type="text"],
.panel-body-admin .sim-block input[type="date"],
.panel-body-admin .sim-block input[type="search"],
.panel-body-admin .sim-block select {
  min-height: 46px;
  border-radius: 0.84rem;
  border-color: rgba(20, 76, 155, 0.3);
  background: linear-gradient(180deg, #fff, #f4f9ff);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.72);
}

.panel-body-admin .student-list-toolbar .admin-search-input,
.panel-body-admin .student-list-toolbar .admin-filter-select {
  min-height: 38px;
  border-radius: 0.68rem;
  padding-top: 0.48rem;
  padding-bottom: 0.48rem;
  font-size: max(var(--ui-font-min), 0.86rem);
}

.panel-body-admin .admin-search-input.is-filter-active,
.panel-body-admin .admin-filter-select.is-filter-active {
  border-color: rgba(13, 91, 255, 0.72);
  background: linear-gradient(180deg, #eef6ff, #ffffff);
  box-shadow: 0 0 0 2px rgba(13, 91, 255, 0.14), inset 3px 0 0 rgba(13, 91, 255, 0.62);
}

.panel-body-admin .admin-search-input:focus-visible,
.panel-body-admin .admin-filter-select:focus-visible,
.panel-body-admin .admin-form input[type="text"]:focus-visible,
.panel-body-admin .admin-form input[type="password"]:focus-visible,
.panel-body-admin .admin-form input[type="number"]:focus-visible,
.panel-body-admin .admin-form input[type="date"]:focus-visible,
.panel-body-admin .admin-form select:focus-visible,
.panel-body-admin .sim-block input[type="text"]:focus-visible,
.panel-body-admin .sim-block input[type="date"]:focus-visible,
.panel-body-admin .sim-block input[type="search"]:focus-visible,
.panel-body-admin .sim-block select:focus-visible {
  border-color: rgba(13, 91, 255, 0.74);
  box-shadow: 0 0 0 3px rgba(13, 91, 255, 0.16);
}

.panel-body-admin .btn-primary {
  border-color: rgba(18, 67, 140, 0.62);
  background: linear-gradient(135deg, #0d5bff, #2f8dff 55%, #2db4e8);
  box-shadow: 0 14px 24px rgba(15, 66, 146, 0.28);
}

.panel-body-admin .btn-primary:hover {
  box-shadow: 0 18px 30px rgba(15, 66, 146, 0.34);
}

.panel-body-admin .btn-secondary {
  border-color: rgba(20, 76, 155, 0.32);
  background: linear-gradient(145deg, #f7fbff, #e9f3ff);
  color: #1e4f89;
  box-shadow: 0 9px 16px rgba(15, 45, 91, 0.1);
}

.panel-body-admin .btn-secondary:hover {
  background: linear-gradient(145deg, #ffffff, #e3f0ff);
}

.panel-body-admin .btn-danger {
  border-color: rgba(170, 63, 63, 0.4);
  background: linear-gradient(145deg, #fff3f3, #ffe6e6);
  color: #a03232;
  box-shadow: 0 8px 15px rgba(148, 46, 46, 0.15);
}

.panel-body-admin .admin-users-scroll,
.panel-body-admin .sim-search-results,
.panel-body-admin .finance-debtors-scroll,
.panel-body-admin .finance-payments-list,
.panel-body-admin .student-notes-table-wrap,
.panel-body-admin .sim-results-wrap {
  border-radius: 1rem;
  border-color: rgba(21, 78, 168, 0.23);
  background: linear-gradient(165deg, rgba(255, 255, 255, 0.98), rgba(239, 248, 255, 0.9));
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.7);
}

.panel-body-admin .admin-user-row,
.panel-body-admin .sim-card-row,
.panel-body-admin .sim-search-item,
.panel-body-admin .finance-debtor-item,
.panel-body-admin .finance-payment-item,
.panel-body-admin .admin-virtual-item-card,
.panel-body-admin .sim-comment-item {
  border-radius: 0.9rem;
  border-color: rgba(21, 78, 168, 0.2);
  background: linear-gradient(148deg, rgba(255, 255, 255, 0.97), rgba(232, 244, 255, 0.88));
  box-shadow: 0 10px 16px rgba(15, 45, 91, 0.08);
}

.panel-body-admin .admin-user-row h3,
.panel-body-admin .sim-search-item strong,
.panel-body-admin .finance-debtor-item strong,
.panel-body-admin .finance-payment-main strong {
  color: #153a6b;
}

.panel-body-admin .admin-user-meta,
.panel-body-admin .sim-search-meta,
.panel-body-admin .finance-debtor-item p,
.panel-body-admin .finance-payment-main p,
.panel-body-admin .sim-comment-meta {
  color: #4a6388;
}

.panel-body-admin .finance-kpi-card,
.panel-body-admin .finance-summary-card,
.panel-body-admin .finance-modal-block,
.panel-body-admin .tools-block,
.panel-body-admin .sim-block,
.panel-body-admin .sim-comments-block,
.panel-body-admin .sim-top10-card,
.panel-body-admin .sim-chart-card {
  border-radius: 0.95rem;
  border-color: rgba(21, 78, 168, 0.2);
  background: linear-gradient(155deg, rgba(255, 255, 255, 0.98), rgba(236, 247, 255, 0.9));
}

.panel-body-admin .sim-results-table th,
.panel-body-admin .student-notes-table th,
.panel-body-admin .finance-report-card .student-notes-table th {
  background: linear-gradient(145deg, #dceeff, #e9f5ff);
  color: #12427b;
  border-bottom-color: rgba(21, 78, 168, 0.26);
}

.panel-body-admin .sim-results-table td,
.panel-body-admin .student-notes-table td,
.panel-body-admin .finance-report-card .student-notes-table td {
  border-bottom-color: rgba(21, 78, 168, 0.12);
}

.panel-body-admin .sim-results-table tbody tr:nth-child(even),
.panel-body-admin .student-notes-table tbody tr:nth-child(even),
.panel-body-admin .finance-report-card .student-notes-table tbody tr:nth-child(even) {
  background: rgba(236, 247, 255, 0.5);
}

.panel-body-admin .sim-results-table tbody tr:hover,
.panel-body-admin .student-notes-table tbody tr:hover,
.panel-body-admin .finance-report-card .student-notes-table tbody tr:hover {
  background: rgba(220, 239, 255, 0.66);
}

.panel-body-admin .admin-modal-card {
  border-radius: 1.1rem;
  border-color: rgba(21, 78, 168, 0.24);
  background:
    radial-gradient(circle at top right, rgba(13, 91, 255, 0.1), transparent 38%),
    linear-gradient(165deg, #fff, #f4faff);
  box-shadow: 0 24px 42px rgba(15, 45, 91, 0.24);
}

.panel-body-admin .admin-modal-head {
  margin-bottom: 0.7rem;
}

.panel-body-admin .admin-modal-head h2 {
  color: #153a6b;
}

.panel-body-admin .admin-modal-close {
  border-radius: 0.72rem;
  border: 1px solid rgba(21, 78, 168, 0.28);
  background: linear-gradient(145deg, #f7fbff, #e8f3ff);
  color: #1c4a7f;
}

.panel-body-admin .admin-modal-close:hover {
  background: linear-gradient(145deg, #ffffff, #ddecff);
}

.panel-body-admin .admin-floating-toast {
  border-radius: 0.95rem;
  border-color: rgba(20, 76, 155, 0.35);
  background: linear-gradient(145deg, #f7fbff, #e6f2ff);
  color: #1d4f8a;
}

.panel-body-admin .admin-confirm-card {
  border-radius: 1rem;
}

@keyframes adminAuraFloat {
  0%,
  100% {
    transform: translateY(0) translateX(0) scale(1);
  }
  50% {
    transform: translateY(16px) translateX(-11px) scale(1.06);
  }
}

@keyframes adminOverviewGlow {
  0%,
  100% {
    box-shadow:
      0 24px 42px rgba(15, 45, 91, 0.14),
      inset 0 1px 0 rgba(255, 255, 255, 0.8);
  }
  50% {
    box-shadow:
      0 30px 52px rgba(15, 45, 91, 0.2),
      inset 0 1px 0 rgba(255, 255, 255, 0.9);
  }
}

@keyframes adminSectionReveal {
  from {
    opacity: 0;
    transform: translateY(8px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

@media (max-width: 991.98px) {
  .panel-body-admin .panel-shell {
    width: min(100%, 920px);
  }

  .panel-body-admin .admin-year-banner {
    grid-template-columns: 1fr;
  }

  .panel-body-admin .admin-module-nav {
    display: flex;
    flex-wrap: nowrap;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: thin;
    padding-bottom: 0.2rem;
    scroll-snap-type: x mandatory;
  }

  .panel-body-admin .admin-module-btn {
    flex: 0 0 min(240px, 74vw);
    min-height: 64px;
    text-align: left;
    padding: 0.62rem 0.8rem;
    scroll-snap-align: start;
  }
}

@media (max-width: 720px) {
  .panel-body-admin .panel-topbar-inner {
    padding-inline: 0.9rem;
  }

  .panel-body-admin .panel-shell {
    padding: 0.9rem 0.86rem 1.45rem;
    gap: 0.82rem;
  }

  .panel-body-admin .admin-overview {
    border-radius: 1.05rem;
    padding: 0.82rem;
  }

  .panel-body-admin .admin-overview h1 {
    font-size: max(var(--ui-font-min), 1.45rem);
  }

  .panel-body-admin .admin-overview .panel-lead {
    font-size: max(var(--ui-font-min), 0.88rem);
  }

  .panel-body-admin .admin-module-btn {
    flex-basis: min(220px, 82vw);
    min-height: 58px;
    border-radius: 0.88rem;
    font-size: max(var(--ui-font-min), 0.84rem);
  }

  .panel-body-admin .admin-panel-card {
    border-radius: 0.98rem;
    padding: 0.78rem;
  }

  .panel-body-admin .admin-users-toolbar {
    gap: 0.5rem;
  }

  .panel-body-admin .btn-small,
  .panel-body-admin .btn-secondary,
  .panel-body-admin .btn-primary {
    min-height: 44px;
  }

  .panel-body-admin .admin-search-input,
  .panel-body-admin .admin-filter-select,
  .panel-body-admin .admin-form input[type="text"],
  .panel-body-admin .admin-form input[type="password"],
  .panel-body-admin .admin-form input[type="number"],
  .panel-body-admin .admin-form input[type="date"],
  .panel-body-admin .admin-form select {
    min-height: 44px;
    font-size: max(var(--ui-font-min), 0.94rem);
  }

  .panel-body-admin .admin-users-scroll,
  .panel-body-admin .sim-search-results,
  .panel-body-admin .finance-debtors-scroll,
  .panel-body-admin .finance-payments-list {
    border-radius: 0.86rem;
  }

  .panel-body-admin .admin-user-row,
  .panel-body-admin .sim-card-row,
  .panel-body-admin .sim-search-item,
  .panel-body-admin .finance-payment-item {
    border-radius: 0.76rem;
    padding: 0.58rem 0.62rem;
  }

  .panel-body-admin .admin-modal-layer {
    padding: 0.55rem;
  }

  .panel-body-admin .admin-modal-card {
    border-radius: 0.9rem;
    max-height: calc(100vh - 1.1rem);
    padding: 0.78rem 0.76rem;
  }

  .panel-body-admin .admin-modal-card.admin-modal-card-wide {
    width: 100%;
  }
}

@media (max-width: 440px) {
  .panel-body-admin .admin-module-btn {
    flex-basis: min(196px, 86vw);
  }

  .panel-body-admin .panel-menu {
    gap: 0.35rem;
  }
}

@media (prefers-reduced-motion: reduce) {
  .panel-body-admin::before,
  .panel-body-admin::after,
  .panel-body-admin .admin-overview,
  .panel-body-admin .admin-module-section:not([hidden]) {
    animation: none !important;
  }

  .panel-body-admin .admin-module-btn,
  .panel-body-admin .admin-panel-card,
  .panel-body-admin .btn-primary,
  .panel-body-admin .btn-secondary {
    transition: none !important;
  }
}

.panel-body-admin .admin-virtual-form textarea.admin-virtual-extra-json,
.panel-body-admin .admin-virtual-form #adminVirtualQuestionExtraData {
  width: 100%;
  min-height: 360px;
  border: 1px solid rgba(31, 79, 154, 0.35);
  border-radius: 0.85rem;
  background: linear-gradient(180deg, #ffffff 0%, #f8fbff 100%);
  padding: 0.72rem 0.78rem;
  font-family: "JetBrains Mono", "Fira Code", "Consolas", monospace;
  font-size: max(var(--ui-font-min), 0.84rem);
  line-height: 1.5;
  color: #17335c;
  resize: vertical;
  tab-size: 2;
  outline: none;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.85);
  transition: border-color 0.18s ease, box-shadow 0.18s ease, background-color 0.18s ease;
}

.panel-body-admin .admin-virtual-form textarea.admin-virtual-extra-json:focus-visible,
.panel-body-admin .admin-virtual-form #adminVirtualQuestionExtraData:focus-visible {
  border-color: rgba(26, 88, 191, 0.9);
  box-shadow: 0 0 0 3px rgba(31, 79, 154, 0.16), inset 0 1px 0 rgba(255, 255, 255, 0.92);
  background: #ffffff;
}

textarea#adminVirtualQuestionExtraData.admin-virtual-extra-json {
  display: block !important;
  width: 100% !important;
  min-height: 360px !important;
  border: 1px solid rgba(31, 79, 154, 0.38) !important;
  border-radius: 0.85rem !important;
  background: linear-gradient(180deg, #ffffff 0%, #f8fbff 100%) !important;
  padding: 0.72rem 0.78rem !important;
  font-family: "JetBrains Mono", "Fira Code", "Consolas", monospace !important;
  font-size: max(var(--ui-font-min), 0.84rem) !important;
  line-height: 1.5 !important;
  color: #17335c !important;
  resize: vertical !important;
  tab-size: 2 !important;
  outline: none !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.85), 0 10px 22px rgba(23, 54, 97, 0.08) !important;
}

textarea#adminVirtualQuestionExtraData.admin-virtual-extra-json:focus-visible {
  border-color: rgba(26, 88, 191, 0.9) !important;
  background: #ffffff !important;
  box-shadow: 0 0 0 3px rgba(31, 79, 154, 0.16), inset 0 1px 0 rgba(255, 255, 255, 0.92) !important;
}

@media (max-width: 640px) {
  .panel-body-admin .admin-virtual-form textarea.admin-virtual-extra-json,
  .panel-body-admin .admin-virtual-form #adminVirtualQuestionExtraData,
  textarea#adminVirtualQuestionExtraData.admin-virtual-extra-json {
    min-height: 260px !important;
  }
}