:root {
  --teal-900: #062E2B;
  --teal-800: #0B4743;
  --teal-700: #0E5F59;
  --teal-600: #137A72;
  --teal-500: #17968C;
  --cyan-400: #22C3B6;
  --cyan-100: #DFF7F4;
  --amber-100: #FDF1DE;
  --amber-600: #C9862B;
  --violet-100: #F1EAFB;
  --violet-600: #7C5CC4;
  --ink-900: #0E1C1B;
  --ink-600: #4A5B59;
  --ink-400: #7C8A88;
  --line: #E3ECEB;
  --bg: #F5FAF9;
  --card: #FFFFFF;

  --page: var(--bg);
  --surface: var(--card);
  --border: var(--line);
  --ink: var(--ink-900);
  --muted: var(--ink-600);
  --primary: var(--teal-600);
  --purple: var(--violet-600);
  --prisht-navy: var(--teal-900);
  --prisht-blue: var(--teal-600);
  --prisht-sky: var(--cyan-100);
  --prisht-ink: var(--ink-900);
  --edu-forest: var(--teal-700);
  --edu-forest-deep: var(--teal-900);
  --edu-emerald: var(--teal-600);
  --edu-emerald-bright: var(--cyan-400);
  --edu-mint: var(--cyan-100);
  --edu-mint-soft: var(--bg);
  --edu-warm: var(--amber-100);
  --edu-orange: var(--amber-600);
}

body { background: var(--bg); color: var(--ink-900); }

#appShell:not(.d-none) {
  background: var(--bg);
  color: var(--ink-900);
}

#appShell:not(.d-none) .sidebar,
#appShell.role-school-user:not(.d-none) .sidebar,
#appShell.role-student:not(.d-none) .sidebar {
  border-color: rgba(34,195,182,.16);
  background: linear-gradient(180deg,var(--teal-900) 0%,var(--teal-800) 100%);
  box-shadow: 7px 0 24px rgba(6,46,43,.12);
}

#appShell:not(.d-none) .sidebar-brand { color: #fff; }
#appShell:not(.d-none) .sidebar-brand img {
  padding: 4px;
  border-radius: 11px;
  background: #fff;
  mix-blend-mode: normal;
}
#appShell:not(.d-none) .sidebar-brand b { color: #fff; }
#appShell:not(.d-none) .sidebar-brand small { color: var(--cyan-400); }
#appShell:not(.d-none) .nav-section { color: rgba(223,247,244,.58); }
#appShell:not(.d-none) .side-link { color: rgba(255,255,255,.82); }
#appShell:not(.d-none) .side-link i { color: var(--cyan-400); }
#appShell:not(.d-none) .side-link:hover { background: rgba(34,195,182,.13); color: #fff; }
#appShell:not(.d-none) .side-link.active {
  background: var(--cyan-400);
  color: var(--teal-900);
  box-shadow: 0 7px 17px rgba(0,0,0,.13);
}
#appShell:not(.d-none) .side-link.active::before { background: #fff; }
#appShell:not(.d-none) .side-link.active i { background: rgba(255,255,255,.22); color: var(--teal-900); }
#appShell:not(.d-none) .sidebar-motto,
#appShell.role-school-user:not(.d-none) .sidebar-motto {
  border-color: rgba(34,195,182,.25);
  background: rgba(14,95,89,.72);
  color: #fff;
}
#appShell:not(.d-none) .sidebar-motto > i { background: var(--cyan-400); color: var(--teal-900); }
#appShell:not(.d-none) .sidebar-motto small { color: rgba(223,247,244,.72); }

#appShell:not(.d-none) .topbar {
  border-color: var(--line);
  background: rgba(255,255,255,.94);
}
#appShell:not(.d-none) .sidebar-toggle { background: var(--cyan-100); color: var(--teal-700); }
#appShell:not(.d-none) .sidebar-toggle:hover { background: #c9f0eb; color: var(--teal-900); }
#appShell:not(.d-none) .topbar-breadcrumb { color: var(--ink-400); }
#appShell:not(.d-none) .topbar-breadcrumb i { color: var(--cyan-400); }
#appShell:not(.d-none) .topbar-breadcrumb b { color: var(--teal-700); }
#appShell:not(.d-none) .topbar-search,
#appShell:not(.d-none) .profile-trigger { border-color: var(--line); background: var(--bg); }
#appShell:not(.d-none) .topbar-search,
#appShell:not(.d-none) .topbar-search input { color: var(--ink-600); }
#appShell:not(.d-none) .notification-button { color: var(--teal-700); }
#appShell:not(.d-none) .profile-avatar { background: linear-gradient(135deg,var(--teal-600),var(--cyan-400)); }
#appShell:not(.d-none) .profile-trigger-copy b { color: var(--teal-900); }
#appShell:not(.d-none) .profile-trigger-copy small { color: var(--ink-400); }

