/*
Theme Name: Eric Worship V506 On-Screen Health and Lives
Theme URI: https://space2047.com/
Author: Benjamin Arthur Robinson + ChatGPT
Description: Preserves the clean V505 slide-out game menu while restoring a compact always-visible Health and Lives HUD on the game screen. Movement/view controls and character switching remain visible; missions, maps, inventory, chat, visitors, help and other information remain inside the slide-out menu.
Version: 506.0
Requires at least: 6.0
Tested up to: 6.6
License: GPL-2.0-or-later
Text Domain: eric-worship-v506
*/

:root{--gold:#ffd66b;--violet:#7a35ff;--blue:#34e7ff;--red:#ff3d7f;--dark:#07040d;--glass:rgba(255,255,255,.08)}
*{box-sizing:border-box} html,body{margin:0;min-height:100%;background:#050209;color:#fff;font-family:Inter,ui-sans-serif,system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;overflow:hidden}
a{color:inherit}.screen-reader-text{position:absolute;left:-9999px}.game-shell{position:fixed;inset:0;background:radial-gradient(circle at 50% 25%,#28104d 0,#090311 46%,#020104 100%);overflow:hidden}.game-shell:before{content:"";position:absolute;inset:0;background-image:linear-gradient(90deg,rgba(255,255,255,.05) 1px,transparent 1px),linear-gradient(rgba(255,255,255,.04) 1px,transparent 1px);background-size:42px 42px;mask-image:radial-gradient(circle at center,#000 35%,transparent 90%);pointer-events:none}.top-hud{position:absolute;z-index:40;top:18px;left:18px;right:18px;display:flex;align-items:flex-start;justify-content:center;gap:15px;pointer-events:none;text-align:center}.brand-card,.hint-card{pointer-events:auto;background:linear-gradient(145deg,rgba(14,4,31,.82),rgba(7,4,14,.66));border:1px solid rgba(255,214,107,.35);box-shadow:0 20px 70px rgba(0,0,0,.45),inset 0 0 30px rgba(122,53,255,.18);border-radius:22px;padding:14px 17px;backdrop-filter:blur(12px)}.brand-title{font-family:Georgia,serif;font-size:clamp(20px,3vw,38px);letter-spacing:.04em;color:var(--gold);line-height:1;text-shadow:0 0 18px rgba(255,214,107,.5)}.brand-sub{font-size:12px;opacity:.9;margin-top:7px;color:#dffaff;text-align:center}.hint-card{max-width:365px;font-size:13px;color:#effcff}.hint-card b{color:var(--gold)}#gameCanvas{position:absolute;inset:0;width:100%;height:100%;display:block;image-rendering:auto}.entry-screen{position:absolute;inset:0;z-index:30;display:grid;place-items:center;background:radial-gradient(circle at 50% 30%,rgba(72,22,130,.64),rgba(3,1,7,.98) 66%);transition:opacity .9s ease,visibility .9s ease}.entry-screen.hidden{opacity:0;visibility:hidden;pointer-events:none}.church-front{position:relative;width:min(900px,94vw);height:min(640px,83vh);perspective:1000px}.church-front:before{content:"";position:absolute;left:50%;top:0;transform:translateX(-50%);width:74%;height:76%;clip-path:polygon(50% 0,100% 35%,100% 100%,0 100%,0 35%);background:linear-gradient(120deg,#22104a,#5331a7 35%,#120820 90%);border:3px solid rgba(255,214,107,.58);box-shadow:0 0 90px rgba(122,53,255,.55),inset 0 0 80px rgba(0,0,0,.7)}.rose-window{position:absolute;left:50%;top:10%;transform:translateX(-50%);width:150px;height:150px;border-radius:50%;border:5px solid #ffd66b;background:conic-gradient(from 20deg,#ff367f,#34e7ff,#ffd66b,#7a35ff,#2cffb7,#ff367f);box-shadow:0 0 38px rgba(255,214,107,.6),inset 0 0 26px rgba(0,0,0,.65)}.door-wrap{position:absolute;left:50%;bottom:5%;transform:translateX(-50%);width:min(340px,54vw);height:min(430px,58vh);cursor:pointer;filter:drop-shadow(0 28px 38px rgba(0,0,0,.6))}.door{position:absolute;inset:0;border-radius:170px 170px 10px 10px;border:4px solid #ffd66b;background:linear-gradient(90deg,#1b0c28 0 49%,#08040c 50%,#1f0d2d 51% 100%);overflow:hidden;transition:transform 1s ease}.door:before,.door:after{content:"";position:absolute;top:0;bottom:0;width:50%;background-image:linear-gradient(135deg,rgba(255,54,127,.45),transparent 30%),linear-gradient(45deg,transparent 45%,rgba(52,231,255,.55) 46% 54%,transparent 55%),radial-gradient(circle at 50% 22%,rgba(255,214,107,.8),transparent 12%);border-right:2px solid rgba(255,214,107,.5)}.door:before{left:0}.door:after{right:0;transform:scaleX(-1)}.door-wrap:hover .door{transform:scale(1.025)}.enter-label{position:absolute;left:50%;bottom:18%;transform:translateX(-50%);white-space:nowrap;padding:14px 22px;border-radius:999px;background:rgba(0,0,0,.62);border:1px solid rgba(255,214,107,.7);color:#fff;box-shadow:0 0 30px rgba(52,231,255,.35);font-weight:900;letter-spacing:.08em;text-transform:uppercase}.interaction-panel{position:absolute;z-index:45;left:50%;bottom:30px;transform:translateX(-50%);min-width:min(650px,92vw);padding:14px 18px;border:1px solid rgba(255,214,107,.45);border-radius:20px;background:rgba(5,2,10,.78);backdrop-filter:blur(14px);box-shadow:0 25px 80px rgba(0,0,0,.5);display:none;text-align:center}.interaction-panel.show{display:block}.interaction-title{color:var(--gold);font-weight:900;font-size:18px}.interaction-body{font-size:13px;opacity:.92;margin-top:4px}.modal{position:absolute;inset:0;z-index:70;background:rgba(0,0,0,.65);display:none;align-items:center;justify-content:center;padding:20px}.modal.show{display:flex}.modal-card{position:relative;width:min(820px,94vw);max-height:86vh;overflow:auto;border-radius:28px;padding:30px;background:linear-gradient(140deg,rgba(31,8,62,.97),rgba(6,3,12,.97));border:1px solid rgba(255,214,107,.5);box-shadow:0 30px 120px rgba(0,0,0,.78),inset 0 0 70px rgba(52,231,255,.12)}.modal-close{position:absolute;right:15px;top:12px;width:44px;height:44px;border-radius:50%;border:1px solid rgba(255,255,255,.35);background:#10051c;color:#fff;font-size:26px;cursor:pointer}.modal-card h2{margin:0 48px 12px 0;color:var(--gold);font-family:Georgia,serif;font-size:clamp(28px,4vw,52px)}.modal-card p{font-size:17px;line-height:1.6;color:#f5eeff}.mobile-controls{position:absolute;z-index:50;inset:auto 0 0 0;display:none;pointer-events:none}.pad{position:absolute;bottom:24px;left:22px;width:142px;height:142px;border-radius:50%;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.22);pointer-events:auto}.pad button,.action-buttons button{position:absolute;border:0;border-radius:18px;background:rgba(255,214,107,.86);color:#110414;font-weight:900}.pad .up{left:50%;top:8px;transform:translateX(-50%);width:44px;height:44px}.pad .down{left:50%;bottom:8px;transform:translateX(-50%);width:44px;height:44px}.pad .left{left:8px;top:50%;transform:translateY(-50%);width:44px;height:44px}.pad .right{right:8px;top:50%;transform:translateY(-50%);width:44px;height:44px}.action-buttons{position:absolute;right:22px;bottom:32px;display:flex;gap:10px;pointer-events:auto}.action-buttons button{position:relative;width:72px;height:58px;box-shadow:0 12px 30px rgba(0,0,0,.35)}.wp-content-fallback{display:none}@media(max-width:780px){.hint-card{display:none}.brand-card{padding:10px 12px}.brand-title{font-size:20px}.mobile-controls{display:block}.interaction-panel{bottom:105px}.top-hud{top:10px;left:10px;right:10px}.brand-sub{font-size:11px}.modal-card{padding:24px 18px}.modal-card p{font-size:15px}}

/* Update: title is centred at the top of the 3D church. */
.top-hud .brand-card{margin-left:auto;margin-right:auto;max-width:min(860px,92vw);}
.top-hud .hint-card{position:absolute;right:0;top:0;text-align:left;}
@media(max-width:780px){.top-hud{justify-content:center}.top-hud .brand-card{margin:auto}.top-hud .hint-card{display:none}}


/* Sentient potato statue outside the church doors before entry. */
.potato-statue{position:absolute;left:calc(50% - min(340px,54vw)/2 - 118px);bottom:5.5%;width:104px;height:205px;z-index:3;filter:drop-shadow(0 18px 24px rgba(0,0,0,.55));animation:potatoStatueGlow 3.4s ease-in-out infinite alternate;pointer-events:none}
.potato-body{position:absolute;left:50%;bottom:49px;transform:translateX(-50%);width:78px;height:118px;border-radius:48% 52% 44% 56% / 36% 41% 59% 64%;background:linear-gradient(135deg,#c9b38b,#8e744d 58%,#5f472b);border:3px solid rgba(255,214,107,.8);box-shadow:inset -13px -18px 24px rgba(49,31,12,.45),inset 10px 14px 22px rgba(255,248,207,.28),0 0 28px rgba(255,214,107,.32)}
.potato-body:before,.potato-body:after{content:"";position:absolute;border-radius:50%;background:rgba(62,43,24,.42);box-shadow:18px 48px 0 rgba(62,43,24,.28),-12px 72px 0 rgba(62,43,24,.24)}
.potato-body:before{width:9px;height:7px;left:16px;top:25px}.potato-body:after{width:7px;height:6px;right:14px;top:54px}
.potato-glasses{position:absolute;top:34px;width:25px;height:20px;border:4px solid #120914;border-radius:50%;background:rgba(217,247,255,.18);box-shadow:0 0 8px rgba(52,231,255,.35),inset 0 0 10px rgba(52,231,255,.18);z-index:2}.potato-glasses.left{left:13px}.potato-glasses.right{right:13px}.potato-bridge{position:absolute;top:44px;left:37px;width:10px;height:4px;background:#120914;border-radius:999px;z-index:2}
.potato-eye{position:absolute;top:43px;width:6px;height:6px;border-radius:50%;background:#09050d;z-index:3}.eye-left{left:24px}.eye-right{right:24px}.potato-smile{position:absolute;left:50%;top:70px;width:32px;height:17px;transform:translateX(-50%);border-bottom:5px solid #140713;border-radius:0 0 40px 40px;z-index:2}
.potato-plinth{position:absolute;left:50%;bottom:0;transform:translateX(-50%);width:104px;height:54px;padding-top:18px;text-align:center;font-size:10px;font-weight:900;letter-spacing:.08em;color:#211106;background:linear-gradient(#ffe293,#b9822e 60%,#5e3610);border:2px solid rgba(255,214,107,.9);clip-path:polygon(14% 0,86% 0,100% 100%,0 100%);text-shadow:0 1px 0 rgba(255,255,255,.45);box-shadow:inset 0 6px 16px rgba(255,255,255,.22),0 0 26px rgba(255,214,107,.25)}
@keyframes potatoStatueGlow{from{filter:drop-shadow(0 18px 24px rgba(0,0,0,.55)) drop-shadow(0 0 4px rgba(255,214,107,.18))}to{filter:drop-shadow(0 18px 24px rgba(0,0,0,.55)) drop-shadow(0 0 18px rgba(255,214,107,.55))}}
@media(max-width:780px){.potato-statue{left:calc(50% - min(340px,54vw)/2 - 66px);bottom:5%;width:68px;height:145px}.potato-body{width:52px;height:82px;bottom:36px}.potato-glasses{top:23px;width:17px;height:14px;border-width:3px}.potato-glasses.left{left:8px}.potato-glasses.right{right:8px}.potato-bridge{top:31px;left:24px;width:8px;height:3px}.potato-eye{top:30px;width:4px;height:4px}.eye-left{left:16px}.eye-right{right:16px}.potato-smile{top:48px;width:22px;height:12px;border-bottom-width:4px}.potato-plinth{width:68px;height:38px;padding-top:12px;font-size:7px}}

.modal-shop{display:none;width:max-content;min-width:140px;margin:22px auto 4px;padding:12px 28px;border:1px solid rgba(255,214,107,.9);border-radius:999px;background:linear-gradient(135deg,#ffd66b,#ff9f43);color:#160b1d;font-weight:900;text-align:center;text-decoration:none;box-shadow:0 8px 24px rgba(255,159,67,.25);transition:transform .18s ease,box-shadow .18s ease}.modal-shop.show{display:block}.modal-shop:hover,.modal-shop:focus{transform:translateY(-2px);box-shadow:0 12px 30px rgba(255,159,67,.38)}

/* Centre all information popup titles */
#modalTitle { text-align: center !important; width: 100%; }


/* Koala marriage buttons and inventory */
.modal-actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 12px;
  margin: 18px 0 8px;
}
.modal-actions button,
.inventory-panel button {
  border: 2px solid rgba(255,214,107,.9);
  background: linear-gradient(180deg, rgba(255,214,107,.22), rgba(0,0,0,.22));
  color: #fff7cf;
  border-radius: 999px;
  padding: 10px 16px;
  font-weight: 700;
  cursor: pointer;
  box-shadow: 0 0 16px rgba(255,214,107,.25);
}
.modal-actions button:hover,
.inventory-panel button:hover {
  transform: translateY(-1px);
  box-shadow: 0 0 24px rgba(255,214,107,.42);
}
.inventory-panel {
  position: fixed;
  left: 50%;
  top: 50%;
  right: auto;
  transform: translate(-50%, -50%);
  width: min(560px, calc(100vw - 32px));
  max-height: min(680px, calc(100vh - 32px));
  overflow: auto;
  z-index: 1001;
  display: none;
  padding: 24px;
  border: 2px solid rgba(255,214,107,.8);
  border-radius: 22px;
  background: rgba(7,4,13,.97);
  color: #fff7cf;
  box-shadow: 0 0 70px rgba(0,0,0,.9), 0 0 34px rgba(255,214,107,.28), inset 0 0 20px rgba(255,214,107,.08);
}

.inventory-panel.show { display: block; }
.inventory-panel h2 {
  text-align: center;
  margin: 0 0 14px;
  color: #ffd66b;
}
.inventory-items,
.inventory-use {
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.inventory-use {
  margin-top: 14px;
  border-top: 1px solid rgba(255,214,107,.32);
  padding-top: 12px;
}
@media (max-width: 700px) {
  .inventory-panel {
    width: calc(100vw - 24px);
    max-height: calc(100vh - 24px);
    padding: 18px;
  }
}

#modalActions, .modal-actions {
  pointer-events: auto !important;
}
#modalActions button, .modal-actions button {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  pointer-events: auto !important;
  visibility: visible !important;
  opacity: 1 !important;
  min-width: 150px;
}


/* Koala interactive hover pointer */
.koala,
.koala-hotspot,
.koala-interactive,
[data-koala],
[id*="koala" i],
[class*="koala" i] {
    cursor: pointer !important;
}


/* Author donation collection tin hover tooltip */
.eric-donation-tooltip{
  position:fixed; z-index:999999; display:none; pointer-events:none;
  width:min(360px,calc(100vw - 32px)); padding:14px 16px;
  border:1px solid rgba(255,255,255,.35); border-radius:12px;
  background:rgba(8,16,31,.96); color:#fff; font-size:14px; line-height:1.45;
  box-shadow:0 14px 38px rgba(0,0,0,.45); backdrop-filter:blur(8px);
}
.eric-donation-tooltip.show{display:block;}


/* Church visitor notebook popup */
#infoModal.show .modal-box,
.info-modal.show .modal-box{
  max-width: min(1100px, calc(100vw - 28px));
}

.visitor-notebook-popup{
  text-align:left;
  color:#fff;
}

.visitor-greeting{
  margin:0 0 16px;
  text-align:center;
  font-size:1.16rem;
  font-weight:700;
}

.visitor-notebook-grid{
  display:grid;
  grid-template-columns: minmax(260px, 1fr) minmax(300px, 1.16fr);
  gap:18px;
  align-items:start;
}

.visitor-notebook-form,
.visitor-notebook-board{
  border:1px solid rgba(255,255,255,.26);
  border-radius:16px;
  background:rgba(5, 10, 24, .78);
  box-shadow:0 18px 48px rgba(0,0,0,.35), inset 0 0 22px rgba(126,211,255,.08);
  padding:16px;
}

.visitor-notebook-form label{
  display:block;
  margin:0 0 12px;
  font-weight:700;
  color:#f7e7bd;
}

.visitor-notebook-form input,
.visitor-notebook-form textarea{
  width:100%;
  margin-top:6px;
  padding:11px 12px;
  border-radius:10px;
  border:1px solid rgba(255,255,255,.34);
  background:rgba(255,255,255,.94);
  color:#111;
  font:inherit;
  box-sizing:border-box;
}

.visitor-notebook-form textarea{
  resize:vertical;
  min-height:150px;
}

.visitor-notebook-form button,
.visitor-scroll-controls button{
  cursor:pointer;
  border:1px solid rgba(255,255,255,.35);
  border-radius:999px;
  padding:10px 16px;
  color:#fff;
  font-weight:800;
  background:linear-gradient(135deg,#083b8f,#009cde);
  box-shadow:0 10px 26px rgba(0,0,0,.28);
}

.visitor-notebook-status{
  margin-top:12px;
  min-height:22px;
  color:#c9f4ff;
  font-weight:700;
}

.visitor-scroll-controls{
  display:grid;
  grid-template-columns:auto 1fr auto;
  gap:10px;
  align-items:center;
  text-align:center;
  margin-bottom:12px;
  color:#f7e7bd;
}

.visitor-scroll-controls strong{
  font-size:1rem;
}

.visitor-scroll-controls button{
  min-width:46px;
  padding:9px 12px;
}

.visitor-messages-list{
  max-height:390px;
  overflow-y:auto;
  padding-right:8px;
  scroll-behavior:smooth;
}

.visitor-message-card{
  margin:0 0 12px;
  padding:13px 14px;
  border-radius:14px;
  background:rgba(255,255,255,.10);
  border:1px solid rgba(255,255,255,.16);
}

.visitor-message-card h4{
  margin:0 0 4px;
  color:#fff;
  font-size:1rem;
}

.visitor-message-card time{
  display:block;
  margin-bottom:8px;
  color:#9edcff;
  font-size:.88rem;
}

.visitor-message-card p{
  margin:0;
  white-space:pre-wrap;
  color:#fff;
  line-height:1.45;
}

.visitor-empty{
  padding:18px;
  text-align:center;
  color:#dcecff;
  border:1px dashed rgba(255,255,255,.28);
  border-radius:14px;
}

@media (max-width: 760px){
  .visitor-notebook-grid{
    grid-template-columns:1fr;
  }
  .visitor-messages-list{
    max-height:300px;
  }
}


/* Bottom walking speed slider */
.eric-speed-slider-box{
  position:fixed;
  left:50%;
  bottom:18px;
  transform:translateX(-50%);
  z-index:99999;
  display:flex;
  align-items:center;
  gap:12px;
  padding:12px 18px;
  border:1px solid rgba(255,255,255,.32);
  border-radius:999px;
  background:rgba(5,10,24,.86);
  color:#fff;
  box-shadow:0 14px 38px rgba(0,0,0,.45), inset 0 0 20px rgba(52,231,255,.12);
  backdrop-filter:blur(8px);
  font-weight:800;
  user-select:none;
}

.eric-speed-slider-box label{
  color:#ffe58a;
  white-space:nowrap;
}

.eric-speed-slider-box input[type="range"]{
  width:min(360px,42vw);
  cursor:pointer;
  accent-color:#34e7ff;
}

.eric-speed-slider-box span{
  min-width:52px;
  text-align:center;
  color:#bdf6ff;
}

@media (max-width:700px){
  .eric-speed-slider-box{
    bottom:82px;
    width:calc(100vw - 28px);
    justify-content:center;
    padding:10px 12px;
    gap:8px;
  }
  .eric-speed-slider-box input[type="range"]{
    width:42vw;
  }
}


/* Live visitor numbers: directly under site title, scrollable country breakdown */
.live-visitor-panel{margin:.45rem auto .35rem;max-width:520px;border:1px solid rgba(255,214,92,.8);border-radius:10px;background:rgba(8,8,12,.82);box-shadow:0 4px 18px rgba(0,0,0,.35);overflow:hidden}
.live-visitor-summary{padding:6px 10px;text-align:center;color:#ffe07a;font-size:13px;letter-spacing:.02em}
.live-visitor-countries{max-height:76px;overflow-y:auto;scrollbar-width:thin;padding:0 8px 6px}
.visitor-country-row{display:grid;grid-template-columns:38px 1fr;gap:8px;align-items:center;padding:3px 6px;margin:2px 0;border-radius:6px;background:rgba(255,255,255,.07);color:#fff;font-size:12px;text-align:left}
.visitor-country-row span:first-child{font-weight:800;color:#ffe07a;text-align:center}
.sticky-room-name{position:sticky;top:0;z-index:2;margin:.3rem auto .35rem;padding:5px 10px;max-width:520px;border-radius:999px;background:#f2a51a;color:#241300;font-weight:800;text-align:center;font-size:13px;box-shadow:0 3px 10px rgba(0,0,0,.25)}
@media(max-width:700px){.live-visitor-panel,.sticky-room-name{max-width:94vw}.live-visitor-countries{max-height:62px}.live-visitor-summary,.sticky-room-name{font-size:11px}}

/* Position the live visitor counter on the left of the HUD instead of centred. */
.live-visitor-panel{
  margin:.45rem auto .35rem 0 !important;
  width:min(520px, 42vw);
  max-width:520px;
}
@media(max-width:700px){
  .live-visitor-panel{
    margin:.45rem auto .35rem 0 !important;
    width:min(94vw, 520px);
    max-width:94vw;
  }
}

/* FINAL FIX: pin the live visitor counter to the left side of the screen.
   This overrides the centred brand-card layout. */
#liveVisitorPanel.live-visitor-panel{
  position:fixed !important;
  left:2px !important;
  right:auto !important;
  top:88px !important;
  margin:0 !important;
  width:min(360px, 30vw) !important;
  max-width:360px !important;
  z-index:60 !important;
  text-align:left !important;
}
#liveVisitorPanel .live-visitor-summary{
  text-align:left !important;
}
@media(max-width:700px){
  #liveVisitorPanel.live-visitor-panel{
    left:2px !important;
    right:auto !important;
    top:68px !important;
    width:min(280px, 62vw) !important;
    max-width:62vw !important;
  }
}

/* 2026-07-08 pointer-aligned placement: start near the far-left pointer position and stay at top. */
#liveVisitorPanel.live-visitor-panel{
  left:18px !important;
  right:auto !important;
  top:2px !important;
  transform:none !important;
}
@media(max-width:700px){
  #liveVisitorPanel.live-visitor-panel{
    left:8px !important;
    right:auto !important;
    top:2px !important;
    transform:none !important;
  }
}

/* TRUE VIEWPORT POSITION FIX: visitor panel is now outside the blurred centred brand card.
   This prevents backdrop-filter from turning fixed positioning into brand-card-relative positioning. */
#eric-game-app > #liveVisitorPanel.live-visitor-panel{
  position:fixed !important;
  left:18px !important;
  right:auto !important;
  top:2px !important;
  margin:0 !important;
  transform:none !important;
  width:min(360px,30vw) !important;
  max-width:360px !important;
  z-index:65 !important;
}
@media(max-width:700px){
  #eric-game-app > #liveVisitorPanel.live-visitor-panel{
    left:8px !important;
    right:auto !important;
    top:2px !important;
    width:min(280px,62vw) !important;
    max-width:62vw !important;
  }
}

/* Fix character interaction reply popups so text never gets clipped off the left/right edges */
#infoModal.modal,
.modal#infoModal{
  position:fixed !important;
  inset:0 !important;
  padding:24px !important;
  box-sizing:border-box !important;
  align-items:center !important;
  justify-content:center !important;
}

#infoModal .modal-card,
.modal .modal-card{
  width:min(860px, calc(100vw - 48px)) !important;
  max-width:calc(100vw - 48px) !important;
  box-sizing:border-box !important;
  margin:0 auto !important;
  overflow:auto !important;
}

#modalText,
#infoModal .modal-card p,
.modal-card #modalText{
  display:block !important;
  box-sizing:border-box !important;
  width:100% !important;
  max-width:100% !important;
  margin:0 !important;
  padding:0 10px !important;
  text-align:left !important;
  white-space:normal !important;
  overflow-wrap:anywhere !important;
  word-break:normal !important;
  hyphens:auto !important;
}

@media(max-width:780px){
  #infoModal.modal,
  .modal#infoModal{ padding:14px !important; }
  #infoModal .modal-card,
  .modal .modal-card{
    width:calc(100vw - 28px) !important;
    max-width:calc(100vw - 28px) !important;
    padding:24px 18px !important;
  }
  #modalText,
  #infoModal .modal-card p,
  .modal-card #modalText{
    padding:0 6px !important;
    font-size:15px !important;
    line-height:1.55 !important;
  }
}

/* In-world speech bubbles for Eric's autonomous blessings and character replies */
.world-speech-bubble{position:fixed;z-index:10020;transform:translate(-50%,-115%);max-width:min(360px,72vw);padding:12px 15px;border:2px solid #f4cf63;border-radius:18px;background:rgba(16,12,26,.96);color:#fff;font:700 15px/1.35 Arial,sans-serif;text-align:center;box-shadow:0 8px 28px rgba(0,0,0,.5);pointer-events:none;white-space:normal;overflow-wrap:anywhere}
.world-speech-bubble:after{content:"";position:absolute;left:50%;bottom:-13px;transform:translateX(-50%);border:7px solid transparent;border-top-color:#f4cf63}

/* Inventory popup close button */
.inventory-panel { position: fixed; }
.inventory-close {
  position: absolute; top: 10px; right: 12px; width: 42px; height: 42px;
  padding: 0 !important; border-radius: 50% !important; font-size: 30px; line-height: 36px;
  display: grid; place-items: center; z-index: 3; color: #fff7cf !important;
}

/* Tidy WooCommerce shop popup used by the Merchandise Chapel icon */
.woo-shop-popup-wrap{width:100%;display:grid;gap:12px;align-items:center}
.woo-shop-popup-list{max-height:min(62vh,620px);overflow-y:auto;padding:8px 10px;display:grid;gap:16px;scroll-behavior:smooth}
.woo-shop-popup-product{display:grid;grid-template-columns:120px 1fr;gap:16px;align-items:start;border:2px solid rgba(255,216,107,.75);border-radius:16px;background:rgba(10,8,18,.72);padding:14px;box-shadow:0 8px 22px rgba(0,0,0,.28)}
.woo-shop-popup-product img{width:120px;height:150px;object-fit:cover;border-radius:10px;border:1px solid rgba(255,216,107,.65);background:#111}
.woo-shop-popup-details h3{margin:0 0 8px;color:#ffd86b;font:700 22px/1.2 Georgia,serif;text-align:left}
.woo-shop-popup-price{color:#fff;font:800 18px/1.25 Arial,sans-serif;margin-bottom:8px;text-align:left}
.woo-shop-popup-details p{margin:0 0 12px !important;padding:0 !important;color:#fff2df;font:500 15px/1.45 Arial,sans-serif;text-align:left!important}
.woo-shop-popup-buttons{display:flex;flex-wrap:wrap;gap:10px}
.woo-shop-popup-btn,.woo-shop-popup-btn:visited{display:inline-flex;align-items:center;justify-content:center;min-height:38px;padding:8px 13px;border-radius:999px;background:#ffd86b;color:#1a1020!important;font:800 13px/1 Arial,sans-serif;text-decoration:none;border:2px solid #ffd86b}
.woo-shop-popup-btn.secondary{background:transparent;color:#ffd86b!important}
.woo-shop-scroll{width:100%;min-height:42px;border:2px solid #ffd86b;border-radius:14px;background:rgba(255,216,107,.13);color:#ffd86b;font:900 24px/1 Arial,sans-serif;cursor:pointer}
.woo-shop-scroll:hover{background:rgba(255,216,107,.25)}
.woo-shop-popup-empty{padding:24px;border:2px solid #ffd86b;border-radius:16px;color:#fff;text-align:center;font:700 18px/1.5 Arial,sans-serif}
@media(max-width:620px){.woo-shop-popup-product{grid-template-columns:1fr}.woo-shop-popup-product img{width:100%;height:220px}.woo-shop-popup-buttons{display:grid}.woo-shop-popup-list{max-height:58vh}}

/* Final fix: keep WooCommerce shop popup above all room labels/HUD and display products as tidy square grid cards */
.modal.show{z-index:999999 !important;}
.modal-card{z-index:1000000 !important;}
#stickyRoomName,.sticky-room-name,.top-hud,.brand-card{z-index:100 !important;}
.modal.show .sticky-room-name{display:none!important;}
.woo-shop-popup-wrap{width:100%;display:grid;gap:14px;align-items:center}
.woo-shop-popup-list{max-height:min(62vh,620px);overflow-y:auto;overflow-x:hidden;padding:10px;display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:16px;scroll-behavior:smooth;border:1px solid rgba(255,216,107,.35);border-radius:18px;background:rgba(0,0,0,.18)}
.woo-shop-popup-product{display:flex!important;flex-direction:column;min-height:360px;border:2px solid rgba(255,216,107,.78);border-radius:18px;background:rgba(10,8,18,.86);padding:12px;box-shadow:0 10px 28px rgba(0,0,0,.36);overflow:hidden}
.woo-shop-popup-product img{width:100%!important;aspect-ratio:1/1;height:auto!important;object-fit:cover;border-radius:12px;border:1px solid rgba(255,216,107,.7);background:#111;margin:0 0 10px}
.woo-shop-popup-details{display:flex;flex-direction:column;gap:8px;min-height:0;flex:1}
.woo-shop-popup-details h3{margin:0;color:#ffd86b;font:800 18px/1.16 Georgia,serif;text-align:center;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.woo-shop-popup-price{color:#fff;font:900 17px/1.16 Arial,sans-serif;margin:0;text-align:center;background:rgba(255,216,107,.12);border:1px solid rgba(255,216,107,.45);border-radius:999px;padding:7px 8px;white-space:normal;overflow-wrap:anywhere}
.woo-shop-popup-details p{margin:0!important;padding:0!important;color:#fff2df;font:500 13px/1.35 Arial,sans-serif;text-align:center!important;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.woo-shop-popup-buttons{display:grid;grid-template-columns:1fr;gap:8px;margin-top:auto}
.woo-shop-popup-btn,.woo-shop-popup-btn:visited{display:flex;align-items:center;justify-content:center;min-height:36px;padding:8px 10px;border-radius:999px;background:#ffd86b;color:#1a1020!important;font:900 12px/1 Arial,sans-serif;text-decoration:none;border:2px solid #ffd86b;text-align:center}
.woo-shop-popup-btn.secondary{background:transparent;color:#ffd86b!important}
.woo-shop-scroll{width:100%;min-height:44px;border:2px solid #ffd86b;border-radius:14px;background:rgba(255,216,107,.13);color:#ffd86b;font:900 24px/1 Arial,sans-serif;cursor:pointer;position:relative;z-index:2}
@media(max-width:620px){.woo-shop-popup-list{grid-template-columns:1fr;max-height:58vh}.woo-shop-popup-product{min-height:auto}.woo-shop-popup-details h3{font-size:20px}}


/* Final popup layering and speed polish */
.modal.show{
  position:fixed!important;
  z-index:2147483000!important;
  isolation:isolate!important;
}
.modal.show .modal-card{
  position:relative!important;
  z-index:2147483001!important;
  transform:translateZ(0);
}
body:has(.modal.show) .top-hud,
body:has(.modal.show) .sticky-room-name,
body:has(.modal.show) .brand-card{
  z-index:1!important;
}
.modal.show ~ .top-hud,
.modal.show ~ .mobile-controls{z-index:1!important;}
.woo-shop-popup-buttons{grid-template-columns:1fr!important;}
.woo-shop-popup-btn.secondary{display:none!important;}
.woo-shop-popup-product{contain:content;content-visibility:auto;contain-intrinsic-size:230px 390px;}
.woo-shop-popup-list{overscroll-behavior:contain;}

body.eric-modal-open .top-hud, body.eric-modal-open .sticky-room-name, body.eric-modal-open .brand-card{z-index:1!important;opacity:.08!important;pointer-events:none!important;}

/* Room sign readability fix: make all room labels high-contrast and large enough to read. */
.sticky-room-name,
#stickyRoomName{
  background:linear-gradient(180deg,#09060f,#2b1908)!important;
  color:#fff6bf!important;
  border:3px solid #ffd86b!important;
  border-radius:18px!important;
  padding:10px 24px!important;
  font-family:Georgia,serif!important;
  font-size:clamp(18px,3vw,32px)!important;
  font-weight:900!important;
  line-height:1.08!important;
  text-shadow:0 3px 0 #000,0 0 14px #000!important;
  box-shadow:0 12px 35px rgba(0,0,0,.72),0 0 22px rgba(255,216,107,.36)!important;
  opacity:1!important;
}
#ericStickyRoomName{
  background:linear-gradient(180deg,#09060f,#2b1908)!important;
  color:#fff6bf!important;
  border:3px solid #ffd86b!important;
  font-size:clamp(20px,3.2vw,34px)!important;
  font-weight:900!important;
  text-shadow:0 3px 0 #000,0 0 14px #000!important;
  z-index:120!important;
}
@media(max-width:700px){
  .sticky-room-name,#stickyRoomName,#ericStickyRoomName{font-size:17px!important;padding:8px 14px!important;max-width:96vw!important;}
}

/* Responsive room sign text: allow long room names to fit instead of overflowing. */
.sticky-room-name,#stickyRoomName,#ericStickyRoomName{
  width:fit-content!important;
  min-width:min(280px,88vw)!important;
  max-width:96vw!important;
  white-space:normal!important;
  overflow-wrap:anywhere!important;
  word-break:normal!important;
  box-sizing:border-box!important;
  text-wrap:balance;
  font-size:clamp(15px,2.35vw,30px)!important;
  line-height:1.12!important;
}
@media(max-width:700px){
  .sticky-room-name,#stickyRoomName,#ericStickyRoomName{
    font-size:clamp(13px,4.2vw,18px)!important;
    padding:7px 11px!important;
    min-width:0!important;
  }
}

/* 2026-07-08 RESTORE LIVE VISITOR DISPLAY: keep it visible on the far-left of the viewport.
   Later popup/HUD z-index fixes accidentally allowed the HUD/canvas/modal rules to bury the counter. */
html body #liveVisitorPanel.live-visitor-panel,
html body #eric-game-app > #liveVisitorPanel.live-visitor-panel{
  display:block !important;
  visibility:visible !important;
  opacity:1 !important;
  position:fixed !important;
  left:12px !important;
  top:12px !important;
  right:auto !important;
  bottom:auto !important;
  transform:none !important;
  margin:0 !important;
  width:clamp(210px, 28vw, 360px) !important;
  max-width:360px !important;
  min-height:42px !important;
  z-index:2147482500 !important;
  pointer-events:auto !important;
  box-sizing:border-box !important;
}
html body #liveVisitorPanel .live-visitor-summary,
html body #liveVisitorPanel .live-visitor-countries{
  display:block !important;
  visibility:visible !important;
  opacity:1 !important;
}
html body #liveVisitorPanel .live-visitor-summary{
  text-align:left !important;
  padding:7px 10px !important;
}
html body #liveVisitorPanel .live-visitor-countries{
  max-height:88px !important;
  overflow-y:auto !important;
}
@media(max-width:700px){
  html body #liveVisitorPanel.live-visitor-panel,
  html body #eric-game-app > #liveVisitorPanel.live-visitor-panel{
    left:6px !important;
    top:6px !important;
    width:min(280px, 68vw) !important;
    max-width:68vw !important;
  }
}


/* 2026-07-09 HUD and WooCommerce popup repair
   Keep the Church title and controls visible in every room, and prevent stale modal state from burying them. */
html body:not(.eric-modal-open) #eric-game-app .top-hud{
  display:flex!important;
  visibility:visible!important;
  opacity:1!important;
  position:fixed!important;
  top:14px!important;
  left:18px!important;
  right:18px!important;
  z-index:2147482400!important;
  pointer-events:none!important;
}
html body:not(.eric-modal-open) #eric-game-app .brand-card{
  display:block!important;
  visibility:visible!important;
  opacity:1!important;
  position:relative!important;
  z-index:2147482401!important;
  pointer-events:auto!important;
}
html body:not(.eric-modal-open) #eric-game-app .brand-title{
  display:block!important;
  visibility:visible!important;
  opacity:1!important;
}
html body:not(.eric-modal-open) #eric-game-app .hint-card{
  display:block!important;
  visibility:visible!important;
  opacity:1!important;
  position:fixed!important;
  top:14px!important;
  right:18px!important;
  width:min(390px,32vw)!important;
  max-width:390px!important;
  z-index:2147482402!important;
  pointer-events:auto!important;
  text-align:left!important;
}
html body:not(.eric-modal-open) #ericStickyRoomName{
  display:block!important;
  visibility:visible!important;
  opacity:1!important;
  top:116px!important;
  z-index:2147482300!important;
}
@media(max-width:780px){
  html body:not(.eric-modal-open) #eric-game-app .hint-card{
    display:none!important;
  }
  html body:not(.eric-modal-open) #eric-game-app .top-hud{
    top:10px!important;
    left:10px!important;
    right:10px!important;
  }
  html body:not(.eric-modal-open) #ericStickyRoomName{
    top:82px!important;
  }
}

/* WooCommerce popup: remove the card/outer scrollbar; only the product grid scrolls. */
#infoModal.show{
  position:fixed!important;
  z-index:2147483000!important;
}
#infoModal.show .modal-card{
  overflow:hidden!important;
  max-height:86vh!important;
  z-index:2147483001!important;
}
#infoModal.show #modalText:has(.woo-shop-popup-wrap){
  overflow:visible!important;
  max-height:none!important;
  padding-right:0!important;
}
#infoModal.show .woo-shop-popup-list{
  max-height:calc(86vh - 210px)!important;
  overflow-y:auto!important;
  overflow-x:hidden!important;
}
body.eric-modal-open #ericStickyRoomName,
body.eric-modal-open #eric-game-app .top-hud,
body.eric-modal-open #eric-game-app .brand-card,
body.eric-modal-open #eric-game-app .hint-card{
  z-index:1!important;
  opacity:.08!important;
  pointer-events:none!important;
}

