/* Overlapping artwork shares the same dark masonry; scenery never sits over controls. */
.castle-passage { position:relative; height:clamp(350px,34vw,520px); margin:-95px 0; z-index:1; pointer-events:none; isolation:isolate; }
.passage-art { position:absolute; inset:-120px 0; width:100%; height:calc(100% + 240px); object-fit:cover; image-rendering:pixelated; transform:translate3d(0,var(--depth-offset,0px),0) scale(1.035); mask-image:linear-gradient(transparent,black 24%,black 73%,transparent); }
.passage-near { position:absolute; inset:-100px -2%; background:url('assets/stone-foreground.png') center / cover; transform:translate3d(0,var(--depth-offset,0px),0); mask-image:linear-gradient(90deg,black,transparent 23%,transparent 77%,black); opacity:.45; }
.passing-mist { position:absolute; inset:0; background:radial-gradient(ellipse at 50% 50%,#5793a30d,transparent 60%); }
.passage-vaults { height:clamp(370px,35vw,540px); }
.passage-chains { height:clamp(370px,35vw,540px); }
.castle-room { --room-accent:var(--gold); --room-glow:#e5964433; position:relative; isolation:isolate; padding:155px max(7vw,28px) 165px; }
.room-backdrop { position:absolute; inset:-90px 0; width:100%; height:calc(100% + 180px); object-fit:cover; object-position:center; image-rendering:pixelated; z-index:-3; pointer-events:none; opacity:.65; transform:translate3d(0,var(--depth-offset,0px),0) scale(1.04); mask-image:linear-gradient(transparent,black 17%,black 78%,transparent); }
.castle-room::before { content:''; position:absolute; inset:0; z-index:-1; pointer-events:none; background:linear-gradient(90deg,transparent,#090d1280 17%,#090d1233 78%,transparent); }
.ambient-light { position:absolute; inset:0; z-index:-2; pointer-events:none; background:radial-gradient(ellipse at 3% 35%,var(--room-glow),transparent 35%),radial-gradient(ellipse at 98% 65%,var(--room-glow),transparent 30%); animation:chamber-light 7s ease-in-out infinite alternate; }
.room-shell { position:relative; width:min(1232px,100%); margin:auto; z-index:2; display:grid; grid-template-columns:minmax(300px,.7fr) minmax(0,1.5fr); gap:clamp(32px,4vw,64px); align-items:center; }
.feature-copy { min-width:0; }
.feature-copy .eyebrow { font-size:9px; margin:0 0 21px; letter-spacing:1.65px; }
.feature-copy h2 { font-size:clamp(48px,4.6vw,68px); line-height:1.04; margin:0 0 27px; }
.feature-copy h2 em { color:var(--room-accent); }
.feature-copy>p:not(.eyebrow) { color:#c3beb3; font-size:14px; line-height:1.85; margin:0 0 20px; max-width:390px; }
.feature-copy>p.feature-lead { color:#eddfc5; font-family:Georgia,serif; font-size:19px; line-height:1.6; margin-bottom:20px; }
.encounter-stage { min-width:0; position:relative; width:100%; padding:0; }
.sanctum { --room-accent:#c5a5f5; --room-glow:#754ad72e; }.sanctum .eyebrow { color:#c5a5f5; }.sanctum .room-backdrop { opacity:.63; }
.magic-layout { grid-template-columns:minmax(300px,.7fr) minmax(0,1.5fr); }
.game-card { display:block; background-image:url('assets/spell-cards.png'); image-rendering:pixelated; width:98px; height:147px; flex:none; }.barrier-card { background-position:-401px -597px; }.fireball-card { background-position:-307px -1px; }
.dungeon { --room-accent:var(--cyan); padding:65px 0 0; }.dungeon::before { display:none; }
.dungeon-scene { position:relative; width:100%; aspect-ratio:1672/941; isolation:isolate; }.portal-art { width:100%; height:100%; object-fit:contain; image-rendering:pixelated; mask-image:linear-gradient(transparent,black 17%,black 87%,transparent); }
.phone-stage { position:absolute; left:56.3%; top:14%; width:18.1%; }.phone { position:relative; aspect-ratio:390/844; width:100%; border:6px solid #111721; border-radius:30px; overflow:hidden; background:#101319; box-shadow:0 0 0 2px #6b8397,0 0 0 4px #070d17,0 16px 38px #000b; }.phone video { display:block; width:100%; height:100%; object-fit:cover; border-radius:24px; }.phone-speaker { position:absolute; top:5px; left:50%; transform:translateX(-50%); width:25%; height:4px; border-radius:3px; background:#020304; z-index:3; }.phone-toggle { position:absolute; bottom:13px; right:12px; z-index:3; }
.portal-aura { position:absolute; left:52.9%; top:9%; width:25%; height:75%; border-radius:43% 43% 8% 8%; box-shadow:0 0 38px 17px #27c9ff35,inset 0 0 33px 12px #5ad6ff44; background:radial-gradient(ellipse,#50caff22,transparent 67%); mix-blend-mode:screen; animation:arcane-breath 5s ease-in-out infinite; pointer-events:none; }
.dungeon-copy { position:absolute; top:clamp(145px,14vw,275px); left:12%; width:31%; }.dungeon-copy .eyebrow { color:var(--cyan); }.dungeon-copy h2 { font-size:clamp(42px,4.6vw,70px); line-height:1.07; margin:22px 0 28px; }.dungeon-copy h2 em { color:#a4d8e6; }.dungeon-copy>p:not(.eyebrow) { font-size:14px; line-height:1.85; color:#c6d2d9; max-width:360px; }
.platform-notes { display:flex; flex-wrap:wrap; gap:15px; font-size:10px; color:#a4c4d1; margin-top:25px; align-items:center; }.platform-notes>span { display:flex; align-items:center; gap:6px; }.platform-notes svg { width:18px; height:18px; fill:none; stroke:currentColor; stroke-width:1.4; }
.portal-invitation { position:relative; text-align:center; margin:0 auto; padding:40px 24px 100px; }.portal-invitation .eyebrow { color:#b1c3c9; font-size:9px; }.portal-invitation h2 { font-size:clamp(50px,5vw,76px); line-height:1.08; margin:20px 0; }.portal-invitation h2 em { color:#abd9e6; }.portal-invitation>p:not(.eyebrow) { font-size:14px; line-height:1.8; color:#aebdc7; margin:0 0 28px; }
.trial-note { padding:24px; font-size:15px; line-height:1.8; text-align:center; }
@keyframes chamber-light { from { opacity:.45; } to { opacity:.85; } }@keyframes arcane-breath { 0%,100% { opacity:.5; } 50% { opacity:.95; } }
.motion-paused [data-depth] { transform:none!important; }
@media(max-width:1100px) { .room-shell { gap:32px; grid-template-columns:1fr; max-width:880px; }.castle-room { padding-inline:5%; }.feature-copy h2 { font-size:50px; }.feature-copy>p:not(.eyebrow) { font-size:13px; }.feature-copy>p.feature-lead { font-size:17px; }.dungeon { padding-inline:0; }.dungeon-copy { left:9%; width:35%; top:145px; }.dungeon-copy h2 { font-size:44px; }.dungeon-copy>p:not(.eyebrow) { font-size:12px; } }
@media(max-width:760px) {
 .castle-passage { height:310px; margin:-85px 0; }.passage-art { width:160%; max-width:none; left:-30%; height:calc(100% + 180px); top:-90px; }.passage-near { opacity:.3; }.passage-vaults,.passage-chains { height:300px; }
 .castle-room { padding:115px 24px 120px; }.room-backdrop { width:170%; max-width:none; left:-35%; opacity:.45; }.room-shell { grid-template-columns:1fr; gap:38px; max-width:570px; }.feature-copy .eyebrow { font-size:8px; letter-spacing:1.1px; margin-bottom:16px; }.feature-copy h2 { font-size:52px; margin-bottom:22px; }.feature-copy h2 br { display:none; }.feature-copy h2 em::before { content:' '; }.feature-copy>p:not(.eyebrow) { font-size:14px; max-width:none; }.feature-copy>p.feature-lead { font-size:19px; }
 .dungeon { padding:115px 0 0; }.dungeon-copy { position:relative; left:auto; top:auto; width:auto; padding:0 24px; max-width:540px; margin:auto; }.dungeon-copy h2 { font-size:53px; margin:18px 0 24px; }.dungeon-copy>p:not(.eyebrow) { font-size:14px; max-width:none; }.platform-notes { margin-top:20px; }.dungeon-scene { width:1000px; height:563px; margin:0 0 0 calc(50% - 652px); }.dungeon { display:flex; flex-direction:column; }.dungeon-copy { order:-1; }.phone { border-radius:24px; border-width:5px; }.phone video { border-radius:19px; }.phone-toggle { right:8px; bottom:10px; }.portal-invitation { padding:0 24px 80px; }.portal-invitation h2 { font-size:50px; }
}
@media(max-width:360px) { .castle-room { padding-inline:20px; }.feature-copy h2 { font-size:45px; }.dungeon { padding-inline:0; }.dungeon-copy h2 { font-size:46px; }.portal-invitation h2 { font-size:44px; } }
@media(prefers-reduced-motion:reduce) { [data-depth] { transform:none!important; } }
/* Rooms sit above their overlapping passages; transparent art margins retain continuity. */
.hero,.castle-room { z-index:2; }
.castle-passage { z-index:1; }
.hero-art { mask-image:linear-gradient(black 72%,transparent); }
.hero-shade { background:radial-gradient(ellipse at 50% 45%,#05091155,transparent 65%); }
@media(max-width:760px) { .hero-shade { background:linear-gradient(0deg,transparent,#090d12 28%,#090d12a0 54%,transparent 77%); }.hero-art { mask-image:linear-gradient(black 65%,transparent); } }

@media(min-width:1101px) { .magic-layout { grid-template-columns:minmax(0,1.5fr) minmax(300px,.7fr); }.magic-layout .feature-copy { order:2; } }
@media(max-width:760px) { .hero { min-height:770px; padding-top:290px; }.hero-art { height:auto; width:100%; min-height:0; object-fit:contain; }.hero-shade { background:linear-gradient(0deg,transparent,#090d12 28%,#090d12a0 54%,transparent 77%); } }

@media(min-width:761px) and (max-width:1000px) {
 .dungeon { display:flex; flex-direction:column; padding-top:120px; }
 .dungeon-copy { position:relative; top:auto; left:auto; width:min(550px,85%); margin:auto; order:-1; }
 .dungeon-copy h2 { font-size:56px; }.dungeon-copy>p:not(.eyebrow) { font-size:14px; max-width:490px; }
 .dungeon-scene { width:1000px; height:563px; margin:0 0 0 calc(50% - 652px); }
 .portal-invitation { padding-top:10px; }
}

/* Keep the playable field prominent, with game reference material beneath it. */
@media(max-width:760px) {
  .encounter-stage { width:calc(100% + 24px); margin-inline:-12px; }
}