#appShell:not(.d-none) .page-content { background: var(--bg); }
.page-heading h2,
.panel h2,.panel h3,.panel h4,
.experience-card h2,.experience-card h3,
.school-dashboard h1,.student-dashboard-page h1 { color: var(--ink-900); }
.page-heading p,.panel p,.panel small { color: var(--ink-600); }
.panel,.stat,.chapter-card,.experience-card,.quick-access-card,
.table-card,.admin-table-card,.content-card {
  border-color: var(--line);
  background: var(--card);
}

.btn-primary,
.form-save-btn,
.asset-btn-primary,
.experience-hero-actions .primary,
.learning-start-card > .btn,
.student-dashboard-page .btn-primary {
  border-color: var(--teal-600) !important;
  background: var(--teal-600) !important;
  color: #fff !important;
  box-shadow: 0 7px 16px rgba(19,122,114,.2) !important;
}
.btn-primary:hover,
.form-save-btn:hover,
.asset-btn-primary:hover,
.experience-hero-actions .primary:hover,
.learning-start-card > .btn:hover {
  border-color: var(--teal-700) !important;
  background: var(--teal-700) !important;
}
.btn-outline-primary { border-color: var(--teal-500); color: var(--teal-700); }
.btn-outline-primary:hover { border-color: var(--teal-600); background: var(--teal-600); color: #fff; }
.badge-soft,.text-bg-primary { background: var(--cyan-100) !important; color: var(--teal-700) !important; }
a { color: var(--teal-600); }
a:hover { color: var(--teal-700); }

.form-control,.form-select,.input-group-text {
  border-color: var(--line);
  color: var(--ink-900);
}
.form-control:focus,.form-select:focus {
  border-color: var(--teal-500);
  box-shadow: 0 0 0 .2rem rgba(23,150,140,.13);
}
.form-label { color: var(--ink-600); }
.table { --bs-table-color: var(--ink-900); --bs-table-border-color: var(--line); }
.table thead th { color: var(--teal-700); background: var(--bg); }

.prisht-hero,
#appShell.role-school-user .school-dashboard .experience-hero.school,
.student-dashboard-page .student-dashboard-hero {
  border-color: rgba(23,150,140,.35);
}
.prisht-hero::after { background: linear-gradient(90deg,rgba(245,250,249,.99) 0%,rgba(223,247,244,.93) 37%,rgba(223,247,244,.2) 61%,transparent 76%); }
.prisht-hero h1,
.prisht-hero .experience-kicker,
#appShell.role-school-user .school-dashboard .experience-hero :is(h1,p),
.student-dashboard-page .student-dashboard-hero :is(h1,p,.student-dashboard-kicker) { color: var(--teal-900); }
.prisht-hero p { color: var(--ink-600); }
.prisht-hero .btn.primary,
#appShell.role-school-user .school-dashboard .experience-hero-actions .primary { background: var(--teal-600) !important; }
.prisht-hero .btn.secondary,
#appShell.role-school-user .school-dashboard .experience-hero-actions .secondary { color: var(--teal-700); }

.prisht-metrics .experience-metric.coral,
.school-metrics .experience-metric.blue,
.student-dashboard-metrics .experience-metric.blue { border-color: var(--teal-500); background: var(--cyan-100); }
.prisht-metrics .experience-metric.blue,
.school-metrics .experience-metric.violet,
.student-dashboard-metrics .experience-metric.violet { border-color: #d7cbed; background: var(--violet-100); }
.prisht-metrics .experience-metric.amber,
.school-metrics .experience-metric.amber,
.student-dashboard-metrics .experience-metric.amber { border-color: #ecd8b7; background: var(--amber-100); }
.prisht-metrics .experience-metric.green,
.school-metrics .experience-metric.green,
.student-dashboard-metrics .experience-metric.green { border-color: var(--teal-500); background: #edf9f7; }
.experience-metric strong,.experience-metric h3 { color: var(--ink-900) !important; }
.experience-metric p { color: var(--ink-600) !important; }
.experience-metric.blue > span,.experience-metric.coral > span { background: #c9efeb !important; color: var(--teal-700) !important; }
.experience-metric.violet > span { background: #e4d9f6 !important; color: var(--violet-600) !important; }
.experience-metric.amber > span { background: #f8e3c3 !important; color: var(--amber-600) !important; }
.experience-metric.green > span { background: var(--cyan-100) !important; color: var(--teal-600) !important; }

.prisht-action-grid .experience-card,
.school-dashboard .learning-start-card,
.school-dashboard .quick-access-card,
.student-dashboard-page .student-help-card { border-color: var(--line); background-color: var(--card); }
.workflow-steps strong,.quick-access-grid button,.quick-access-card h2 { color: var(--teal-700); }
.workflow-steps button:hover,.quick-access-grid button:hover { background: var(--bg); }
.quick-access-grid button i,.workflow-steps button > i { background: var(--cyan-100); color: var(--teal-600); }

#appShell:not(.d-none) .shared-content-view .learning-library-hero {
  border-color: var(--teal-500);
  background:
    linear-gradient(90deg,rgba(6,46,43,.98) 0%,rgba(11,71,67,.93) 43%,rgba(14,95,89,.2) 70%,transparent 100%),
    url("../images/content-library-hero.png") center/cover no-repeat;
}
#appShell:not(.d-none) .shared-content-view .learning-library-copy h1 span { color: var(--cyan-400); }
#appShell:not(.d-none) .shared-content-view .learning-library-stats span { border-color: rgba(34,195,182,.55); background: rgba(6,46,43,.52); }
#appShell:not(.d-none) .shared-content-view .hero-quick-chapters { border-color: var(--line); background: rgba(255,255,255,.93); }
#appShell:not(.d-none) .shared-content-view .hero-quick-heading h2,
#appShell:not(.d-none) .shared-content-view .library-browser-heading h2,
#appShell:not(.d-none) .shared-content-view .school-chapter-title h3 { color: var(--teal-700); }
#appShell:not(.d-none) .shared-content-view .hero-quick-heading > span { background: var(--amber-600); }
#appShell:not(.d-none) .shared-content-view .hero-quick-chapters .quick-chapter { border-color: var(--line); color: var(--teal-700); }
#appShell:not(.d-none) .shared-content-view .hero-quick-chapters .quick-chapter > i { background: var(--cyan-400); }
#appShell:not(.d-none) .shared-content-view .school-chapter-browser,
#appShell:not(.d-none) .shared-content-view .school-resource-card { border-color: var(--line); background: var(--card); }
#appShell:not(.d-none) .shared-content-view .library-browser-icon,
#appShell:not(.d-none) .shared-content-view .library-browser-badge { background: var(--cyan-100); color: var(--teal-700); }
#appShell:not(.d-none) .shared-content-view .content-filter-field:nth-child(1),
#appShell:not(.d-none) .shared-content-view .content-filter-field:nth-child(3) { border-color: #b7e6e0; background: var(--cyan-100); }
#appShell:not(.d-none) .shared-content-view .content-filter-field:nth-child(2) { border-color: #ead5b5; background: var(--amber-100); }
#appShell:not(.d-none) .shared-content-view .content-filter-field:focus-within { border-color: var(--teal-500); box-shadow: 0 0 0 3px rgba(23,150,140,.12); }
#appShell:not(.d-none) .shared-content-view .shared-flipbook-action { background: var(--teal-600); box-shadow: 0 5px 13px rgba(19,122,114,.2); }
#appShell:not(.d-none) .shared-content-view .school-resource-tabs button.active { border-color: var(--teal-500); background: var(--cyan-100); color: var(--teal-700); }
#appShell:not(.d-none) .shared-content-view .school-resource-tabs button.active span { background: var(--cyan-400); color: var(--teal-900); }
#appShell:not(.d-none) .shared-content-view .school-resource-card:hover { border-color: var(--teal-500); box-shadow: 0 8px 20px rgba(19,122,114,.1); }

.modal-content,.dropdown-menu,.profile-menu { border-color: var(--line); background: var(--card); color: var(--ink-900); }
.modal-header,.modal-footer,.profile-menu-context { border-color: var(--line); }
.form-modal-icon,.editor-panel-heading > span { background: var(--cyan-100); color: var(--teal-700); }
.flipbook-header { border-color: var(--line); background: var(--card); }
.round-action.exercise,.page-hotspot.EXERCISE,.editor-hotspot.EXERCISE { background: var(--teal-600); }
.round-action.ar,.page-hotspot.AR,.editor-hotspot.AR { background: var(--violet-600); }

/* Login uses the same teal/cyan design tokens. */
.login-screen {
  color: var(--ink-900);
  background:
    linear-gradient(90deg,rgba(245,250,249,.97) 0%,rgba(223,247,244,.86) 27%,rgba(223,247,244,.04) 53%,rgba(245,250,249,.2) 100%),
    url("../images/prisht-login-classroom-v2.png") center/cover no-repeat;
}
.login-screen::before { background: rgba(223,247,244,.7); }
.login-screen::after { background: rgba(241,234,251,.62); }
.dn-brand-word,.dn-panel-head h1 { color: var(--teal-900); }
.dn-brand-sub,.dn-panel-head p { color: var(--ink-600); }
.dn-panel-head h1 span,.login-intro h2 span { color: var(--teal-600); }
.dn-panel-head h1 span::after,.dn-top-handwriting::after,.dn-login-card-art span::after,.dn-panel-foot p::after { border-color: var(--amber-600); background: var(--amber-600); }
.dn-top-handwriting { color: var(--teal-700); }
.dn-board-handwriting::after { border-color: var(--cyan-400); }
.dn-floating-benefits span { color: var(--ink-900); }
.dn-floating-benefits span:nth-child(1) i { color: var(--amber-600); }
.dn-floating-benefits span:nth-child(2) i { color: var(--teal-500); }
.dn-floating-benefits span:nth-child(3) i { color: var(--teal-600); }
.dn-chip { border-color: var(--line); color: var(--ink-900); }
.dn-chip:nth-child(1) i,.dn-chip:nth-child(2) i { background: var(--cyan-100); color: var(--teal-600); }
.dn-chip:nth-child(3) i { background: var(--amber-100); color: var(--amber-600); }
.dn-chip:nth-child(4) i { background: var(--violet-100); color: var(--violet-600); }
.dn-audiences span { color: var(--ink-900); }
.dn-audiences small,.dn-panel-foot p,.dn-login-card-art { color: var(--ink-600); }
.dn-audiences span:nth-child(1) i { color: var(--amber-600); }
.dn-audiences span:nth-child(2) i { color: var(--teal-500); }
.dn-audiences span:nth-child(3) i { color: var(--teal-600); }
.dn-form-side { border-color: rgba(227,236,235,.92); background: rgba(255,255,255,.94); box-shadow: 0 20px 50px rgba(6,46,43,.16); }
.dn-eyebrow { background: var(--cyan-100); color: var(--teal-700); }
.dn-form-side h2,.dn-form-side label { color: var(--ink-900); }
.dn-lede,.dn-create-link { color: var(--ink-600); }
.dn-input-wrap input,.dn-form-side #studentRegisterForm .form-control,.dn-form-side #studentRegisterForm .form-select { border-color: var(--line); color: var(--ink-900); }
.dn-input-wrap input:focus,.dn-form-side #studentRegisterForm .form-control:focus,.dn-form-side #studentRegisterForm .form-select:focus { border-color: var(--teal-500); box-shadow: 0 0 0 4px rgba(23,150,140,.12); }
.dn-input-icon,.dn-password-toggle { color: var(--teal-700); }
.dn-forgot-row a,.dn-create-link button,.dn-back-link { color: var(--teal-600); }
.dn-submit { background: linear-gradient(100deg,var(--teal-700),var(--teal-600),var(--cyan-400)); box-shadow: 0 14px 25px -13px rgba(19,122,114,.55); }
.dn-submit:hover { background: linear-gradient(100deg,var(--teal-900),var(--teal-700),var(--teal-500)); }
.dn-create-link { border-color: var(--line); }

body.theme-dark {
  --bg: #062E2B;
  --card: #0B4743;
  --line: rgba(223,247,244,.16);
  --ink-900: #F5FAF9;
  --ink-600: #C2D7D4;
  --ink-400: #8FB0AC;
}
body.theme-dark #appShell:not(.d-none),body.theme-dark #appShell:not(.d-none) .page-content { background: var(--bg); }
body.theme-dark #appShell:not(.d-none) .topbar,
body.theme-dark .panel,body.theme-dark .experience-card,body.theme-dark .quick-access-card,
body.theme-dark .modal-content,body.theme-dark .dropdown-menu { background: var(--card); border-color: var(--line); }
body.theme-dark :is(.page-heading h2,.panel h2,.panel h3,.panel h4,.experience-card h2,.experience-card h3) { color: var(--ink-900); }

@media (max-width:760px) {
  #appShell:not(.d-none) .sidebar,
  #appShell.role-school-user:not(.d-none) .sidebar,
  #appShell.role-student:not(.d-none) .sidebar { background: linear-gradient(180deg,var(--teal-900),var(--teal-800)); }
}

/* School and student dashboard refinement */
#appShell.role-school-user:not(.d-none) .topbar-search,
#appShell.role-school-user:not(.d-none) .notification-button,
#appShell.role-student:not(.d-none) .topbar-search,
#appShell.role-student:not(.d-none) .notification-button { display: none; }

#appShell.role-school-user:not(.d-none) .topbar,
#appShell.role-student:not(.d-none) .topbar {
  grid-template-columns: minmax(0,1fr) auto;
}

#appShell.role-school-user:not(.d-none) .topbar-actions,
#appShell.role-student:not(.d-none) .topbar-actions { grid-column: 2; gap: 0; }

#appShell.role-school-user .school-dashboard,
#appShell.role-student .student-dashboard-page {
  width: min(100%,1240px);
  margin-inline: auto;
}

#appShell.role-school-user .school-dashboard > .experience-metric-grid,
#appShell.role-student .student-dashboard-metrics {
  grid-template-columns: repeat(4,minmax(190px,1fr));
  gap: 12px;
  margin-block: 12px;
}

#appShell.role-school-user .school-dashboard > .experience-metric-grid .experience-metric,
#appShell.role-student .student-dashboard-metrics .student-metric {
  position: relative;
  isolation: isolate;
  min-height: 108px;
  display: grid;
  grid-template-columns: 48px minmax(0,1fr) 32px;
  align-items: center;
  gap: 12px;
  padding: 16px 14px;
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 17px;
  background: linear-gradient(135deg,#fff 0%,var(--cyan-100) 155%);
  box-shadow: 0 8px 20px rgba(6,46,43,.07);
  transition: transform .18s ease,box-shadow .18s ease,border-color .18s ease;
}

#appShell.role-school-user .school-dashboard > .experience-metric-grid .experience-metric:hover,
#appShell.role-student .student-dashboard-metrics .student-metric:hover {
  z-index: 2;
  border-color: rgba(23,150,140,.45);
  box-shadow: 0 12px 25px rgba(6,46,43,.11);
  transform: translateY(-2px);
}

#appShell.role-school-user .school-dashboard > .experience-metric-grid .experience-metric::before,
#appShell.role-student .student-dashboard-metrics .student-metric::before {
  content: "";
  position: absolute;
  inset: 0 auto 0 0;
  z-index: -1;
  width: 5px;
  height: auto;
  display: block !important;
  border-radius: 0 5px 5px 0;
  background: var(--teal-500);
}

#appShell.role-school-user .school-dashboard > .experience-metric-grid .experience-metric::after,
#appShell.role-student .student-dashboard-metrics .student-metric::after {
  content: "";
  position: absolute;
  z-index: -1;
  right: -32px;
  bottom: -49px;
  width: 112px;
  height: 112px;
  border: 19px solid rgba(34,195,182,.08);
  border-radius: 50%;
}

