/* Folio WALL — shared site chrome.
   Stealable home plate: [data-csl-plate="superfractor-csl"]
   Do not import this into cinema. Do not restyle .card / .team-card / .cinema-*. */

.folio-page {
  --folio-sky: #0b1e44;
  --folio-sky-2: #10285a;
  --folio-cream: #f4ead8;
  --folio-paper: #f7efe3;
  --folio-ink: #14110e;
  --folio-tape: #e6d3a8;
  --folio-brick: #8d3c30;
  --folio-brick-2: #a4493a;
  --folio-mortar: #2a2624;
  --folio-run: #e30613;
  --folio-band: #0b0b0b;
  --folio-band-ink: #f5e000;
  --folio-vinyl-1: #f6de7a;
  --folio-vinyl-2: #c9a227;
  --folio-vinyl-3: #8a6b14;
  --folio-vinyl-4: #e8c14a;
  --folio-imagine-h: 92px;
  --font-folio-script: "Yesteryear", "Segoe Script", cursive;
  min-height: 100%;
  margin: 0;
  color: var(--folio-ink);
  background: var(--folio-mortar);
}

.folio-brick,
.folio-page .folio-main {
  background-color: var(--folio-brick);
  background-image:
    linear-gradient(var(--folio-mortar) 3px, transparent 3px),
    linear-gradient(90deg, var(--folio-mortar) 3px, transparent 3px),
    linear-gradient(180deg, rgba(255, 220, 180, 0.07), transparent 42%),
    repeating-linear-gradient(
      180deg,
      var(--folio-brick) 0 13px,
      var(--folio-brick-2) 13px 26px
    );
  background-size: 58px 29px, 58px 29px, 100% 120px, 58px 29px;
  background-position: 0 0, 0 0, 0 0, 0 0;
}

.folio-page .folio-main {
  position: relative;
  box-sizing: border-box;
  width: 100%;
  max-width: none;
  min-height: calc(100dvh - var(--folio-imagine-h));
  margin: 0;
  padding: 18px 16px 72px;
}

.folio-stack {
  width: min(420px, 100%);
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 18px;
}

