@media (max-width: 1023.98px) {
  .admin-ant-shell {
    display: block !important;
    min-height: 100vh !important;
  }

  .admin-ant-shell > .ant-layout {
    display: block !important;
    min-height: auto !important;
  }

  .admin-ant-shell .ant-layout-header,
  .admin-ant-app .ant-layout-header {
    position: relative !important;
    z-index: 30 !important;
    display: flex !important;
    height: 126px !important;
    min-height: 126px !important;
    flex-direction: column !important;
    line-height: normal !important;
    overflow: hidden !important;
    padding-block: 0 !important;
    padding-inline: 1rem !important;
  }

  .admin-ant-shell .ant-layout-header > .flex.h-full,
  .admin-ant-app .ant-layout-header > .flex.h-full {
    flex: 0 0 64px !important;
    height: 64px !important;
    min-height: 64px !important;
  }

  .admin-ant-shell .ant-layout-header > .-mx-4,
  .admin-ant-app .ant-layout-header > .-mx-4 {
    position: relative;
    z-index: 1;
    flex: 0 0 62px !important;
    height: 62px !important;
    margin-inline: -1rem !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    -webkit-overflow-scrolling: touch;
    background: var(--app-bg-secondary) !important;
    border-top: 1px solid var(--app-border) !important;
  }

  .admin-ant-shell .ant-layout-header .ant-menu-horizontal,
  .admin-ant-app .ant-layout-header .ant-menu-horizontal {
    min-width: max-content !important;
    line-height: 46px !important;
    border-bottom: 0 !important;
    white-space: nowrap;
  }

  .admin-ant-shell .ant-layout-header .ant-menu-horizontal > .ant-menu-item,
  .admin-ant-app .ant-layout-header .ant-menu-horizontal > .ant-menu-item {
    display: inline-flex !important;
    height: 46px !important;
    align-items: center !important;
    line-height: 46px !important;
  }

  .admin-ant-shell .ant-layout-content,
  .admin-ant-app .ant-layout-content {
    position: relative;
    z-index: 0;
    display: block !important;
    clear: both !important;
    overflow-x: hidden !important;
    padding-top: 1rem !important;
  }
}

body,
body::before {
  transition: none !important;
}

body::before {
  display: none !important;
}

body {
  background-image: none !important;
}

button[aria-label="Toggle Theme"] {
  display: inline-grid !important;
  width: 44px !important;
  height: 44px !important;
  min-width: 44px !important;
  min-height: 44px !important;
  place-items: center !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 0 !important;
  line-height: 0 !important;
}

button[aria-label="Toggle Theme"] > svg {
  display: block !important;
  width: 18px !important;
  height: 18px !important;
  margin: 0 !important;
  flex: 0 0 auto !important;
}

:root.theme-switching *,
:root.theme-switching *::before,
:root.theme-switching *::after {
  animation: none !important;
  transition-property: none !important;
  transition-duration: 0ms !important;
  transition-delay: 0ms !important;
  will-change: auto !important;
}

:root.theme-switching,
:root.theme-switching body {
  scroll-behavior: auto !important;
  transition: none !important;
}

:root.theme-switching .nav-glass-shell,
:root.theme-switching .nav-glass-shell-home,
:root.theme-switching .nav-brand-chip,
:root.theme-switching .nav-glass-rail,
:root.theme-switching .nav-user-chip,
:root.theme-switching .nav-icon-button,
:root.theme-switching .liquid-glass,
:root.theme-switching .liquid-glass-dark,
:root.theme-switching .admin-ant-app .ant-layout,
:root.theme-switching .admin-ant-app .ant-layout-sider,
:root.theme-switching .admin-ant-app .ant-layout-header,
:root.theme-switching .admin-ant-app .ant-card,
:root.theme-switching .admin-ant-app .ant-modal-content,
:root.theme-switching .admin-ant-app .ant-drawer-content,
:root.theme-switching .admin-ant-app .ant-table-wrapper {
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  box-shadow: none !important;
}