#appShell.role-school-user .school-dashboard > .experience-metric-grid .experience-metric > span,
#appShell.role-student .student-dashboard-metrics .student-metric > span {
  width: 48px;
  height: 48px;
  display: grid;
  place-items: center;
  margin: 0;
  border-radius: 14px;
  background: var(--cyan-100) !important;
  color: var(--teal-700) !important;
  font-size: 21px;
  box-shadow: inset 0 0 0 1px rgba(23,150,140,.08);
}

#appShell.role-school-user .school-dashboard > .experience-metric-grid .experience-metric > div,
#appShell.role-student .student-dashboard-metrics .student-metric > div { min-width: 0; }

#appShell.role-school-user .school-dashboard > .experience-metric-grid strong,
#appShell.role-student .student-dashboard-metrics .student-metric strong {
  display: block;
  margin: 0 0 3px;
  color: var(--ink-900) !important;
  font-size: 27px;
  font-weight: 950;
  line-height: 1;
}

#appShell.role-school-user .school-dashboard > .experience-metric-grid h3,
#appShell.role-student .student-dashboard-metrics .student-metric h3 {
  display: block;
  margin: 0;
  overflow: hidden;
  color: var(--teal-700) !important;
  font-size: 11px;
  font-weight: 900;
  line-height: 1.25;
  text-overflow: ellipsis;
  white-space: nowrap;
}