/* 2026-07-09 RESPONSIVE HUD + CONTROL LAYOUT FIX
   Keep the walking speed slider above the on-screen controls and stop the title,
   room name, visitor counter, controls and slider from covering one another. */
html body .eric-speed-slider-box{
  position:fixed!important;
  left:50%!important;
  bottom:178px!important;
  transform:translateX(-50%)!important;
  z-index:2147482200!important;
  max-width:min(680px, calc(100vw - 36px))!important;
  box-sizing:border-box!important;
  pointer-events:auto!important;
}
html body .mobile-controls{
  z-index:2147482100!important;
}
html body .pad{
  bottom:22px!important;
}
html body .action-buttons{
  right:22px!important;
  bottom:30px!important;
  flex-wrap:wrap!important;
  max-width:min(350px, 48vw)!important;
  justify-content:flex-end!important;
}
html body .action-buttons button{
  min-width:70px!important;
}

@media(max-width:980px){
  html body:not(.eric-modal-open) #eric-game-app .top-hud{
    position:fixed!important;
    top:8px!important;
    left:8px!important;
    right:8px!important;
    display:flex!important;
    justify-content:center!important;
    align-items:flex-start!important;
    gap:8px!important;
    pointer-events:none!important;
  }
  html body:not(.eric-modal-open) #eric-game-app .brand-card{
    width:min(58vw, 430px)!important;
    max-width:58vw!important;
    padding:8px 10px!important;
    border-radius:14px!important;
    box-sizing:border-box!important;
  }
  html body:not(.eric-modal-open) #eric-game-app .brand-title{
    font-size:clamp(15px, 3.8vw, 24px)!important;
    line-height:1.05!important;
    overflow-wrap:anywhere!important;
  }
  html body:not(.eric-modal-open) #eric-game-app .brand-sub{
    display:none!important;
  }
  html body:not(.eric-modal-open) #ericStickyRoomName,
  html body #ericStickyRoomName.sticky-room-name{
    position:fixed!important;
    top:72px!important;
    left:50%!important;
    transform:translateX(-50%)!important;
    width:min(430px, 58vw)!important;
    max-width:58vw!important;
    margin:0!important;
    padding:5px 8px!important;
    font-size:11px!important;
    line-height:1.16!important;
    z-index:2147482300!important;
    box-sizing:border-box!important;
  }
  html body #eric-game-app > #liveVisitorPanel.live-visitor-panel,
  html body #liveVisitorPanel.live-visitor-panel{
    position:fixed!important;
    top:8px!important;
    left:8px!important;
    right:auto!important;
    width:min(190px, 36vw)!important;
    max-width:36vw!important;
    max-height:96px!important;
    overflow:hidden!important;
    border-radius:10px!important;
    z-index:2147482350!important;
    box-sizing:border-box!important;
  }
  html body #liveVisitorPanel .live-visitor-summary{
    font-size:10px!important;
    line-height:1.16!important;
    padding:5px 7px!important;
  }
  html body #liveVisitorPanel .live-visitor-countries{
    max-height:56px!important;
    padding:0 5px 5px!important;
  }
  html body #liveVisitorPanel .visitor-country-row{
    grid-template-columns:24px 1fr!important;
    gap:4px!important;
    font-size:10px!important;
    padding:2px 4px!important;
  }
}

