/* Paired entrances: whole panels resize together around a constant blade gap. */
#choose-world {
  --choice-inset: max(var(--gutter), calc((100% - 1680px) / 2));
  --blade: clamp(80px, 12vw, 230px);
  --choice-gap: 14px;
  max-width: none;
  padding: 58px 0 72px;
  overflow: clip;
}
#choose-world > .choice-geometry { display: none; }
#choose-world > .choice-wave { opacity: .42; }
#choose-world .choice-heading {
  margin: 0 var(--choice-inset) 60px;
  padding-top: 24px;
  border-top: 1px solid var(--line);
  align-items: center;
  gap: 45px;
  perspective: 1200px;
  transform-style: preserve-3d;
}
#choose-world .choice-heading > div:first-child { min-width: 0; transform-style: preserve-3d; }
#choose-world .choice-heading .eyebrow { margin: 0 0 28px; font-size: 12px; letter-spacing: .1em; color: var(--muted); }
#choose-world .choice-heading h2 { margin: 0; max-width: 100%; transform-style: preserve-3d; }
#choose-world .choice-heading h2 .choice-title-prefix {
  display: block; margin: 0 0 10px; color: var(--muted); background: none;
  -webkit-text-fill-color: currentColor;
  font: 500 clamp(22px, 2.4vw, 36px)/1.25 var(--sans); letter-spacing: -.05em;
  transform: translateZ(-30px);
}
#choose-world .choice-heading h2 .choice-title-main {
  position: relative; display: block; width: fit-content; margin: 0 0 0 36px;
  color: var(--ink); background: none; -webkit-text-fill-color: currentColor;
  font: 500 clamp(62px, 7.5vw, 120px)/1.12 var(--display); letter-spacing: -.045em;
  transform: translateZ(42px); transform-style: preserve-3d;
}
#choose-world .choice-title-main::before, #choose-world .choice-primary::before {
  content: attr(data-echo); position: absolute; inset: -9px auto auto 9px; width: max-content;
  color: transparent; -webkit-text-fill-color: transparent; -webkit-text-stroke: 1px currentColor;
  pointer-events: none; user-select: none; z-index: -1;
}
#choose-world .choice-title-main::before { -webkit-text-stroke-color: color-mix(in srgb, var(--ink) 22%, transparent); transform: translateZ(-50px); }
#choose-world .choice-instruction { position: relative; display: block; width: 235px; max-width: none; flex: none; padding: 34px 0 0; border: 0; transform: translateZ(-40px); }
#choose-world .instruction-index { display: block; color: var(--muted); font: 400 12px/1 var(--sans); letter-spacing: .14em; margin-bottom: 18px; }
#choose-world .choice-instruction p { margin: 0; font: 500 19px/1.65 var(--sans); color: var(--ink); letter-spacing: -.025em; }
#choose-world .choice-instruction br { display: none; }
#choose-world .choice-instruction strong { display: block; font-size: 14px; font-weight: 400; color: var(--muted); }
#choose-world .instruction-line { position: relative; display: block; width: 100%; height: 28px; margin-top: 20px; border-top: 1px solid var(--line); border-right: 1px solid var(--line); transform: skew(-28deg); }
#choose-world .instruction-line::after { content: ''; position: absolute; right: -3px; bottom: 0; width: 5px; height: 5px; background: var(--ink); }