:root.theme-switching [class*="backdrop-"] {
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

:root.theme-switching [class*="shadow-"] {
  box-shadow: none !important;
}

:root.theme-switching [class*="drop-shadow"] {
  filter: none !important;
}

:root.home-route,
:root.home-route * {
  scroll-behavior: auto !important;
}

:root.home-route main *,
:root.home-route header * {
  will-change: auto !important;
}

:root.home-route main [style*="opacity"],
:root.home-route main [style*="transform"] {
  opacity: 1 !important;
  transform: none !important;
}

:root.home-route main [style*="will-change"] {
  will-change: auto !important;
}

:root.home-route .train-scene,
:root.home-route .train-scene-side,
:root.home-route .train-speed-lines,
:root.home-route .train-screen-lines,
:root.home-route .train-glass-sweep,
:root.home-route .train-glass-sweep::before,
:root.home-route .train-carriage-light {
  animation: none !important;
  will-change: auto !important;
}

:root.home-route .train-speed-lines,
:root.home-route .train-screen-lines,
:root.home-route .train-glass-sweep,
:root.home-route .train-carriage-light {
  display: none !important;
}

:root.home-route .liquid-glass,
:root.home-route .liquid-glass-dark,
:root.home-route .liquid-control,
:root.home-route .nav-glass-shell,
:root.home-route .nav-glass-shell-home,
:root.home-route .nav-brand-chip,
:root.home-route .nav-glass-rail,
:root.home-route .nav-user-chip,
:root.home-route .nav-icon-button {
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  transition-property: background-color, color, border-color, opacity !important;
  transition-duration: 60ms !important;
}

:root.home-route main [class*="backdrop-"],
:root.home-route header [class*="backdrop-"] {
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

:root.home-route main [class*="transition-"],
:root.home-route header [class*="transition-"] {
  transition-property: background-color, color, border-color, opacity !important;
  transition-duration: 50ms !important;
  transition-delay: 0ms !important;
}

:root.home-route main [class*="shadow-"],
:root.home-route header [class*="shadow-"] {
  box-shadow: none !important;
}

:root.home-route main [class*="drop-shadow"],
:root.home-route header [class*="drop-shadow"] {
  filter: none !important;
}

:root.home-route .learning-console,
:root.home-route .station-ticket,
:root.home-route .route-map > *,
:root.home-route .liquid-glass,
:root.home-route .liquid-glass-dark {
  box-shadow: none !important;
}

:root.home-route .station-ticket,
:root.home-route .route-map > *,
:root.home-route main section:not(:first-of-type) {
  content-visibility: auto;
  contain-intrinsic-size: 1px 560px;
}

:root.home-route .drop-shadow-\[0_2px_18px_rgba\(0\,0\,0\,0\.28\)\],
:root.home-route .drop-shadow-\[0_2px_0_rgba\(255\,255\,255\,0\.45\)\] {
  filter: none !important;
}

:root.dark.tutors-route body,
:root.dark.tutors-route main {
  background: #070b14 !important;
}

:root.dark.tutors-route .bg-\[\#F8FAFC\] {
  background:
    radial-gradient(circle at 18% 0%, rgba(79, 70, 229, 0.18), transparent 34%),
    radial-gradient(circle at 88% 14%, rgba(14, 165, 233, 0.11), transparent 30%),
    #070b14 !important;
  color: #e5edf7 !important;
}

:root.dark.tutors-route .bg-white\/60 {
  background-color: rgba(9, 15, 29, 0.86) !important;
}

:root.dark.tutors-route .bg-white\/40 {
  background-color: rgba(12, 18, 32, 0.72) !important;
}

:root.dark.tutors-route .bg-white,
:root.dark.tutors-route .hover\:bg-white\/40:hover {
  background-color: #111827 !important;
}

:root.dark.tutors-route .bg-slate-100,
:root.dark.tutors-route .prose-pre\:bg-slate-50 pre,
:root.dark.tutors-route .prose-code\:bg-indigo-50 code {
  background-color: #1f2937 !important;
}

:root.dark.tutors-route .prose pre {
  background-color: #111827 !important;
  border-color: rgba(148, 163, 184, 0.22) !important;
}

:root.dark.tutors-route .prose code:not(pre code) {
  background-color: rgba(99, 102, 241, 0.16) !important;
}

:root.dark.tutors-route .border-border-primary,
:root.dark.tutors-route .border-border-primary\/50,
:root.dark.tutors-route .border-border-primary\/60,
:root.dark.tutors-route .border-border-primary\/80 {
  border-color: rgba(148, 163, 184, 0.22) !important;
}

:root.dark.tutors-route .text-text-primary,
:root.dark.tutors-route .prose,
:root.dark.tutors-route .prose :where(p, li, strong, h1, h2, h3, h4) {
  color: #e5edf7 !important;
}

:root.dark.tutors-route .text-text-secondary,
:root.dark.tutors-route .prose :where(blockquote, figcaption),
:root.dark.tutors-route textarea::placeholder {
  color: #94a3b8 !important;
}

:root.dark.tutors-route .prose code {
  color: #a5b4fc !important;
}

:root.dark.tutors-route .prose pre,
:root.dark.tutors-route .prose pre code {
  color: #dbeafe !important;
}

:root.dark.tutors-route .shadow-sm,
:root.dark.tutors-route .shadow-xl,
:root.dark.tutors-route .shadow-2xl {
  box-shadow: 0 18px 52px rgba(0, 0, 0, 0.28) !important;
}

:root.dark.tutors-route .shadow-indigo-500\/5,
:root.dark.tutors-route .shadow-blue-900\/\[0\.03\],
:root.dark.tutors-route .shadow-slate-900\/10 {
  box-shadow: none !important;
}

:root.dark.tutors-route .custom-scrollbar::-webkit-scrollbar-thumb {
  background: rgba(148, 163, 184, 0.35) !important;
}

@media (max-width: 1023.98px) {
  .nav-glass-shell,
  .nav-glass-shell-home,
  .nav-brand-chip,
  .nav-glass-rail,
  .nav-user-chip,
  .nav-icon-button,
  .liquid-glass,
  .liquid-glass-dark,
  .admin-ant-app .ant-layout,
  .admin-ant-app .ant-layout-sider,
  .admin-ant-app .ant-layout-header,
  .admin-ant-app .ant-card,
  .admin-ant-app .ant-modal-content,
  .admin-ant-app .ant-drawer-content,
  .admin-ant-app .ant-table-wrapper {
    transition-property: background-color, border-color, color, opacity !important;
    transition-duration: 90ms !important;
  }
}

@media (max-width: 767.98px) {
  :root.home-route main [style*="opacity"],
  :root.home-route main [style*="transform"] {
    opacity: 1 !important;
    transform: none !important;
  }

  :root.home-route main * {
    scroll-behavior: auto !important;
  }

  body::before {
    display: none !important;
  }

  body {
    background-image: none !important;
  }

  .train-scene,
  .train-scene-side,
  .train-speed-lines,
  .train-screen-lines,
  .train-glass-sweep,
  .train-glass-sweep::before,
  .train-carriage-light {
    animation: none !important;
    will-change: auto !important;
  }

  .train-speed-lines,
  .train-screen-lines,
  .train-glass-sweep,
  .train-carriage-light {
    display: none !important;
  }

  .liquid-glass,
  .liquid-glass-dark,
  .liquid-control,
  .nav-glass-shell,
  .nav-glass-shell-home,
  .nav-brand-chip,
  .nav-glass-rail,
  .nav-user-chip,
  .nav-icon-button {
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
    transition-property: background-color, color, border-color, opacity !important;
    transition-duration: 80ms !important;
  }

  .liquid-glass,
  .liquid-control {
    background-color: rgba(255, 255, 255, 0.78) !important;
  }

  .liquid-glass-dark {
    background-color: rgba(10, 24, 22, 0.9) !important;
  }

  .learning-console,
  .station-ticket,
  .route-map > *,
  .liquid-glass,
  .liquid-glass-dark {
    box-shadow: none !important;
  }

  .station-ticket,
  .route-map > *,
  section > .mx-auto,
  section > div.mx-auto {
    content-visibility: auto;
    contain-intrinsic-size: 1px 520px;
  }

  .drop-shadow-\[0_2px_18px_rgba\(0\,0\,0\,0\.28\)\],
  .drop-shadow-\[0_2px_0_rgba\(255\,255\,255\,0\.45\)\] {
    filter: none !important;
  }
}

:root.home-route:not(.theme-switching) header.nav-glass-shell-home,
:root.home-route:not(.theme-switching) header .nav-glass-rail,
:root.home-route:not(.theme-switching) header .nav-brand-chip,
:root.home-route:not(.theme-switching) header .nav-user-chip,
:root.home-route:not(.theme-switching) header .nav-icon-button,
:root.home-route:not(.theme-switching) main .liquid-glass,
:root.home-route:not(.theme-switching) main .liquid-glass-dark,
:root.home-route:not(.theme-switching) main .liquid-control,
:root.home-route:not(.theme-switching) main .learning-console,
:root.home-route:not(.theme-switching) main .station-ticket,
:root.home-route:not(.theme-switching) main .route-map > *,
:root.home-route:not(.theme-switching) main [class*="backdrop-blur"],
:root.home-route:not(.theme-switching) footer[class*="backdrop-blur"] {
  backdrop-filter: blur(8px) saturate(1.08) !important;
  -webkit-backdrop-filter: blur(8px) saturate(1.08) !important;
  transition-property: background-color, border-color, color, opacity !important;
  transition-duration: 80ms !important;
}

:root.home-route:not(.theme-switching) header.nav-glass-shell-home {
  background:
    linear-gradient(180deg, rgba(15, 23, 42, 0.46), rgba(15, 23, 42, 0.24)),
    rgba(255, 255, 255, 0.08) !important;
  border-bottom: 1px solid rgba(255, 255, 255, 0.16) !important;
}

:root.home-route:not(.theme-switching) header .nav-glass-rail,
:root.home-route:not(.theme-switching) header .nav-brand-chip,
:root.home-route:not(.theme-switching) header .nav-user-chip,
:root.home-route:not(.theme-switching) header .nav-icon-button {
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.18), rgba(255, 255, 255, 0.07)),
    rgba(15, 23, 42, 0.18) !important;
  border: 1px solid rgba(255, 255, 255, 0.18) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.28),
    0 12px 34px rgba(2, 6, 23, 0.16) !important;
}