@media(max-width:780px){
  html body .mobile-controls{
    display:block!important;
    position:fixed!important;
    left:0!important;
    right:0!important;
    bottom:0!important;
    height:176px!important;
    pointer-events:none!important;
  }
  html body .pad{
    left:12px!important;
    bottom:12px!important;
    width:128px!important;
    height:128px!important;
  }
  html body .pad button{
    width:40px!important;
    height:40px!important;
    border-radius:14px!important;
  }
  html body .action-buttons{
    right:10px!important;
    bottom:14px!important;
    max-width:calc(100vw - 160px)!important;
    display:grid!important;
    grid-template-columns:repeat(2, minmax(64px, 1fr))!important;
    gap:7px!important;
  }
  html body .action-buttons button{
    width:auto!important;
    height:45px!important;
    min-width:64px!important;
    padding:0 8px!important;
    border-radius:14px!important;
    font-size:11px!important;
  }
  html body .eric-speed-slider-box{
    bottom:188px!important;
    left:50%!important;
    width:min(520px, calc(100vw - 18px))!important;
    max-width:calc(100vw - 18px)!important;
    padding:8px 10px!important;
    gap:7px!important;
    border-radius:16px!important;
    flex-wrap:nowrap!important;
  }
  html body .eric-speed-slider-box label{
    font-size:11px!important;
  }
  html body .eric-speed-slider-box input[type="range"]{
    width:calc(100vw - 210px)!important;
    min-width:105px!important;
  }
  html body .eric-speed-slider-box span{
    min-width:42px!important;
    font-size:11px!important;
  }
  html body .interaction-panel{
    bottom:300px!important;
    left:8px!important;
    right:8px!important;
    transform:none!important;
    min-width:0!important;
    width:auto!important;
    max-width:none!important;
    padding:10px 12px!important;
    font-size:12px!important;
  }
}

@media(max-width:520px){
  html body:not(.eric-modal-open) #eric-game-app .top-hud{
    top:6px!important;
    left:5px!important;
    right:5px!important;
    justify-content:flex-end!important;
  }
  html body:not(.eric-modal-open) #eric-game-app .brand-card{
    width:calc(100vw - 142px)!important;
    max-width:calc(100vw - 142px)!important;
    padding:7px 8px!important;
  }
  html body:not(.eric-modal-open) #eric-game-app .brand-title{
    font-size:clamp(13px, 4.3vw, 18px)!important;
    letter-spacing:.01em!important;
  }
  html body:not(.eric-modal-open) #ericStickyRoomName,
  html body #ericStickyRoomName.sticky-room-name{
    top:58px!important;
    left:auto!important;
    right:6px!important;
    transform:none!important;
    width:calc(100vw - 142px)!important;
    max-width:calc(100vw - 142px)!important;
    font-size:10px!important;
  }
  html body #eric-game-app > #liveVisitorPanel.live-visitor-panel,
  html body #liveVisitorPanel.live-visitor-panel{
    left:5px!important;
    top:6px!important;
    width:128px!important;
    max-width:128px!important;
    max-height:86px!important;
  }
  html body #liveVisitorPanel .live-visitor-summary{
    font-size:9px!important;
    padding:4px 5px!important;
  }
  html body #liveVisitorPanel .live-visitor-countries{
    max-height:48px!important;
  }
  html body #liveVisitorPanel .visitor-country-row{
    font-size:9px!important;
    grid-template-columns:18px 1fr!important;
  }
  html body .eric-speed-slider-box{
    bottom:184px!important;
    width:calc(100vw - 12px)!important;
    padding:7px 8px!important;
    gap:5px!important;
  }
  html body .eric-speed-slider-box label{
    font-size:10px!important;
  }
  html body .eric-speed-slider-box input[type="range"]{
    width:calc(100vw - 184px)!important;
    min-width:90px!important;
  }
  html body .eric-speed-slider-box span{
    min-width:36px!important;
    font-size:10px!important;
  }
  html body .pad{
    left:8px!important;
    bottom:10px!important;
    width:118px!important;
    height:118px!important;
  }
  html body .pad button{
    width:36px!important;
    height:36px!important;
  }
  html body .action-buttons{
    right:7px!important;
    bottom:11px!important;
    max-width:calc(100vw - 140px)!important;
    gap:6px!important;
  }
  html body .action-buttons button{
    height:42px!important;
    min-width:58px!important;
    font-size:10px!important;
  }
}

@media(max-height:620px) and (max-width:780px){
  html body .mobile-controls{height:142px!important;}
  html body .pad{width:104px!important;height:104px!important;bottom:8px!important;}
  html body .pad button{width:32px!important;height:32px!important;}
  html body .action-buttons{bottom:9px!important;max-width:calc(100vw - 124px)!important;}
  html body .action-buttons button{height:36px!important;font-size:9px!important;}
  html body .eric-speed-slider-box{bottom:150px!important;}
  html body .interaction-panel{bottom:250px!important;}
}

/* 2026-07-09 CENTRED CONTENT + ENTER-CHURCH CLEARANCE FIX */
#eric-game-app,
#eric-game-app .top-hud,
#eric-game-app .brand-card,
#ericStickyRoomName,
.interaction-panel,
.eric-speed-slider-box{
  text-align:center!important;
}
#eric-game-app .brand-card,
#ericStickyRoomName,
.interaction-panel{
  margin-left:auto!important;
  margin-right:auto!important;
}
/* Keep walking speed away from the central lower interaction/Enter church prompt. */
html body .eric-speed-slider-box{
  top:118px!important;
  bottom:auto!important;
  left:50%!important;
  right:auto!important;
  transform:translateX(-50%)!important;
  justify-content:center!important;
}
html body .interaction-panel{
  left:50%!important;
  right:auto!important;
  transform:translateX(-50%)!important;
  width:min(680px, calc(100vw - 24px))!important;
  max-width:calc(100vw - 24px)!important;
  text-align:center!important;
}
@media(max-width:980px){
  html body .eric-speed-slider-box{top:108px!important;}
}
@media(max-width:780px){
  html body .eric-speed-slider-box{
    top:104px!important;
    bottom:auto!important;
  }
  html body .interaction-panel{
    left:50%!important;
    right:auto!important;
    transform:translateX(-50%)!important;
    bottom:188px!important;
    width:calc(100vw - 16px)!important;
    max-width:calc(100vw - 16px)!important;
  }
}
@media(max-width:520px){
  html body .eric-speed-slider-box{top:96px!important;}
  html body .interaction-panel{bottom:176px!important;}
}
@media(max-height:620px) and (max-width:780px){
  html body .eric-speed-slider-box{top:92px!important;bottom:auto!important;}
  html body .interaction-panel{bottom:148px!important;}
}

/* 2026-07-09 ROOM TITLE + VISITOR STACK FIX
   Centre the room title on desktop and mobile, and stack visitor numbers directly
   under the walking speed panel with matching mobile sizing. */
html body #ericStickyRoomName.sticky-room-name,
html body #stickyRoomName.sticky-room-name,
html body .sticky-room-name{
  position:fixed!important;
  left:50%!important;
  right:auto!important;
  transform:translateX(-50%)!important;
  top:64px!important;
  width:min(680px, calc(100vw - 36px))!important;
  max-width:calc(100vw - 36px)!important;
  margin:0!important;
  text-align:center!important;
  box-sizing:border-box!important;
  z-index:2147482320!important;
}

html body #liveVisitorPanel.live-visitor-panel,
html body #eric-game-app > #liveVisitorPanel.live-visitor-panel{
  position:fixed!important;
  left:50%!important;
  right:auto!important;
  top:174px!important;
  bottom:auto!important;
  transform:translateX(-50%)!important;
  width:min(680px, calc(100vw - 36px))!important;
  max-width:calc(100vw - 36px)!important;
  max-height:116px!important;
  margin:0!important;
  text-align:center!important;
  box-sizing:border-box!important;
  z-index:2147482210!important;
}
html body #liveVisitorPanel .live-visitor-summary,
html body #liveVisitorPanel .live-visitor-countries{
  text-align:center!important;
}
html body #liveVisitorPanel .visitor-country-row{
  text-align:left!important;
}

@media(max-width:980px){
  html body #ericStickyRoomName.sticky-room-name,
  html body #stickyRoomName.sticky-room-name,
  html body .sticky-room-name{
    top:62px!important;
    left:50%!important;
    right:auto!important;
    transform:translateX(-50%)!important;
    width:min(520px, calc(100vw - 18px))!important;
    max-width:calc(100vw - 18px)!important;
  }
  html body #liveVisitorPanel.live-visitor-panel,
  html body #eric-game-app > #liveVisitorPanel.live-visitor-panel{
    top:162px!important;
    left:50%!important;
    right:auto!important;
    transform:translateX(-50%)!important;
    width:min(520px, calc(100vw - 18px))!important;
    max-width:calc(100vw - 18px)!important;
  }
}

@media(max-width:780px){
  html body #ericStickyRoomName.sticky-room-name,
  html body #stickyRoomName.sticky-room-name,
  html body .sticky-room-name{
    top:58px!important;
    width:calc(100vw - 12px)!important;
    max-width:calc(100vw - 12px)!important;
    font-size:11px!important;
    padding:6px 9px!important;
  }
  html body #liveVisitorPanel.live-visitor-panel,
  html body #eric-game-app > #liveVisitorPanel.live-visitor-panel{
    top:154px!important;
    width:calc(100vw - 12px)!important;
    max-width:calc(100vw - 12px)!important;
    max-height:92px!important;
    border-radius:16px!important;
  }
  html body #liveVisitorPanel .live-visitor-summary{
    font-size:10px!important;
    line-height:1.16!important;
    padding:5px 8px!important;
  }
  html body #liveVisitorPanel .live-visitor-countries{
    max-height:54px!important;
    padding:0 7px 6px!important;
  }
  html body #liveVisitorPanel .visitor-country-row{
    grid-template-columns:28px 1fr!important;
    gap:6px!important;
    font-size:10px!important;
    padding:2px 5px!important;
  }
}

@media(max-width:520px){
  html body:not(.eric-modal-open) #eric-game-app .top-hud{
    justify-content:center!important;
  }
  html body:not(.eric-modal-open) #eric-game-app .brand-card{
    width:calc(100vw - 12px)!important;
    max-width:calc(100vw - 12px)!important;
  }
  html body #ericStickyRoomName.sticky-room-name,
  html body #stickyRoomName.sticky-room-name,
  html body .sticky-room-name{
    top:54px!important;
    left:50%!important;
    right:auto!important;
    transform:translateX(-50%)!important;
    width:calc(100vw - 12px)!important;
    max-width:calc(100vw - 12px)!important;
  }
  html body #liveVisitorPanel.live-visitor-panel,
  html body #eric-game-app > #liveVisitorPanel.live-visitor-panel{
    top:144px!important;
    left:50%!important;
    right:auto!important;
    transform:translateX(-50%)!important;
    width:calc(100vw - 12px)!important;
    max-width:calc(100vw - 12px)!important;
    max-height:86px!important;
  }
}

@media(max-height:620px) and (max-width:780px){
  html body #ericStickyRoomName.sticky-room-name,
  html body #stickyRoomName.sticky-room-name,
  html body .sticky-room-name{
    top:50px!important;
  }
  html body #liveVisitorPanel.live-visitor-panel,
  html body #eric-game-app > #liveVisitorPanel.live-visitor-panel{
    top:138px!important;
    max-height:76px!important;
  }
  html body #liveVisitorPanel .live-visitor-countries{
    max-height:42px!important;
  }
}


/* 2026-07-09 HARD FIX: centre JS-created room title by ID as well as class.
   The room title is created in JavaScript, so this targets #ericStickyRoomName directly. */
html body #ericStickyRoomName{
  position:fixed!important;
  left:50vw!important;
  right:auto!important;
  transform:translateX(-50%)!important;
  top:64px!important;
  width:min(680px, calc(100vw - 36px))!important;
  max-width:calc(100vw - 36px)!important;
  margin-left:0!important;
  margin-right:0!important;
  text-align:center!important;
  box-sizing:border-box!important;
}
html body #liveVisitorPanel.live-visitor-panel{
  left:50vw!important;
  transform:translateX(-50%)!important;
  width:min(680px, calc(100vw - 36px))!important;
  max-width:calc(100vw - 36px)!important;
}
@media(max-width:780px){
  html body #ericStickyRoomName{
    left:50vw!important;
    width:calc(100vw - 12px)!important;
    max-width:calc(100vw - 12px)!important;
    top:58px!important;
  }
  html body #liveVisitorPanel.live-visitor-panel{
    left:50vw!important;
    width:calc(100vw - 12px)!important;
    max-width:calc(100vw - 12px)!important;
  }
}
@media(max-width:520px){
  html body #ericStickyRoomName{
    left:50vw!important;
    width:calc(100vw - 12px)!important;
    max-width:calc(100vw - 12px)!important;
    top:54px!important;
  }
}