.folio-imagine {
  position: sticky;
  top: 0;
  z-index: 80;
  height: var(--folio-imagine-h);
  padding: 10px 12px 18px;
  display: grid;
  grid-template-columns: 56px 1fr 56px;
  align-items: center;
  background-color: var(--folio-sky);
  background-image:
    radial-gradient(1.4px 1.4px at 8% 30%, #fff 55%, transparent 56%),
    radial-gradient(1px 1px at 18% 62%, #fff 55%, transparent 56%),
    radial-gradient(1.6px 1.6px at 29% 22%, #fff 55%, transparent 56%),
    radial-gradient(1px 1px at 41% 70%, #fff 55%, transparent 56%),
    radial-gradient(1.3px 1.3px at 53% 28%, #fff 55%, transparent 56%),
    radial-gradient(1px 1px at 66% 58%, #fff 55%, transparent 56%),
    radial-gradient(1.5px 1.5px at 78% 24%, #fff 55%, transparent 56%),
    radial-gradient(1px 1px at 88% 66%, #fff 55%, transparent 56%),
    radial-gradient(1.2px 1.2px at 94% 36%, #fff 55%, transparent 56%),
    linear-gradient(180deg, #071428 0%, var(--folio-sky) 38%, var(--folio-sky-2) 100%);
  color: var(--folio-cream);
}

.folio-imagine::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: -12px;
  height: 16px;
  background: var(--folio-cream);
  clip-path: polygon(
    0 0, 100% 0,
    100% 38%, 97% 100%, 93% 42%, 89% 92%, 84% 36%,
    79% 100%, 74% 40%, 68% 88%, 62% 34%, 56% 100%,
    50% 38%, 44% 90%, 38% 36%, 32% 100%, 26% 42%,
    20% 86%, 14% 34%, 8% 100%, 3% 40%, 0 88%
  );
  pointer-events: none;
}

.folio-mark {
  pointer-events: none;
}

.folio-mark img {
  display: block;
  object-fit: contain;
  filter: brightness(0) invert(1) sepia(0.22) saturate(0.45);
}

.folio-imagine .folio-mark {
  width: 40px;
  height: 40px;
  justify-self: start;
  align-self: center;
}

.folio-imagine .folio-mark img {
  width: 40px;
  height: 40px;
}

.folio-imagine .brand-home {
  display: flex;
  align-items: center;
  justify-self: center;
  min-width: 0;
  text-decoration: none;
  color: var(--folio-cream);
  line-height: 1;
}

.folio-wordmark {
  display: block;
  margin: 0;
  font-family: var(--font-display, "Archivo", sans-serif);
  font-size: clamp(16px, 4.4vw, 18px);
  font-weight: 800;
  letter-spacing: -0.035em;
  line-height: 1.1;
  color: var(--folio-cream);
  white-space: nowrap;
  text-shadow: 0 1px 0 rgba(0, 0, 0, 0.28);
}

.folio-imagine .nav-trigger,
.folio-menu {
  justify-self: end;
  width: 46px;
  height: 46px;
  border: 0;
  padding: 0;
  background: var(--folio-cream);
  color: var(--folio-ink);
  clip-path: polygon(4% 8%, 96% 0, 100% 92%, 8% 100%);
  box-shadow: 1px 2px 0 rgba(0, 0, 0, 0.25);
  cursor: pointer;
}

.folio-imagine .nav-trigger-icon,
.folio-imagine .nav-trigger-icon::before,
.folio-imagine .nav-trigger-icon::after {
  display: block;
  width: 18px;
  height: 2px;
  margin: 0 auto;
  background: var(--folio-ink);
  position: relative;
}

.folio-imagine .nav-trigger-icon::before,
.folio-imagine .nav-trigger-icon::after {
  content: "";
  position: absolute;
  left: 0;
}

.folio-imagine .nav-trigger-icon::before { top: -6px; }
.folio-imagine .nav-trigger-icon::after { top: 6px; }

.folio-imagine .app-nav,
.folio-imagine .topbar-actions,
.folio-imagine .nav-auth,
.folio-imagine .live-pill,
.folio-imagine .brand-lockup .topbar-wordmark,
.folio-imagine .brand-lockup .topbar-tagline,
.folio-imagine .topbar-mark {
  display: none;
}

/* Folio hamburger sheet — Wall paper scrap. Closed stays off-stage on every folio
   page (Vault does not load styles.css). Do not invent routes; nav.js owns links. */
.folio-page .nav-sheet {
  position: fixed;
  top: calc(var(--folio-imagine-h) - 6px);
  right: 10px;
  left: auto;
  bottom: auto;
  width: min(260px, calc(100vw - 20px));
  max-height: calc(100dvh - var(--folio-imagine-h) - 12px);
  display: none !important;
  flex-direction: column;
  gap: 0;
  margin: 0;
  padding: 16px 12px 18px;
  overflow-x: hidden;
  overflow-y: auto;
  background: var(--folio-paper);
  color: var(--folio-ink);
  border: 0;
  box-shadow: 0 8px 0 rgba(0, 0, 0, 0.12);
  transform: none;
  z-index: 220;
  clip-path: polygon(
    0 3%, 4% 0, 12% 4%, 22% 0, 34% 3%, 48% 0, 62% 4%, 74% 0, 86% 3%, 96% 0, 100% 4%,
    100% 92%, 96% 100%, 84% 94%, 72% 100%, 58% 93%, 44% 100%, 30% 94%, 16% 100%, 6% 93%, 0 100%
  );
}

.folio-page .nav-sheet.is-open {
  display: flex !important;
}

.folio-page .nav-sheet::before {
  content: "";
  position: absolute;
  top: 6px;
  left: 50%;
  width: 54px;
  height: 16px;
  background: linear-gradient(180deg, #f3e4bf, var(--folio-tape));
  transform: translateX(-50%) rotate(-3deg);
  box-shadow: 0 1px 0 rgba(0, 0, 0, 0.12);
  pointer-events: none;
}

.folio-page .nav-sheet-header {
  margin: 8px 4px 4px;
}

.folio-page .nav-sheet-title {
  font-family: var(--font-display, "Archivo", sans-serif);
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--folio-ink);
}

.folio-page .nav-sheet a {
  display: flex;
  align-items: center;
  box-sizing: border-box;
  min-height: 44px;
  height: 44px;
  margin: 0;
  padding: 0 10px;
  border: 0;
  border-bottom: 1px solid rgba(20, 17, 14, 0.08);
  border-radius: 0;
  color: var(--folio-ink);
  font-family: var(--font-sans, "Hanken Grotesk", sans-serif);
  font-size: 16px;
  font-weight: 600;
  line-height: 44px;
  text-decoration: none;
}

.folio-page .nav-sheet a:hover,
.folio-page .nav-sheet a:focus-visible {
  background: rgba(20, 17, 14, 0.06);
  outline: none;
}

.folio-page .nav-sheet a.active {
  color: var(--folio-ink);
  background: rgba(20, 17, 14, 0.08);
  text-decoration: underline;
  text-underline-offset: 4px;
}

.folio-page .nav-sheet-group {
  margin: 10px 10px 0;
  font-family: var(--font-sans, "Hanken Grotesk", sans-serif);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--folio-ink);
  opacity: 0.55;
}

.folio-page .nav-backdrop {
  position: fixed;
  inset: 0;
  z-index: 210;
  display: none !important;
  background: rgba(20, 10, 4, 0.35);
  opacity: 0;
  visibility: hidden;
}

.folio-page .nav-backdrop.is-visible {
  display: block !important;
  opacity: 1;
  visibility: visible;
}

.folio-tape {
  position: absolute;
  width: 54px;
  height: 16px;
  background: linear-gradient(180deg, #f3e4bf, var(--folio-tape));
  opacity: 0.92;
  box-shadow: 0 1px 0 rgba(0, 0, 0, 0.12);
  pointer-events: none;
  z-index: 3;
}

.folio-tape-n { top: -8px; left: 50%; transform: translateX(-50%) rotate(-3deg); }
.folio-tape-s { bottom: -8px; left: 50%; transform: translateX(-50%) rotate(4deg); }
.folio-tape-e { right: -18px; top: 50%; transform: translateY(-50%) rotate(86deg); }
.folio-tape-w { left: -18px; top: 50%; transform: translateY(-50%) rotate(-88deg); }

.folio-offstage {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

.folio-scrap {
  position: relative;
  box-sizing: border-box;
  width: 100%;
  margin: 0;
  padding: 16px 16px 18px;
  background: var(--folio-paper);
  color: var(--folio-ink);
  box-shadow: 0 8px 0 rgba(0, 0, 0, 0.12);
}

.folio-scrap-torn {
  clip-path: polygon(
    0 3%, 4% 0, 12% 4%, 22% 0, 34% 3%, 48% 0, 62% 4%, 74% 0, 86% 3%, 96% 0, 100% 4%,
    100% 92%, 96% 100%, 84% 94%, 72% 100%, 58% 93%, 44% 100%, 30% 94%, 16% 100%, 6% 93%, 0 100%
  );
}

.folio-scrap h1,
.folio-scrap h2,
.folio-scrap .folio-scrap-title {
  margin: 0 0 8px;
  font-family: var(--font-display, "Archivo", sans-serif);
  font-weight: 800;
  font-size: 22px;
  letter-spacing: 0.02em;
  text-transform: uppercase;
  color: var(--folio-ink);
}

.folio-underline {
  text-decoration: underline;
  text-underline-offset: 4px;
}

.folio-scrap p {
  margin: 0;
  font-family: var(--font-sans, "Hanken Grotesk", sans-serif);
  font-size: 15px;
  line-height: 1.45;
}

.folio-paper-play {
  position: absolute;
  right: 12px;
  bottom: 14px;
  z-index: 4;
  width: 58px;
  height: 58px;
  margin: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--folio-run);
  color: #111;
  font-family: var(--font-sans, "Hanken Grotesk", sans-serif);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0;
  text-transform: lowercase;
  text-align: center;
  line-height: 1.1;
  box-shadow: 2px 2px 0 rgba(0, 0, 0, 0.25);
}

/* Home plate — stealable site object, not cinema */
.folio-plate-wrap {
  position: relative;
  width: min(220px, 68vw);
  margin: 10px auto 6px;
}

.folio-plate {
  --hit-letters: 3;
  position: relative;
  z-index: 2;
  width: 100%;
  aspect-ratio: 5 / 7;
  border-radius: 14px;
  overflow: hidden;
  box-shadow:
    0 14px 28px rgba(20, 10, 4, 0.38),
    inset 0 0 0 1px rgba(80, 58, 12, 0.35);
}

.folio-plate-vinyl {
  position: absolute;
  inset: 0;
  background-color: var(--folio-vinyl-2);
  background-image:
    repeating-radial-gradient(circle at 50% 32%, var(--folio-vinyl-1) 0 1.2px, transparent 1.2px 7px),
    repeating-radial-gradient(circle at 18% 18%, var(--folio-vinyl-4) 0 1px, transparent 1px 8px),
    repeating-radial-gradient(circle at 82% 22%, var(--folio-vinyl-2) 0 1px, transparent 1px 9px),
    repeating-radial-gradient(circle at 28% 78%, var(--folio-vinyl-3) 0 1px, transparent 1px 8px),
    repeating-conic-gradient(
      from 8deg at 50% 38%,
      var(--folio-vinyl-1) 0 4deg,
      var(--folio-vinyl-2) 4deg 8deg,
      var(--folio-vinyl-3) 8deg 11deg,
      var(--folio-vinyl-4) 11deg 15deg
    );
  background-size: 22px 22px, 26px 26px, 24px 24px, 28px 28px, 100% 100%;
}

.folio-plate-letters {
  position: absolute;
  inset: 10% 4% 36%;
  z-index: 2;
  margin: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: var(--font-folio-script);
  font-size: clamp(72px, 28vw, 108px);
  line-height: 0.8;
  color: #111;
  text-shadow: 0 1px 0 rgba(255, 236, 170, 0.35);
}

.folio-plate-band {
  position: absolute;
  left: 0;
  right: 0;
  top: 64%;
  z-index: 2;
  margin: 0;
  padding: 11px 6px 10px;
  background: var(--folio-band);
  color: var(--folio-band-ink);
  font-family: var(--font-display, "Archivo", sans-serif);
  font-weight: 800;
  font-size: clamp(11px, 3.1vw, 13px);
  letter-spacing: 0.045em;
  line-height: 1;
  text-align: center;
  text-transform: uppercase;
}

.folio-run {
  width: 148px;
  height: 148px;
  margin: 4px auto 8px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  border: 6px solid #111;
  background: var(--folio-run);
  box-shadow: inset 0 0 0 5px #fff, 0 10px 0 #9a0410;
  color: #fff;
  text-decoration: none;
  text-align: center;
  text-transform: uppercase;
  font-family: var(--font-display, "Archivo", sans-serif);
  font-weight: 800;
  font-style: italic;
  font-size: 22px;
  letter-spacing: 0.02em;
  line-height: 0.95;
}

.folio-run:hover,
.folio-run:focus-visible {
  background: #c80510;
}

.folio-home .lobby-section {
  width: 100%;
}

.folio-home .folio-board,
.folio-home .folio-moving {
  width: 100%;
}

.folio-home .folio-board-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.folio-home .folio-board-list li {
  display: flex;
  align-items: baseline;
  gap: 10px;
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
}

.folio-home .folio-board-rank {
  flex: 0 0 1.25em;
  font-family: var(--font-mono, "IBM Plex Mono", monospace);
  font-size: 13px;
  font-weight: 600;
  opacity: 0.55;
}

.folio-home .folio-board-handle {
  flex: 1;
  min-width: 0;
  font-family: var(--font-sans, "Hanken Grotesk", sans-serif);
  font-size: 15px;
  font-weight: 600;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.folio-home .folio-board-net {
  flex: 0 0 auto;
  font-family: var(--font-mono, "IBM Plex Mono", monospace);
  font-size: 13px;
  font-weight: 600;
  white-space: nowrap;
  color: var(--folio-ink);
}

.folio-home .folio-board-unit {
  font-family: var(--font-sans, "Hanken Grotesk", sans-serif);
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  opacity: 0.55;
}

.folio-home .folio-board-empty {
  margin: 0;
  font-family: var(--font-sans, "Hanken Grotesk", sans-serif);
  font-size: 15px;
  line-height: 1.45;
}

.folio-home .folio-board-link {
  display: inline-block;
  margin-top: 12px;
  font-family: var(--font-sans, "Hanken Grotesk", sans-serif);
  font-size: 14px;
  font-weight: 600;
  color: var(--folio-ink);
  text-underline-offset: 3px;
}

.folio-home .folio-moving .whats-moving-rail {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.folio-home .folio-moving .whats-moving-card {
  padding: 0;
  border: 0;
  background: transparent;
  box-shadow: none;
}

.folio-home .lobby-empty {
  margin: 0;
  padding: 0;
  background: transparent;
  border: 0;
}

.folio-home .lobby-empty-actions,
.folio-home .lobby-section-note,
.folio-home .eyebrow {
  display: none;
}

.folio-home .lobby-footer,
.folio-page .landing-footer,
.folio-page .page-disclaimer {
  background: var(--folio-paper);
  color: var(--folio-ink);
}

/* News poster */
.folio-news .folio-poster {
  width: min(420px, 100%);
  margin: 8px auto 0;
  padding: 22px 16px 20px;
}

.folio-news .news-hero,
.folio-news .wire-section,
.folio-news .news-controls,
.folio-news .news-content {
  margin: 0;
  padding: 0;
  background: transparent;
  border: 0;
  box-shadow: none;
}

.folio-news .news-hero-copy .eyebrow,
.folio-news .news-lead-stat {
  display: none;
}

.folio-vault.vault-body {
  background: var(--folio-mortar);
}

.folio-news .news-lead {
  margin: 0 0 14px;
  font-size: 14px;
}

.folio-news .news-controls {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
  margin: 12px 0 16px;
}

.folio-news .news-controls label {
  display: none;
}

.folio-news .news-controls select {
  width: 100%;
  border: 1px solid #cfc3ad;
  background: #efe6d4;
  color: var(--folio-ink);
  font-family: var(--font-sans, "Hanken Grotesk", sans-serif);
  font-size: 13px;
  font-weight: 600;
  padding: 8px 10px;
}

.folio-news .wire-title {
  font-size: 16px;
}

/* Guide scraps */
.folio-guide .guide-main {
  width: min(420px, 100%);
  margin: 0 auto;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.folio-guide .guide-hero,
.folio-guide .guide-card,
.folio-guide .guide-cta {
  background: var(--folio-paper);
  border: 0;
  border-radius: 0;
  box-shadow: 0 8px 0 rgba(0, 0, 0, 0.12);
}

.folio-guide .guide-hero h1,
.folio-guide .guide-card h2 {
  text-transform: uppercase;
}

.folio-guide .guide-cta {
  padding: 16px;
  justify-content: center;
}

/* Vault wrap — do not restyle .card faces */
.folio-vault .vault-wrap {
  width: min(420px, 100%);
  margin: 0 auto;
  padding: 8px 0 80px;
  background: transparent;
}

.folio-vault .vault-head,
.folio-vault .vault-dek,
.folio-vault .vault-shelf,
.folio-vault .vault-section-h,
.folio-vault .rainbow-head,
.folio-vault .chase-strip,
.folio-vault .vault-teams,
.folio-vault .vault-foot {
  position: relative;
}

.folio-vault .vault-title-scrap,
.folio-vault .vault-dek {
  width: 100%;
  margin: 0 0 12px;
  padding: 14px 16px;
  background: var(--folio-paper);
  box-shadow: 0 8px 0 rgba(0, 0, 0, 0.12);
}

.folio-vault .vault-title h1 {
  text-transform: uppercase;
}

.folio-vault .vault-shelf {
  padding: 14px 12px 18px;
  background: var(--folio-paper);
  box-shadow: 0 8px 0 rgba(0, 0, 0, 0.12);
}

.folio-shelf-wood {
  height: 14px;
  margin: 8px 8px 0;
  background: linear-gradient(180deg, #c48a4a, #8a5a28);
  border-radius: 2px;
  box-shadow: 0 3px 0 #5a3a16;
}

/* Play wrap — the Imagine-bar IS the Play header. Do not restyle tiles, chips, values, cinema cards, breaker. */
body.folio-play {
  --portal-void: #12051c;
  --portal-void-2: #1c0830;
  --portal-gold: #f0b84a;
  --portal-ink: #f6f1ff;
  --portal-muted: #b7a8c9;
  --folio-cream: #f6f1ff;
}

body.folio-play .topbar.folio-imagine--play {
  position: sticky;
  top: 0;
  z-index: 60;
  height: auto;
  min-height: calc(64px + var(--safe-top, 0px));
  padding: calc(8px + var(--safe-top, 0px)) 8px 16px;
  display: grid;
  grid-template-columns: 36px minmax(0, 1fr) auto 44px;
  align-items: center;
  gap: 6px;
  background-color: transparent;
  background-image:
    radial-gradient(ellipse 70% 80% at 50% 0%, rgba(255, 46, 138, 0.20), transparent 62%),
    linear-gradient(180deg, #0a0312 0%, rgba(10, 3, 18, 0.6) 70%, transparent 100%);
  border-top: 0;
  border-bottom: 0;
  box-shadow: none;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
  overflow: visible;
  pointer-events: auto;
}

body.folio-play .topbar.folio-imagine--play::after {
  display: none;
}

body.folio-play .topbar.folio-imagine--play .folio-mark {
  position: relative;
  z-index: 0;
  width: 36px;
  height: 36px;
  margin: 0;
  pointer-events: none;
}

body.folio-play .topbar.folio-imagine--play .folio-mark img {
  display: block;
  width: 36px;
  height: 36px;
}

body.folio-play .topbar.folio-imagine--play .brand-home {
  position: relative;
  z-index: 2;
  justify-self: start;
  min-width: 0;
  pointer-events: auto;
}

body.folio-play .topbar.folio-imagine--play .folio-wordmark {
  font-size: clamp(14px, 3.8vw, 16px);
}

body.folio-play .topbar.folio-imagine--play .balance-pill,
body.folio-play .topbar.folio-imagine--play .topbar-account {
  position: relative;
  z-index: 2;
  pointer-events: auto;
}

body.folio-play .topbar.folio-imagine--play .icon-btn {
  border-color: rgba(246, 241, 255, 0.35);
  color: var(--portal-ink);
}

body.folio-play .topbar.folio-imagine--play .folio-wordmark,
body.folio-play .topbar.folio-imagine--play .brand-home {
  color: var(--portal-ink);
  text-decoration: none;
}

body.folio-play .app {
  background-color: var(--portal-void);
  background-image:
    radial-gradient(ellipse 80% 50% at 50% -10%, rgba(255, 46, 138, 0.24), transparent 58%),
    radial-gradient(ellipse 60% 40% at 80% 110%, rgba(184, 255, 60, 0.10), transparent 55%),
    linear-gradient(180deg, #0a0312 0%, var(--portal-void) 38%, var(--portal-void-2) 100%);
}

body.folio-play .stage-wrap:not(.felt) {
  background: transparent;
}

body.folio-play .buy-screen {
  inset: 10px 8px 8px;
  background: transparent;
  box-shadow: none;
}

body.folio-play .folio-paper-play-play {
  position: absolute;
  right: 10px;
  bottom: 10px;
  z-index: 5;
  width: 52px;
  height: 52px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: #e30613;
  color: #111;
  font-size: 10px;
  font-weight: 700;
  text-transform: lowercase;
  pointer-events: none;
}

/* Leftover player routes — Wall chrome around live desks. Do not restyle pricing $0. */
.folio-page.login-page {
  display: block;
  min-height: 100%;
  place-items: unset;
  background: var(--folio-mortar);
}

.folio-player .folio-player-scrap {
  width: min(420px, 100%);
  margin: 8px auto 0;
}

.folio-player .folio-player-scrap h1,
.folio-player .folio-player-scrap h2,
.folio-player .folio-player-scrap .folio-scrap-title {
  text-transform: none;
  font-size: inherit;
  letter-spacing: inherit;
  margin: revert;
}

.folio-player .folio-player-scrap p {
  margin: revert;
  font-size: inherit;
  line-height: inherit;
}

.folio-login .login-shell,
.folio-signup .login-shell,
.folio-forgot .login-shell {
  width: 100%;
  padding: 0;
}

.folio-login .login-panel,
.folio-signup .login-panel,
.folio-forgot .login-panel {
  border: 0;
  border-radius: 0;
  padding: 0;
  background: transparent;
  box-shadow: none;
}

.folio-leaderboard .csl-lb-main,
.folio-account .account-main,
.folio-account .doc-main,
.folio-pricing .pricing-main,
.folio-pricing .doc-main {
  width: 100%;
  max-width: none;
  margin: 0;
  padding: 0;
}

@media (min-width: 720px) {
  .folio-stack,
  .folio-news .folio-poster,
  .folio-guide .guide-main,
  .folio-vault .vault-wrap,
  .folio-player .folio-player-scrap {
    width: min(460px, 100%);
  }
}

/* Night is the Folio site look.
   data-theme lives on <html>. data-folio stays the Folio family flag.
   Do not restyle cinema, #buyScreen, or vault card faces. */
.folio-door {
  display: contents;
}

.folio-kid,
.folio-csl,
.folio-theme-home,
.folio-hamburger-art,
.folio-night-badge {
  display: none;
}

html[data-theme="night"] .folio-page {
  --folio-imagine-h: 96px;
  background-color: #071428;
  background-image: url("/assets/theme2/night-bg-390.png");
  background-repeat: no-repeat;
  background-position: center bottom;
  background-size: cover;
  background-attachment: fixed;
}

html[data-theme="night"] .folio-page::before {
  content: "";
  position: fixed;
  inset: 0;
  z-index: 0;
  background-color: #071428;
  background-image: url("/assets/theme2/night-bg-390.png");
  background-repeat: no-repeat;
  background-position: center bottom;
  background-size: cover;
  pointer-events: none;
}

html[data-theme="night"] .folio-page .folio-main,
html[data-theme="night"] .folio-page .folio-brick {
  background-color: transparent;
  background-image: none;
}

html[data-theme="night"] .folio-page.login-page,
html[data-theme="night"] .folio-vault.vault-body {
  background-color: #071428;
  background-image: url("/assets/theme2/night-bg-390.png");
  background-repeat: no-repeat;
  background-position: center bottom;
  background-size: cover;
  background-attachment: fixed;
}

html[data-theme="night"] .folio-page .folio-main,
html[data-theme="night"] .folio-page .landing-footer,
html[data-theme="night"] .folio-page .page-disclaimer,
html[data-theme="night"] .folio-page .nav-sheet,
html[data-theme="night"] .folio-page .nav-backdrop {
  position: relative;
  z-index: 1;
}

html[data-theme="night"] .folio-page .csl-lb-eyebrow,
html[data-theme="night"] .folio-vault .vault-eyebrow {
  display: none;
}

html[data-theme="night"] .folio-page .nav-sheet {
  clip-path: none;
  border-radius: 6px;
  background: #f3ead8;
  box-shadow: 0 10px 24px rgba(0, 0, 0, 0.28);
}

html[data-theme="night"] .folio-page .nav-sheet::before {
  display: none;
}

html[data-theme="night"] .folio-page .nav-sheet-header {
  display: none;
}

html[data-theme="night"] .folio-page .nav-sheet a {
  border-bottom: 1px solid #14110e;
}

html[data-theme="night"] .folio-theme-home {
  display: flex;
}

html[data-theme="night"] .folio-page .folio-kid,
html[data-theme="night"] .folio-page .folio-csl {
  display: block;
}

html[data-theme="night"] .folio-page .folio-mark-wall,
html[data-theme="night"] .folio-page .folio-wordmark {
  display: none;
}

html[data-theme="night"] .folio-page .folio-imagine {
  height: var(--folio-imagine-h);
  padding: 4px 4px 26px;
  overflow: visible;
  background-color: transparent;
  background-image: none;
  grid-template-columns: minmax(136px, 40vw) 1fr 124px;
  align-items: end;
}

html[data-theme="night"] .folio-page .folio-imagine::after {
  display: block;
  left: 0;
  right: 0;
  bottom: 0;
  height: 34px;
  background: #f3ead8;
  clip-path: polygon(
    0 0, 100% 0,
    100% 52%, 96% 100%, 88% 48%, 80% 100%, 71% 50%,
    62% 100%, 52% 46%, 42% 100%, 32% 50%, 22% 100%,
    12% 48%, 5% 100%, 0 56%
  );
}

html[data-theme="night"] .folio-page .folio-kid {
  width: min(210px, 56vw);
  height: auto;
  justify-self: start;
  align-self: end;
  margin: 0 0 -6px -10px;
  overflow: visible;
  pointer-events: none;
  -webkit-mask-image: none;
  mask-image: none;
}

html[data-theme="night"] .folio-page .folio-kid img {
  display: block;
  width: 100%;
  height: auto;
  object-fit: contain;
  object-position: left bottom;
  filter: none;
}

html[data-theme="night"] .folio-page .folio-csl {
  margin: 0 0 6px;
  font-family: var(--font-folio-script);
  font-size: clamp(38px, 12vw, 52px);
  font-weight: 400;
  line-height: 1;
  color: #f4ead8;
  text-shadow: 0 2px 0 rgba(0, 0, 0, 0.35);
}

html[data-theme="night"] .folio-page .folio-menu {
  position: relative;
  align-self: end;
  margin: 0 -8px -18px 0;
  width: 124px;
  height: 104px;
  background: transparent;
  clip-path: none;
  box-shadow: none;
  overflow: visible;
}

html[data-theme="night"] .folio-page .folio-menu::before {
  display: none;
}

html[data-theme="night"] .folio-page .folio-hamburger-art {
  display: block;
  width: 124px;
  height: 104px;
  object-fit: contain;
  object-position: right bottom;
  pointer-events: none;
}

html[data-theme="night"] .folio-page .folio-menu .nav-trigger-icon,
html[data-theme="night"] .folio-page .folio-menu .nav-trigger-icon::before,
html[data-theme="night"] .folio-page .folio-menu .nav-trigger-icon::after {
  display: none;
}

html[data-theme="night"] body.folio-home .folio-main {
  min-height: calc(100dvh - var(--folio-imagine-h));
  padding: 0;
  display: block;
}

/* First screen is a fixed stage: pieces are absolutely placed, nothing shrinks to make room. */
html[data-theme="night"] body.folio-home .folio-stack {
  position: relative;
  display: block;
  width: 100%;
  min-height: calc(100dvh - var(--folio-imagine-h));
  height: calc(100dvh - var(--folio-imagine-h));
  gap: 0;
  margin: 0;
  padding: 0;
  overflow: visible;
}

html[data-theme="night"] body.folio-home {
  overflow-x: hidden;
}

/* plate-as-badge.png bakes navy around the plate: a 410px img renders the
   visible Superfractor at ~290px (~74% of the 390 stage), per the lock still. */
html[data-theme="night"] body.folio-home .folio-door {
  display: block;
  position: absolute;
  top: 56px;
  left: calc(50% - 218px);
  width: 410px;
  max-width: none;
  margin: 0;
  padding: 0;
  overflow: visible;
}

html[data-theme="night"] body.folio-home .folio-night-badge {
  display: block;
  width: 100%;
  height: auto;
  pointer-events: none;
  -webkit-mask-image: linear-gradient(180deg, #000 94%, transparent 100%);
  mask-image: linear-gradient(180deg, #000 94%, transparent 100%);
}

html[data-theme="night"] body.folio-home .folio-door .folio-plate-wrap {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  opacity: 0;
  pointer-events: none;
}

html[data-theme="night"] body.folio-home .folio-plate-wrap .folio-tape {
  display: none;
}

html[data-theme="night"] body.folio-home .folio-door .folio-run {
  position: absolute;
  left: 63%;
  top: 67%;
  z-index: 6;
  width: 30%;
  height: 27%;
  margin: 0;
  transform: none;
  border: 0;
  border-radius: 50%;
  background: transparent;
  box-shadow: none;
  color: transparent;
  font-size: 16px;
  line-height: 1;
}

html[data-theme="night"] body.folio-home .folio-door .folio-run:hover,
html[data-theme="night"] body.folio-home .folio-door .folio-run:focus-visible {
  background: transparent;
  box-shadow: none;
  outline: 2px solid rgba(244, 234, 216, 0.55);
  outline-offset: 3px;
}

html[data-theme="night"] body.folio-home .folio-board {
  display: none;
}

html[data-theme="night"] body.folio-home .folio-moving {
  position: absolute;
  left: 7%;
  bottom: 26px;
  z-index: 4;
  width: min(172px, 44vw);
  max-width: 172px;
  margin: 0;
  padding: 8px 10px 9px;
  background: #f3ead8;
  box-shadow: 1px 2px 0 rgba(0, 0, 0, 0.2);
  rotate: -3deg;
}

html[data-theme="night"] body.folio-home .folio-moving .folio-underline {
  margin: 0 0 6px;
  font-size: 12px;
  letter-spacing: 0.04em;
}

html[data-theme="night"] body.folio-home .folio-moving .whats-moving-rail {
  gap: 6px;
}

html[data-theme="night"] body.folio-home .folio-moving .whats-moving-card:nth-child(n+3),
html[data-theme="night"] body.folio-home .folio-moving .whats-moving-card-source,
html[data-theme="night"] body.folio-home .folio-moving .lobby-empty-actions {
  display: none;
}

html[data-theme="night"] body.folio-home .folio-moving .whats-moving-card-headline {
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 1;
  overflow: hidden;
  font-size: 11px;
  line-height: 1.3;
}

html[data-theme="night"] body.folio-home .folio-moving .lobby-empty p {
  margin: 0;
  font-size: 11px;
  line-height: 1.3;
}

html[data-theme="night"] body.folio-home .folio-moving .whats-moving-card-meta {
  display: none;
}

html[data-theme="night"] body.folio-home .folio-moving .folio-tape-n {
  left: 28%;
}

html[data-theme="night"] body.folio-home .folio-moving::before {
  content: "";
  position: absolute;
  top: -8px;
  left: 62%;
  width: 42px;
  height: 14px;
  background: linear-gradient(180deg, #f3e4bf, var(--folio-tape));
  transform: translateX(-50%) rotate(6deg);
  box-shadow: 0 1px 0 rgba(0, 0, 0, 0.12);
  pointer-events: none;
  z-index: 3;
}

html[data-theme="night"] body.folio-home .folio-paper-play {
  display: none;
}

html[data-theme="night"] body.folio-home .folio-paper-play::before {
  display: none;
}

html[data-theme="night"] .folio-page .landing-footer,
html[data-theme="night"] .folio-page .page-disclaimer {
  background: rgba(7, 20, 40, 0.92);
  color: #d7deea;
}

/* PORTAL site (Folio hosts). The Play shell has its own PORTAL wrap above
   ("Play wrap") plus a scoped block at the end of play/play.css — reveal
   faces, picker tiles, and vault faces stay untouched everywhere. */
html[data-theme="portal"] {
  background: #12051c;
  overflow-x: clip;
}

html[data-theme="portal"] body {
  background: #12051c;
  overflow-x: clip;
  max-width: 100%;
}

html[data-theme="portal"] .folio-page:not(.folio-play) {
  --portal-void: #12051c;
  --portal-void-2: #1c0830;
  --portal-magenta: #ff2e8a;
  --portal-slime: #b8ff3c;
  --portal-gold: #f0b84a;
  --portal-chrome: #d7dde8;
  --portal-ink: #f6f1ff;
  --portal-muted: #b7a8c9;
  --folio-imagine-h: 72px;
  --folio-sky: #12051c;
  --folio-sky-2: #1c0830;
  --folio-cream: #f6f1ff;
  --folio-ink: #f6f1ff;
  --folio-paper: rgba(28, 8, 48, 0.88);
  --folio-run: #f0b84a;
  color: var(--portal-ink);
  background-color: var(--portal-void);
  background-image:
    radial-gradient(ellipse 80% 50% at 50% -10%, rgba(255, 46, 138, 0.28), transparent 58%),
    radial-gradient(ellipse 60% 40% at 80% 110%, rgba(184, 255, 60, 0.12), transparent 55%),
    radial-gradient(ellipse 50% 40% at 10% 90%, rgba(88, 20, 140, 0.45), transparent 50%),
    linear-gradient(180deg, #0a0312 0%, var(--portal-void) 38%, var(--portal-void-2) 100%);
  background-attachment: fixed;
  overflow-x: hidden;
}

html[data-theme="portal"] .folio-page:not(.folio-play) .folio-main,
html[data-theme="portal"] .folio-page:not(.folio-play) .folio-brick {
  background-color: transparent;
  background-image: none;
}

html[data-theme="portal"] .folio-page:not(.folio-play) .folio-main,
html[data-theme="portal"] .folio-page:not(.folio-play) .landing-footer,
html[data-theme="portal"] .folio-page:not(.folio-play) .page-disclaimer {
  position: relative;
  z-index: 1;
}

html[data-theme="portal"] .folio-page:not(.folio-play) .folio-imagine {
  background-color: transparent;
  background-image:
    radial-gradient(ellipse 70% 80% at 50% 0%, rgba(255, 46, 138, 0.22), transparent 62%),
    linear-gradient(180deg, #0a0312 0%, transparent 100%);
  color: var(--portal-ink);
}

html[data-theme="portal"] .folio-page:not(.folio-play) .folio-imagine::after {
  display: none;
}

html[data-theme="portal"] .folio-page:not(.folio-play) .folio-wordmark,
html[data-theme="portal"] .folio-page:not(.folio-play) .folio-imagine .brand-home {
  color: var(--portal-ink);
}

html[data-theme="portal"] .folio-page:not(.folio-play) .folio-mark-wall {
  display: block;
}

html[data-theme="portal"] .folio-page:not(.folio-play) .folio-kid,
html[data-theme="portal"] .folio-page:not(.folio-play) .folio-csl,
html[data-theme="portal"] .folio-page:not(.folio-play) .folio-hamburger-art,
html[data-theme="portal"] .folio-page:not(.folio-play) .folio-night-badge,
html[data-theme="portal"] .folio-page:not(.folio-play) .folio-plate-wrap,
html[data-theme="portal"] .folio-page:not(.folio-play) .folio-tape,
html[data-theme="portal"] .folio-page:not(.folio-play) .folio-paper-play {
  display: none;
}

html[data-theme="portal"] .folio-page:not(.folio-play) .folio-menu,
html[data-theme="portal"] .folio-page:not(.folio-play) .folio-imagine .nav-trigger {
  background: var(--portal-gold);
  color: #1a1204;
  clip-path: none;
  border-radius: 999px;
  width: 46px;
  height: 46px;
  box-shadow: none;
}

html[data-theme="portal"] .folio-page:not(.folio-play) .folio-menu .nav-trigger-icon,
html[data-theme="portal"] .folio-page:not(.folio-play) .folio-menu .nav-trigger-icon::before,
html[data-theme="portal"] .folio-page:not(.folio-play) .folio-menu .nav-trigger-icon::after {
  display: block;
  background: #1a1204;
}

html[data-theme="portal"] .folio-page:not(.folio-play) .nav-sheet {
  background: #1c0830;
  color: #f6f1ff;
  clip-path: none;
  border-radius: 16px;
  box-shadow: 0 16px 40px rgba(0, 0, 0, 0.45);
}

html[data-theme="portal"] .folio-page:not(.folio-play) .nav-sheet::before {
  display: none;
}

html[data-theme="portal"] .folio-page:not(.folio-play) .nav-sheet-header,
html[data-theme="portal"] .folio-page:not(.folio-play) .folio-theme-home {
  display: flex;
}

html[data-theme="portal"] .folio-page:not(.folio-play) .nav-sheet-title,
html[data-theme="portal"] .folio-page:not(.folio-play) .nav-sheet-group {
  color: #f0b84a;
  opacity: 1;
}

html[data-theme="portal"] .folio-page:not(.folio-play) .nav-sheet a,
html[data-theme="portal"] .folio-page:not(.folio-play) .nav-sheet .folio-theme-home {
  color: #f6f1ff;
  background: transparent;
  min-height: 44px;
  height: auto;
  font-size: 16px;
  font-weight: 600;
  border-bottom: 1px solid rgba(246, 241, 255, 0.14);
}

html[data-theme="portal"] .folio-page:not(.folio-play) .nav-sheet a:hover,
html[data-theme="portal"] .folio-page:not(.folio-play) .nav-sheet a:focus-visible,
html[data-theme="portal"] .folio-page:not(.folio-play) .nav-sheet a.active {
  color: #f6f1ff;
  background: rgba(246, 241, 255, 0.08);
}

html[data-theme="portal"] .folio-page:not(.folio-play) .folio-scrap {
  background: rgba(28, 8, 48, 0.88);
  color: #f6f1ff;
  clip-path: none;
  border-radius: 16px;
  box-shadow: 0 10px 28px rgba(0, 0, 0, 0.28);
}

html[data-theme="portal"] .folio-page:not(.folio-play):not(.folio-vault) {
  --text-primary: #f6f1ff;
  --text-muted: #b7a8c9;
  --text-secondary: #c8bdd6;
  --muted: #b7a8c9;
  --csl-steel: #f6f1ff;
  --csl-chrome: #c8bdd6;
}

html[data-theme="portal"] .folio-page.login-page {
  background-color: var(--portal-void);
  background-image:
    radial-gradient(ellipse 80% 50% at 50% -10%, rgba(255, 46, 138, 0.28), transparent 58%),
    radial-gradient(ellipse 60% 40% at 80% 110%, rgba(184, 255, 60, 0.12), transparent 55%),
    linear-gradient(180deg, #0a0312 0%, var(--portal-void) 38%, var(--portal-void-2) 100%);
}

html[data-theme="portal"] .folio-page:not(.folio-play) .news-controls label,
html[data-theme="portal"] .folio-page:not(.folio-play) .eyebrow,
html[data-theme="portal"] .folio-guide .guide-row,
html[data-theme="portal"] .folio-guide .guide-row-n,
html[data-theme="portal"] .folio-guide .guide-row-body,
html[data-theme="portal"] .folio-guide .guide-row-body strong {
  color: var(--portal-ink);
}

html[data-theme="portal"] .folio-page:not(.folio-play) input,
html[data-theme="portal"] .folio-page:not(.folio-play) select,
html[data-theme="portal"] .folio-page:not(.folio-play) textarea {
  color: #13181f;
  background: #f6f1ff;
}

html[data-theme="portal"] .folio-page:not(.folio-play) .landing-footer,
html[data-theme="portal"] .folio-page:not(.folio-play) .page-disclaimer {
  background: rgba(10, 3, 18, 0.92);
  color: var(--portal-muted);
}

html[data-theme="portal"] .folio-page:not(.folio-play) .landing-footer a {
  color: var(--portal-ink);
}

html[data-theme="portal"] body.folio-home .folio-stack {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  width: min(720px, 100%);
  min-height: 0;
  height: auto;
  margin: 0 auto;
  padding: 8px 16px 48px;
  gap: 22px;
}

html[data-theme="portal"] body.folio-home .folio-door {
  display: flex;
  flex-direction: column;
  align-items: center;
  position: relative;
  top: auto;
  left: auto;
  width: min(640px, 100%);
  max-width: 100%;
  margin: 0;
  padding: 0;
  gap: 18px;
}

html[data-theme="portal"] body.folio-home .portal-hit {
  position: relative;
  width: 100%;
  margin: 0;
}

html[data-theme="portal"] body.folio-home .portal-hit-art {
  display: block;
  width: 100%;
  height: auto;
  min-height: 200px;
  object-fit: contain;
  filter: drop-shadow(0 18px 40px rgba(255, 46, 138, 0.28));
}

html[data-theme="portal"] body.folio-home .folio-run,
html[data-theme="portal"] body.folio-home a.portal-run {
  box-sizing: border-box;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  position: relative;
  top: auto;
  left: auto;
  min-height: 52px;
  min-width: 180px;
  width: auto;
  height: auto;
  margin: 0;
  padding: 14px 28px;
  border: 2px solid #1a1204;
  border-radius: 999px;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.28), transparent 42%),
    linear-gradient(180deg, #ffe08a, var(--portal-gold) 55%, #c4922a);
  color: #1a1204;
  text-decoration: none;
  text-transform: uppercase;
  font-family: var(--font-display, "Archivo", sans-serif);
  font-weight: 800;
  font-style: italic;
  font-size: 20px;
  letter-spacing: 0.04em;
  line-height: 1;
  box-shadow:
    0 0 0 1px rgba(255, 255, 255, 0.25) inset,
    0 8px 0 #8a6414,
    0 12px 28px rgba(240, 184, 74, 0.28);
}

html[data-theme="portal"] body.folio-home .folio-run:hover,
html[data-theme="portal"] body.folio-home .folio-run:focus-visible,
html[data-theme="portal"] body.folio-home a.portal-run:hover,
html[data-theme="portal"] body.folio-home a.portal-run:focus-visible {
  transform: scale(1.06) rotate(-1deg);
  outline: none;
}

html[data-theme="portal"] body.folio-home .folio-board,
html[data-theme="portal"] body.folio-home .folio-moving {
  position: relative;
  top: auto;
  left: auto;
  bottom: auto;
  width: min(520px, 100%);
  display: block;
  background: rgba(28, 8, 48, 0.78);
  color: var(--portal-ink);
}

html[data-theme="portal"] body.folio-home .folio-underline,
html[data-theme="portal"] body.folio-home .folio-board-link,
html[data-theme="portal"] .folio-page:not(.folio-play) .folio-underline,
html[data-theme="portal"] .folio-page:not(.folio-play) .folio-theme-home,
html[data-theme="portal"] .folio-page:not(.folio-play) .folio-scrap .text-link {
  color: var(--portal-gold);
}

html[data-theme="portal"] body.folio-home .folio-board-handle,
html[data-theme="portal"] body.folio-home .folio-board-net,
html[data-theme="portal"] body.folio-home .folio-board-empty,
html[data-theme="portal"] body.folio-home .whats-moving-card-headline,
html[data-theme="portal"] body.folio-home .whats-moving-headline-link,
html[data-theme="portal"] body.folio-home .whats-moving-card-meta,
html[data-theme="portal"] body.folio-home .lobby-empty p {
  color: #f6f1ff;
}

html[data-theme="portal"] .folio-vault .vault-title,
html[data-theme="portal"] .folio-vault .vault-title h1,
html[data-theme="portal"] .folio-vault .vault-eyebrow,
html[data-theme="portal"] .folio-vault .vault-dek,
html[data-theme="portal"] .folio-vault .vault-section-h .h,
html[data-theme="portal"] .folio-vault .vault-section-h .sub,
html[data-theme="portal"] .folio-vault .vault-overall .num,
html[data-theme="portal"] .folio-vault .vault-overall .lbl,
html[data-theme="portal"] .folio-vault .vault-foot,
html[data-theme="portal"] .folio-vault .rainbow-head,
html[data-theme="portal"] .folio-vault .rainbow-head .team-name,
html[data-theme="portal"] .folio-vault .rainbow-head .progress,
html[data-theme="portal"] .folio-vault .shelf-cap,
html[data-theme="portal"] .folio-vault .shelf-cap b {
  color: #f6f1ff;
}

html[data-theme="portal"] .folio-news .news-lead,
html[data-theme="portal"] .folio-news .wire-sub,
html[data-theme="portal"] .folio-news .wire-title {
  color: #f6f1ff;
}

html[data-theme="portal"] .folio-leaderboard .csl-lb-dek,
html[data-theme="portal"] .folio-leaderboard .csl-lb-model,
html[data-theme="portal"] .folio-leaderboard .csl-lb-updated,
html[data-theme="portal"] .folio-leaderboard h1 {
  color: #f6f1ff;
}

html[data-theme="portal"] .folio-page:not(.folio-play) :is(.panel, .soft-panel, .wire-card, .news-card, .csl-lb-card) {
  --text-primary: #13181f;
  --text-muted: #5a6270;
  --text-secondary: #3c4654;
  --muted: #5a6270;
  --csl-steel: #13181f;
  --csl-chrome: #3c4654;
  background: #f6f1ff;
  color: #13181f;
}

html[data-theme="portal"] .folio-news .wire-card-headline,
html[data-theme="portal"] .folio-news .wire-card-headline-link,
html[data-theme="portal"] .folio-news .wire-card-body,
html[data-theme="portal"] .folio-news .wire-card-meta,
html[data-theme="portal"] .folio-news .news-card-headline,
html[data-theme="portal"] .folio-news .news-card-asof,
html[data-theme="portal"] .folio-leaderboard .csl-lb-name,
html[data-theme="portal"] .folio-leaderboard .csl-lb-net {
  color: #13181f;
}

/* Auth rooms — the sheet is dark glass in the void, not a paper relic. */
html[data-theme="portal"] :is(.folio-login, .folio-signup, .folio-forgot) .folio-player-scrap {
  padding: 22px 18px 24px;
}

html[data-theme="portal"] .folio-player .auth-sheet-title,
html[data-theme="portal"] .folio-player .login-copy h1 {
  color: var(--portal-ink);
}

html[data-theme="portal"] .folio-player .auth-sheet-lede,
html[data-theme="portal"] .folio-player .login-copy p,
html[data-theme="portal"] .folio-player .auth-sheet-extra,
html[data-theme="portal"] .folio-player .auth-password-rule,
html[data-theme="portal"] .folio-player .login-form label {
  color: var(--portal-muted);
}

html[data-theme="portal"] .folio-player .auth-sheet-tab {
  border-color: rgba(246, 241, 255, 0.35);
  color: var(--portal-ink);
  background: transparent;
  min-height: 40px;
}

html[data-theme="portal"] .folio-player .auth-sheet-tab.is-active {
  background: var(--portal-gold);
  border-color: var(--portal-gold);
  color: #1a1204;
}

html[data-theme="portal"] .folio-player .login-form input {
  max-width: 100%;
  border-color: rgba(246, 241, 255, 0.25);
}

html[data-theme="portal"] .folio-player .login-form .cta-primary {
  border: 2px solid #1a1204;
  border-radius: 999px;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.28), transparent 42%),
    linear-gradient(180deg, #ffe08a, var(--portal-gold) 55%, #c4922a);
  color: #1a1204;
  box-shadow:
    0 0 0 1px rgba(255, 255, 255, 0.25) inset,
    0 5px 0 #8a6414,
    0 10px 22px rgba(240, 184, 74, 0.25);
}

html[data-theme="portal"] .folio-player .login-form .cta-primary:active {
  transform: translateY(2px);
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.18), transparent 42%),
    linear-gradient(180deg, #f3cf6d, #d9a53f 55%, #b08325);
  box-shadow:
    0 0 0 1px rgba(255, 255, 255, 0.18) inset,
    0 3px 0 #8a6414,
    0 6px 14px rgba(240, 184, 74, 0.2);
}

html[data-theme="portal"] .folio-player .login-form .cta-secondary {
  background: transparent;
  border: 1px solid rgba(246, 241, 255, 0.3);
  color: var(--portal-ink);
  min-height: 44px;
  border-radius: 999px;
}

html[data-theme="portal"] .folio-player .auth-password-toggle {
  color: var(--portal-gold);
}

html[data-theme="portal"] .folio-player .form-field-error,
html[data-theme="portal"] .folio-player .form-error {
  color: #ff8f8f;
}

html[data-theme="portal"] .folio-player .form-success {
  color: #52e3a4;
}

html[data-theme="portal"] .folio-player .login-form .text-link,
html[data-theme="portal"] .folio-player .login-foot .text-link,
html[data-theme="portal"] .folio-player .auth-sheet-inline {
  color: var(--portal-gold);
}

html[data-theme="portal"] .folio-player .login-copy .eyebrow {
  color: var(--portal-muted);
}

html[data-theme="portal"] .feedback-toggle {
  background: #1c0830;
  color: #f6f1ff;
  border: 1px solid rgba(246, 241, 255, 0.28);
  box-shadow: 0 10px 28px rgba(0, 0, 0, 0.35);
}

html[data-theme="portal"] .feedback-form {
  width: min(360px, calc(100% - 32px));
  background: #1c0830;
  border: 1px solid rgba(246, 241, 255, 0.22);
  color: #f6f1ff;
  box-shadow: 0 18px 48px rgba(0, 0, 0, 0.4);
}

html[data-theme="portal"] .feedback-form label {
  color: #f0b84a;
}

html[data-theme="portal"] .feedback-form textarea {
  background: #f6f1ff;
  color: #13181f;
  caret-color: #13181f;
  border-color: rgba(19, 24, 31, 0.18);
}

html[data-theme="portal"] .feedback-form .cta-primary {
  background: #f0b84a;
  color: #1a1204;
  box-shadow: none;
}

html[data-theme="portal"] .feedback-form .cta-secondary {
  color: #f6f1ff;
  border-color: rgba(246, 241, 255, 0.35);
}

html[data-theme="portal"] .feedback-status {
  color: #b7a8c9;
}

html[data-theme="portal"] .folio-set .folio-set-sheet,
html[data-theme="portal"] .folio-indexes .folio-set-sheet {
  box-sizing: border-box;
  width: 100%;
  max-width: 1180px;
  margin: 0 auto;
  padding: 18px 16px 24px;
  border-radius: 16px;
  background: #f6f1ff;
  color: #13181f;
}

html[data-theme="portal"] .folio-set .folio-set-sheet .text-link,
html[data-theme="portal"] .folio-indexes .folio-set-sheet .text-link {
  color: #3c2a78;
}