:root.home-route:not(.theme-switching) main .liquid-glass,
:root.home-route:not(.theme-switching) main .station-ticket,
:root.home-route:not(.theme-switching) main .route-map > *,
:root.home-route:not(.theme-switching) main [class*="bg-white/35"],
:root.home-route:not(.theme-switching) main [class*="bg-white/45"] {
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.76), rgba(255, 255, 255, 0.48)),
    rgba(255, 255, 255, 0.54) !important;
  border-color: rgba(255, 255, 255, 0.68) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.72),
    0 14px 38px rgba(15, 23, 42, 0.08) !important;
}

:root.home-route:not(.theme-switching) main .liquid-glass-dark,
:root.home-route:not(.theme-switching) main .learning-console {
  background:
    linear-gradient(135deg, rgba(20, 37, 34, 0.9), rgba(6, 18, 17, 0.76)),
    rgba(7, 17, 15, 0.78) !important;
  border-color: rgba(255, 255, 255, 0.16) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.18),
    0 22px 64px rgba(0, 0, 0, 0.28) !important;
}

:root.home-route:not(.theme-switching) main .liquid-control {
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.24), rgba(255, 255, 255, 0.1)),
    rgba(255, 255, 255, 0.12) !important;
  border: 1px solid rgba(255, 255, 255, 0.22) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.32) !important;
}