/* Both tracks share one transition, so the diagonal edges remain parallel. */
#choose-world .choice-options { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1fr); gap: 0; padding: 18px 0; align-items: stretch; isolation: isolate; }
#choose-world .choice-shell {
  --choice-card-y: 0px; --choice-depth-x: 0px; --choice-depth-y: 0px; --choice-depth-turn: 0deg;
  --choice-shape: polygon(0 0, 100% 0, calc(100% - var(--blade)) 100%, 0 100%);
  --choice-pad-left: clamp(26px, 7.5vw, 150px);
  --choice-pad-right: calc(var(--blade) + 26px);
  margin-right: calc((var(--choice-gap) - var(--blade)) / 2);
  min-width: 0; isolation: auto; z-index: 1; pointer-events: none;
}
#choose-world .choice-hit { position: absolute; inset: 0; clip-path: var(--choice-shape); pointer-events: auto; cursor: pointer; }
#choose-world .games-shell {
  --choice-shape: polygon(var(--blade) 0, 100% 0, 100% 100%, 0 100%);
  --choice-pad-left: calc(var(--blade) + 26px);
  --choice-pad-right: clamp(26px, 5vw, 100px);
  margin: 0 0 0 calc((var(--choice-gap) - var(--blade)) / 2);
}
#choose-world .choice-stage {
  position: relative; height: 100%; perspective: 1300px; transform-style: preserve-3d; isolation: auto;
  transform: none;
  opacity: 1;
}
#choose-world .collection-choice {
  --card-ink: #fff; --card-muted: #e8e3f2;
  position: relative; display: flex; flex-direction: column;
  min-height: clamp(460px, 36vw, 630px); height: 100%; width: 100%; padding: 0;
  overflow: visible; isolation: auto; border: 0; border-radius: 0; background: none; clip-path: none;
  transform: none; translate: none; transform-style: preserve-3d;
  box-shadow: none; filter: none; color: var(--card-ink); cursor: pointer; pointer-events: none;
}
#choose-world .choice-topline, #choose-world .choice-copy, #choose-world .choice-bottomline { pointer-events: auto; }
#choose-world .choice-shell:is(:hover,:focus-within) .collection-choice,
#choose-world .collection-choice[aria-pressed="true"] { transform: none; box-shadow: none; filter: none; }
#choose-world .collection-choice::before {
  content: ''; position: absolute; inset: 0; pointer-events: none;
  background: linear-gradient(125deg,#211b32,#10111b 85%);
  clip-path: var(--choice-shape); transform: translateZ(0); z-index: -3;
}
#choose-world .choice-games::before { background: linear-gradient(125deg,#102b30,#0b141c 85%); }
/* The room belongs to the complete resizing panel; its fade never flattens type. */
#choose-world .choice-room {
  position: absolute; inset: 0; z-index: -2; pointer-events: none;
  clip-path: var(--choice-shape); transform: translateZ(0);
  opacity: 0; transition: opacity 1s ease;
}
#choose-world .choice-room img {
  display: block; width: 100%; height: 100%; max-width: none; object-fit: cover;
  object-position: center; pointer-events: none; user-select: none;
  mask-image: linear-gradient(90deg,#000 5%,rgba(0,0,0,.9) 40%,rgba(0,0,0,.45) 92%);
}
#choose-world .choice-games .choice-room img {
  mask-image: linear-gradient(90deg,rgba(0,0,0,.4) 8%,rgba(0,0,0,.85) 55%,#000 95%);
}
#choose-world .choice-shell[data-choice-focus="front"] .choice-room,
#choose-world .choice-shell:not([data-choice-focus]):has(.collection-choice:focus-visible) .choice-room { opacity: .62; }
@media (hover: hover) and (pointer: fine) {
  #choose-world .choice-shell:not([data-choice-focus]):hover .choice-room { opacity: .62; }
}
#choose-world .collection-choice::after {
  background: linear-gradient(112deg,transparent 15%,color-mix(in srgb,var(--card-accent) 9%,transparent) 62%,transparent);
  clip-path: var(--choice-shape); transform: translateZ(0); z-index: -1;
  opacity: 1;
  transition: opacity .75s ease;
}
#choose-world .choice-topline {
  position: relative; inset: auto; margin: 32px var(--choice-pad-right) 0 var(--choice-pad-left);
  gap: 16px; align-items: center; transform: translateZ(20px);
}
#choose-world .choice-count { color: #f0eef5; font: 500 12px/1.5 var(--sans); letter-spacing: .035em; white-space: nowrap; }
#choose-world .choice-selection { font: 500 12px/1.4 var(--sans); letter-spacing: .035em; color: #f0eef5; }
#choose-world .choice-check { width: 22px; height: 22px; flex: none; border-color: #fff8; }
#choose-world .choice-copy {
  position: relative; inset: auto; margin: auto var(--choice-pad-right) auto var(--choice-pad-left);
  padding: 56px 0 34px; transform-style: preserve-3d;
}
#choose-world .choice-category { display: block; margin: 0 0 22px; color: #e6e1ed; font: 500 12px/1.5 var(--sans); letter-spacing: .1em; transform: translateZ(8px); }
#choose-world .choice-title { display: block; width: fit-content; max-width: 100%; font: 500 clamp(74px, 8vw, 145px)/1.02 var(--display); letter-spacing: -.045em; transform-style: preserve-3d; }
#choose-world .choice-title > span.choice-primary {
  position: relative; display: block; margin: 0; color: #fff; font: inherit; letter-spacing: inherit;
  transform: translate3d(calc(var(--hover-x) * .16), calc(var(--hover-y) * .16), 60px);
  transform-style: preserve-3d; transition: color .7s ease; text-shadow: 0 8px 24px #0005;
}
#choose-world .choice-primary::before { -webkit-text-stroke-color: color-mix(in srgb,var(--card-accent) 48%, transparent); transform: translate3d(calc(var(--hover-x) * -.3), 0, -18px); }
#choose-world .choice-title > span.choice-secondary {
  display: block; width: max-content; max-width: 100%; margin: 14px 0 0 18px; color: var(--card-accent);
  font: italic 400 clamp(28px, 3.1vw, 53px)/1.12 Georgia, 'Times New Roman', serif; letter-spacing: -.045em;
  transform: translate3d(calc(var(--hover-x) * -.12), calc(var(--hover-y) * -.12), 34px);
  transition: opacity .7s ease;
}
#choose-world .choice-bottomline {
  position: relative; inset: auto; width: auto; margin: 0 var(--choice-pad-right) 28px var(--choice-pad-left);
  padding: 18px 0 0; min-height: 58px; background: none; clip-path: none;
  border-top: 1px solid #ffffff4d; color: #fff; transform: translateZ(45px);
}
#choose-world .choice-cinema .choice-copy { text-align: right; }
#choose-world .choice-cinema .choice-category,
#choose-world .choice-cinema .choice-title { margin-left: auto; }
#choose-world .choice-cinema .choice-title > span.choice-secondary { margin-left: auto; margin-right: 0; }
#choose-world .choice-action { font: 500 14px/1.4 var(--sans); letter-spacing: .04em; }
#choose-world .choice-arrow { width: 44px; height: 44px; border-radius: 0; border: 1px solid var(--card-accent); font-size: 27px; color: var(--card-accent); transform: none; transition: translate .5s ease, background .4s ease; }
#choose-world .collection-choice:hover .choice-arrow { transform: none; }
#choose-world .collection-choice[aria-pressed="true"] .choice-arrow { color: #10111b; background: var(--card-accent); }
#choose-world .collection-choice[aria-pressed="true"] .choice-bottomline { border-color: var(--card-accent); }
#choose-world .choice-mask-shape, #choose-world .choice-outline, #choose-world .choice-orbit-frame,
#choose-world .choice-portal, #choose-world .choice-sparks, #choose-world .choice-aura { display: none; }
#choose-world .choice-vfx { clip-path: var(--choice-shape); transform: translateZ(0); opacity: .28; z-index: 0; }
#choose-world .choice-shell:is(:hover,:focus-within) .choice-vfx { opacity: .65; }
#choose-world .choice-prism { position: absolute; inset: 0; pointer-events: none; transform-style: preserve-3d; z-index: -4; }
#choose-world .choice-prism i { position: absolute; inset: -13px -4px; clip-path: var(--choice-shape); background: none; transform: translateZ(-85px); }
#choose-world .choice-prism i:nth-child(2) { inset: -25px 15px; background: none; border-block: 1px solid color-mix(in srgb,var(--fx-colour) 50%,transparent); transform: translate3d(calc(var(--choice-depth-x) * .35),calc(var(--choice-depth-y) * .15),-115px); }
#choose-world .choice-prism i:nth-child(3) { inset: 8% -5px -6%; background: none; transform: translateZ(-150px); }
#choose-world .choice-stage::after { content: ''; position: absolute; inset: -8px 8px; border: 2px solid var(--fx-colour); pointer-events: none; opacity: 0; transform: translateZ(72px); }
#choose-world .choice-stage:has(.collection-choice:focus-visible)::after { opacity: 1; }
#choose-world .collection-choice:focus-visible { outline: none; }
#choose-world .choice-footer { margin: 32px var(--choice-inset) 0; padding-top: 18px; border-top: 1px solid var(--line); gap: 35px; }
#choose-world .choice-footnote { font-size: 12px; letter-spacing: .06em; }
#choose-world .choice-status { max-width: 45ch; font-size: 13px; line-height: 1.6; text-align: right; }