/* 2026-07-09 REVERT GRAPHICS + DESKTOP ONSCREEN CONTROLS
   Based on the previous stable room-title-centred version. Keep the mobile movement
   controls visible on desktop as well, without changing the game renderer/graphics. */
html body .mobile-controls{
  display:block!important;
  position:fixed!important;
  left:0!important;
  right:0!important;
  bottom:0!important;
  height:176px!important;
  z-index:2147482100!important;
  pointer-events:none!important;
}
html body .mobile-controls .pad,
html body .mobile-controls .action-buttons{
  pointer-events:auto!important;
}
@media(min-width:781px){
  html body .mobile-controls{
    height:168px!important;
  }
  html body .pad{
    left:22px!important;
    bottom:22px!important;
    width:142px!important;
    height:142px!important;
  }
  html body .pad button{
    width:44px!important;
    height:44px!important;
    border-radius:18px!important;
    font-size:20px!important;
  }
  html body .action-buttons{
    right:22px!important;
    bottom:32px!important;
    display:grid!important;
    grid-template-columns:repeat(2, 110px)!important;
    gap:10px!important;
    max-width:240px!important;
  }
  html body .action-buttons button{
    width:110px!important;
    height:58px!important;
    min-width:110px!important;
    border-radius:18px!important;
    font-size:14px!important;
  }
}


/* 2026-07-09 DEFINITIVE REQUEST FIX
   Remove the walking-speed panel everywhere and put the live visitor counter
   at the bottom middle of the screen between the left direction arrows and
   the right turn/look/interact controls. */
html body .eric-speed-slider-box,
html body #ericWalkingSpeedSlider,
html body label[for="ericWalkingSpeedSlider"],
html body #ericWalkingSpeedValue{
  display:none!important;
  visibility:hidden!important;
  opacity:0!important;
  pointer-events:none!important;
  width:0!important;
  height:0!important;
  overflow:hidden!important;
}

html body #liveVisitorPanel.live-visitor-panel,
html body #eric-game-app > #liveVisitorPanel.live-visitor-panel{
  position:fixed!important;
  left:50vw!important;
  right:auto!important;
  top:auto!important;
  bottom:28px!important;
  transform:translateX(-50%)!important;
  width:min(360px, calc(100vw - 420px))!important;
  min-width:230px!important;
  max-width:360px!important;
  max-height:128px!important;
  margin:0!important;
  text-align:center!important;
  box-sizing:border-box!important;
  z-index:2147482300!important;
  pointer-events:auto!important;
}
html body #liveVisitorPanel .live-visitor-summary{
  font-size:12px!important;
  line-height:1.2!important;
  padding:6px 8px!important;
  text-align:center!important;
}
html body #liveVisitorPanel .live-visitor-countries{
  max-height:76px!important;
  overflow-y:auto!important;
  padding:0 7px 6px!important;
}

@media(min-width:781px){
  html body .pad{left:22px!important;bottom:22px!important;}
  html body .action-buttons{right:22px!important;bottom:32px!important;}
  html body #liveVisitorPanel.live-visitor-panel,
  html body #eric-game-app > #liveVisitorPanel.live-visitor-panel{
    bottom:30px!important;
    width:min(360px, calc(100vw - 560px))!important;
  }
}

@media(max-width:780px){
  html body .mobile-controls{height:164px!important;}
  html body .pad{
    left:10px!important;
    bottom:14px!important;
    width:126px!important;
    height:126px!important;
  }
  html body .pad button{
    width:38px!important;
    height:38px!important;
    border-radius:15px!important;
    font-size:17px!important;
  }
  html body .action-buttons{
    right:8px!important;
    bottom:16px!important;
    display:grid!important;
    grid-template-columns:repeat(2, minmax(62px, 1fr))!important;
    gap:7px!important;
    width:142px!important;
    max-width:142px!important;
  }
  html body .action-buttons button{
    width:68px!important;
    height:44px!important;
    min-width:68px!important;
    border-radius:14px!important;
    font-size:10px!important;
    padding:2px!important;
  }
  html body #liveVisitorPanel.live-visitor-panel,
  html body #eric-game-app > #liveVisitorPanel.live-visitor-panel{
    left:50vw!important;
    bottom:16px!important;
    top:auto!important;
    transform:translateX(-50%)!important;
    width:calc(100vw - 310px)!important;
    min-width:96px!important;
    max-width:190px!important;
    max-height:126px!important;
    border-radius:12px!important;
  }
  html body #liveVisitorPanel .live-visitor-summary{
    font-size:9px!important;
    line-height:1.1!important;
    padding:5px 4px!important;
  }
  html body #liveVisitorPanel .live-visitor-countries{
    max-height:70px!important;
    padding:0 4px 4px!important;
  }
  html body #liveVisitorPanel .visitor-country-row{
    grid-template-columns:18px 1fr!important;
    gap:3px!important;
    font-size:8px!important;
    padding:2px 3px!important;
  }
}

@media(max-width:520px){
  html body .pad{
    left:6px!important;
    bottom:12px!important;
    width:116px!important;
    height:116px!important;
  }
  html body .pad button{width:36px!important;height:36px!important;font-size:16px!important;}
  html body .action-buttons{
    right:5px!important;
    bottom:14px!important;
    width:132px!important;
    max-width:132px!important;
    gap:6px!important;
  }
  html body .action-buttons button{
    width:63px!important;
    min-width:63px!important;
    height:42px!important;
    font-size:9px!important;
  }
  html body #liveVisitorPanel.live-visitor-panel,
  html body #eric-game-app > #liveVisitorPanel.live-visitor-panel{
    width:calc(100vw - 270px)!important;
    min-width:74px!important;
    max-width:140px!important;
    bottom:14px!important;
  }
}

@media(max-width:400px){
  html body #liveVisitorPanel.live-visitor-panel,
  html body #eric-game-app > #liveVisitorPanel.live-visitor-panel{
    width:86px!important;
    min-width:86px!important;
    max-width:86px!important;
  }
  html body #liveVisitorPanel .live-visitor-countries{display:none!important;}
}


/* Crisp graphics patch: avoid transform-induced blur and preserve sharp raster scaling */
canvas, img {
  backface-visibility: hidden;
  -webkit-backface-visibility: hidden;
}
canvas {
  image-rendering: auto;
}

/* 2026-07-09 INTERACTION MESSAGE ABOVE VISITOR PANEL
   Keep the interaction prompt vertically clear of the centred visitor panel. */
html body .interaction-panel,
html body #interactionPanel.interaction-panel{
  position:fixed!important;
  left:50%!important;
  right:auto!important;
  top:auto!important;
  bottom:172px!important;
  transform:translateX(-50%)!important;
  z-index:2147482350!important;
}
@media(max-width:780px){
  html body .interaction-panel,
  html body #interactionPanel.interaction-panel{
    bottom:154px!important;
  }
}
@media(max-width:400px){
  html body .interaction-panel,
  html body #interactionPanel.interaction-panel{
    bottom:154px!important;
  }
}