@media (max-width: 767.98px) {
  :root.home-route:not(.theme-switching) header.nav-glass-shell-home,
  :root.home-route:not(.theme-switching) header .nav-glass-rail,
  :root.home-route:not(.theme-switching) header .nav-brand-chip,
  :root.home-route:not(.theme-switching) header .nav-user-chip,
  :root.home-route:not(.theme-switching) header .nav-icon-button,
  :root.home-route:not(.theme-switching) main .liquid-glass,
  :root.home-route:not(.theme-switching) main .liquid-glass-dark,
  :root.home-route:not(.theme-switching) main .liquid-control,
  :root.home-route:not(.theme-switching) main .learning-console,
  :root.home-route:not(.theme-switching) main .station-ticket,
  :root.home-route:not(.theme-switching) main .route-map > *,
  :root.home-route:not(.theme-switching) main [class*="backdrop-blur"],
  :root.home-route:not(.theme-switching) footer[class*="backdrop-blur"] {
    backdrop-filter: blur(4px) saturate(1.03) !important;
    -webkit-backdrop-filter: blur(4px) saturate(1.03) !important;
    box-shadow:
      inset 0 1px 0 rgba(255, 255, 255, 0.42),
      0 10px 26px rgba(15, 23, 42, 0.06) !important;
  }
}

