:root {
  --inner-world-void: #07020f;
  --inner-world-panel: rgba(15, 7, 31, .9);
  --inner-world-panel-deep: rgba(7, 2, 15, .94);
  --inner-world-line: rgba(192, 132, 252, .34);
  --inner-world-cyan: #67e8f9;
}

body.inner-page {
  --inner-world-image: none;
  --inner-world-position: center;
  position: relative;
  min-height: 100vh;
  background: var(--inner-world-void);
  isolation: isolate;
}

body.inner-page--ruins {
  --inner-world-image: url("/assets/voidex-optimized/inner-lunar-ruins-v2.webp");
  --inner-world-position: center center;
}

body.inner-page--archive {
  --inner-world-image: url("/assets/voidex-optimized/inner-archive-keep-v6.webp");
  --inner-world-position: center center;
}

body.inner-page--forest {
  --inner-world-image: url("/assets/voidex-optimized/inner-whisperwood-v2.webp");
  --inner-world-position: center center;
}

body.inner-page::before {
  content: "";
  position: fixed;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  opacity: 1;
  background:
    linear-gradient(90deg, rgba(7, 2, 15, .94) 0%, rgba(7, 2, 15, .78) 36%, rgba(7, 2, 15, .32) 72%, rgba(7, 2, 15, .48) 100%),
    linear-gradient(180deg, rgba(7, 2, 15, .3) 0%, rgba(7, 2, 15, .08) 46%, rgba(7, 2, 15, .72) 100%),
    repeating-linear-gradient(180deg, rgba(255, 255, 255, .018) 0 1px, rgba(0, 0, 0, .04) 1px 3px),
    var(--inner-world-image) var(--inner-world-position) / cover no-repeat;
  mix-blend-mode: normal;
}

body.inner-page::after {
  content: attr(data-world-location);
  position: fixed;
  top: 50%;
  right: 14px;
  z-index: 12;
  padding: 12px 7px;
  border: 1px solid rgba(192, 132, 252, .28);
  color: rgba(244, 240, 255, .62);
  background: rgba(7, 2, 15, .68);
  font: 800 10px/1.2 ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  letter-spacing: .18em;
  text-transform: uppercase;
  writing-mode: vertical-rl;
  transform: translateY(-50%);
  pointer-events: none;
}

.inner-page > main,
.inner-page > .site-footer {
  position: relative;
  z-index: 1;
}

.inner-page > .topbar {
  position: relative;
  z-index: 70;
  border-bottom-color: rgba(192, 132, 252, .28);
  background: rgba(7, 2, 15, .78);
  box-shadow: 0 12px 34px rgba(0, 0, 0, .28);
}

.inner-page > main {
  min-height: calc(100vh - 174px);
}

.inner-page > main > h1,
.inner-page .page-head h1,
.inner-page .voidex-hero h1 {
  max-width: 880px;
  text-transform: uppercase;
  text-wrap: balance;
  letter-spacing: -.045em;
  text-shadow: 0 4px 0 rgba(54, 20, 96, .44), 0 0 30px rgba(168, 85, 247, .2);
}

.inner-page > main > .badge:first-child,
.inner-page .page-head .badge:first-child,
.inner-page .auth-card > .badge:first-child {
  border-radius: 2px;
  border-color: rgba(103, 232, 249, .32);
  color: var(--inner-world-cyan);
  background: rgba(8, 47, 73, .22);
  font-family: var(--font-tech, "Space Mono", ui-monospace, SFMono-Regular, Menlo, Consolas, monospace);
  letter-spacing: .12em;
  text-transform: uppercase;
}

.inner-page :where(
  .panel,
  .card,
  .auth-card,
  .dashboard-main,
  .discount-panel,
  .tariff-panel,
  .session-management-panel,
  .lectures-panel,
  .lecture-progress,
  .lecture-item,
  .lecture-form,
  .download-card,
  .connect-card,
  .seo-content
) {
  border-color: var(--inner-world-line);
  background:
    linear-gradient(135deg, rgba(126, 34, 206, .07), transparent 46%),
    linear-gradient(180deg, var(--inner-world-panel), var(--inner-world-panel-deep));
  box-shadow: 0 22px 48px rgba(0, 0, 0, .38), inset 0 1px 0 rgba(255, 255, 255, .025);
}

.inner-page :where(.auth-card, .price-card, .download-card, .connect-card) {
  border-radius: 2px;
  clip-path: polygon(0 0, calc(100% - 14px) 0, 100% 14px, 100% 100%, 14px 100%, 0 calc(100% - 14px));
}

.inner-page .btn,
.inner-page .navlinks a,
.inner-page input,
.inner-page select,
.inner-page textarea {
  border-radius: 2px;
}

.inner-page input,
.inner-page select,
.inner-page textarea {
  border-color: rgba(192, 132, 252, .34);
  background-color: rgba(7, 2, 15, .78);
}

.inner-page input:focus,
.inner-page select:focus,
.inner-page textarea:focus {
  outline: 2px solid rgba(103, 232, 249, .68);
  outline-offset: 2px;
  border-color: var(--inner-world-cyan);
  box-shadow: 0 0 24px rgba(103, 232, 249, .1);
}

.inner-page .site-footer {
  border-top-color: rgba(192, 132, 252, .22);
  background: rgba(7, 2, 15, .82);
}

.inner-page--auth .auth-wrap {
  min-height: calc(100svh - 136px);
  place-items: center start;
}

.inner-page--auth .auth-card {
  margin-left: clamp(0px, 5vw, 68px);
  background:
    radial-gradient(circle at 90% 8%, rgba(168, 85, 247, .13), transparent 120px),
    linear-gradient(180deg, rgba(20, 9, 42, .94), rgba(7, 2, 15, .96));
}

.inner-page--archive .lecture-map-sidebar,
.inner-page--archive .lecture-map-main,
.inner-page--archive .lecture-node-detail {
  background:
    radial-gradient(circle at 50% 0%, rgba(124, 58, 237, .16), transparent 220px),
    linear-gradient(180deg, rgba(16, 7, 34, .9), rgba(7, 2, 15, .94));
}

@media (max-width: 1100px) {
  body.inner-page::after { display: none; }
}

@media (max-width: 820px) {
  body.inner-page::before {
    background:
      linear-gradient(180deg, rgba(7, 2, 15, .68) 0%, rgba(7, 2, 15, .42) 30%, rgba(7, 2, 15, .82) 100%),
      linear-gradient(90deg, rgba(7, 2, 15, .72), rgba(7, 2, 15, .38)),
      repeating-linear-gradient(180deg, rgba(255, 255, 255, .014) 0 1px, rgba(0, 0, 0, .035) 1px 3px),
      var(--inner-world-image) 68% center / cover no-repeat;
  }

  .inner-page--auth .auth-wrap { place-items: center; }
  .inner-page--auth .auth-card { margin-left: 0; }
}

@media (prefers-reduced-motion: reduce) {
  body.inner-page::before { background-attachment: scroll; }
}