/* Live multiplayer visitors + moderated chat */
.live-chat-toggle{position:fixed;right:18px;top:150px;z-index:2147482500;border:1px solid rgba(255,255,255,.35);border-radius:999px;background:rgba(12,18,34,.9);color:#fff;padding:10px 14px;font-weight:800;cursor:pointer;box-shadow:0 8px 28px rgba(0,0,0,.3)}
.live-chat-panel{display:none;position:fixed;right:18px;top:198px;width:min(360px,calc(100vw - 28px));max-height:58vh;z-index:2147482600;background:rgba(10,15,29,.96);color:#fff;border:1px solid rgba(255,255,255,.25);border-radius:16px;padding:12px;box-shadow:0 18px 55px rgba(0,0,0,.48);backdrop-filter:blur(12px)}
.live-chat-panel.open{display:flex;flex-direction:column;gap:9px}.live-chat-head{display:flex;align-items:center;justify-content:space-between}.live-chat-head button{background:transparent;border:0;color:#fff;font-size:24px;cursor:pointer}.live-chat-name-label{font-size:12px;display:flex;align-items:center;gap:8px}.live-chat-name-label input{flex:1}.live-chat-panel input{background:#fff;color:#111;border:0;border-radius:9px;padding:9px}.live-chat-messages{min-height:120px;max-height:250px;overflow:auto;background:rgba(255,255,255,.07);border-radius:10px;padding:8px}.live-chat-message{padding:6px 4px;border-bottom:1px solid rgba(255,255,255,.09);font-size:13px}.live-chat-message b{color:#ffe36b}.live-chat-form{display:flex;gap:7px}.live-chat-form input{min-width:0;flex:1}.live-chat-form button{border:0;border-radius:9px;padding:8px 12px;background:#ffe36b;color:#111;font-weight:900;cursor:pointer}.live-chat-panel small{opacity:.7}
@media(max-width:780px){.live-chat-toggle{right:8px;top:118px}.live-chat-panel{right:7px;top:160px;max-height:52vh}}

/* Live-chat usability fixes: keep game controls tappable and show real online users. */
.live-chat-users{display:flex;align-items:center;gap:6px;flex-wrap:wrap;font-size:12px;background:rgba(255,255,255,.06);border-radius:10px;padding:7px 8px}
.live-chat-users strong{color:#ffe36b}.live-chat-users button{border:1px solid rgba(255,255,255,.22);border-radius:999px;background:rgba(255,255,255,.12);color:#fff;padding:4px 8px;cursor:pointer;font-weight:800}.live-chat-users span{opacity:.75}
html body .mobile-controls,html body .mobile-controls *{touch-action:none;-webkit-user-select:none;user-select:none}
html body .mobile-controls{z-index:2147482450!important;pointer-events:none!important}
html body .mobile-controls .pad,html body .mobile-controls .action-buttons,html body .mobile-controls button{pointer-events:auto!important}
html body .live-chat-panel.open ~ .mobile-controls{z-index:2147482450!important}
@media(max-width:780px){.live-chat-panel{max-height:44vh}.live-chat-toggle{top:92px!important}.live-chat-panel{top:132px!important}}


/* Sharp rendering profile: keep the WebGL canvas at its intrinsic aspect and avoid
   browser-side blur filters on game artwork. */
#ericGameCanvas,
.eric-game-canvas,
canvas[data-eric-game] {
  image-rendering: auto;
  filter: none !important;
  transform: translateZ(0);
}
.eric-game-wrap img,
.game-modal img,
.room-image,
.wall-art img {
  image-rendering: auto;
  filter: none;
}

/* Nouala hidden-door quest and city room chooser */
#modalActions.modal-actions{display:flex;flex-wrap:wrap;gap:12px;justify-content:center;margin-top:22px}
#modalActions.modal-actions button{appearance:none;border:1px solid rgba(255,214,107,.72);border-radius:999px;padding:12px 18px;background:linear-gradient(180deg,#4e2877,#21102f);color:#fff6c5;font-weight:900;cursor:pointer;box-shadow:0 8px 24px rgba(0,0,0,.35)}
#modalActions.modal-actions button:hover,#modalActions.modal-actions button:focus{transform:translateY(-1px);background:linear-gradient(180deg,#684093,#2d1740);outline:2px solid rgba(52,231,255,.65)}


/* v45: scenery-friendly text-only site and room titles */
#eric-site-title,
.eric-site-title,
#church-title,
.church-title,
#eric-room-title,
.eric-room-title,
#room-title,
.room-title,
.current-room,
.current-location,
.eric-current-room {
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  border: 0 !important;
  border-width: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  outline: 0 !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

/* Keep text legible over changing 3D scenery without drawing a panel. */
#eric-site-title,
.eric-site-title,
#church-title,
.church-title,
#eric-room-title,
.eric-room-title,
#room-title,
.room-title,
.current-room,
.current-location,
.eric-current-room {
  text-shadow: 0 2px 3px rgba(0,0,0,.9), 0 0 7px rgba(0,0,0,.65) !important;
}

.live-chat-target-name{margin-top:2px;color:#ffe36b;font-size:12px;font-weight:800}
.live-chat-message.mine{background:rgba(255,227,107,.13);border-left:3px solid #ffe36b}
.live-chat-message.pending{opacity:.72}
.live-chat-invite-alert{position:fixed;left:50%;top:50%;transform:translate(-50%,-50%);z-index:2147483640;width:min(520px,calc(100vw - 28px));background:rgba(10,15,29,.98);color:#fff;border:2px solid #ffe36b;border-radius:18px;padding:18px;box-shadow:0 24px 80px rgba(0,0,0,.68);font:700 16px/1.45 system-ui,sans-serif}
.live-chat-invite-alert strong{color:#ffe36b}.live-chat-invite-message{margin:12px 0;padding:11px;border-radius:10px;background:rgba(255,255,255,.08);white-space:pre-wrap;word-break:break-word}
.live-chat-invite-actions{display:flex;gap:10px;justify-content:flex-end;flex-wrap:wrap}
.live-chat-invite-actions button{border:0;border-radius:999px;padding:10px 14px;font-weight:900;cursor:pointer}
.live-chat-invite-actions .enter{background:#ffe36b;color:#151515}

.live-chat-panel.incoming-message{animation:liveChatIncomingPulse .7s ease-in-out 3}
@keyframes liveChatIncomingPulse{
  0%,100%{box-shadow:0 18px 55px rgba(0,0,0,.55)}
  50%{box-shadow:0 0 0 4px rgba(255,227,107,.95),0 18px 70px rgba(0,0,0,.72)}
}

/* Noualan Archive book reader */
.nouala-reader{max-width:720px;margin:0 auto;color:#24180f;background:#f3e5bd;border:12px solid #5a321c;border-radius:9px;box-shadow:inset 0 0 45px rgba(83,52,20,.2),0 18px 50px rgba(0,0,0,.45);padding:24px 30px 18px;font-family:Georgia,serif}
.nouala-reader header{text-align:center;border-bottom:2px solid rgba(80,46,20,.35);padding-bottom:14px;margin-bottom:18px}.nouala-reader-kicker{font:700 11px/1.2 system-ui,sans-serif;letter-spacing:.15em;color:#754f2f}.nouala-reader h3{font-size:clamp(22px,4vw,34px);margin:8px 0;color:#3a2114}.nouala-reader-byline{font-style:italic;color:#69492e}.nouala-reader-page p{color:#24180f!important;font-size:17px!important;line-height:1.72!important;text-indent:1.5em;margin:.8em 0}.nouala-reader footer{text-align:center;border-top:1px solid rgba(80,46,20,.3);margin-top:18px;padding-top:12px;font-weight:700;color:#69492e}.modal-actions button:disabled{opacity:.35;cursor:not-allowed;transform:none!important}@media(max-width:700px){.nouala-reader{padding:17px 16px 13px;border-width:7px}.nouala-reader-page p{font-size:15px!important;line-height:1.58!important}}

/* v80: visible archive spine titles and dedicated reader page controls */
.nouala-reader{position:relative;padding-left:72px;padding-right:72px}
.nouala-reader-book-title{font:700 14px/1.35 Georgia,serif;letter-spacing:.05em;text-transform:uppercase;color:#4b2b19;margin:8px auto 3px;max-width:560px}
.nouala-reader-toolbar{display:flex;gap:8px;justify-content:flex-end;align-items:center;position:sticky;top:0;z-index:8;margin:-10px -10px 12px;padding:8px 10px;background:linear-gradient(#f3e5bd 82%,rgba(243,229,189,0));}.nouala-reader-scroll{position:static;width:48px;min-height:48px;border:2px solid #80512b;border-radius:12px;background:#fff2c9;color:#4a2918;box-shadow:0 5px 12px rgba(52,29,12,.22);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;font:900 18px/1 system-ui,sans-serif;cursor:pointer;z-index:3;touch-action:manipulation}
.nouala-reader-scroll small{font-size:9px;letter-spacing:.08em}.nouala-reader-up,.nouala-reader-down{top:auto;bottom:auto}.nouala-reader-scroll:hover:not(:disabled),.nouala-reader-scroll:focus-visible{transform:translateY(-1px);background:#ffe7a2;outline:3px solid rgba(147,91,40,.32)}.nouala-reader-scroll:disabled{opacity:.3;cursor:not-allowed}
@media(max-width:700px){.nouala-reader{padding-left:16px;padding-right:16px}.nouala-reader-toolbar{margin:-6px -6px 10px}.nouala-reader-scroll{width:42px;min-height:42px}.nouala-reader-book-title{font-size:12px}}

.nouala-reader-x{position:static;width:48px;height:48px;border:2px solid #7d2f2f;border-radius:12px;background:#7d2f2f;color:#fff;font:900 20px/1 system-ui,sans-serif;cursor:pointer}.nouala-reader-x:hover,.nouala-reader-x:focus-visible{background:#a33d3d;outline:3px solid rgba(125,47,47,.25)}
.nouala-reader-page{max-height:min(55vh,520px);overflow-y:auto;overscroll-behavior:contain;scroll-behavior:smooth;padding-right:10px}

/* v85 Visual Renaissance: richer glass HUD and sharper readable controls. */
.brand-card,.hint-card,.interaction-panel{border-color:rgba(255,214,107,.72);box-shadow:0 18px 54px rgba(0,0,0,.58),inset 0 0 30px rgba(255,214,107,.06)}
.brand-title{text-shadow:0 2px 16px rgba(255,214,107,.34)}
.live-world-speech{border:2px solid rgba(255,214,107,.85)!important}

/* v88: smaller room-title lettering keeps decorative lines clear of the text. */
.sticky-room-name,#stickyRoomName,#ericStickyRoomName{
  font-size:clamp(13px,1.9vw,24px)!important;
  line-height:1.18!important;
  padding:9px 22px!important;
}
@media(max-width:700px){
  .sticky-room-name,#stickyRoomName,#ericStickyRoomName{
    font-size:clamp(11px,3.5vw,15px)!important;
    padding:7px 12px!important;
  }
}

/* v99: renderer-safe centred church façade and entrance. */
#entryScreen.entry-screen{
  display:grid !important;
  place-items:center !important;
  padding:0 !important;
}
#entryScreen .church-front{
  position:relative !important;
  width:min(900px,94vw) !important;
  height:min(640px,83vh) !important;
  margin:0 auto !important;
  transform:none !important;
}
#entryScreen .church-front::before,
#entryScreen .rose-window{
  pointer-events:none !important;
}
#entryScreen #enterDoor.door-wrap{
  position:absolute !important;
  left:50% !important;
  right:auto !important;
  bottom:5% !important;
  transform:translateX(-50%) !important;
  display:block !important;
  width:min(340px,54vw) !important;
  height:min(430px,58vh) !important;
  margin:0 !important;
  padding:0 !important;
  border:0 !important;
  background:transparent !important;
  z-index:20 !important;
  pointer-events:auto !important;
  touch-action:manipulation !important;
  cursor:pointer !important;
}
#entryScreen #enterDoor .door,
#entryScreen #enterDoor .enter-label{pointer-events:none !important;}
#entryScreen #enterDoor:focus-visible{
  outline:4px solid #34e7ff !important;
  outline-offset:8px !important;
  border-radius:170px 170px 10px 10px !important;
}
@media(max-width:780px){
  #entryScreen .church-front{width:96vw !important;height:78vh !important;}
  #entryScreen #enterDoor.door-wrap{width:min(320px,62vw) !important;height:min(400px,56vh) !important;}
}


/* v105 — genuine left/right page-turning Noualan archive reader */
.nouala-reader{
  max-width:1040px;
  position:relative;
  padding:22px 74px 18px;
  overflow:visible;
  background:linear-gradient(90deg,#e7d09b 0%,#f7ebc8 48.5%,#c8a96e 50%,#f7ebc8 51.5%,#e7d09b 100%);
  border:14px solid #573019;
  border-radius:18px 18px 12px 12px;
  box-shadow:inset 0 0 50px rgba(82,48,15,.23),0 24px 65px rgba(0,0,0,.5);
}
.nouala-reader header{margin:0 0 14px;padding:0 54px 13px;position:relative;z-index:3}
.nouala-reader-x{position:absolute;right:14px;top:12px;z-index:12}
.nouala-book-spread{display:grid;grid-template-columns:1fr 1fr;min-height:min(58vh,590px);perspective:1500px;position:relative}
.nouala-book-spread:after{content:"";position:absolute;left:50%;top:0;bottom:0;width:18px;transform:translateX(-50%);background:linear-gradient(90deg,transparent,rgba(69,38,17,.2),rgba(255,255,255,.34),rgba(69,38,17,.16),transparent);pointer-events:none;z-index:4}
.nouala-book-page{position:relative;padding:30px 38px 34px;background:linear-gradient(100deg,#f8edcf,#fff7df 74%,#ead8ad);box-shadow:inset 0 0 28px rgba(106,70,29,.13);overflow:auto;max-height:min(58vh,590px);scrollbar-width:thin;transform-origin:center right;backface-visibility:hidden}
.nouala-book-page-left{border-radius:10px 2px 2px 10px;box-shadow:inset -16px 0 24px rgba(74,43,17,.12),inset 0 0 28px rgba(106,70,29,.1);transform-origin:right center}
.nouala-book-page-right{border-radius:2px 10px 10px 2px;box-shadow:inset 16px 0 24px rgba(74,43,17,.12),inset 0 0 28px rgba(106,70,29,.1);transform-origin:left center}
.nouala-book-page h3{font-size:clamp(20px,2.2vw,30px);line-height:1.2;margin:0 0 20px;color:#382015;text-align:center}
.nouala-reader-page-copy p{color:#24180f!important;font-size:16px!important;line-height:1.68!important;text-indent:1.4em;margin:.75em 0}
.nouala-page-number{position:absolute;bottom:10px;left:0;right:0;text-align:center;font:700 12px/1 system-ui,sans-serif;color:#765238}
.nouala-page-turn{position:absolute;top:50%;transform:translateY(-50%);z-index:15;width:58px;height:112px;border:2px solid #80512b;border-radius:18px;background:linear-gradient(#fff0bd,#d9b66d);color:#472817;box-shadow:0 8px 22px rgba(44,24,10,.34);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:7px;font:900 48px/.7 Georgia,serif;cursor:pointer;touch-action:manipulation}
.nouala-page-turn small{font:800 9px/1 system-ui,sans-serif;letter-spacing:.08em}
.nouala-page-turn-left{left:8px}.nouala-page-turn-right{right:8px}
.nouala-page-turn:hover:not(:disabled),.nouala-page-turn:focus-visible{background:linear-gradient(#fff7d7,#edca7d);outline:4px solid rgba(147,91,40,.28)}
.nouala-page-turn:disabled{opacity:.28;cursor:not-allowed}
.nouala-reader-next .nouala-book-page-right{animation:noualaTurnNext .42s ease-out}
.nouala-reader-previous .nouala-book-page-left{animation:noualaTurnPrevious .42s ease-out}
@keyframes noualaTurnNext{0%{transform:rotateY(-16deg);filter:brightness(.84)}100%{transform:rotateY(0);filter:brightness(1)}}
@keyframes noualaTurnPrevious{0%{transform:rotateY(16deg);filter:brightness(.84)}100%{transform:rotateY(0);filter:brightness(1)}}
@media(max-width:760px){
  .nouala-reader{padding:58px 12px 14px;border-width:8px;max-width:96vw}
  .nouala-reader header{padding:0 36px 10px;margin-bottom:8px}
  .nouala-book-spread{grid-template-columns:1fr;min-height:55vh}
  .nouala-book-page{padding:25px 24px 34px;max-height:55vh}
  .nouala-book-page-right{display:none}
  .nouala-book-spread:after{display:none}
  .nouala-page-turn{top:9px;transform:none;width:48px;height:42px;border-radius:11px;font-size:31px}
  .nouala-page-turn-left{left:12px}.nouala-page-turn-right{right:66px}
  .nouala-reader-x{right:12px;top:9px;width:46px;height:42px}
  .nouala-reader footer{font-size:11px}
}
@media(prefers-reduced-motion:reduce){.nouala-reader-next .nouala-book-page-right,.nouala-reader-previous .nouala-book-page-left{animation:none}}

/* v111 multiplayer polish */
.live-chat-users .live-typing{display:inline-block;margin-left:4px;color:#9ff7ff;font-size:11px;font-weight:800;animation:ericTypingPulse .8s ease-in-out infinite alternate}.live-chat-message.pending{opacity:.68}.live-chat-message.failed{color:#ffb8b8}@keyframes ericTypingPulse{from{opacity:.45}to{opacity:1}}

/* v139: compact current-location sign.
   Keep the room label readable without covering the scenery on phones. */
html body #ericStickyRoomName.sticky-room-name,
html body #stickyRoomName.sticky-room-name,
html body .sticky-room-name{
  width:max-content!important;
  max-width:min(72vw,520px)!important;
  min-width:0!important;
  padding:5px 15px!important;
  border-width:2px!important;
  border-radius:999px!important;
  font-size:clamp(12px,1.45vw,18px)!important;
  line-height:1.1!important;
  letter-spacing:.025em!important;
  box-shadow:0 5px 16px rgba(0,0,0,.58),0 0 8px rgba(255,216,107,.2)!important;
  backdrop-filter:blur(3px)!important;
}
@media(max-width:780px){
  html body #ericStickyRoomName.sticky-room-name,
  html body #stickyRoomName.sticky-room-name,
  html body .sticky-room-name{
    width:max-content!important;
    max-width:76vw!important;
    padding:4px 11px!important;
    border-width:2px!important;
    font-size:12px!important;
    line-height:1.05!important;
  }
}
@media(max-width:420px){
  html body #ericStickyRoomName.sticky-room-name,
  html body #stickyRoomName.sticky-room-name,
  html body .sticky-room-name{
    max-width:72vw!important;
    padding:3px 9px!important;
    font-size:11px!important;
  }
}

/* v150 mobile control feedback */
html body .mobile-controls button.is-pressed{transform:scale(.94)!important;filter:brightness(1.12)!important;}

/* V151: keep game canvas visible and controls above all 3D overlays. */
#gameCanvas{visibility:visible!important;opacity:1!important;}
.mobile-controls{z-index:10000!important;pointer-events:none!important;}
.mobile-controls button{pointer-events:auto!important;touch-action:none!important;-webkit-user-select:none;user-select:none;}

/* V156: there is no exterior/entry page on any device. The 3D church canvas is
   the first and only view. This also defeats stale page-builder copies of the old
   entry screen while browser caches are being refreshed. */
#entryScreen,
.entry-screen,
.church-front,
body .entry-screen,
body #entryScreen {
  display:none !important;
  visibility:hidden !important;
  opacity:0 !important;
  pointer-events:none !important;
}
#gameCanvas { visibility:visible !important; opacity:1 !important; }


/* V157: desktop and mobile both start directly in the rendered Main Church. */
#entryScreen,.entry-screen,.church-front,#enterDoor{display:none!important;visibility:hidden!important;opacity:0!important;pointer-events:none!important;}
html.eric-direct-church-entry #gameCanvas{display:block!important;visibility:visible!important;opacity:1!important;}

/* V159: canvas remains opaque while desktop WebGL starts. */
#gameCanvas{background:#17120d!important;}

/* V164: recovery canvas must remain below HUD but above the failed WebGL canvas. */
#desktopChurchRecoveryCanvas{position:absolute!important;inset:0!important;z-index:4!important;display:block!important;visibility:visible!important;opacity:1!important;}

/* V168 clean unified renderer verification marker. */
#rendererBuildBadge{position:absolute;right:8px;bottom:8px;z-index:60;padding:4px 7px;border-radius:5px;background:rgba(0,0,0,.55);color:#fff;font:11px/1 Arial,sans-serif;pointer-events:none}
html[data-eric-renderer="v168-unified-clean"] #gameCanvas{display:block!important;visibility:visible!important;opacity:1!important;z-index:1!important}


/* V169: the legacy entry/exterior screen has been physically retired. */
#entryScreen,.entry-screen,.church-front,#enterDoor,.door-wrap.entry-door,.legacy-entry-screen,.wp-content-fallback{display:none!important;visibility:hidden!important;opacity:0!important;pointer-events:none!important;width:0!important;height:0!important;overflow:hidden!important;}
html,body,#page,#eric-game-app{width:100%!important;height:100%!important;min-height:100%!important;}
#eric-game-app{display:block!important;position:fixed!important;inset:0!important;z-index:1!important;}
#gameCanvas{display:block!important;position:absolute!important;inset:0!important;width:100%!important;height:100%!important;visibility:visible!important;opacity:1!important;z-index:1!important;}
#rendererBuildBadge{position:absolute;right:8px;bottom:8px;z-index:60;padding:4px 7px;border-radius:5px;background:rgba(0,0,0,.55);color:#fff;font:11px/1 Arial,sans-serif;pointer-events:none}

/* V170: one dependency-free renderer for desktop and mobile. */
#gameCanvas{position:absolute!important;inset:0!important;width:100%!important;height:100%!important;display:block!important;visibility:visible!important;opacity:1!important;z-index:1!important;background:#17120d!important;touch-action:none!important;}
#rendererBuildBadge{position:absolute;right:8px;bottom:8px;z-index:61;padding:5px 8px;border-radius:6px;background:rgba(0,0,0,.68);color:#fff;font:11px/1 Arial,sans-serif;pointer-events:none;}
#rendererStatus{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);z-index:62;padding:14px 18px;border-radius:12px;background:rgba(0,0,0,.72);color:#ffe6a0;font:700 16px Arial;text-align:center;display:none;}


/* V174: onscreen movement and action controls are available on desktop and mobile. */
html body .mobile-controls{
  display:block!important;
  position:absolute!important;
  left:0!important;
  right:0!important;
  bottom:0!important;
  height:180px!important;
  z-index:2147482450!important;
  pointer-events:none!important;
  visibility:visible!important;
  opacity:1!important;
}
html body .mobile-controls .pad,
html body .mobile-controls .action-buttons,
html body .mobile-controls button{
  visibility:visible!important;
  opacity:1!important;
  pointer-events:auto!important;
}
html body .mobile-controls .pad{
  left:22px!important;
  bottom:22px!important;
  width:142px!important;
  height:142px!important;
}
html body .mobile-controls .action-buttons{
  right:22px!important;
  bottom:32px!important;
  display:flex!important;
  flex-wrap:wrap!important;
  justify-content:flex-end!important;
  max-width:390px!important;
}
html body .mobile-controls .action-buttons button{
  width:82px!important;
  min-width:72px!important;
  height:58px!important;
  font-size:12px!important;
}
@media (max-width:780px){
  html body .mobile-controls{height:150px!important;}
  html body .mobile-controls .pad{left:10px!important;bottom:10px!important;width:112px!important;height:112px!important;}
  html body .mobile-controls .pad button{width:36px!important;height:36px!important;}
  html body .mobile-controls .action-buttons{right:10px!important;bottom:12px!important;max-width:calc(100vw - 138px)!important;gap:6px!important;}
  html body .mobile-controls .action-buttons button{width:64px!important;min-width:58px!important;height:42px!important;font-size:10px!important;padding:2px!important;}
}
@media (max-width:430px){
  html body .mobile-controls .action-buttons{max-width:210px!important;}
  html body .mobile-controls .action-buttons button{width:58px!important;min-width:54px!important;height:38px!important;font-size:9px!important;}
}

/* V176 old-style movement arrow controls are generated as a fixed body-level layer by unified-canvas-v176.js. */
#ericUnifiedControls,#ericUnifiedControls *{visibility:visible!important;opacity:1!important;}


/* V177: permanent, server-rendered movement controls. These do not depend on JS creation. */
#ericOnscreenControls.eric-onscreen-controls{
  display:block!important;visibility:visible!important;opacity:1!important;
  position:fixed!important;inset:0!important;z-index:2147483646!important;
  pointer-events:none!important;font-family:Arial,sans-serif!important;
}
#ericOnscreenControls .eric-movement-pad{
  display:block!important;visibility:visible!important;opacity:1!important;
  position:absolute!important;left:max(14px,env(safe-area-inset-left))!important;
  bottom:max(16px,env(safe-area-inset-bottom))!important;width:136px!important;height:136px!important;
  border-radius:50%!important;background:rgba(10,5,18,.78)!important;
  border:3px solid #ffd66b!important;box-shadow:0 10px 35px rgba(0,0,0,.7)!important;
  pointer-events:auto!important;
}
#ericOnscreenControls button{
  display:block!important;visibility:visible!important;opacity:1!important;
  border:2px solid rgba(255,255,255,.55)!important;background:#ffd66b!important;color:#160917!important;
  font-weight:900!important;box-shadow:0 5px 15px rgba(0,0,0,.55)!important;
  pointer-events:auto!important;touch-action:none!important;-webkit-user-select:none!important;user-select:none!important;
}
#ericOnscreenControls .eric-movement-pad button{
  position:absolute!important;width:46px!important;height:46px!important;border-radius:14px!important;
  padding:0!important;font-size:21px!important;line-height:42px!important;text-align:center!important;
}
#ericOnscreenControls .move-up{left:45px!important;top:4px!important}
#ericOnscreenControls .move-left{left:4px!important;top:45px!important}
#ericOnscreenControls .move-down{left:45px!important;top:86px!important}
#ericOnscreenControls .move-right{left:86px!important;top:45px!important}
#ericOnscreenControls .eric-view-actions{
  display:flex!important;visibility:visible!important;opacity:1!important;
  position:absolute!important;right:max(14px,env(safe-area-inset-right))!important;
  bottom:max(18px,env(safe-area-inset-bottom))!important;max-width:min(480px,calc(100vw - 180px))!important;
  flex-wrap:wrap!important;justify-content:flex-end!important;gap:8px!important;pointer-events:auto!important;
}
#ericOnscreenControls .eric-view-actions button{
  position:relative!important;min-width:76px!important;height:48px!important;padding:4px 9px!important;
  border-radius:14px!important;font-size:11px!important;line-height:1.1!important;
}
#ericOnscreenControls button.is-pressed{transform:scale(.91)!important;filter:brightness(1.15)!important}
@media(max-width:600px){
  #ericOnscreenControls .eric-movement-pad{left:8px!important;bottom:8px!important;width:112px!important;height:112px!important}
  #ericOnscreenControls .eric-movement-pad button{width:38px!important;height:38px!important;font-size:17px!important;line-height:34px!important}
  #ericOnscreenControls .move-up{left:37px!important;top:2px!important}
  #ericOnscreenControls .move-left{left:2px!important;top:37px!important}
  #ericOnscreenControls .move-down{left:37px!important;top:72px!important}
  #ericOnscreenControls .move-right{left:72px!important;top:37px!important}
  #ericOnscreenControls .eric-view-actions{right:8px!important;bottom:9px!important;max-width:calc(100vw - 130px)!important;gap:5px!important}
  #ericOnscreenControls .eric-view-actions button{min-width:54px!important;height:39px!important;padding:2px 5px!important;font-size:9px!important}
}


/* V180 mobile-only control safety layer. */
@media (max-width: 900px), (pointer: coarse) {
  html body #ericOnscreenControls.eric-onscreen-controls {
    display:block!important; visibility:visible!important; opacity:1!important;
    position:fixed!important; left:0!important; right:0!important; top:0!important; bottom:0!important;
    width:100vw!important; height:100dvh!important; z-index:2147483000!important;
    pointer-events:none!important; transform:none!important; overflow:visible!important;
  }
  html body #ericOnscreenControls .eric-movement-pad {
    display:block!important; visibility:visible!important; opacity:1!important;
    position:fixed!important; left:10px!important;
    bottom:calc(12px + env(safe-area-inset-bottom, 0px))!important;
    width:124px!important; height:124px!important; z-index:2147483001!important;
    background:rgba(22,16,18,.84)!important; border:2px solid #f2c75c!important;
    border-radius:50%!important; pointer-events:auto!important;
  }
  html body #ericOnscreenControls .eric-view-actions {
    display:grid!important; visibility:visible!important; opacity:1!important;
    grid-template-columns:repeat(2, minmax(70px,1fr))!important;
    position:fixed!important; right:10px!important;
    bottom:calc(12px + env(safe-area-inset-bottom, 0px))!important;
    width:164px!important; max-width:164px!important; gap:6px!important;
    z-index:2147483001!important; pointer-events:auto!important;
  }
  html body #ericOnscreenControls .eric-view-actions button:last-child {grid-column:1 / -1!important;}
  html body #ericOnscreenControls button {
    display:block!important; visibility:visible!important; opacity:1!important;
    pointer-events:auto!important; -webkit-appearance:none!important; appearance:none!important;
  }
}

/* V184: mobile browser toolbars change the visual viewport. The game and controls use the visible viewport. */
html,body{width:100%!important;height:100%!important;min-height:100%!important;}
html body .game-shell{width:100vw!important;height:100dvh!important;min-height:100dvh!important;inset:0!important;}
#gameCanvas{width:100%!important;height:100%!important;}

/* V198 final safeguard: canvas is the only control surface. */
#ericOnscreenControls,#ericControlsV181,#ericUnifiedControls,.mobile-controls{display:none!important;visibility:hidden!important;opacity:0!important;pointer-events:none!important;}

/* v221 unified WebGL canvas and touch controls */
#gameCanvas{position:absolute!important;inset:0!important;width:100%!important;height:100%!important;touch-action:none;background:#86bde4!important}
#v221Controls{position:fixed;inset:0;z-index:2147483000;pointer-events:none;font-family:system-ui,sans-serif}
#v221Controls button{pointer-events:auto;touch-action:none;user-select:none;-webkit-user-select:none;border:2px solid rgba(255,220,118,.95);background:rgba(20,14,8,.78);color:#fff5c7;border-radius:12px;font-weight:800;box-shadow:0 4px 14px rgba(0,0,0,.38)}
.v221-pad{position:absolute;left:max(14px,env(safe-area-inset-left));bottom:max(18px,calc(env(safe-area-inset-bottom) + 14px));display:grid;grid-template-columns:58px 58px 58px;grid-template-rows:54px 54px;gap:6px}.v221-pad button{font-size:24px}.v221-pad button:nth-child(1){grid-column:2}.v221-pad button:nth-child(2){grid-column:1;grid-row:2}.v221-pad button:nth-child(3){grid-column:2;grid-row:2}.v221-pad button:nth-child(4){grid-column:3;grid-row:2}
.v221-actions{position:absolute;right:max(14px,env(safe-area-inset-right));bottom:max(18px,calc(env(safe-area-inset-bottom) + 14px));display:flex;gap:7px;align-items:end}.v221-actions button{min-width:82px;height:52px;padding:6px 10px}
@media(max-width:700px){.top-hud{pointer-events:none}.hint-card{font-size:11px;max-width:52vw}.brand-card{max-width:44vw}.brand-title{font-size:15px}.v221-actions{flex-direction:column-reverse}.v221-actions button{min-width:92px;height:44px;font-size:11px}.v221-pad{grid-template-columns:52px 52px 52px;grid-template-rows:48px 48px}}

/* v234 unified isometric renderer overrides */
html,body{background:#21180f!important}
.game-shell{background:#21180f!important}
.game-shell:before{display:none!important}
#gameCanvas{background:#21180f!important;touch-action:none;image-rendering:auto}
.top-hud{display:none!important}
#rendererBuildBadge{position:fixed;right:10px;bottom:10px;z-index:1000;padding:6px 9px;border-radius:8px;background:rgba(28,20,14,.76);color:#fff1d2;font:600 11px system-ui,sans-serif;pointer-events:none}
@media(max-width:780px){#rendererBuildBadge{font-size:9px;right:6px;bottom:6px}}


/* V244 — remove original bordered brand title/subtitle; keep only the dynamic location/room title overlay. */
#eric-game-app .brand-card{display:none!important;}
#eric-game-app .top-hud{justify-content:flex-end!important;}
#eric-game-app .top-hud .hint-card{position:relative!important;right:auto!important;top:auto!important;margin-left:auto!important;}
@media(max-width:780px){#eric-game-app .top-hud{display:none!important;}}


/* V314 definitive visitor-counter clearance above the single global controls. */
html body #liveVisitorPanel.live-visitor-panel,
html body #eric-game-app > #liveVisitorPanel.live-visitor-panel{
  bottom:290px!important;
  z-index:2147483640!important;
  width:min(360px,calc(100vw - 24px))!important;
  max-width:360px!important;
}
@media(max-width:780px){
  html body #liveVisitorPanel.live-visitor-panel,
  html body #eric-game-app > #liveVisitorPanel.live-visitor-panel{bottom:255px!important;}
}
@media(max-width:430px){
  html body #liveVisitorPanel.live-visitor-panel,
  html body #eric-game-app > #liveVisitorPanel.live-visitor-panel{bottom:245px!important;}
}


/* V410 automatic diagnostics console ------------------------------------------------ */
#v410DiagnosticsButton{position:fixed;left:12px;top:390px;z-index:2147483000;border:2px solid #ffd66b;border-radius:999px;background:rgba(20,17,13,.92);color:#fff3c6;padding:9px 13px;font:900 12px/1 system-ui,sans-serif;box-shadow:0 8px 28px rgba(0,0,0,.45);cursor:pointer;touch-action:manipulation}
#v410DiagnosticsButton span{display:inline-grid;place-items:center;min-width:20px;height:20px;margin-left:6px;border-radius:999px;background:#31546c;color:#fff;font-size:11px}
#v410DiagnosticsButton.has-errors{background:#6f241d;border-color:#ffb26f;animation:v410DebugPulse 1.6s ease-in-out infinite alternate}
#v410DiagnosticsButton.has-errors span{background:#ffcf73;color:#28180b}
@keyframes v410DebugPulse{from{box-shadow:0 8px 28px rgba(0,0,0,.45)}to{box-shadow:0 0 0 5px rgba(255,178,111,.18),0 8px 28px rgba(0,0,0,.45)}}
#v410DiagnosticsPanel{position:fixed;inset:0;z-index:2147483600;display:none;background:rgba(4,5,8,.82);backdrop-filter:blur(7px);padding:12px;overflow:auto;color:#fff;font-family:system-ui,-apple-system,Segoe UI,sans-serif}
#v410DiagnosticsPanel.open{display:block}
.v410-diagnostics-card{width:min(1000px,100%);margin:0 auto 40px;background:#111923;border:1px solid #d6b86d;border-radius:18px;box-shadow:0 24px 90px rgba(0,0,0,.65);overflow:hidden}
.v410-diagnostics-head{position:sticky;top:0;z-index:3;display:flex;justify-content:space-between;gap:12px;align-items:flex-start;padding:16px 18px;background:#172431;border-bottom:1px solid #41566a}
.v410-diagnostics-head h2{margin:0;color:#ffe29b;font:900 clamp(22px,4vw,34px)/1.05 Georgia,serif}
.v410-diagnostics-head small{display:block;margin-top:5px;color:#c9d5df;line-height:1.35}
.v410-diagnostics-head>button{flex:none;width:42px;height:42px;border-radius:50%;border:1px solid #8193a4;background:#0b1118;color:#fff;font-size:28px;cursor:pointer}
.v410-diagnostics-actions{display:flex;flex-wrap:wrap;gap:8px;align-items:center;padding:12px 16px;background:#0c131b;border-bottom:1px solid #293848}
.v410-diagnostics-actions button{border:1px solid #b99750;border-radius:10px;background:#2a2117;color:#ffe8af;padding:9px 12px;font-weight:800;cursor:pointer}
.v410-diagnostics-actions strong{margin-left:auto;color:#ffe29b}
.v410-diagnostics-card h3{margin:16px 16px 8px;color:#8ed7ff}
.v410-grid{display:grid;grid-template-columns:minmax(110px,180px) 1fr;gap:1px;margin:0 16px 18px;border:1px solid #34495d;background:#34495d;border-radius:10px;overflow:hidden}
.v410-grid>*{padding:8px 10px;background:#111923;min-width:0;overflow-wrap:anywhere}
.v410-grid b{color:#ffd985}.v410-grid span{color:#dce9f2}
.v410-diagnostics-list{display:grid;gap:12px;padding:0 16px 20px}
.v410-log{padding:13px;border:1px solid #405368;border-radius:12px;background:#0b1219}
.v410-log header{display:flex;justify-content:space-between;gap:12px;align-items:center}.v410-log header strong{text-transform:uppercase;letter-spacing:.06em;color:#ffca79}.v410-log time{font-size:11px;color:#9cb0bf;text-align:right}
.v410-log p{margin:8px 0;color:#fff;font-weight:750}.v410-log-meta{font:12px/1.4 ui-monospace,SFMono-Regular,Menlo,monospace;color:#a9c7d8}
.v410-log img{display:block;width:min(100%,720px);height:auto;margin:10px 0 0;border:1px solid #5e7183;border-radius:8px;background:#000}
.v410-log pre{max-height:180px;overflow:auto;white-space:pre-wrap;background:#04080c;border-radius:8px;padding:8px;color:#ffb8a8;font-size:11px}
.v410-empty{padding:12px;color:#9fbdce}
@media(max-width:780px){#v410DiagnosticsButton{left:10px;top:375px;padding:8px 10px;font-size:11px}.v410-diagnostics-card{border-radius:12px}.v410-grid{grid-template-columns:105px 1fr;margin-left:10px;margin-right:10px}.v410-diagnostics-list{padding-left:10px;padding-right:10px}.v410-diagnostics-head{padding:13px}}


/* V411 diagnostics readability and fault classification. */
#v410DiagnosticsPanel.open{z-index:2147483647!important}
body.v411-debug-open #ericV314Controls,
body.v411-debug-open #liveVisitorPanel,
body.v411-debug-open #liveChatToggle,
body.v411-debug-open .top-hud,
body.v411-debug-open #rendererBuildBadge{visibility:hidden!important;pointer-events:none!important}
.v410-log.v410-browser-compatibility-note,.v410-log.v410-external-window-error{border-color:#52697c;background:#101923}
.v410-log.v410-browser-compatibility-note header strong,.v410-log.v410-external-window-error header strong{color:#9ed7f0}
.v411-source{margin:7px 0 0;color:#a8c9dd;font:700 12px/1.35 ui-monospace,SFMono-Regular,Consolas,monospace;overflow-wrap:anywhere}
.v411-stack{margin-top:8px;border:1px solid #324556;border-radius:9px;background:#080e14;padding:8px 10px}
.v411-stack summary{cursor:pointer;color:#c9e8f7;font-weight:800}
.v411-stack pre{white-space:pre-wrap;overflow-wrap:anywhere;color:#f0b7ab;margin:8px 0 0;font-size:11px;line-height:1.45}
@media(max-width:780px){#v410DiagnosticsPanel{padding:0!important}.v410-diagnostics-card{border-radius:0!important;margin:0!important;min-height:100vh}.v410-diagnostics-head{top:0}}

/* V416 whole-world stability audit summary inside Z diagnostics. */
[data-v416-audit-result]{margin:0 16px 14px}
[data-v416-audit-result]>div{display:grid;gap:6px;padding:12px 14px;border-radius:12px;border:1px solid #42566a;background:#0c151e;color:#e8f2fa}
[data-v416-audit-result] strong{font-size:15px}
[data-v416-audit-result] span{color:#b9cbd8;font-size:12px}
[data-v416-audit-result] ul{margin:6px 0 0;padding-left:20px;color:#e7eef3;font-size:12px;line-height:1.45}
[data-v416-audit-result] .v416-audit-ok{border-color:#4d966b;background:#0d2018}
[data-v416-audit-result] .v416-audit-ok strong{color:#8ff0b0}
[data-v416-audit-result] .v416-audit-fail{border-color:#b96565;background:#281313}
[data-v416-audit-result] .v416-audit-fail strong{color:#ffaaa5}
[data-v416-audit-result] .v416-audit-pending{color:#c7d4de}

/* V500 Space 2047 full-game campaign ------------------------------------------------ */
#space2047FullGameV500,#space2047LivingWorldV501{position:fixed;inset:0;z-index:2147483500;pointer-events:none;font-family:Inter,ui-sans-serif,system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;color:#fff}
#space2047FullGameV500 *,#space2047LivingWorldV501 *{box-sizing:border-box}
.space2047-overlay{position:absolute;inset:0;display:none;align-items:center;justify-content:center;padding:18px;background:rgba(2,5,18,.82);backdrop-filter:blur(9px);pointer-events:auto}
.space2047-overlay.open{display:flex}
.space2047-panel{position:relative;width:min(920px,96vw);max-height:90vh;overflow:auto;border:1px solid rgba(255,214,107,.72);border-radius:22px;background:linear-gradient(145deg,rgba(9,17,42,.98),rgba(33,13,52,.98));box-shadow:0 24px 80px rgba(0,0,0,.7),inset 0 0 60px rgba(82,121,255,.08);padding:clamp(18px,3vw,34px)}
.space2047-panel h2,.space2047-panel h3{font-family:Georgia,'Times New Roman',serif;color:#ffe18b;margin-top:0}
.space2047-panel p{line-height:1.55;color:#f4efff}
.space2047-close{position:sticky;float:right;top:0;z-index:4;width:42px;height:42px;border-radius:50%;border:1px solid #e6bf65;background:#3a173c;color:#fff;font-size:26px;cursor:pointer}
.space2047-logo{font:900 clamp(48px,10vw,112px)/.82 Georgia,'Times New Roman',serif;letter-spacing:-.05em;color:#fff;text-align:center;text-shadow:0 0 22px rgba(84,175,255,.5)}
.space2047-logo span{display:block;color:#ffd966;font-size:.78em;letter-spacing:.06em}
.space2047-tagline{text-align:center;font-size:clamp(15px,2vw,22px);max-width:720px;margin:22px auto;color:#dce9ff!important}
.space2047-menu-actions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin-top:20px}
.space2047-menu-actions button,.space2047-hero-card,.space2047-chapter-card,.space2047-map-card,.space2047-dialogue-actions button,.space2047-hud-actions button,.space2047-link-btn,.space2047-mini-controls button{border:1px solid rgba(255,215,119,.7);border-radius:14px;background:linear-gradient(180deg,#273f6d,#16243f);color:#fff;padding:13px 15px;font-weight:850;cursor:pointer;box-shadow:0 6px 18px rgba(0,0,0,.25)}
.space2047-menu-actions button:hover,.space2047-hero-card:hover,.space2047-chapter-card:hover,.space2047-map-card:hover,.space2047-dialogue-actions button:hover{transform:translateY(-1px);filter:brightness(1.12)}
.space2047-menu-actions button:disabled{opacity:.4;cursor:not-allowed}
.space2047-source-note{display:block;text-align:center;margin-top:18px;color:#aebbd4}
.space2047-hero-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin:18px 0}
.space2047-hero-card{text-align:left;display:flex;flex-direction:column;gap:6px;min-height:120px}
.space2047-hero-card strong{font:900 23px Georgia,serif;color:#ffe18b}.space2047-hero-card span{color:#edf5ff}.space2047-hero-card small{color:#a9bdd7}
.space2047-hud{position:absolute;left:12px;top:112px;width:min(430px,calc(100vw - 24px));display:none;pointer-events:auto;border:1px solid rgba(255,214,107,.72);border-radius:16px;background:rgba(6,12,31,.92);box-shadow:0 10px 30px rgba(0,0,0,.42);padding:12px 14px;z-index:5}
.space2047-hud.show{display:block}.space2047-hud-head{display:flex;gap:10px;justify-content:space-between;align-items:flex-start}.space2047-hud-head span{font-weight:900;color:#ffe18b}.space2047-hud-head strong{min-width:44px;text-align:right;color:#75e7ff}.space2047-progress{height:6px;background:#182540;border-radius:999px;overflow:hidden;margin:8px 0}.space2047-progress span{display:block;height:100%;background:linear-gradient(90deg,#4fe8ff,#ffd967,#ff6d9d);width:0}.space2047-hud>b{display:block;font-size:15px;margin:4px 0;color:#fff}.space2047-hud>small{display:block;color:#b7cae4}.space2047-hud-actions{display:flex;gap:6px;flex-wrap:wrap;margin-top:9px}.space2047-hud-actions button{padding:7px 9px;font-size:11px;border-radius:9px;background:#172746}
.space2047-action{position:absolute;right:12px;top:330px;display:none;pointer-events:auto;border:2px solid #ffd76e;border-radius:999px;background:#42193d;color:#fff;padding:12px 15px;font-weight:950;box-shadow:0 8px 22px rgba(0,0,0,.45);cursor:pointer;z-index:6}.campaign-active .space2047-action{display:block}.space2047-action.ready{background:#155f53;box-shadow:0 0 0 4px rgba(75,241,192,.25),0 8px 22px rgba(0,0,0,.45);animation:space2047Pulse 1.2s infinite}
@keyframes space2047Pulse{50%{transform:scale(1.04)}}
.space2047-dialogue{max-width:700px;text-align:center}.space2047-speaker{font:900 clamp(24px,5vw,42px) Georgia,serif;color:#ffe18b}.space2047-dialogue p{white-space:pre-line;font-size:clamp(16px,2.5vw,21px)}.space2047-dialogue-actions{display:flex;gap:10px;justify-content:center;flex-wrap:wrap;margin-top:18px}
.space2047-map-panel,.space2047-codex-panel,.space2047-chapter-panel{width:min(1040px,96vw)}
.space2047-map-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.space2047-map-card{display:flex;align-items:flex-start;gap:12px;text-align:left;background:linear-gradient(145deg,#14264a,#26173c)}.space2047-map-card .num{font:900 20px Georgia,serif;color:#ffd86e;min-width:32px}.space2047-map-card span:last-child{display:flex;flex-direction:column;gap:4px}.space2047-map-card small{color:#b8c7dc;line-height:1.3}
.space2047-chapter-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.space2047-chapter-card{display:flex;flex-direction:column;gap:5px;text-align:left}.space2047-chapter-card strong{color:#ffe18b}.space2047-chapter-card span{color:#75e7ff;font-size:12px}.space2047-chapter-card small{color:#c4cee0;line-height:1.35}
.space2047-codex-panel section{border:1px solid rgba(255,215,119,.25);border-radius:14px;padding:14px;margin:10px 0;background:rgba(255,255,255,.035)}.space2047-codex-panel ul,.space2047-codex-panel ol{padding-left:22px}.space2047-codex-panel .achievements{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:7px;list-style:none;padding:0}.space2047-codex-panel .achievements li{padding:8px;border-radius:9px;background:rgba(255,255,255,.04);color:#8290a6}.space2047-codex-panel .achievements li.unlocked{color:#ffe18b;background:rgba(255,213,98,.09)}
.space2047-minigame-panel{width:min(760px,96vw);text-align:center}.space2047-minigame-panel canvas{display:block;width:100%;height:min(54vh,460px);min-height:300px;border:1px solid rgba(117,231,255,.55);border-radius:14px;background:#07091d;touch-action:none}.space2047-mini-controls{display:flex;gap:14px;justify-content:center;margin-top:12px}.space2047-mini-controls button{font-size:28px;min-width:110px;touch-action:none}
#space2047Toast{position:fixed;left:50%;top:82px;transform:translate(-50%,-20px);z-index:2147483646;opacity:0;pointer-events:none;padding:10px 16px;border:1px solid #ffd76e;border-radius:999px;background:rgba(8,15,34,.96);color:#fff;font-weight:850;box-shadow:0 8px 28px rgba(0,0,0,.5);transition:.2s ease}#space2047Toast.show{opacity:1;transform:translate(-50%,0)}
@media(max-width:700px){
  .space2047-menu-actions,.space2047-hero-grid,.space2047-map-grid,.space2047-chapter-list,.space2047-codex-panel .achievements{grid-template-columns:1fr}
  .space2047-overlay{padding:8px}.space2047-panel{border-radius:16px;padding:16px;max-height:94vh}
  .space2047-hud{top:285px;left:8px;width:calc(100vw - 16px);padding:9px 10px}.space2047-hud-actions{display:grid;grid-template-columns:repeat(4,1fr)}.space2047-hud-actions button{padding:6px 3px;font-size:9px}
  .space2047-action{top:auto;bottom:160px;right:10px;padding:10px 12px;font-size:11px}
  .space2047-minigame-panel canvas{height:48vh;min-height:260px}
}


/* V501 Space 2047 living story world controls */
.space2047-crew-dock{position:absolute;left:50%;bottom:118px;transform:translateX(-50%);display:none;gap:6px;align-items:center;max-width:calc(100vw - 18px);padding:7px;border:1px solid rgba(255,214,107,.62);border-radius:16px;background:rgba(5,10,28,.94);box-shadow:0 8px 26px rgba(0,0,0,.48);pointer-events:auto;z-index:8;white-space:nowrap}
.space2047-crew-dock.show{display:flex}
.space2047-crew-dock button{border:1px solid rgba(130,190,255,.45);border-radius:11px;background:#172746;color:#eaf6ff;padding:8px 10px;font-size:11px;font-weight:900;cursor:pointer}
.space2047-crew-dock button.active{background:linear-gradient(180deg,#6a4a18,#3b2b12);border-color:#ffd66b;color:#fff4c9;box-shadow:0 0 0 2px rgba(255,214,107,.18)}
.space2047-crew-dock [data-ability]{background:#183f42;border-color:#5ce3d0;color:#d7fff8}
.space2047-cutscene-overlay{background:radial-gradient(circle at 50% 35%,rgba(25,57,101,.64),rgba(1,3,12,.94) 70%)}
.space2047-cutscene-panel{max-width:780px;text-align:left;border-color:rgba(255,214,107,.8);background:linear-gradient(145deg,rgba(13,28,59,.98),rgba(22,10,38,.98));box-shadow:0 22px 70px rgba(0,0,0,.72)}
.space2047-cutscene-kicker{color:#65e7ff;font-size:11px;font-weight:950;letter-spacing:.14em;text-transform:uppercase}
.space2047-cutscene-panel h2{margin:8px 0 12px;color:#ffe18b;font:900 clamp(24px,5vw,48px) Georgia,serif}
.space2047-cutscene-panel p{font-size:clamp(16px,2.2vw,22px);line-height:1.6;color:#f2f6ff;white-space:pre-line}
.space2047-cutscene-footer{display:flex;justify-content:space-between;align-items:center;margin-top:22px;color:#9eb5d8}
.space2047-cutscene-footer button,.space2047-puzzle-panel button{border:1px solid rgba(255,215,119,.72);border-radius:12px;background:linear-gradient(180deg,#314c7c,#192944);color:#fff;padding:11px 16px;font-weight:900;cursor:pointer}
.space2047-puzzle-panel{width:min(700px,94vw);background:linear-gradient(155deg,#0c1e37,#1d1034);border-color:rgba(101,231,255,.7)}
.space2047-puzzle-panel h2{color:#73ecff}.space2047-puzzle-panel input[type=range]{width:100%;margin:18px 0}
.space2047-puzzle-buttons{display:flex;gap:10px;flex-wrap:wrap;margin:14px 0}
.space2047-puzzle-status{min-height:34px;padding:8px 0;color:#ffe18b;font-weight:800}
.space2047-puzzle-panel [data-puzzle-body]{display:grid;gap:10px}
@media(max-width:720px){
  .space2047-crew-dock{bottom:154px;gap:3px;padding:5px;width:calc(100vw - 12px);justify-content:center;flex-wrap:wrap}
  .space2047-crew-dock button{padding:6px 7px;font-size:9px}
  .space2047-crew-dock [data-ability]{flex-basis:100%}
  .space2047-cutscene-panel p{font-size:15px}
  .space2047-puzzle-buttons{display:grid;grid-template-columns:repeat(2,1fr)}
}

/* V502 Planet Nouala full open world ------------------------------------------------ */
#space2047NoualaOpenWorldV502{position:fixed;inset:0;z-index:2147483550;pointer-events:none;font-family:Inter,ui-sans-serif,system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;color:#fff}
#space2047NoualaOpenWorldV502 *{box-sizing:border-box}
.v502-nouala-hud{position:absolute;left:14px;top:152px;width:min(370px,calc(100vw - 28px));padding:12px 14px;border:1px solid rgba(255,224,132,.62);border-radius:16px;background:linear-gradient(145deg,rgba(25,63,74,.94),rgba(40,28,61,.93));box-shadow:0 16px 40px rgba(0,0,0,.38),inset 0 1px 0 rgba(255,255,255,.08);backdrop-filter:blur(12px);display:none;pointer-events:auto}
.v502-nouala-hud.show{display:block}
.v502-nouala-kicker{font:900 9px/1.2 system-ui,sans-serif;letter-spacing:.18em;color:#ffe58d;margin-bottom:7px}
.v502-nouala-head{display:flex;gap:10px;align-items:flex-start;justify-content:space-between}
.v502-nouala-head strong{font:950 17px/1.08 system-ui,sans-serif;color:#fff1b8;max-width:230px}
.v502-nouala-head span{white-space:nowrap;font:800 11px/1.2 system-ui,sans-serif;color:#a9f1dc;background:rgba(0,0,0,.25);border-radius:999px;padding:5px 8px}
.v502-nouala-hud>b{display:block;margin:10px 0 4px;font:850 13px/1.35 system-ui,sans-serif;color:#fff}
.v502-nouala-hud>small{display:block;color:#d9ebef;font:700 10px/1.4 system-ui,sans-serif}
.v502-nouala-hud-actions{display:flex;gap:7px;margin-top:10px}
.v502-nouala-hud-actions button{flex:1;border:1px solid rgba(255,225,142,.55);border-radius:10px;background:rgba(255,255,255,.08);color:#fff;font:850 11px/1 system-ui,sans-serif;padding:9px 7px;cursor:pointer}
.v502-nouala-hud-actions button:hover,.v502-nouala-hud-actions button:focus-visible{background:#7b4c86;outline:3px solid rgba(255,225,142,.25)}
.v502-nouala-action{position:absolute;right:14px;top:390px;display:none;pointer-events:auto;border:2px solid #ffe078;border-radius:999px;background:#4b2e6c;color:#fff;padding:12px 16px;font:950 12px/1 system-ui,sans-serif;box-shadow:0 10px 26px rgba(0,0,0,.42);cursor:pointer;z-index:9}
.v502-nouala-action.show{display:block}.v502-nouala-action.ready{background:#156957;box-shadow:0 0 0 5px rgba(88,245,194,.22),0 10px 26px rgba(0,0,0,.42);animation:v502NoualaPulse 1.25s infinite}
@keyframes v502NoualaPulse{50%{transform:scale(1.045)}}
.v502-nouala-overlay{position:absolute;inset:0;display:none;align-items:center;justify-content:center;padding:18px;background:rgba(4,8,18,.78);backdrop-filter:blur(8px);pointer-events:auto;overflow:auto}
.v502-nouala-overlay.open{display:flex}
.v502-nouala-panel{position:relative;width:min(980px,96vw);max-height:91vh;overflow:auto;border:1px solid rgba(255,224,132,.72);border-radius:22px;background:linear-gradient(150deg,#143d4c 0%,#253958 45%,#43274f 100%);box-shadow:0 30px 90px rgba(0,0,0,.7);padding:24px}
.v502-nouala-close{position:sticky;float:right;top:0;z-index:10;width:44px;height:44px;border:1px solid rgba(255,255,255,.3);border-radius:50%;background:#6c2f4a;color:#fff;font:900 25px/1 system-ui,sans-serif;cursor:pointer}
.v502-panel-head small{font:950 10px/1.2 system-ui,sans-serif;letter-spacing:.18em;color:#ffe186}.v502-panel-head h2{margin:5px 0 8px;font:950 clamp(25px,4vw,42px)/1.05 Georgia,serif;color:#fff2ba}
.v502-nouala-panel>div>p,.v502-nouala-panel>p{color:#e7f2f4;font-size:14px;line-height:1.55}
.v502-district-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:11px;margin-top:16px}
.v502-district-grid button{min-height:100px;display:grid;grid-template-columns:46px 1fr;grid-template-rows:auto auto;gap:4px 8px;align-items:center;text-align:left;border:1px solid rgba(255,224,132,.45);border-radius:15px;background:rgba(255,255,255,.08);color:#fff;padding:12px;cursor:pointer}
.v502-district-grid button:hover,.v502-district-grid button:focus-visible{background:rgba(255,224,132,.18);transform:translateY(-1px);outline:3px solid rgba(255,224,132,.24)}
.v502-district-grid button>span{grid-row:1/3;font-size:32px}.v502-district-grid button strong{font:900 14px/1.18 system-ui,sans-serif;color:#fff1b0}.v502-district-grid button small{font:700 10px/1.2 system-ui,sans-serif;color:#b9d9df}
.v502-quest-list{display:grid;gap:10px;margin-top:16px}.v502-quest-list article{display:grid;grid-template-columns:1fr auto;gap:12px;align-items:center;border:1px solid rgba(255,255,255,.18);border-radius:15px;background:rgba(255,255,255,.065);padding:13px}.v502-quest-list article.active{border-color:#78e2ba;background:rgba(30,128,99,.2)}.v502-quest-list article.complete{border-color:#efd073;background:rgba(154,113,43,.19)}
.v502-quest-list small{font:900 9px/1.2 system-ui,sans-serif;letter-spacing:.12em;color:#92e7d0}.v502-quest-list h3{margin:3px 0 4px;font:900 16px/1.2 system-ui,sans-serif;color:#fff0b2}.v502-quest-list p{margin:0;color:#dce9ec;font-size:12px;line-height:1.45}.v502-quest-list button,.v502-world-actions button{border:1px solid #f2d073;border-radius:11px;background:#573b73;color:#fff;padding:9px 12px;font:850 11px/1 system-ui,sans-serif;cursor:pointer}.v502-quest-list button:disabled{opacity:.55;cursor:default}
.v502-world-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin:16px 0}.v502-world-stats div{border:1px solid rgba(255,224,132,.38);border-radius:13px;background:rgba(0,0,0,.16);padding:12px;text-align:center}.v502-world-stats strong{display:block;font:950 22px/1 system-ui,sans-serif;color:#ffe18a}.v502-world-stats small{display:block;margin-top:5px;color:#c9e2e6;font-size:10px}
.v502-world-actions{display:flex;gap:9px;flex-wrap:wrap;margin:14px 0 20px}.v502-world-actions button{padding:11px 14px;background:#285f70}
.v502-nouala-dialogue-card{width:min(720px,94vw);border:1px solid rgba(255,224,132,.7);border-radius:22px;background:linear-gradient(145deg,#173b4c,#432746);box-shadow:0 28px 90px rgba(0,0,0,.7);padding:24px}.v502-nouala-speaker{font:950 12px/1 system-ui,sans-serif;letter-spacing:.14em;color:#ffe17f;text-transform:uppercase}.v502-nouala-dialogue-card p{white-space:pre-line;font:600 17px/1.65 Georgia,serif;color:#fff;margin:14px 0 20px}.v502-nouala-dialogue-actions{display:flex;gap:9px;flex-wrap:wrap;justify-content:flex-end}.v502-nouala-dialogue-actions button{border:1px solid #f3d273;border-radius:12px;background:#6a3f78;color:#fff;padding:11px 15px;font:900 12px/1 system-ui,sans-serif;cursor:pointer}
#space2047NoualaToastV502{position:fixed;left:50%;bottom:105px;z-index:2147483600;transform:translate(-50%,24px);max-width:min(620px,90vw);opacity:0;pointer-events:none;border:1px solid rgba(255,224,132,.7);border-radius:999px;background:rgba(24,47,61,.95);color:#fff;padding:11px 18px;font:850 13px/1.3 system-ui,sans-serif;box-shadow:0 12px 35px rgba(0,0,0,.45);transition:.22s ease}
#space2047NoualaToastV502.show{opacity:1;transform:translate(-50%,0)}
@media(max-width:700px){
  .v502-nouala-hud{left:8px;right:8px;top:118px;width:auto;padding:10px 11px}.v502-nouala-head strong{font-size:14px}.v502-nouala-head span{font-size:9px}.v502-nouala-hud>b{font-size:11px}.v502-nouala-action{top:auto;right:12px;bottom:164px;padding:11px 13px;font-size:10px}
  .v502-nouala-overlay{padding:8px;align-items:flex-start}.v502-nouala-panel{width:100%;max-height:96vh;padding:17px 12px;border-radius:17px}.v502-district-grid{grid-template-columns:1fr}.v502-world-stats{grid-template-columns:1fr 1fr}.v502-quest-list article{grid-template-columns:1fr}.v502-nouala-dialogue-card{padding:18px 15px;margin-top:12vh}.v502-nouala-dialogue-card p{font-size:15px}.v502-nouala-dialogue-actions button{flex:1}
}
@media(prefers-reduced-motion:reduce){.v502-nouala-action.ready{animation:none}}


/* V503 responsive interface rebuild -------------------------------------------------
   One clean control layer, phone safe-area support, no visible developer UI, and
   the Space 2047 main menu sits above every gameplay control on desktop and mobile. */
#rendererBuildBadge,
#rendererStatus,
#v410DiagnosticsButton,
#v410DiagnosticsPanel,
#ericDevLocationOverlay{
  display:none!important;
  visibility:hidden!important;
  opacity:0!important;
  pointer-events:none!important;
}

/* The main Space 2047 menu receives the maximum browser z-index while open. */
#space2047LivingWorldV501.space2047-menu-layer-active{
  z-index:2147483647!important;
}
#space2047Menu{
  position:fixed!important;
  inset:0!important;
  z-index:2147483647!important;
}
#space2047Menu.open{
  display:flex!important;
  pointer-events:auto!important;
}
#space2047Menu .space2047-menu-panel{
  position:relative!important;
  z-index:2147483647!important;
}

/* Nouala panels remain above gameplay controls but below the main game menu. */
#space2047NoualaOpenWorldV502.v503-nouala-layer-active{
  z-index:2147483646!important;
}

/* Keep ordinary gameplay layers below menus and modal story panels. */
#ericV314Controls{z-index:2147483200!important;}
.live-chat-toggle,.live-chat-panel{z-index:2147483150!important;}
#liveVisitorPanel.live-visitor-panel{z-index:2147483100!important;}

@media(max-width:780px), (pointer:coarse){
  html,body,#page,#eric-game-app,.game-shell{
    width:100%!important;
    height:100dvh!important;
    min-height:100dvh!important;
    max-height:100dvh!important;
    overflow:hidden!important;
    overscroll-behavior:none!important;
  }

  /* Full-screen menus use the visual viewport and never sit under phone cut-outs. */
  .space2047-overlay{
    position:fixed!important;
    inset:0!important;
    align-items:flex-start!important;
    justify-content:center!important;
    padding:calc(8px + env(safe-area-inset-top,0px)) 8px calc(8px + env(safe-area-inset-bottom,0px))!important;
    overflow:auto!important;
  }
  .space2047-panel{
    width:100%!important;
    max-width:100%!important;
    max-height:calc(100dvh - env(safe-area-inset-top,0px) - env(safe-area-inset-bottom,0px) - 16px)!important;
    margin:0!important;
    padding:15px 12px 18px!important;
    border-radius:16px!important;
    overflow:auto!important;
    -webkit-overflow-scrolling:touch!important;
  }
  .space2047-close{
    top:0!important;
    width:46px!important;
    height:46px!important;
    font-size:28px!important;
  }
  .space2047-logo{font-size:clamp(42px,18vw,76px)!important;margin-top:6px!important;}
  .space2047-tagline{font-size:14px!important;line-height:1.42!important;margin:14px auto!important;}
  .space2047-menu-actions{grid-template-columns:1fr!important;gap:8px!important;margin-top:12px!important;}
  .space2047-menu-actions button{min-height:49px!important;padding:11px 12px!important;font-size:13px!important;}
  .space2047-source-note{margin-top:12px!important;font-size:10px!important;}

  /* Story HUD stays at the top edge and leaves the world centre visible. */
  .space2047-hud{
    top:calc(8px + env(safe-area-inset-top,0px))!important;
    left:8px!important;
    right:8px!important;
    width:auto!important;
    max-height:150px!important;
    padding:9px 10px!important;
    overflow:auto!important;
    border-radius:13px!important;
  }
  .space2047-hud>b{font-size:12px!important;line-height:1.25!important;}
  .space2047-hud>small{font-size:9px!important;}
  .space2047-hud-actions{display:grid!important;grid-template-columns:repeat(4,minmax(0,1fr))!important;gap:4px!important;}
  .space2047-hud-actions button{min-height:34px!important;padding:4px 2px!important;font-size:8.5px!important;}

  /* Crew switching becomes a compact strip just above the main controls. */
  .space2047-crew-dock{
    left:50%!important;
    bottom:calc(186px + env(safe-area-inset-bottom,0px))!important;
    width:calc(100vw - 12px)!important;
    max-width:520px!important;
    gap:3px!important;
    padding:5px!important;
    justify-content:center!important;
    flex-wrap:wrap!important;
    border-radius:12px!important;
  }
  .space2047-crew-dock button{padding:6px 7px!important;font-size:9px!important;min-height:32px!important;}
  .space2047-crew-dock [data-ability]{flex-basis:100%!important;}

  /* Nouala HUD and interaction button are compact and avoid the controls. */
  .v502-nouala-hud{
    top:calc(8px + env(safe-area-inset-top,0px))!important;
    left:8px!important;
    right:8px!important;
    width:auto!important;
    max-height:142px!important;
    overflow:auto!important;
    padding:9px 10px!important;
  }
  .v502-nouala-action{
    top:auto!important;
    right:8px!important;
    bottom:calc(182px + env(safe-area-inset-bottom,0px))!important;
    padding:10px 12px!important;
    font-size:10px!important;
  }
  .v502-nouala-overlay{
    position:fixed!important;
    inset:0!important;
    align-items:flex-start!important;
    padding:calc(8px + env(safe-area-inset-top,0px)) 8px calc(8px + env(safe-area-inset-bottom,0px))!important;
  }
  .v502-nouala-panel{
    width:100%!important;
    max-width:100%!important;
    max-height:calc(100dvh - env(safe-area-inset-top,0px) - env(safe-area-inset-bottom,0px) - 16px)!important;
    padding:16px 12px 18px!important;
    border-radius:16px!important;
  }

  /* Reduce chat footprint on phones. */
  .live-chat-toggle{
    top:calc(160px + env(safe-area-inset-top,0px))!important;
    right:8px!important;
    padding:8px 11px!important;
    font-size:11px!important;
  }
  .live-chat-panel{
    top:calc(200px + env(safe-area-inset-top,0px))!important;
    right:7px!important;
    left:7px!important;
    width:auto!important;
    max-height:48dvh!important;
  }
  #liveVisitorPanel.live-visitor-panel{display:none!important;}
  .live-visitor-countries{display:none!important;}

  /* Interaction messages sit above the controls and use the available width. */
  .interaction-panel{
    left:8px!important;
    right:8px!important;
    bottom:calc(182px + env(safe-area-inset-bottom,0px))!important;
    transform:none!important;
    width:auto!important;
    min-width:0!important;
    padding:9px 11px!important;
    border-radius:13px!important;
  }
}

@media(max-width:430px){
  .space2047-logo{font-size:52px!important;}
  .space2047-menu-actions button{min-height:46px!important;font-size:12px!important;}
  .space2047-hud{max-height:136px!important;}
  .space2047-crew-dock{bottom:calc(176px + env(safe-area-inset-bottom,0px))!important;}
  .v502-nouala-action,.interaction-panel{bottom:calc(174px + env(safe-area-inset-bottom,0px))!important;}
}


/* V504 Galaxy location list navigation ----------------------------------------- */
.space2047-galaxy-nav{
  position:sticky;
  top:0;
  z-index:30;
  display:grid;
  grid-template-columns:54px minmax(0,1fr) 54px auto;
  gap:8px;
  align-items:stretch;
  margin:8px 0 14px;
  padding:9px;
  border:1px solid rgba(255,215,119,.72);
  border-radius:16px;
  background:linear-gradient(145deg,rgba(8,18,45,.98),rgba(38,17,59,.98));
  box-shadow:0 10px 28px rgba(0,0,0,.42);
}
.space2047-galaxy-arrow,.space2047-galaxy-select{
  border:1px solid #e8c66d;
  border-radius:12px;
  background:linear-gradient(180deg,#34547e,#1a2b4c);
  color:#fff;
  font-weight:950;
  cursor:pointer;
  min-height:52px;
  touch-action:manipulation;
}
.space2047-galaxy-arrow{font-size:25px;line-height:1;min-width:52px;padding:0;}
.space2047-galaxy-select{padding:0 16px;color:#241507;background:linear-gradient(180deg,#ffe99b,#d6a93d);white-space:nowrap;}
.space2047-galaxy-arrow:active,.space2047-galaxy-select:active{transform:translateY(1px) scale(.98)}
.space2047-galaxy-selected{min-width:0;display:flex;flex-direction:column;justify-content:center;gap:2px;padding:3px 8px;text-align:left;}
.space2047-galaxy-selected strong{color:#75e7ff;font-size:12px;letter-spacing:.05em;}
.space2047-galaxy-selected span{font:900 18px Georgia,'Times New Roman',serif;color:#ffe18b;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.space2047-galaxy-selected small{color:#c3d0e5;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.space2047-map-card.selected{outline:3px solid #75e7ff;outline-offset:1px;background:linear-gradient(145deg,#244a72,#4d245d);box-shadow:0 0 0 4px rgba(117,231,255,.13),0 8px 22px rgba(0,0,0,.35);}
@media(max-width:700px), (pointer:coarse){
  .space2047-galaxy-nav{grid-template-columns:48px minmax(0,1fr) 48px;gap:6px;padding:7px;top:0;}
  .space2047-galaxy-select{grid-column:1/-1;min-height:46px;font-size:13px;}
  .space2047-galaxy-arrow{min-width:46px;min-height:48px;font-size:22px;}
  .space2047-galaxy-selected{padding:2px 5px;text-align:center;}
  .space2047-galaxy-selected span{font-size:16px;}
  .space2047-galaxy-selected small{font-size:10px;}
}


/* V505 clean game screen + slide-out information menu -------------------------
   Only the game controls and crew switching remain permanently visible. All
   persistent HUD/status/chat/location/help elements are moved into this drawer. */
body.v505-clean-game-screen #space2047DrawerV505,
body.v505-clean-game-screen #space2047DrawerToggleV505,
body.v505-clean-game-screen #space2047DrawerBackdropV505{box-sizing:border-box;font-family:Inter,ui-sans-serif,system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif}

#space2047DrawerToggleV505{
  position:fixed;left:max(8px,env(safe-area-inset-left,0px));top:max(8px,env(safe-area-inset-top,0px));
  z-index:2147483645;display:flex;align-items:center;gap:6px;min-height:42px;padding:7px 10px;
  border:1px solid rgba(255,216,113,.9);border-radius:12px;background:rgba(9,16,34,.94);color:#fff;
  box-shadow:0 8px 24px rgba(0,0,0,.42);backdrop-filter:blur(10px);font-weight:950;cursor:pointer;touch-action:manipulation;
}
#space2047DrawerToggleV505 span{font-size:20px;line-height:1;color:#ffe18b}
#space2047DrawerToggleV505 b{font-size:10px;letter-spacing:.09em}
#space2047DrawerToggleV505:active{transform:scale(.97)}

#space2047DrawerBackdropV505{
  position:fixed;inset:0;z-index:2147483643;display:block;visibility:hidden;opacity:0;pointer-events:none;
  border:0;background:rgba(0,0,0,.48);backdrop-filter:blur(3px);transition:opacity .22s ease,visibility .22s ease;
}
#space2047DrawerBackdropV505.open{visibility:visible;opacity:1;pointer-events:auto}

#space2047DrawerV505{
  position:fixed;left:0;top:0;bottom:0;z-index:2147483646;width:min(430px,92vw);
  transform:translateX(calc(-100% - 18px));transition:transform .26s cubic-bezier(.2,.8,.2,1);
  border-right:1px solid rgba(255,216,113,.62);background:linear-gradient(165deg,rgba(7,14,34,.985),rgba(31,13,49,.985));
  color:#fff;box-shadow:18px 0 70px rgba(0,0,0,.56);pointer-events:auto;overflow:hidden;
  display:grid;grid-template-rows:auto auto minmax(0,1fr);
  padding-top:env(safe-area-inset-top,0px);padding-bottom:env(safe-area-inset-bottom,0px);
}
#space2047DrawerV505.open{transform:translateX(0)}
.v505-drawer-head{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px 14px 11px;border-bottom:1px solid rgba(255,216,113,.24)}
.v505-drawer-head small{display:block;color:#75e7ff;font-size:10px;font-weight:900;letter-spacing:.15em}
.v505-drawer-head h2{margin:2px 0 0;font:900 26px/1 Georgia,'Times New Roman',serif;color:#ffe18b}
.v505-drawer-close{width:44px;height:44px;border:1px solid rgba(255,216,113,.65);border-radius:50%;background:#3a173c;color:#fff;font-size:27px;line-height:1;cursor:pointer}
.v505-quick-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:6px;padding:10px 10px 11px;border-bottom:1px solid rgba(255,216,113,.18);background:rgba(255,255,255,.025)}
.v505-quick-grid button{min-width:0;min-height:60px;padding:7px 4px;border:1px solid rgba(255,216,113,.42);border-radius:11px;background:linear-gradient(180deg,#263f6b,#152540);color:#fff;font-weight:900;font-size:17px;cursor:pointer;touch-action:manipulation}
.v505-quick-grid button span{display:block;margin-top:3px;font-size:8.5px;line-height:1.1;color:#eef7ff}
.v505-drawer-body{min-height:0;overflow-y:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch;padding:10px 10px 22px}
.v505-drawer-section{margin:0 0 10px;padding:10px;border:1px solid rgba(255,216,113,.25);border-radius:14px;background:rgba(255,255,255,.035)}
.v505-section-head{display:flex;align-items:flex-end;justify-content:space-between;gap:8px;margin-bottom:8px}
.v505-section-head h3{margin:0;font:900 16px/1.1 Georgia,'Times New Roman',serif;color:#ffe18b}
.v505-section-head small{font-size:8.5px;line-height:1.2;text-align:right;color:#9eb9d0;max-width:55%}
.v505-drawer-slot{min-width:0}

/* Before JavaScript relocates the persistent UI, keep it off the world view. */
body.v505-clean-game-screen #space2047Hud:not([data-v505-drawer-moved]),
body.v505-clean-game-screen #space2047ActionButton:not([data-v505-drawer-moved]),
body.v505-clean-game-screen #space2047NoualaOpenWorldV502 .v502-nouala-hud:not([data-v505-drawer-moved]),
body.v505-clean-game-screen #space2047NoualaOpenWorldV502 .v502-nouala-action:not([data-v505-drawer-moved]),
body.v505-clean-game-screen #liveVisitorPanel:not([data-v505-drawer-moved]),
body.v505-clean-game-screen #liveChatToggle:not([data-v505-drawer-moved]),
body.v505-clean-game-screen #interactionPanel:not([data-v505-drawer-moved]),
body.v505-clean-game-screen #ericLocationBanner:not([data-v505-drawer-moved]),
body.v505-clean-game-screen #eric-game-app>.top-hud:not([data-v505-drawer-moved]){display:none!important}

/* Relocated HUD elements become normal drawer content rather than screen overlays. */
#space2047DrawerV505 #ericLocationBanner{
  position:static!important;left:auto!important;top:auto!important;transform:none!important;width:100%!important;
  filter:none!important;text-align:left!important;padding:7px 8px!important;border-radius:10px!important;background:rgba(0,0,0,.18)!important;
}
#space2047DrawerV505 #ericLocationTitle{font-size:20px!important;line-height:1.05!important;text-align:left!important;text-shadow:none!important}
#space2047DrawerV505 #ericRoomSubtitle{font-size:12px!important;line-height:1.25!important;text-align:left!important;margin-top:4px!important;text-shadow:none!important}

#space2047DrawerV505 .space2047-hud,
#space2047DrawerV505 .v502-nouala-hud{
  position:static!important;left:auto!important;right:auto!important;top:auto!important;bottom:auto!important;transform:none!important;
  width:100%!important;max-width:none!important;max-height:none!important;overflow:visible!important;margin:0!important;z-index:auto!important;
  border-radius:11px!important;padding:10px!important;box-shadow:none!important;
}
#space2047DrawerV505 .space2047-hud.show,
#space2047DrawerV505 .v502-nouala-hud.show{display:block!important}
#space2047DrawerV505 .space2047-hud-actions{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:6px!important}
#space2047DrawerV505 .space2047-hud-actions button{min-height:38px!important;padding:7px!important;font-size:10px!important}
#space2047DrawerV505 .v502-nouala-hud-actions{display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:6px!important}

#space2047DrawerV505 .space2047-action,
#space2047DrawerV505 .v502-nouala-action{
  position:static!important;left:auto!important;right:auto!important;top:auto!important;bottom:auto!important;transform:none!important;
  width:100%!important;max-width:none!important;margin:6px 0!important;z-index:auto!important;border-radius:11px!important;
}
#space2047DrawerV505 .space2047-action{display:block!important}
#space2047DrawerV505 .v502-nouala-action.show{display:block!important}

#space2047DrawerV505 #interactionPanel{
  position:static!important;left:auto!important;right:auto!important;bottom:auto!important;transform:none!important;
  min-width:0!important;width:100%!important;margin:0!important;padding:10px!important;border-radius:11px!important;box-shadow:none!important;
}
#space2047DrawerV505 #interactionPanel.show{display:block!important}

#space2047DrawerV505 #liveVisitorPanel.live-visitor-panel{
  position:static!important;left:auto!important;right:auto!important;top:auto!important;bottom:auto!important;transform:none!important;
  display:block!important;width:100%!important;max-width:none!important;margin:0!important;z-index:auto!important;pointer-events:auto!important;
}
#space2047DrawerV505 #liveChatToggle{
  position:static!important;display:block!important;width:100%!important;margin:0!important;padding:10px 12px!important;border-radius:11px!important;z-index:auto!important;
}
#space2047DrawerV505 #liveChatPanel{
  position:static!important;left:auto!important;right:auto!important;top:auto!important;bottom:auto!important;width:100%!important;max-width:none!important;
  max-height:none!important;margin:8px 0 0!important;z-index:auto!important;border-radius:11px!important;box-shadow:none!important;
}
#space2047DrawerV505 #liveChatPanel.open{display:flex!important}

#space2047DrawerV505 .top-hud{
  position:static!important;left:auto!important;right:auto!important;top:auto!important;bottom:auto!important;display:block!important;width:100%!important;
  text-align:left!important;pointer-events:auto!important;z-index:auto!important;
}
#space2047DrawerV505 .top-hud .hint-card{display:block!important;position:static!important;max-width:none!important;width:100%!important;margin:0!important;padding:10px!important;border-radius:11px!important;font-size:11px!important}

#space2047DrawerV505 #inventoryPanel{
  position:static!important;left:auto!important;right:auto!important;top:auto!important;bottom:auto!important;transform:none!important;
  width:100%!important;max-width:none!important;max-height:none!important;margin:0!important;z-index:auto!important;box-shadow:none!important;border-radius:11px!important;
}
#space2047DrawerV505 #inventoryPanel:not(.show){display:none!important}
#space2047DrawerV505 #inventoryPanel.show{display:block!important}

/* The full-screen Space 2047 menu remains the absolute highest layer. */
#space2047Menu,#space2047Menu.open,#space2047Menu .space2047-menu-panel{z-index:2147483647!important}

/* Preserve exactly what the user asked to keep visible: controls and crew switching. */
body.v505-clean-game-screen #ericV314Controls{display:block!important;visibility:visible!important;opacity:1!important}
body.v505-clean-game-screen #space2047CrewDock{z-index:2147483644!important}
body.v505-clean-game-screen #space2047CrewDock.show{display:flex!important}

@media(max-width:780px),(pointer:coarse){
  #space2047DrawerToggleV505{min-height:39px;padding:6px 9px;border-radius:10px}
  #space2047DrawerToggleV505 span{font-size:18px}#space2047DrawerToggleV505 b{font-size:9px}
  #space2047DrawerV505{width:min(380px,91vw)}
  .v505-drawer-head{padding:10px 10px 9px}.v505-drawer-head h2{font-size:23px}.v505-drawer-close{width:42px;height:42px}
  .v505-quick-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:5px;padding:8px}
  .v505-quick-grid button{min-height:55px;font-size:16px;padding:6px 2px}.v505-quick-grid button span{font-size:7.5px}
  .v505-drawer-body{padding:8px 8px 18px}.v505-drawer-section{padding:8px;border-radius:12px;margin-bottom:8px}
  .v505-section-head h3{font-size:15px}.v505-section-head small{font-size:7.5px}

  /* Keep character switching compact and clear of the movement/action controls. */
  body.v505-clean-game-screen #space2047CrewDock{
    bottom:calc(126px + env(safe-area-inset-bottom,0px))!important;
    width:min(520px,calc(100vw - 12px))!important;max-width:calc(100vw - 12px)!important;
    gap:3px!important;padding:4px!important;flex-wrap:nowrap!important;border-radius:11px!important;
  }
  body.v505-clean-game-screen #space2047CrewDock button{flex:1 1 0!important;min-width:0!important;min-height:31px!important;padding:5px 3px!important;font-size:8px!important;white-space:nowrap!important}
  body.v505-clean-game-screen #space2047CrewDock [data-ability]{flex:0 0 62px!important}
}

@media(max-width:430px){
  #space2047DrawerV505{width:92vw}
  .v505-quick-grid{grid-template-columns:repeat(4,minmax(0,1fr))}
  body.v505-clean-game-screen #space2047CrewDock{bottom:calc(118px + env(safe-area-inset-bottom,0px))!important}
  body.v505-clean-game-screen #space2047CrewDock button{font-size:7.3px!important;padding:4px 2px!important}
  body.v505-clean-game-screen #space2047CrewDock [data-ability]{flex-basis:54px!important}
}


/* V505 player/combat status relocated from the canvas into the drawer. */
.v505-player-status{display:grid;gap:8px;padding:9px;border-radius:11px;background:rgba(0,0,0,.2)}
.v505-player-top{display:flex;align-items:center;justify-content:space-between;gap:10px}
.v505-player-top strong{color:#ffe18b;font:900 16px Georgia,'Times New Roman',serif}.v505-player-top span{color:#c9d9ea;font-size:10px;font-weight:850}
.v505-player-status label{display:grid;grid-template-columns:auto 1fr;gap:4px 8px;align-items:center;color:#dcecff;font-size:10px;font-weight:850}
.v505-player-status label>span{text-align:right;color:#fff}
.v505-player-status label>i{grid-column:1/-1;display:block;height:8px;overflow:hidden;border-radius:999px;background:#182540;border:1px solid rgba(255,255,255,.18)}
.v505-player-status label>i>b{display:block;height:100%;width:0;transition:width .2s ease;background:linear-gradient(90deg,#df4351,#ff7e6d)}
.v505-player-status label:nth-of-type(2)>i>b{background:linear-gradient(90deg,#2da6c5,#65e7ff)}
.v505-world-message{padding:8px 9px;border-radius:9px;background:rgba(255,255,255,.04);color:#9eb4c9;font-size:10px;line-height:1.35}
.v505-world-message.active{background:rgba(255,214,107,.11);color:#fff1b8;border:1px solid rgba(255,214,107,.3)}
#space2047DrawerV505 #ericZoomViewDisplay{position:static!important;left:auto!important;right:auto!important;top:auto!important;bottom:auto!important;transform:none!important;display:block!important;width:100%!important;white-space:normal!important;text-align:center!important;margin:0!important;z-index:auto!important}
body.v505-clean-game-screen #ericZoomViewDisplay:not([data-v505-drawer-moved]){display:none!important}