@media (hover: none) and (pointer: coarse) {
  .hover\:-translate-y-0\.5:hover,
  .hover\:-translate-y-1:hover,
  .group:hover,
  button:hover {
    transform: none !important;
  }
}

@media (max-width: 640px) {
  .admin-ant-shell .ant-layout-content,
  .admin-ant-app .ant-layout-content {
    padding: 1rem !important;
  }

  .admin-ant-app .ant-card,
  .admin-ant-app .rounded-2xl,
  .admin-ant-app .ant-space,
  .admin-ant-app .ant-btn {
    max-width: 100%;
  }
}

@media (max-width: 1023.98px) {
  .z-\[120\].lg\:hidden > .liquid-glass-dark {
    background:
      linear-gradient(180deg, rgba(17, 24, 39, 0.96), rgba(30, 41, 59, 0.94)) !important;
    border-left: 1px solid rgba(255, 255, 255, 0.16) !important;
    box-shadow: -28px 0 80px rgba(2, 6, 23, 0.34) !important;
    backdrop-filter: blur(22px) saturate(1.12) !important;
    -webkit-backdrop-filter: blur(22px) saturate(1.12) !important;
  }

  .z-\[120\].lg\:hidden > .liquid-glass-dark nav > button,
  .z-\[120\].lg\:hidden > .liquid-glass-dark .mt-auto > button {
    position: relative;
    background: rgba(255, 255, 255, 0.14) !important;
    color: rgba(255, 255, 255, 0.94) !important;
    text-shadow: 0 1px 1px rgba(2, 6, 23, 0.26);
  }

  .z-\[120\].lg\:hidden > .liquid-glass-dark nav > button.bg-white {
    background: #ffffff !important;
    color: #0f172a !important;
    text-shadow: none;
  }

  .z-\[120\].lg\:hidden > .liquid-glass-dark nav > button > svg,
  .z-\[120\].lg\:hidden > .liquid-glass-dark nav > button > span,
  .z-\[120\].lg\:hidden > .liquid-glass-dark .mt-auto > button > svg,
  .z-\[120\].lg\:hidden > .liquid-glass-dark .mt-auto > button > span {
    position: relative;
    z-index: 1;
    flex-shrink: 0;
  }

  .z-\[120\].lg\:hidden > .liquid-glass-dark .nav-icon-button.nav-on-dark {
    background: rgba(255, 255, 255, 0.16) !important;
    color: #ffffff !important;
  }
}

@media (min-width: 1024px) {
  .nav-glass-rail {
    max-width: min(64vw, 780px);
    overflow-x: auto;
    scrollbar-width: none;
  }

  .nav-glass-rail::-webkit-scrollbar {
    display: none;
  }

  .nav-glass-item {
    white-space: nowrap;
  }
}

@media (min-width: 1024px) and (max-width: 1180px) {
  .nav-glass-item {
    gap: 0.45rem !important;
    padding-left: 0.75rem !important;
    padding-right: 0.75rem !important;
    font-size: 0.78rem !important;
  }
}