#appShell.role-school-user .school-dashboard > .experience-metric-grid p,
#appShell.role-student .student-dashboard-metrics .student-metric p {
  width: fit-content;
  max-width: 100%;
  margin: 7px 0 0;
  padding: 3px 7px;
  overflow: hidden;
  border-radius: 999px;
  background: rgba(255,255,255,.72);
  color: var(--ink-600) !important;
  font-size: 8px;
  line-height: 1.2;
  text-overflow: ellipsis;
  white-space: nowrap;
}

#appShell.role-school-user .metric-role-arrow,
#appShell.role-student .metric-card-action {
  position: relative;
  inset: auto;
  z-index: 2;
  width: 32px;
  height: 32px;
  display: grid !important;
  place-items: center;
  padding: 0;
  border: 1px solid rgba(23,150,140,.16);
  border-radius: 10px;
  background: rgba(255,255,255,.88);
  color: var(--teal-700) !important;
  font-size: 13px;
  justify-self: end;
  box-shadow: 0 4px 10px rgba(6,46,43,.07);
}

#appShell.role-school-user .metric-role-arrow:hover,
#appShell.role-student .metric-card-action:hover { background: var(--teal-600); color: #fff !important; }

#appShell.role-school-user .school-dashboard > .experience-metric-grid .violet,
#appShell.role-student .student-dashboard-metrics .violet {
  background: linear-gradient(135deg,#fff 0%,var(--violet-100) 130%);
}
#appShell.role-school-user .school-dashboard > .experience-metric-grid .violet::before,
#appShell.role-student .student-dashboard-metrics .violet::before { background: var(--violet-600); }
#appShell.role-school-user .school-dashboard > .experience-metric-grid .violet > span,
#appShell.role-student .student-dashboard-metrics .violet > span { background: var(--violet-100) !important; color: var(--violet-600) !important; }

