/* QPal dashboard two-surface background.
   Presentation only: the branded upper surface ends after the existing main
   Study/Exam/Flashcards card; the normal theme background continues below. */

:root {
  --qpal-dashboard-upper-surface:
    linear-gradient(145deg, #ee7438 0%, #d65a20 48%, #b94308 100%);
  --qpal-dashboard-upper-surface-shadow:
    0 18px 42px rgba(116, 45, 12, 0.16);
  --qpal-dashboard-upper-surface-radius: 30px;
}

html.dark-mode {
  --qpal-dashboard-upper-surface:
    linear-gradient(145deg, #9b4322 0%, #74321b 52%, #542417 100%);
  --qpal-dashboard-upper-surface-shadow:
    0 20px 48px rgba(0, 0, 0, 0.24);
}

.app-workspace {
  position: relative;
  isolation: isolate;
}

.qpal-dashboard-upper-surface {
  position: absolute;
  z-index: -1;
  left: 50%;
  top: var(--qpal-dashboard-upper-top, 0px);
  width: 100vw;
  height: var(--qpal-dashboard-upper-height, 0px);
  max-width: none;
  box-sizing: border-box;
  transform: translateX(-50%);
  pointer-events: none;
  border-radius:
    0 0
    var(--qpal-dashboard-upper-surface-radius)
    var(--qpal-dashboard-upper-surface-radius);
  background: var(--qpal-dashboard-upper-surface);
  box-shadow: var(--qpal-dashboard-upper-surface-shadow);
}

.qpal-dashboard-upper-surface[hidden],
body.qpal-session-active .qpal-dashboard-upper-surface {
  display: none !important;
}

@media (max-width: 620px) {
  :root {
    --qpal-dashboard-upper-surface-radius: 24px;
  }
}