html[data-app-shell="true"] {
  --app-bg: #07131b;
  --app-bg-2: #0b2230;
  --app-card: linear-gradient(180deg, rgba(16, 33, 43, 0.94), rgba(9, 22, 30, 0.98));
  --app-line: rgba(137, 223, 208, 0.16);
  --app-text: #eef4ee;
  --app-text-soft: rgba(231, 240, 235, 0.72);
  --app-accent: #8fe2cf;
  --app-shadow: 0 18px 42px rgba(0, 0, 0, 0.28);
  --app-radius-lg: 22px;
  --app-page-pad: clamp(14px, 4vw, 24px);
}

html[data-app-shell="true"] body {
  background:
    radial-gradient(circle at top left, rgba(143, 226, 207, 0.12), transparent 34%),
    radial-gradient(circle at bottom right, rgba(240, 180, 91, 0.12), transparent 32%),
    linear-gradient(180deg, var(--app-bg-2), var(--app-bg));
  color: var(--app-text);
}

html[data-app-shell="true"] body::before {
  opacity: 0.08 !important;
  background-size: 84px 84px !important;
}

html[data-app-shell="true"] .app-shell-2,
html[data-app-shell="true"] .app-container,
html[data-app-shell="true"] .rfa2-shell {
  width: 100%;
  max-width: 100%;
  min-height: 100svh;
  padding: calc(var(--m-safe-top, 0px) + 10px) var(--app-page-pad) calc(var(--m-safe-bottom, 0px) + 86px);
  gap: 14px;
}

html[data-app-shell="true"] .entry-header,
html[data-app-shell="true"] .internal-topbar,
html[data-app-shell="true"] .classes-toolbar,
html[data-app-shell="true"] .topbar {
  position: sticky !important;
  top: 0 !important;
  z-index: 40;
  margin: 0 calc(var(--app-page-pad) * -1) 14px !important;
  padding: calc(var(--m-safe-top, 0px) + 10px) var(--app-page-pad) 12px !important;
  background: rgba(6, 16, 24, 0.84) !important;
  border: 0 !important;
  border-bottom: 1px solid var(--app-line) !important;
  box-shadow: none !important;
  backdrop-filter: blur(18px);
}

html[data-app-shell="true"] .hero-board,
html[data-app-shell="true"] .classes-hero,
html[data-app-shell="true"] .entry-form-card,
html[data-app-shell="true"] .entry-panel,
html[data-app-shell="true"] .panel-shell,
html[data-app-shell="true"] .content-section,
html[data-app-shell="true"] .classes-sections-nav,
html[data-app-shell="true"] .stats-strip,
html[data-app-shell="true"] .summary-card,
html[data-app-shell="true"] .signal-card,
html[data-app-shell="true"] .cta-card,
html[data-app-shell="true"] .workflow-link,
html[data-app-shell="true"] .quick-link,
html[data-app-shell="true"] .nav-item,
html[data-app-shell="true"] .stat-box {
  border-radius: var(--app-radius-lg) !important;
  border: 1px solid var(--app-line) !important;
  background: var(--app-card) !important;
  box-shadow: var(--app-shadow) !important;
}

html[data-app-shell="true"] .entry-grid,
html[data-app-shell="true"] .panel-grid,
html[data-app-shell="true"] .quick-grid,
html[data-app-shell="true"] .workflow-grid,
html[data-app-shell="true"] .summary-grid,
html[data-app-shell="true"] .cta-grid,
html[data-app-shell="true"] .signal-grid,
html[data-app-shell="true"] .classes-context-switch,
html[data-app-shell="true"] .classes-quick-grid,
html[data-app-shell="true"] .summary-stack,
html[data-app-shell="true"] .hero-inline-points,
html[data-app-shell="true"] .hero-points {
  display: grid !important;
  grid-template-columns: 1fr !important;
  gap: 12px !important;
}

html[data-app-shell="true"] .hero-board,
html[data-app-shell="true"] .classes-hero,
html[data-app-shell="true"] .entry-grid {
  display: grid !important;
  grid-template-columns: 1fr !important;
  gap: 14px !important;
}

html[data-app-shell="true"] .hero-primary,
html[data-app-shell="true"] .hero-secondary,
html[data-app-shell="true"] .classes-hero-copy,
html[data-app-shell="true"] .classes-hero-visuals {
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
}

html[data-app-shell="true"] .entry-list li,
html[data-app-shell="true"] .hero-inline-points li,
html[data-app-shell="true"] .hero-points li {
  min-height: 48px;
  padding: 12px 14px;
  border-radius: 16px;
  background: rgba(143, 226, 207, 0.08);
  border: 1px solid rgba(143, 226, 207, 0.1);
}

html[data-app-shell="true"] .entry-title {
  font-size: clamp(2.2rem, 11vw, 3.4rem) !important;
  line-height: 0.88 !important;
  max-width: 8ch;
}

html[data-app-shell="true"] .entry-form-title {
  font-size: clamp(1.45rem, 6vw, 2rem) !important;
}

html[data-app-shell="true"] .entry-form-card {
  gap: 14px;
}

html[data-app-shell="true"] .login-v2-page .entry-grid {
  min-height: calc(100svh - 120px);
  align-content: start;
}

html[data-app-shell="true"] .login-v2-page .entry-panel {
  display: none !important;
}

html[data-app-shell="true"] .login-v2-page .entry-form-panel {
  display: block;
}

html[data-app-shell="true"] .login-v2-page .entry-form-card {
  padding-top: 18px !important;
}

html[data-app-shell="true"] .student-register-v2-page .entry-panel {
  padding: 16px !important;
}

