/* In-game marble wall and block textures at native scale; UI stays readable. */
.world-stage{position:relative;isolation:isolate}
.world-stage>main{position:relative;z-index:1}
.marble-scene{display:none;pointer-events:none;user-select:none}
:root[data-theme="light"] .world-stage{background:#353944}
:root[data-theme="light"] .world-stage>main{padding-bottom:248px}
:root[data-theme="light"] .marble-scene[data-cave-material="marble"]{display:block;position:absolute;inset:0;z-index:0;overflow:hidden}
.marble-atmosphere{position:absolute;inset:0;image-rendering:pixelated;background:
  radial-gradient(ellipse 220px 180px at 9% 8%,#ffe2a33d,transparent 80%),
  radial-gradient(ellipse 250px 220px at 94% 35%,#ffd39733,transparent 80%),
  radial-gradient(ellipse 240px 210px at 4% 66%,#ffe3a632,transparent 80%),
  radial-gradient(ellipse 280px 220px at 84% 94%,#ffd6923b,transparent 80%),
  radial-gradient(ellipse 220px 200px at 30% 100%,#ffdf9c38,transparent 80%),
  linear-gradient(90deg,#080a146e,transparent 20%,#10131d18 54%,transparent 80%,#080a1477),
  linear-gradient(#1a1c2b65,#11131e70),
  url('./assets/marble/marble-wall-tile.svg') 0 0/32px 32px repeat;
}
.marble-depth{position:absolute;inset:0;background:
  radial-gradient(ellipse 300px 120px at 40% 100%,#613a7833,transparent 80%),
  linear-gradient(180deg,#06070be6 0,transparent 160px,transparent calc(100% - 220px),#0a081344 100%),
  linear-gradient(90deg,#08090ebf,transparent 12%,transparent 88%,#08090ec9)}
.marble-rock{position:absolute;left:0;right:0;image-rendering:pixelated}
.marble-tiles{display:block;width:100%;height:100%;max-width:none;overflow:hidden}
.marble-tiles>g>svg{width:16px;height:16px}
.marble-tiles>.cave-pot{height:30px}
.marble-tiles>.granite-pot{width:24px;height:26px}
.marble-water-front{position:absolute;bottom:0;left:0;right:0;height:148px;z-index:2;pointer-events:none}
.marble-water-tiles{display:block;width:100%;height:100%;overflow:hidden}
.cave-water-glint{opacity:.22;animation:cave-water-shimmer 4.8s steps(3,end) infinite}
@keyframes cave-water-shimmer{0%,100%{opacity:.16}50%{opacity:.3}}
.cave-splash{position:absolute;width:1px;height:1px;z-index:3;pointer-events:none;animation:cave-splash-fade .6s linear forwards}
.cave-splash i{position:absolute;width:2px;height:2px;background:#a2b6cf;animation:cave-splash-drop .6s ease-out forwards}
@keyframes cave-splash-drop{0%{transform:translate(0,0)}55%{transform:translate(var(--splash-x),var(--splash-y))}100%{transform:translate(var(--splash-x),3px)}}
@keyframes cave-splash-fade{0%,45%{opacity:.7}100%{opacity:0}}
@media(prefers-reduced-motion:reduce){.cave-water-glint{animation:none}}
.marble-ceiling{top:0;height:80px}
.marble-ceiling .marble-tiles{filter:brightness(.42)}
.marble-floor{bottom:0;height:148px}
.marble-enemy{position:absolute;display:block;object-fit:contain;image-rendering:pixelated;backface-visibility:hidden;filter:brightness(.92) drop-shadow(1px 2px 0 #16132175)}
.marble-enemy.hoplite{width:32px;height:62px}
.marble-enemy.medusa{width:40px;height:58px}
.marble-enemy img{position:absolute;left:50%;bottom:0;transform:translateX(-50%);width:auto;height:auto;max-width:none;image-rendering:pixelated}
.marble-bottom-hoplite{left:18%;bottom:136px}
.marble-bottom-medusa{left:58%;bottom:128px;transform:scaleX(-1)}
.marble-bottom-guard{left:85%;bottom:136px;transform:scaleX(-1)}
.marble-torch{position:absolute;display:block;width:10px;height:20px;background:url('./assets/marble/torch-placed.png') center/contain no-repeat;image-rendering:pixelated;filter:drop-shadow(0 0 3px #ffc763)}
.marble-torch:before{content:'';position:absolute;inset:-85px -80px;background:radial-gradient(ellipse at center,#ffdb8429,transparent 67%);mix-blend-mode:screen}
.marble-torch-a{left:9%;top:8%}.marble-torch-b{right:5%;top:35%}.marble-torch-c{left:4%;top:66%}.marble-torch-d{left:84%;bottom:166px}.marble-torch-e{left:30%;bottom:160px}
/* Reading surfaces remain opaque; cave lighting never washes over the text. */
:root[data-theme="light"] .world-stage :is(.page-heading,.section-title,.section-head-extra,footer,.notice,.result-actions){position:relative;background:var(--theme-surface);border-radius:6px;box-shadow:0 2px 8px #080c1c26}
:root[data-theme="light"] .world-stage :is(.page-heading,.section-title){padding:10px 12px;margin-inline:-12px;border:1px solid #c9c8ce}
:root[data-theme="light"] .world-stage footer{padding:12px;border:1px solid #c9c8ce}
:root[data-theme="light"] .world-stage .empty{background:var(--theme-surface);border-radius:10px}
:root[data-theme="light"] .theme-preview.light{background:#737987 url('./assets/marble/marble-wall-tile.svg') center/32px 32px;color:#e0ddd1;image-rendering:pixelated}
@media(max-width:680px){
  :root[data-theme="light"] .world-stage>main{padding-bottom:216px}
  .marble-ceiling{height:64px}
  .marble-floor{height:124px}
  .marble-water-front{height:124px}
  .marble-bottom-hoplite{left:10%;bottom:104px}
  .marble-bottom-medusa{left:58%;bottom:104px}
  .marble-bottom-guard{display:none}
  .marble-torch-b{right:2%}.marble-torch-d{left:85%;bottom:142px}.marble-torch-e{left:28%;bottom:136px}
}

/* Granite reuses the same native tile geometry; only its own dark scene runs. */
:root[data-theme="dark"] .world-stage{background:#111627}
:root[data-theme="dark"] .world-stage>main{padding-bottom:248px}
:root[data-theme="dark"] .granite-scene{display:block;position:absolute;inset:0;z-index:0;overflow:hidden}
.granite-scene .marble-atmosphere{background:
  radial-gradient(ellipse 220px 180px at 9% 8%,#f5c78b28,transparent 80%),
  radial-gradient(ellipse 250px 220px at 94% 35%,#f5c78b28,transparent 80%),
  radial-gradient(ellipse 240px 210px at 4% 66%,#f5c78b28,transparent 80%),
  radial-gradient(ellipse 280px 220px at 84% 94%,#f5c78b33,transparent 80%),
  radial-gradient(ellipse 220px 200px at 30% 100%,#f5c78b30,transparent 80%),
  linear-gradient(90deg,#03071599,transparent 20%,#060e2518 54%,transparent 80%,#03071599),
  linear-gradient(#07102744,#050b1866),
  url('./assets/granite/granite-wall-tile.svg') 0 0/32px 32px repeat}
.granite-scene .marble-depth{background:radial-gradient(ellipse 330px 150px at 58% 100%,#2d6cc92b,transparent 85%),linear-gradient(180deg,#02040bcc,transparent 160px,transparent calc(100% - 200px),#03071544)}
.granite-scene .marble-ceiling .marble-tiles{filter:brightness(.72)}
.marble-enemy.granite-golem{width:42px;height:52px}
.marble-enemy.granite-elemental{width:42px;height:48px;filter:drop-shadow(0 0 5px #5e8de045)}
:root[data-theme="dark"] .world-stage :is(.page-heading,.section-title,.section-head-extra,footer,.notice,.result-actions){position:relative;background:#0a0f1b;border-radius:6px;box-shadow:0 2px 8px #0005}
:root[data-theme="dark"] .world-stage :is(.page-heading,.section-title){padding:10px 12px;margin-inline:-12px;border:1px solid #344264}
:root[data-theme="dark"] .world-stage footer{padding:12px;border:1px solid #344264}
:root[data-theme="dark"] .world-stage .empty{background:#0a0f1b;border-radius:10px}
.theme-preview.dark{background:#111627 url('./assets/granite/granite-wall-tile.svg') center/32px 32px;color:#89a7df;image-rendering:pixelated}
@media(max-width:680px){:root[data-theme="dark"] .world-stage>main{padding-bottom:216px}}

.placed-chest{image-rendering:pixelated;filter:brightness(.94)}
.granite-scene .placed-chest{filter:brightness(.83)}