@media (min-width: 761px) and (hover: hover) and (pointer: fine) {
  #choose-world .choice-options { transition: grid-template-columns .85s cubic-bezier(.22,.68,.18,1); }
  #choose-world .choice-options:has(.choice-shell:not(.games-shell)[data-choice-focus="front"]) { grid-template-columns: minmax(0,1.13fr) minmax(0,.87fr); }
  #choose-world .choice-options:has(.games-shell[data-choice-focus="front"]) { grid-template-columns: minmax(0,.87fr) minmax(0,1.13fr); }
  #choose-world .choice-shell[data-choice-focus="front"] { z-index: 3; }
  #choose-world .choice-shell[data-choice-focus="back"] { z-index: 0; }
  /* Keep every 3D ancestor opaque: group opacity would flatten the depth stack. */
  #choose-world .choice-shell[data-choice-focus="back"] .choice-primary { color: #bfc0c8; }
  #choose-world .choice-shell[data-choice-focus="back"] .choice-secondary { opacity: .7; }
  #choose-world .choice-shell[data-choice-focus="back"] .collection-choice::after { opacity: .3; }
}
[data-theme="light"] #choose-world .collection-choice { --card-tone: #171822; --card-ink: #fff; background: none; }
[data-theme="light"] #choose-world .choice-bottomline { background: none; color: #fff; }
[data-theme="light"] #choose-world .collection-choice:hover .choice-bottomline { background: none; }
[data-theme="light"] #choose-world .collection-choice::after { background: linear-gradient(112deg,transparent 15%,color-mix(in srgb,var(--card-accent) 9%,transparent) 62%,transparent); }