:root.home-route:not(.theme-switching) main section:has(.learning-console) {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  content-visibility: visible !important;
  contain: none !important;
  contain-intrinsic-size: auto !important;
  padding-top: clamp(56px, 7vw, 92px) !important;
  padding-bottom: clamp(64px, 8vw, 108px) !important;
  background:
    linear-gradient(90deg, rgba(15, 23, 42, 0.052) 1px, transparent 1px),
    linear-gradient(180deg, rgba(15, 23, 42, 0.04) 1px, transparent 1px),
    linear-gradient(135deg, #f8fafc 0%, #eef5f2 48%, #f7f3eb 100%) !important;
  background-size: 56px 56px, 56px 56px, auto !important;
}

:root.home-route:not(.theme-switching) main section:has(.learning-console)::before {
  content: "";
  display: none;
  position: absolute;
  z-index: -1;
  top: clamp(72px, 9vw, 120px);
  left: max(24px, calc((100vw - 1360px) / 2));
  right: max(24px, calc((100vw - 1360px) / 2));
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(11, 25, 22, 0.22), rgba(37, 99, 235, 0.24), transparent);
}

:root.home-route:not(.theme-switching) main section:has(.learning-console) > div.mx-auto {
  max-width: 1360px !important;
  align-items: start !important;
  gap: clamp(28px, 3vw, 46px) !important;
}

@media (min-width: 1024px) {
  :root.home-route:not(.theme-switching) main section:has(.learning-console) > div.mx-auto {
    grid-template-columns: minmax(320px, 0.74fr) minmax(0, 1.42fr) !important;
  }
}

:root.home-route:not(.theme-switching) main .learning-console {
  position: relative !important;
  display: flex !important;
  min-height: clamp(580px, 31.7vw, 648px) !important;
  overflow: hidden !important;
  flex-direction: column !important;
  justify-content: flex-start !important;
  border: 1px solid rgba(217, 176, 111, 0.28) !important;
  border-radius: 30px !important;
  background:
    linear-gradient(135deg, rgba(217, 176, 111, 0.14), transparent 28%),
    linear-gradient(160deg, rgba(19, 42, 38, 0.98) 0%, rgba(8, 21, 19, 0.96) 52%, rgba(5, 13, 12, 0.98) 100%) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.15),
    inset 0 0 0 1px rgba(255, 255, 255, 0.05),
    0 26px 70px rgba(15, 23, 42, 0.18) !important;
}

:root.home-route:not(.theme-switching) main .learning-console::before {
  content: "";
  position: absolute;
  inset: 18px;
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 22px;
  pointer-events: none;
}