html[data-app-shell="true"] .topbar .nav-links,
html[data-app-shell="true"] .entry-panel .signal-grid,
html[data-app-shell="true"] .classes-toolbar__account,
html[data-app-shell="true"] .home-toolbar__account {
  display: none !important;
}

html[data-app-shell="true"] .btn,
html[data-app-shell="true"] .quick-link,
html[data-app-shell="true"] .workflow-link,
html[data-app-shell="true"] .cta-card,
html[data-app-shell="true"] .nav-item,
html[data-app-shell="true"] input,
html[data-app-shell="true"] select,
html[data-app-shell="true"] textarea {
  min-height: 52px;
  border-radius: 18px !important;
}

html[data-app-shell="true"] .btn-primary {
  background: linear-gradient(135deg, rgba(240, 180, 91, 0.96), rgba(205, 140, 58, 0.95)) !important;
  border-color: rgba(240, 180, 91, 0.26) !important;
  color: #1b1309 !important;
}

html[data-app-shell="true"] .btn-secondary,
html[data-app-shell="true"] .nav-item,
html[data-app-shell="true"] .panel-action-btn {
  background: rgba(143, 226, 207, 0.08) !important;
  border-color: rgba(143, 226, 207, 0.14) !important;
  color: var(--app-text) !important;
}

html[data-app-shell="true"] .stats-strip {
  padding: 12px !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
}

html[data-app-shell="true"] .panel-shell,
html[data-app-shell="true"] .content-section,
html[data-app-shell="true"] .classes-sections-nav,
html[data-app-shell="true"] .entry-form-card,
html[data-app-shell="true"] .entry-panel,
html[data-app-shell="true"] .hero-board,
html[data-app-shell="true"] .classes-hero {
  padding: 16px !important;
}

html[data-app-shell="true"] .mobile-drawer,
html[data-app-shell="true"] .home-mobile-menu,
html[data-app-shell="true"] .teacher-mobile-menu,
html[data-app-shell="true"] .sidebar {
  width: min(380px, calc(100vw - 18px)) !important;
  max-width: calc(100vw - 18px) !important;
  border-radius: 26px 26px 0 0 !important;
  border: 1px solid var(--app-line) !important;
  background: rgba(6, 18, 26, 0.96) !important;
  box-shadow: 0 -18px 48px rgba(0, 0, 0, 0.38) !important;
}

html[data-app-shell="true"] .rfa-project-page .topbar-inner,
html[data-app-shell="true"] .rfa-associates-page .topbar-inner,
html[data-app-shell="true"] .rfa-associates-network-page .topbar-inner {
  min-height: 0 !important;
  padding: 0 !important;
}

html[data-app-shell="true"] .rfa-project-page .brand-logo,
html[data-app-shell="true"] .rfa-associates-page .brand-logo,
html[data-app-shell="true"] .rfa-associates-network-page .brand-logo {
  height: 34px !important;
  width: auto !important;
  margin: 0 !important;
}

html[data-app-shell="true"] .rfa-project-page .topbar-actions,
html[data-app-shell="true"] .rfa-associates-page .topbar-actions,
html[data-app-shell="true"] .rfa-associates-network-page .topbar-actions {
  margin-left: auto;
}

html[data-app-shell="true"] .rfa-project-page .hero,
html[data-app-shell="true"] .rfa-associates-page .hero,
html[data-app-shell="true"] .rfa-associates-network-page .hero {
  padding: 0 !important;
}

html[data-app-shell="true"] .rfa-project-page .hero-grid {
  grid-template-columns: 1fr !important;
  gap: 16px !important;
}

html[data-app-shell="true"] .rfa-project-page .hero-copy {
  padding: 0 !important;
  gap: 14px !important;
}

html[data-app-shell="true"] .rfa-project-page .hero-copy::before {
  display: none !important;
}

html[data-app-shell="true"] .rfa-project-page .display-title {
  max-width: none !important;
  font-size: clamp(2.3rem, 10vw, 3.3rem) !important;
  line-height: 0.9 !important;
}

html[data-app-shell="true"] .rfa-project-page .btn-row,
html[data-app-shell="true"] .rfa-project-page .hero-metrics {
  display: grid !important;
  grid-template-columns: 1fr !important;
  gap: 10px !important;
}

html[data-app-shell="true"] .rfa-project-page .hero-metrics .stat-card {
  padding: 14px !important;
  background: rgba(143, 226, 207, 0.06) !important;
  border: 1px solid rgba(143, 226, 207, 0.1) !important;
  border-radius: 16px !important;
}

html[data-app-shell="true"] .rfa-project-page .executive-panel {
  padding: 18px !important;
  border: 1px solid var(--app-line) !important;
  border-radius: var(--app-radius-lg) !important;
  background: var(--app-card) !important;
  box-shadow: var(--app-shadow) !important;
}

html[data-app-shell="true"] .rfa-project-page .executive-panel::before {
  display: none !important;
}

html[data-app-shell="true"] .rfa-project-page .executive-reference-strip,
html[data-app-shell="true"] .rfa-project-page .executive-reference-board,
html[data-app-shell="true"] .rfa-project-page .executive-reference-band {
  display: grid !important;
  grid-template-columns: 1fr !important;
  gap: 12px !important;
}

@media (min-width: 821px) {
  html[data-app-shell="true"] .app-shell-2,
  html[data-app-shell="true"] .app-container,
  html[data-app-shell="true"] .rfa2-shell {
    max-width: 520px;
    margin: 0 auto;
    border-left: 1px solid rgba(143, 226, 207, 0.08);
    border-right: 1px solid rgba(143, 226, 207, 0.08);
  }
}