@media (min-width: 761px) and (max-width: 1100px) {
  #choose-world { --blade: 100px; }
  #choose-world .choice-shell { --choice-pad-left: 40px; --choice-pad-right: 110px; }
  #choose-world .games-shell { --choice-pad-left: 120px; --choice-pad-right: 30px; }
  #choose-world .choice-topline { flex-wrap: wrap; gap: 9px; }
  #choose-world .choice-title { font-size: 8.7vw; }
  #choose-world .choice-title > span.choice-secondary { font-size: 3.4vw; }
}
@media (max-width: 760px) {
  #choose-world { --blade: 55px; padding-block: 34px 48px; }
  #choose-world .choice-heading { display: block; margin-bottom: 34px; padding-top: 20px; }
  #choose-world .choice-heading .eyebrow { font-size: 12px; margin-bottom: 24px; }
  #choose-world .choice-heading h2 .choice-title-prefix { font-size: 23px; }
  #choose-world .choice-heading h2 .choice-title-main { font-size: clamp(52px,13vw,88px); margin-left: 12px; }
  #choose-world .choice-instruction { width: auto; display: flex; gap: 20px; align-items: center; padding-top: 24px; transform: none; }
  #choose-world .instruction-index { margin: 0; font-size: 12px; }
  #choose-world .choice-instruction p { font-size: 17px; }
  #choose-world .instruction-line { display: none; }
  #choose-world .choice-options { grid-template-columns: 1fr; gap: 35px; padding-block: 10px; }
  #choose-world .choice-shell { --choice-pad-left: 28px; --choice-pad-right: 76px; margin: 0 22px 0 0; }
  #choose-world .games-shell { --choice-pad-left: 76px; --choice-pad-right: 28px; margin: 0 0 0 22px; }
  #choose-world .choice-stage { transform: none; perspective: 1500px; }
  #choose-world .collection-choice { min-height: 390px; translate: none; }
  #choose-world .choice-topline { flex-wrap: wrap; gap: 7px 15px; margin-top: 24px; }
  #choose-world .choice-count, #choose-world .choice-selection { font-size: 12px; }
  #choose-world .choice-copy { padding-block: 35px 30px; }
  #choose-world .choice-category { font-size: 12px; margin-bottom: 18px; max-width: 24ch; }
  #choose-world .choice-title { font-size: clamp(59px,15vw,92px); }
  #choose-world .choice-title > span.choice-primary { transform: translateZ(25px); }
  #choose-world .choice-title > span.choice-secondary { font-size: clamp(27px,6.8vw,42px); margin-left: 7px; transform: translateZ(12px); }
  #choose-world .choice-bottomline { margin-bottom: 24px; padding-top: 14px; transform: translateZ(18px); gap: 15px; }
  #choose-world .choice-action { font-size: 12px; }
  #choose-world .choice-arrow { width: 36px; height: 36px; flex: none; font-size: 24px; }
  #choose-world .choice-footer { margin-top: 26px; display: block; }
  #choose-world .choice-status { margin-top: 15px; text-align: left; font-size: 13px; }
}
.motion-paused #choose-world .choice-stage { transform: none !important; opacity: 1 !important; }
.motion-paused #choose-world .choice-options { transition: none !important; }
.motion-paused #choose-world .choice-room { transition: none !important; }
.motion-paused #choose-world .collection-choice { translate: none !important; }
.motion-paused #choose-world .choice-primary, .motion-paused #choose-world .choice-secondary { transition: none !important; }
@media print {
  #choose-world .choice-prism, #choose-world .choice-vfx, #choose-world .choice-room { display: none; }
  #choose-world .choice-shell, #choose-world .choice-stage, #choose-world .collection-choice { break-inside: avoid; transform: none !important; }
}