:root.home-route:not(.theme-switching) main .learning-console::after {
  content: "";
  position: absolute;
  inset: auto clamp(30px, 4vw, 54px) clamp(30px, 4vw, 54px) clamp(30px, 4vw, 54px) !important;
  height: 156px !important;
  pointer-events: none;
  opacity: 0.36;
  background:
    linear-gradient(90deg, transparent 0 18%, rgba(217, 176, 111, 0.72) 18% calc(18% + 1px), transparent calc(18% + 1px)),
    linear-gradient(90deg, transparent 0 58%, rgba(37, 99, 235, 0.58) 58% calc(58% + 1px), transparent calc(58% + 1px)),
    linear-gradient(180deg, transparent 0 68%, rgba(255, 255, 255, 0.18) 68% calc(68% + 1px), transparent calc(68% + 1px)),
    linear-gradient(135deg, transparent 0 48%, rgba(217, 176, 111, 0.58) 48.6% 49.4%, transparent 50% 100%);
  mask-image: linear-gradient(180deg, transparent 0%, #000 26%, #000 100%);
}

:root.home-route:not(.theme-switching) main .learning-console > * {
  position: relative;
  z-index: 1;
}

:root.home-route:not(.theme-switching) main .learning-console > div:first-child {
  align-items: flex-start !important;
  margin-bottom: clamp(28px, 4vw, 46px) !important;
}

:root.home-route:not(.theme-switching) main .learning-console > div:first-child > div:first-child {
  align-items: center !important;
}

:root.home-route:not(.theme-switching) main .learning-console > div:first-child .grid.h-11 {
  width: 48px !important;
  height: 48px !important;
  border-radius: 18px !important;
  background: #f8fafc !important;
  color: #0b1916 !important;
}

:root.home-route:not(.theme-switching) main .learning-console h2 {
  max-width: 9em;
  font-size: clamp(26px, 2.25vw, 34px) !important;
  line-height: 1.04 !important;
  letter-spacing: 0 !important;
}

:root.home-route:not(.theme-switching) main .learning-console p {
  max-width: 29em;
}

:root.home-route:not(.theme-switching) main .learning-console button {
  border: 1px solid rgba(244, 216, 161, 0.78) !important;
  background:
    linear-gradient(180deg, #efc979 0%, #d9a953 100%) !important;
  color: #081513 !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.48),
    0 18px 36px rgba(217, 169, 83, 0.24) !important;
}

:root.home-route:not(.theme-switching) main .learning-console .liquid-control {
  border-color: rgba(255, 255, 255, 0.16) !important;
  background: rgba(255, 255, 255, 0.12) !important;
  color: rgba(255, 255, 255, 0.74) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.16) !important;
}

:root.home-route:not(.theme-switching) main .learning-console + .min-w-0 {
  display: flex;
  min-width: 0;
  flex-direction: column;
}

:root.home-route:not(.theme-switching) main .learning-console + .min-w-0 > div:first-child {
  min-height: clamp(96px, 9vw, 126px);
  margin-bottom: clamp(20px, 2vw, 28px) !important;
  align-items: flex-start !important;
}

:root.home-route:not(.theme-switching) main .learning-console + .min-w-0 > div:first-child > div {
  padding-top: 2px;
}

:root.home-route:not(.theme-switching) main .learning-console + .min-w-0 > div:first-child p {
  margin-bottom: 10px !important;
  color: #9b6732 !important;
  letter-spacing: 0.22em !important;
}

:root.home-route:not(.theme-switching) main .learning-console + .min-w-0 h2 {
  max-width: 10em;
  font-size: clamp(42px, 4.6vw, 64px) !important;
  line-height: 0.98 !important;
  letter-spacing: 0 !important;
}

:root.home-route:not(.theme-switching) main .learning-console + .min-w-0 > div:first-child .liquid-control {
  margin-top: 14px;
  border: 1px solid rgba(11, 25, 22, 0.1) !important;
  background: rgba(255, 255, 255, 0.72) !important;
  color: #0b1916 !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.72),
    0 14px 30px rgba(15, 23, 42, 0.08) !important;
}

:root.home-route:not(.theme-switching) main .learning-console + .min-w-0 > div:last-child {
  flex: initial !important;
  gap: clamp(16px, 1.6vw, 22px) !important;
}

:root.home-route:not(.theme-switching) main .station-ticket {
  position: relative !important;
  content-visibility: visible !important;
  contain: none !important;
  contain-intrinsic-size: auto !important;
  grid-template-columns: 10px minmax(0, 1fr) !important;
  min-height: 190px !important;
  border: 1px solid rgba(148, 163, 184, 0.18) !important;
  border-radius: 28px !important;
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.96), rgba(248, 250, 252, 0.84)) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.94),
    0 20px 48px rgba(15, 23, 42, 0.1) !important;
}

@media (min-width: 768px) {
  :root.home-route:not(.theme-switching) main .station-ticket {
    height: 236px !important;
    min-height: 236px !important;
  }
}

:root.home-route:not(.theme-switching) main .station-ticket:hover {
  transform: translateY(-3px) !important;
  border-color: rgba(37, 99, 235, 0.22) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.94),
    0 26px 64px rgba(15, 23, 42, 0.14) !important;
}