#appShell.role-school-user .school-dashboard > .experience-metric-grid .amber,
#appShell.role-student .student-dashboard-metrics .rose {
  background: linear-gradient(135deg,#fff 0%,var(--amber-100) 130%);
}
#appShell.role-school-user .school-dashboard > .experience-metric-grid .amber::before,
#appShell.role-student .student-dashboard-metrics .rose::before { background: var(--amber-600); }
#appShell.role-school-user .school-dashboard > .experience-metric-grid .amber > span,
#appShell.role-student .student-dashboard-metrics .rose > span { background: var(--amber-100) !important; color: var(--amber-600) !important; }

#appShell.role-school-user .school-dashboard > .experience-metric-grid .green,
#appShell.role-student .student-dashboard-metrics .green { background: linear-gradient(135deg,#fff 0%,var(--cyan-100) 120%); }
#appShell.role-school-user .school-dashboard > .experience-metric-grid .green::before,
#appShell.role-student .student-dashboard-metrics .green::before { background: var(--cyan-400); }

@media (max-width:1050px) {
  #appShell.role-school-user .school-dashboard > .experience-metric-grid,
  #appShell.role-student .student-dashboard-metrics { grid-template-columns: repeat(2,minmax(0,1fr)); }
}

@media (max-width:560px) {
  #appShell.role-school-user .school-dashboard > .experience-metric-grid,
  #appShell.role-student .student-dashboard-metrics { grid-template-columns: 1fr; }
  #appShell.role-school-user .school-dashboard > .experience-metric-grid .experience-metric,
  #appShell.role-student .student-dashboard-metrics .student-metric { min-height: 98px; }
}