:root.home-route:not(.theme-switching) main .station-ticket > div:first-child {
  width: 10px !important;
  background:
    linear-gradient(180deg, #0b1916 0%, #1d4ed8 48%, #d9a953 100%) !important;
}

:root.home-route:not(.theme-switching) main .station-ticket > div:last-child {
  display: flex !important;
  min-width: 0;
  flex-direction: column !important;
  padding: clamp(20px, 2.2vw, 28px) !important;
}

:root.home-route:not(.theme-switching) main .station-ticket > div:last-child > div:first-child {
  align-items: flex-start !important;
  margin-bottom: 18px !important;
}

:root.home-route:not(.theme-switching) main .station-ticket > div:last-child > div:first-child p {
  color: #8ca0bd !important;
  letter-spacing: 0.22em !important;
}

:root.home-route:not(.theme-switching) main .station-ticket h3 {
  margin-top: 10px !important;
  max-width: 15em;
  color: #030817 !important;
  font-size: clamp(21px, 1.65vw, 26px) !important;
  line-height: 1.12 !important;
  letter-spacing: 0 !important;
}

:root.home-route:not(.theme-switching) main .station-ticket > div:last-child > p {
  min-height: 44px;
  margin-bottom: 18px !important;
  color: #5f7189 !important;
  font-size: 14px !important;
  line-height: 1.62 !important;
}

:root.home-route:not(.theme-switching) main .station-ticket .grid.h-10 {
  width: 38px !important;
  height: 38px !important;
  border-radius: 15px !important;
  border-color: rgba(148, 163, 184, 0.22) !important;
  background: #ffffff !important;
  color: #0b1916 !important;
  box-shadow: 0 10px 22px rgba(15, 23, 42, 0.07) !important;
}

:root.home-route:not(.theme-switching) main .station-ticket > div:last-child > div:last-child {
  margin-top: auto !important;
  border-top-color: rgba(148, 163, 184, 0.26) !important;
}

:root.home-route:not(.theme-switching) main .station-ticket > div:last-child > div:last-child span:first-child {
  border: 1px solid rgba(11, 25, 22, 0.08);
  background: #f8fafc !important;
  color: #0b1916 !important;
}

:root.home-route:not(.theme-switching) main .station-ticket > div:last-child > div:last-child span:last-child {
  color: #8ca0bd !important;
}

@media (max-width: 1023.98px) {
  :root.home-route:not(.theme-switching) main section:has(.learning-console) > div.mx-auto {
    gap: 24px !important;
  }

  :root.home-route:not(.theme-switching) main .learning-console {
    min-height: 360px !important;
  }

  :root.home-route:not(.theme-switching) main .learning-console + .min-w-0 > div:first-child {
    min-height: auto;
  }
}

@media (max-width: 640px) {
  :root.home-route:not(.theme-switching) main section:has(.learning-console) {
    padding-top: 44px !important;
    padding-bottom: 56px !important;
    background-size: 40px 40px, 40px 40px, auto !important;
  }

  :root.home-route:not(.theme-switching) main .learning-console {
    min-height: 330px !important;
    border-radius: 24px !important;
    padding: 22px !important;
  }

  :root.home-route:not(.theme-switching) main .learning-console::before {
    inset: 12px;
    border-radius: 18px;
  }

  :root.home-route:not(.theme-switching) main .learning-console::after {
    right: 22px;
    bottom: 22px;
    left: 22px;
    height: 120px;
  }

  :root.home-route:not(.theme-switching) main .learning-console + .min-w-0 h2 {
    font-size: 36px !important;
  }

  :root.home-route:not(.theme-switching) main .learning-console + .min-w-0 > div:first-child {
    display: grid !important;
    gap: 16px !important;
  }

  :root.home-route:not(.theme-switching) main .learning-console + .min-w-0 > div:first-child .liquid-control {
    justify-self: start;
    margin-top: 0;
  }

  :root.home-route:not(.theme-switching) main .station-ticket {
    min-height: 172px !important;
    border-radius: 22px !important;
  }

  :root.home-route:not(.theme-switching) main .station-ticket > div:last-child {
    padding: 18px !important;
  }

  :root.home-route:not(.theme-switching) main .station-ticket h3 {
    font-size: 21px !important;
  }
}
