/* Invisible room-to-room artwork hotspots. Keep the normal mouse arrow. */
.next-room-hotspot{
  position:absolute;
  z-index:36;
  border:0;
  background:transparent;
  padding:0;
  cursor:default !important;
  pointer-events:auto;
  transform:translate(-50%,-50%);
  -webkit-tap-highlight-color:transparent;
}
.next-room-hotspot .exit-text{
  position:absolute;
  width:1px;
  height:1px;
  margin:-1px;
  padding:0;
  overflow:hidden;
  clip:rect(0,0,0,0);
  white-space:nowrap;
  border:0;
}
/* Large invisible target areas. Normal arrow cursor is preserved. */
/* Room 1: Knight in the black six-piece frame -> Room 2 */
.room-exit-1{left:56.7%;top:55.0%;width:7.0%;height:18.0%}
/* Room 2: left man in the chess-player artwork -> Room 3 */
.room-exit-2{left:66.8%;top:51.5%;width:7.0%;height:22.0%}
/* Room 3: large King in the far-left artwork -> Room 4 */
.room-exit-3{left:7.8%;top:46.0%;width:8.5%;height:31.0%}
/* Room 4: right man in the center chess-player artwork -> Room 5 */
.room-exit-4{left:51.5%;top:54.5%;width:7.5%;height:24.0%}
/* Room 5: Pawn in the left chess artwork -> Room 1 */
.room-exit-5{left:17.5%;top:69.0%;width:7.0%;height:15.0%}

*{box-sizing:border-box;margin:0;padding:0}
html,body{width:100%;min-height:100%}
body{font-family:Arial,Helvetica,sans-serif;background:#111;color:#203128;overflow:hidden}
.hidden{display:none!important}
button,input,textarea,select{font:inherit}
button{cursor:pointer}

.app-shell{position:relative;width:100vw;height:100dvh;overflow:hidden;background:#111}
.room-column{position:absolute;inset:0;min-width:0;overflow:hidden;background:#111}
.stage-wrap{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;background:#111;overflow:hidden}
.stage{position:absolute;inset:0;overflow:hidden;background:#111}
.scene{position:absolute;left:50%;top:50%;width:min(100%,177.7778dvh);height:min(56.25vw,100dvh);transform:translate(-50%,-50%);transform-origin:50% 50%;will-change:transform}
.room-bg{position:absolute;inset:0;width:100%;height:100%;object-fit:fill;display:block;user-select:none;-webkit-user-drag:none;pointer-events:none}
.room-title{position:absolute;left:50%;top:2.2%;transform:translateX(-50%);z-index:20;color:#fff8e7;background:rgba(41,30,21,.78);padding:7px 14px;border:1px solid rgba(217,179,116,.65);border-radius:999px;font:700 clamp(12px,1.1vw,18px) Georgia,"Times New Roman",serif;letter-spacing:.08em;white-space:nowrap}
.room-help{position:absolute;left:12px;top:12px;z-index:20;color:#433126;background:rgba(255,255,255,.90);padding:8px 12px;border-radius:10px;font:700 12px Arial,sans-serif}


/* Avatar copied from the uploaded Conference Room style. */
.avatar-layer{position:absolute;inset:0;z-index:30;pointer-events:none}
.player{position:absolute;width:86px;text-align:center;transform:translate(-50%,-100%);z-index:100;pointer-events:none}
.player.walking .avatar{animation:bob .3s infinite alternate ease-in-out}
.player-name{display:inline-block;max-width:160px;margin-bottom:4px;padding:4px 9px;border-radius:8px;background:rgba(255,255,255,.94);color:#205038;font-size:12px;box-shadow:0 1px 2px rgba(0,0,0,.12);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.player.me .player-name{color:#0b7b42;font-weight:700}
.avatar{position:relative;width:42px;height:52px;margin:0 auto}
.avatar::after{content:"";position:absolute;left:50%;bottom:1px;width:28px;height:8px;transform:translateX(-50%);background:rgba(0,0,0,.14);filter:blur(3px);border-radius:50%}
.avatar-head{position:absolute;left:50%;top:0;width:24px;height:24px;transform:translateX(-50%);border-radius:50%;background:#d9b48e;box-shadow:inset 0 -1px 0 rgba(0,0,0,.12)}
.avatar-head::before{content:"";position:absolute;left:3px;right:3px;top:1px;height:9px;background:#5c4b3c;border-radius:50% 50% 40% 40%}
.avatar-body{position:absolute;left:50%;top:18px;width:32px;height:26px;transform:translateX(-50%);border-radius:10px 10px 12px 12px;background:linear-gradient(to bottom,#1fa95b,#0d6b40);box-shadow:inset 0 2px 0 rgba(255,255,255,.20)}
.player.me .avatar-body{background:linear-gradient(to bottom,#28b966,#0e7645)}
.player.admin .avatar-body{background:linear-gradient(to bottom,#a85c4c,#7d2723)}
@keyframes bob{from{transform:translateY(0)}to{transform:translateY(-3px)}}

/* Permanent Conference Room-style right side panel. */
.side-panel{position:fixed;right:0;top:0;bottom:0;width:min(330px,92vw);background:#f7faf7;border-left:1px solid #d6e1d7;padding:16px;overflow-y:auto;z-index:500;box-shadow:-10px 0 30px rgba(0,0,0,.14)}
.panel-section{padding:14px 0;border-bottom:1px solid #dfe7e0}
.panel-section:last-child{border-bottom:0}
.panel-section h2{font-size:16px;margin-bottom:10px;color:#0d5a35}
.panel-section button{width:100%;margin-top:8px}
.panel-section textarea{width:100%;min-height:72px;resize:vertical;border:2px solid #d4ded6;border-radius:10px;padding:10px 12px;background:#fff}
.panel-section select{width:100%;border:2px solid #d4ded6;border-radius:10px;padding:10px 12px;background:#fff}
.primary-button,.secondary-button{border:0;border-radius:10px;padding:11px 14px;font-weight:700;cursor:pointer}
.primary-button{background:#009a44;color:#fff}
.secondary-button{background:#ebf1ec;color:#204331}
.control-row button{margin-top:0}
.status-text,.small-note{font-size:12px;color:#6a7c70;margin-top:8px;line-height:1.4}
.admin-panel input{width:100%;margin:5px 0;padding:10px 11px;border:1px solid #d6dfd8;border-radius:8px;background:#fff}
.admin-welcome{font-size:12px;color:#43624f;margin-bottom:7px}
.people-list{display:flex;flex-direction:column;gap:6px;max-height:240px;overflow:auto}
.person-row{display:grid;grid-template-columns:1fr auto;gap:8px;align-items:center;background:#fff;border:1px solid #dde5de;border-radius:8px;padding:8px 9px;font-size:13px}
.person-row .meta{font-size:11px;color:#6d8577}
.person-actions{display:flex;gap:4px}.person-actions button{width:auto!important;margin:0!important;padding:5px 7px!important;font-size:10px!important}
.bounce-button{border:0;border-radius:7px;background:#8f3e32;color:#fff;padding:5px 8px;font-size:10px;cursor:pointer}
.chat-list{display:flex;flex-direction:column;gap:6px;max-height:220px;overflow:auto;margin-bottom:8px}
.chat-msg{padding:7px 8px;background:#fff;border:1px solid #dde5de;border-radius:8px;font-size:12px;line-height:1.35}
.chat-msg b{display:block;margin-bottom:2px;color:#0d6b40}
.pm-messages{margin-top:10px;display:flex;flex-direction:column;gap:7px;max-height:220px;overflow:auto}
.pm-messages .chat-msg{background:#fff}

.announcement{position:fixed;z-index:10020;top:18px;left:50%;transform:translateX(-50%);width:min(660px,calc(100vw - 30px));background:#0d5a35;color:#fff;padding:13px 16px;border-radius:12px;box-shadow:0 10px 30px rgba(0,0,0,.22);font-weight:700;text-align:center}
.overlay{position:fixed;inset:0;z-index:10000;background:rgba(8,50,30,.84);display:flex;align-items:center;justify-content:center;padding:20px}
.entry-card{width:min(430px,92vw);background:#fff;border-radius:18px;padding:34px;text-align:center;box-shadow:0 25px 70px rgba(0,0,0,.28)}
.entry-card h1{color:#0d5a35;margin-bottom:8px}.entry-card p{color:#5f6f66;margin-bottom:18px}.entry-card input{width:100%;height:50px;border:2px solid #d4ded6;border-radius:10px;padding:10px 12px;font-size:16px;background:#fff;margin:5px 0}.entry-card button{width:100%;margin-top:10px}.entry-label{display:block;text-align:left;margin:10px 0 6px;color:#52665a;font-size:12px;font-weight:700}.entry-divider{display:flex;align-items:center;gap:12px;margin:18px 0 4px;color:#89958c;font-size:11px;text-transform:uppercase;letter-spacing:.08em}.entry-divider::before,.entry-divider::after{content:"";flex:1;height:1px;background:#dde5df}.closed-message{padding:12px;background:#5a2a22;color:#fff0dc;border-radius:9px;margin:10px 0}.admin-login-box{margin-top:12px}.admin-login-box h3{color:#0d5a35;margin-bottom:6px}
.toast{position:fixed;left:50%;bottom:22px;transform:translateX(-50%);z-index:10030;background:#0d6b40;color:#fff;padding:10px 14px;border-radius:9px;box-shadow:0 8px 22px rgba(0,0,0,.24);opacity:0;pointer-events:none;transition:opacity .2s}.toast.show{opacity:1}


.name-limit{float:right;font-weight:400;color:#839188}

/* Private messages float above avatars, matching the Conference Room behavior. */
.player{overflow:visible}
.overhead-pm{
  position:absolute;left:50%;bottom:calc(100% + 16px);transform:translateX(-50%);
  width:max-content;min-width:100px;max-width:220px;padding:8px 28px 8px 10px;
  border-radius:11px;background:#fff;border:1px solid #cfded2;
  box-shadow:0 7px 20px rgba(20,57,35,.18);color:#274b36;
  font-size:11px;line-height:1.35;text-align:left;white-space:normal;overflow-wrap:anywhere;
  z-index:250;pointer-events:auto;
}
.overhead-pm::after{content:"";position:absolute;left:50%;bottom:-6px;width:10px;height:10px;transform:translateX(-50%) rotate(45deg);background:#fff;border-right:1px solid #cfded2;border-bottom:1px solid #cfded2}
.overhead-pm strong{display:block;color:#0d6b40;margin-bottom:2px;font-size:10px}
.overhead-pm span{display:block}
.overhead-pm-close{position:absolute;right:4px;top:3px;width:20px!important;height:20px;margin:0!important;padding:0!important;border:0;border-radius:50%;background:#eef4ef;color:#486653;font-weight:700;line-height:18px;cursor:pointer}

/* Room 2 uses a different set of chess frames while keeping the same vintage room. */
.room2-art{position:absolute;z-index:18;border:7px solid #6a4528;background:#b99362;box-shadow:0 8px 18px rgba(0,0,0,.35),inset 0 0 0 2px #2f2115;padding:7px;pointer-events:none}
.room2-art-inner,.mini-board{width:100%;height:100%;display:grid;place-items:center;background:#dfc396;color:#3c2716;text-align:center;font:700 clamp(22px,3.2vw,56px)/1.05 Georgia,serif}
.room2-art-a{left:27.5%;top:22%;width:17.5%;height:34%}
.room2-art-b{left:49%;top:20%;width:20%;height:37%}
.room2-art-c{left:73%;top:23%;width:15%;height:31%}
.mini-board{background:conic-gradient(from 90deg,#5c4028 25%,#d4b27b 0 50%,#5c4028 0 75%,#d4b27b 0) 0 0/25% 25%}

@media(max-width:900px){
  .room-column{inset:0}
  .side-panel{width:300px}
  .room-help{font-size:10px;padding:6px 8px}
  .player{transform:translate(-50%,-100%) scale(.88)}
}
@media(max-width:640px){
  .room-column{inset:0}
  .side-panel{width:92vw}
  .entry-card{padding:24px}
  .room-help{left:8px;top:8px;max-width:70vw}
  .overhead-pm{max-width:170px;font-size:10px}
}

/* v19: centered CONTAIN layout. The complete 16:9 room, including the entire floor, is always visible. */
html,body,.app-shell,.room-column,.stage-wrap,.stage{
  width:100%;
  height:100%;
  height:100dvh;
  min-height:100%;
}
.app-shell,.room-column,.stage-wrap,.stage{
  position:fixed;
  inset:0;
  overflow:hidden;
}
.stage-wrap{
  display:block;
  background:#111;
}
.stage{
  background:#111;
}
.scene{
  position:absolute;
  left:50%;
  top:50%;
  width:max(100vw,177.7777778dvh);
  height:max(56.25vw,100dvh);
  aspect-ratio:16/9;
  transform:translate(-50%,-50%);
  transform-origin:center center;
  overflow:visible;
}
.room-bg{
  width:100%;
  height:100%;
  object-fit:fill;
}


/* v18 mobile/iPhone layout */
@supports (height: 100svh){
  html,body,.app-shell,.room-column,.stage-wrap,.stage{height:100svh}
  .scene{width:max(100vw,177.7777778svh);height:max(56.25vw,100svh)}
}
@media (max-width:700px){
  .side-panel{
    top:auto;
    right:8px;
    bottom:max(8px,env(safe-area-inset-bottom));
    left:8px;
    width:auto;
    max-height:38dvh;
    border:1px solid #d6e1d7;
    border-radius:14px;
    padding:12px;
    box-shadow:0 10px 30px rgba(0,0,0,.22);
  }
  .room-help{
    left:max(8px,env(safe-area-inset-left));
    top:max(8px,env(safe-area-inset-top));
    max-width:calc(100vw - 16px);
    font-size:10px;
  }
  .player{transform:translate(-50%,-100%) scale(.82)}
  .entry-card{width:min(430px,calc(100vw - 24px));padding:22px}
}
@media (orientation:portrait) and (max-width:700px){
  .scene{
    width:177.7777778dvh;
    height:100dvh;
  }
}


/* v19 WHOLE ROOM / WHOLE FLOOR VISIBLE */
html,body,.app-shell,.room-column,.stage-wrap,.stage{
  width:100%;
  height:100%;
  height:100dvh;
  min-height:100%;
}
html,body{background:#111;overflow:hidden}
.app-shell,.room-column,.stage-wrap,.stage{position:fixed;inset:0;overflow:hidden}
.stage-wrap{display:flex;align-items:center;justify-content:center;background:#111}
.stage{background:#111}
.scene{
  position:absolute;
  left:50%;
  top:50%;
  width:min(100vw,177.7777778dvh);
  height:min(56.25vw,100dvh);
  aspect-ratio:16/9;
  transform:translate(-50%,-50%);
  transform-origin:center center;
  overflow:visible;
}
.room-bg{width:100%;height:100%;object-fit:fill}

/* Keep the control dock on the right without covering the floor on phones. */
@supports (height:100svh){
  html,body,.app-shell,.room-column,.stage-wrap,.stage{height:100svh}
  .scene{width:min(100vw,177.7777778svh);height:min(56.25vw,100svh)}
}
@media(max-width:700px){
  .side-panel{
    top:max(8px,env(safe-area-inset-top));
    right:max(8px,env(safe-area-inset-right));
    bottom:auto;
    left:auto;
    width:min(300px,82vw);
    max-height:44svh;
    border:1px solid #d6e1d7;
    border-radius:14px;
    padding:12px;
    box-shadow:0 10px 30px rgba(0,0,0,.22);
  }
  .room-help{
    left:max(8px,env(safe-area-inset-left));
    top:max(8px,env(safe-area-inset-top));
    max-width:calc(100vw - 16px);
    font-size:10px;
  }
  .player{transform:translate(-50%,-100%) scale(.82)}
  .entry-card{width:min(430px,calc(100vw - 24px));padding:22px}
  .overhead-pm{max-width:170px;font-size:10px}
}

/* v23: login overlay never flashes while the saved session is being restored. */
#entryOverlay.hidden{display:none!important}

/* =============================================================
   v24 FULL RESPONSIVE LAYOUT
   Desktop: room fits completely beside the dock.
   Tablet/phone: room fits completely in viewport; dock becomes drawer.
   ============================================================= */
:root{--dock-width:330px;--safe-top:env(safe-area-inset-top,0px);--safe-right:env(safe-area-inset-right,0px);--safe-bottom:env(safe-area-inset-bottom,0px);--safe-left:env(safe-area-inset-left,0px)}
html,body{width:100%;height:100%;height:100dvh;overflow:hidden;overscroll-behavior:none;background:#111}
body{min-width:0;min-height:0}
.app-shell{position:fixed;inset:0;width:100%;height:100%;height:100dvh;display:grid;grid-template-columns:minmax(0,1fr) var(--dock-width);overflow:hidden;background:#111}
.room-column{position:relative!important;inset:auto!important;grid-column:1;min-width:0;min-height:0;width:auto!important;height:auto!important;overflow:hidden;background:#111}
.stage-wrap,.stage{position:absolute!important;inset:0!important;width:100%!important;height:100%!important;overflow:hidden;background:#111}
.stage-wrap{display:flex!important;align-items:center!important;justify-content:center!important}
.scene{position:relative!important;left:auto!important;top:auto!important;transform:none!important;width:min(100%,calc(100dvh * 16 / 9))!important;height:auto!important;aspect-ratio:16/9!important;flex:0 0 auto;overflow:visible}
.room-bg{position:absolute;inset:0;width:100%!important;height:100%!important;object-fit:fill!important}
.side-panel{position:relative!important;inset:auto!important;grid-column:2;width:var(--dock-width)!important;height:100%!important;max-height:none!important;border-radius:0!important;transform:none!important;transition:none;overflow-y:auto;overscroll-behavior:contain;padding:16px max(16px,var(--safe-right)) calc(16px + var(--safe-bottom)) 16px;z-index:500}
.panel-toggle,.panel-close{display:none}
.room-help{max-width:calc(100% - 24px);font-size:clamp(9px,1vw,12px)}
.overlay{padding:max(14px,var(--safe-top)) max(14px,var(--safe-right)) max(14px,var(--safe-bottom)) max(14px,var(--safe-left));overflow-y:auto}
.entry-card{max-height:calc(100dvh - 28px);overflow-y:auto}

/* Tablet and phones: full room uses the entire viewport. Controls slide over it. */
@media (max-width:900px){
  .app-shell{display:block}
  .room-column{position:absolute!important;inset:0!important;width:100%!important;height:100%!important}
  .scene{width:min(100vw,calc(100dvh * 16 / 9))!important;height:auto!important;max-width:100vw;max-height:100dvh}
  .side-panel{
    position:fixed!important;
    top:calc(8px + var(--safe-top))!important;
    right:calc(8px + var(--safe-right))!important;
    bottom:calc(8px + var(--safe-bottom))!important;
    left:auto!important;
    width:min(350px,calc(100vw - 24px - var(--safe-left) - var(--safe-right)))!important;
    height:auto!important;
    max-height:none!important;
    border:1px solid #d6e1d7!important;
    border-radius:16px!important;
    box-shadow:0 14px 42px rgba(0,0,0,.28)!important;
    transform:translateX(calc(100% + 24px + var(--safe-right)))!important;
    transition:transform .22s ease!important;
    z-index:800!important;
    padding:48px 14px 16px!important;
  }
  .side-panel.mobile-open{transform:translateX(0)!important}
  .panel-toggle{
    display:block;position:fixed;right:calc(10px + var(--safe-right));top:calc(10px + var(--safe-top));z-index:850;
    border:1px solid #b8c9bc;border-radius:10px;background:rgba(247,250,247,.96);color:#174a31;
    padding:9px 12px;font-weight:700;box-shadow:0 5px 18px rgba(0,0,0,.18);cursor:pointer
  }
  .panel-close{
    display:grid;place-items:center;position:absolute;right:10px;top:10px;width:30px!important;height:30px;
    margin:0!important;padding:0!important;border:0;border-radius:50%;background:#ebf1ec;color:#204331;font-size:22px;line-height:1
  }
  .room-help{left:calc(8px + var(--safe-left));top:calc(8px + var(--safe-top));right:auto;max-width:calc(100vw - 120px - var(--safe-left) - var(--safe-right));font-size:10px;padding:6px 8px}
  .player{transform:translate(-50%,-100%) scale(.84);transform-origin:50% 100%}
  .overhead-pm{max-width:min(180px,46vw)}
}

/* Small phones, including iPhone portrait. The whole 16:9 room remains visible. */
@media (max-width:600px){
  .scene{width:100vw!important;height:auto!important;max-height:100dvh}
  .panel-toggle{font-size:12px;padding:8px 10px}
  .side-panel{width:min(320px,calc(100vw - 16px - var(--safe-left) - var(--safe-right)))!important;right:calc(8px + var(--safe-right))!important;top:calc(8px + var(--safe-top))!important;bottom:calc(8px + var(--safe-bottom))!important}
  .panel-section{padding:10px 0}.panel-section h2{font-size:14px}.panel-section textarea{min-height:58px}
  .people-list{max-height:150px}.chat-list,.pm-messages{max-height:150px}
  .player{transform:translate(-50%,-100%) scale(.68);transform-origin:50% 100%}
  .player-name{font-size:10px;padding:3px 6px;max-width:110px}
  .overhead-pm{font-size:9px;max-width:145px;padding:6px 24px 6px 8px}
  .room-help{font-size:9px;max-width:calc(100vw - 108px - var(--safe-left) - var(--safe-right))}
  .entry-card{width:100%;max-width:410px;padding:20px 16px;border-radius:14px}
  .entry-card input{height:46px}
}

/* Short landscape phones/tablets. */
@media (max-height:520px) and (max-width:900px){
  .scene{width:min(100vw,calc(100dvh * 16 / 9))!important}
  .side-panel{top:calc(6px + var(--safe-top))!important;bottom:calc(6px + var(--safe-bottom))!important}
  .panel-section{padding:8px 0}.panel-section textarea{min-height:48px}.people-list,.chat-list,.pm-messages{max-height:100px}
  .player{transform:translate(-50%,-100%) scale(.72);transform-origin:50% 100%}
}

@supports (height:100svh){
  html,body,.app-shell{height:100svh}
  @media (min-width:901px){.scene{width:min(100%,calc(100svh * 16 / 9))!important}}
  @media (max-width:900px){.scene{width:min(100vw,calc(100svh * 16 / 9))!important}}
}


/* =============================================================
   v26 DESKTOP LAYOUT FIX
   The room viewport is exactly the browser width minus the
   330px Room Controls dock. The full 16:9 scene is right-aligned
   inside that viewport, so its right edge touches the dock with
   no black strip between image and controls.
   ============================================================= */
@media (min-width:901px){
  :root{--desktop-dock:330px}
  .app-shell{position:fixed!important;inset:0!important;width:100vw!important;height:100dvh!important;overflow:hidden!important;background:#111}
  .room-column{
    position:absolute!important;
    left:0!important;top:0!important;bottom:0!important;
    right:var(--desktop-dock)!important;
    width:auto!important;height:auto!important;
    overflow:hidden!important;background:#111!important;
  }
  .stage-wrap,.stage{position:absolute!important;inset:0!important;width:100%!important;height:100%!important;overflow:hidden!important}
  .stage-wrap{display:block!important}
  .scene{
    position:absolute!important;
    right:0!important;left:auto!important;
    top:50%!important;
    width:min(100%,calc(100dvh * 16 / 9))!important;
    height:auto!important;
    aspect-ratio:16 / 9!important;
    transform:translateY(-50%)!important;
    margin:0!important;
    overflow:visible!important;
  }
  .side-panel{
    position:absolute!important;
    top:0!important;right:0!important;bottom:0!important;left:auto!important;
    width:var(--desktop-dock)!important;
    min-width:var(--desktop-dock)!important;
    max-width:var(--desktop-dock)!important;
    height:100%!important;max-height:none!important;
    border-radius:0!important;
    transform:none!important;
  }
  .panel-toggle,.panel-close{display:none!important}
}
@supports (height:100svh){
  @media (min-width:901px){
    .app-shell{height:100svh!important}
    .scene{width:min(100%,calc(100svh * 16 / 9))!important}
  }
}


/* =============================================================
   v27 WIDE ROOM BACKGROUNDS
   All selected rooms are normalized to a wide 1916x821 canvas.
   The scene uses the same panoramic ratio so the artwork fills
   the available room area and eliminates the leftover black strip.
   ============================================================= */
:root{--scene-ratio:2.3337393423}
@media (min-width:901px){
  .scene{
    width:min(100%,calc(100dvh * var(--scene-ratio)))!important;
    aspect-ratio:1916 / 821!important;
  }
}
@media (max-width:900px){
  .scene{
    width:min(100vw,calc(100dvh * var(--scene-ratio)))!important;
    aspect-ratio:1916 / 821!important;
  }
}
@supports (height:100svh){
  @media (min-width:901px){.scene{width:min(100%,calc(100svh * var(--scene-ratio)))!important}}
  @media (max-width:900px){.scene{width:min(100vw,calc(100svh * var(--scene-ratio)))!important}}
}

/* v27 exit targets on the new wide artwork. */
.room-exit-1{left:61.7%!important;top:51.5%!important;width:6.5%!important;height:20%!important}
.room-exit-2{left:11.2%!important;top:39.0%!important;width:12.5%!important;height:35%!important}
.room-exit-3{left:11.0%!important;top:39.5%!important;width:11.5%!important;height:39%!important}
.room-exit-4{left:67.4%!important;top:39.0%!important;width:5.8%!important;height:18%!important}
.room-exit-5{left:52.6%!important;top:43.5%!important;width:8.5%!important;height:30%!important}

/* v29 Room 1: 25 clickable vintage numbered medallions + playable mate-in-1 popup */
.puzzle-hotspots{position:absolute;inset:0;z-index:70;pointer-events:none}
.puzzle-number-hit{position:absolute;width:3.2%;height:5.8%;transform:translate(-50%,-50%);border:0;background:transparent;padding:0;pointer-events:auto;cursor:pointer;border-radius:50%;-webkit-tap-highlight-color:transparent}
.puzzle-number-hit:focus-visible{outline:3px solid #ffd36a;outline-offset:2px;background:rgba(255,211,106,.14)}
.puzzle-number-1{left:18.7%;top:31.8%}.puzzle-number-2{left:18.7%;top:36.2%}.puzzle-number-3{left:18.7%;top:40.7%}.puzzle-number-4{left:18.7%;top:45.3%}.puzzle-number-5{left:18.7%;top:49.9%}
.puzzle-number-6{left:29.1%;top:28.9%}.puzzle-number-7{left:29.1%;top:33.7%}.puzzle-number-8{left:29.1%;top:38.5%}.puzzle-number-9{left:29.1%;top:43.3%}.puzzle-number-10{left:29.1%;top:48.5%}
.puzzle-number-11{left:41.0%;top:27.3%}.puzzle-number-12{left:41.0%;top:32.1%}.puzzle-number-13{left:41.0%;top:37.0%}.puzzle-number-14{left:41.0%;top:41.9%}.puzzle-number-15{left:41.0%;top:47.0%}
.puzzle-number-16{left:55.5%;top:24.9%}.puzzle-number-17{left:55.5%;top:30.1%}.puzzle-number-18{left:55.5%;top:35.2%}.puzzle-number-19{left:55.5%;top:40.2%}.puzzle-number-20{left:55.5%;top:45.4%}
.puzzle-number-21{left:68.8%;top:29.2%}.puzzle-number-22{left:68.8%;top:34.2%}.puzzle-number-23{left:68.8%;top:39.2%}.puzzle-number-24{left:68.8%;top:44.4%}.puzzle-number-25{left:68.8%;top:49.7%}

.puzzle-modal{position:fixed;inset:0;z-index:1600;display:grid;place-items:center;padding:18px;overflow:auto}
.puzzle-backdrop{position:absolute;inset:0;background:rgba(20,12,6,.68);backdrop-filter:blur(2px)}
.vintage-puzzle-card{position:relative;z-index:1;width:min(850px,94vw);max-height:94vh;overflow:auto;padding:46px 38px 28px;border:5px solid #4b270d;border-radius:7px;background:
  radial-gradient(circle at 18% 22%,rgba(94,49,16,.08) 0 1px,transparent 2px),
  radial-gradient(circle at 78% 64%,rgba(94,49,16,.07) 0 1px,transparent 2px),
  linear-gradient(135deg,#e8c98e,#f5dfae 48%,#d9ad68);
box-shadow:0 22px 70px rgba(0,0,0,.55),inset 0 0 0 3px #c8892e,inset 0 0 0 7px #2d190b;color:#281707;font-family:Georgia,"Times New Roman",serif;text-align:center}
.vintage-puzzle-card::before{content:"";position:absolute;inset:12px;border:2px solid #7f4c16;pointer-events:none}
.vintage-puzzle-card::after{content:"❧     ♛     ❧";position:absolute;left:50%;top:13px;transform:translateX(-50%);color:#6f3e10;font-size:21px;letter-spacing:.28em;white-space:nowrap}
.vintage-crown{font-size:20px;color:#8d5111;margin-bottom:2px}
.vintage-puzzle-card h2{font-size:clamp(26px,3.8vw,44px);line-height:1.1;font-style:italic;margin:0 44px 2px;text-shadow:0 1px #f8e8c6}
.puzzle-subtitle{font-size:clamp(18px,2.3vw,27px);font-weight:700;margin-top:3px}
.puzzle-instruction{font-size:clamp(16px,2vw,23px);font-style:italic;margin:0 0 15px}
.puzzle-close{position:absolute;right:23px;top:22px;z-index:4;width:54px;height:54px;border-radius:50%;border:3px solid #3c210b;background:radial-gradient(circle,#b56b16,#6d3608);color:#ffe3a5;font:bold 36px/1 Georgia,serif;box-shadow:inset 0 0 0 2px #dca64a,0 3px 8px rgba(0,0,0,.35);cursor:pointer}
.puzzle-board-shell{width:min(520px,82vw);margin:0 auto}
.puzzle-board{display:grid;grid-template-columns:repeat(8,1fr);aspect-ratio:1/1;border:7px ridge #6f4217;background:#6f4217;box-shadow:0 5px 16px rgba(51,29,9,.34)}
.puzzle-square{position:relative;display:grid;place-items:center;border:0;padding:0;min-width:0;min-height:0;font-family:"Segoe UI Symbol","Noto Sans Symbols 2",serif;font-size:clamp(28px,5.6vw,58px);line-height:1;user-select:none;-webkit-user-select:none;touch-action:none}
.puzzle-square.light{background:#d9b376}.puzzle-square.dark{background:#86582f}
.puzzle-square.selected{outline:4px solid #f5c04a;outline-offset:-4px}
.puzzle-square.legal-target::after{content:"";position:absolute;width:22%;aspect-ratio:1;border-radius:50%;background:rgba(38,25,10,.30)}
.puzzle-piece{display:block;filter:drop-shadow(0 2px 1px rgba(0,0,0,.35));cursor:grab}
.puzzle-piece.white{color:#fff4cf;text-shadow:-1px -1px 0 #2a1607,1px -1px 0 #2a1607,-1px 1px 0 #2a1607,1px 1px 0 #2a1607}
.puzzle-piece.black{color:#130b05;text-shadow:0 1px 0 rgba(255,220,155,.25)}
.board-files{display:grid;grid-template-columns:repeat(8,1fr);padding:4px 7px 0;color:#351d08;font-size:16px;font-weight:700}
.puzzle-status{min-height:24px;margin:11px auto 5px;font-size:17px;font-weight:700}
.puzzle-status.solved{color:#315b1f}.puzzle-status.wrong{color:#87301e}
.puzzle-actions{display:flex;justify-content:center;gap:12px;margin-top:12px}
.vintage-action{min-width:170px;padding:11px 22px;border:3px solid #3b200b;border-radius:5px;background:linear-gradient(#8b4b10,#4d2708);color:#f6cf75;font:700 20px Georgia,"Times New Roman",serif;box-shadow:inset 0 0 0 2px #bd7823,0 3px 7px rgba(0,0,0,.25);cursor:pointer}
.vintage-action:active{transform:translateY(1px)}
@media(max-width:640px){
  .puzzle-modal{padding:8px}
  .vintage-puzzle-card{width:97vw;max-height:96vh;padding:40px 15px 20px}
  .vintage-puzzle-card::before{inset:7px}
  .puzzle-close{width:44px;height:44px;right:14px;top:14px;font-size:29px}
  .vintage-puzzle-card h2{margin-left:38px;margin-right:38px}
  .puzzle-board-shell{width:min(86vw,500px)}
  .vintage-action{min-width:140px;font-size:17px;padding:10px 16px}
}

/* v30 exact vintage parchment chess-problem presentation */
.puzzle-modal{padding:20px;background:transparent}
.puzzle-backdrop{background:rgba(18,10,4,.66);backdrop-filter:blur(3px) saturate(.8)}
.vintage-puzzle-card{
  width:min(875px,95vw);
  max-height:95vh;
  overflow:auto;
  padding:52px 50px 30px;
  border:6px solid #241205;
  border-radius:8px;
  color:#241505;
  background:
    radial-gradient(circle at 10% 18%,rgba(88,45,14,.16) 0 1px,transparent 2px),
    radial-gradient(circle at 86% 22%,rgba(88,45,14,.12) 0 1px,transparent 2px),
    radial-gradient(circle at 22% 78%,rgba(88,45,14,.10) 0 1px,transparent 2px),
    radial-gradient(circle at 73% 68%,rgba(88,45,14,.12) 0 1px,transparent 2px),
    linear-gradient(100deg,rgba(126,72,21,.10),transparent 18%,transparent 82%,rgba(126,72,21,.11)),
    linear-gradient(#edd09a,#efd7aa 44%,#e2bd7b 100%);
  box-shadow:
    0 26px 80px rgba(0,0,0,.62),
    inset 0 0 0 3px #c88422,
    inset 0 0 0 7px #351b08,
    inset 0 0 34px rgba(92,49,15,.30);
  font-family:Georgia,"Times New Roman",serif;
  text-align:center;
}
.vintage-puzzle-card::before{
  content:"";
  position:absolute;
  inset:15px;
  border:2px solid #8f5719;
  box-shadow:inset 0 0 0 1px rgba(43,22,7,.8);
  pointer-events:none;
}
.vintage-puzzle-card::after{
  content:"❧  ─────────  ♛  ─────────  ❧";
  position:absolute;
  left:50%;top:15px;
  transform:translateX(-50%);
  color:#6c3b0d;
  font-size:17px;
  letter-spacing:.10em;
  white-space:nowrap;
  text-shadow:0 1px #f8e2b2;
}
.vintage-crown{
  width:58px;height:34px;
  display:grid;place-items:center;
  margin:-6px auto 1px;
  color:#8c500e;
  font-size:26px;
  text-shadow:0 1px #f7d99e;
}
.vintage-puzzle-card h2{
  margin:0 58px 2px;
  font-size:clamp(30px,4vw,47px);
  line-height:1.05;
  font-style:italic;
  font-weight:700;
  letter-spacing:.01em;
  text-shadow:0 1px #f9e6be;
}
.puzzle-subtitle{font-size:clamp(20px,2.5vw,29px);font-weight:700;margin-top:4px;line-height:1.05}
.puzzle-instruction{font-size:clamp(17px,2.1vw,23px);font-style:italic;margin:4px 0 15px;color:#3d2108}
.puzzle-close{
  right:24px;top:23px;
  width:60px;height:60px;
  border:4px solid #2d1605;
  background:radial-gradient(circle at 38% 30%,#c47a1b,#7d400a 62%,#4b2405 100%);
  color:#f7cb68;
  font:bold 39px/1 Georgia,serif;
  box-shadow:inset 0 0 0 2px #dca34a,inset 0 0 0 5px #3f2008,0 4px 10px rgba(0,0,0,.35);
  text-shadow:0 1px #351803;
}
.puzzle-close:hover{filter:brightness(1.08)}
.puzzle-board-shell{position:relative;width:min(535px,82vw);margin:0 auto;padding:0 0 0 28px}
.puzzle-board-shell::before{
  content:"8\A 7\A 6\A 5\A 4\A 3\A 2\A 1";
  white-space:pre;
  position:absolute;left:5px;top:11px;bottom:31px;
  display:flex;align-items:center;justify-content:space-between;
  writing-mode:horizontal-tb;
  line-height:calc((100% - 0px)/8);
  color:#361d08;font-size:15px;font-weight:700;
}
.puzzle-board{
  border:8px ridge #6d3f13;
  background:#6d3f13;
  box-shadow:0 7px 20px rgba(51,29,9,.36),inset 0 0 0 1px #c78b3d;
}
.puzzle-square{font-size:clamp(30px,5.4vw,59px)}
.puzzle-square.light{background:linear-gradient(135deg,#dcb978,#d0a25f)}
.puzzle-square.dark{background:linear-gradient(135deg,#84542d,#6f4324)}
.puzzle-square.selected{outline:4px solid #f3c159;outline-offset:-4px;box-shadow:inset 0 0 18px rgba(255,215,111,.55)}
.puzzle-piece.white{color:#fff4cf;text-shadow:-1px -1px 0 #241204,1px -1px 0 #241204,-1px 1px 0 #241204,1px 1px 0 #241204,0 2px 2px rgba(0,0,0,.4)}
.puzzle-piece.black{color:#100904;text-shadow:0 1px 0 rgba(255,221,153,.30),0 2px 2px rgba(0,0,0,.28)}
.board-files{padding:5px 7px 0 0;color:#341b07;font-size:17px;font-weight:700}
.puzzle-status{max-width:560px;min-height:27px;margin:12px auto 6px;font-size:18px;font-weight:700;color:#372008}
.puzzle-status.solved{color:#2f5b22}.puzzle-status.wrong{color:#8b2b19}
.vintage-action{
  min-width:184px;
  padding:12px 24px;
  border:4px solid #2f1705;
  border-radius:6px;
  background:linear-gradient(#9c5913,#582b08);
  color:#f3c967;
  font:700 21px Georgia,"Times New Roman",serif;
  box-shadow:inset 0 0 0 2px #c8892d,inset 0 -6px 12px rgba(45,21,4,.22),0 4px 8px rgba(0,0,0,.25);
  text-shadow:0 1px #2d1605;
}
.vintage-action:hover{filter:brightness(1.06)}
.vintage-puzzle-card .puzzle-board-shell::after{
  content:"♞";
  position:absolute;
  left:-84px;top:18%;
  font-size:108px;
  color:rgba(94,54,18,.10);
  transform:rotate(-9deg);
  pointer-events:none;
}
@media(max-width:760px){
  .vintage-puzzle-card{padding:46px 18px 22px}
  .vintage-puzzle-card::after{font-size:13px;letter-spacing:.05em}
  .puzzle-close{width:48px;height:48px;right:13px;top:14px;font-size:31px}
  .puzzle-board-shell{width:min(88vw,520px);padding-left:22px}
  .puzzle-board-shell::before{left:2px;font-size:12px;top:9px;bottom:29px}
  .vintage-puzzle-card .puzzle-board-shell::after{display:none}
  .vintage-action{min-width:150px;font-size:18px;padding:10px 17px}
}

/* v31: closer match to the selected ornate parchment reference. */
.puzzle-modal{
  padding:12px;
  overflow:auto;
  overscroll-behavior:contain;
}
.puzzle-backdrop{
  background:rgba(18,10,4,.72);
  backdrop-filter:blur(4px) saturate(.72);
}
.vintage-puzzle-card{
  position:relative;
  width:min(860px,calc(100vw - 28px));
  max-height:none;
  overflow:visible;
  padding:54px 56px 24px;
  border:7px solid #1f0f03;
  border-radius:8px;
  background:
    radial-gradient(circle at 17% 17%,rgba(70,34,7,.12) 0 1px,transparent 2px),
    radial-gradient(circle at 77% 27%,rgba(70,34,7,.10) 0 1px,transparent 2px),
    radial-gradient(circle at 34% 74%,rgba(70,34,7,.09) 0 1px,transparent 2px),
    radial-gradient(circle at 86% 78%,rgba(70,34,7,.11) 0 1px,transparent 2px),
    repeating-linear-gradient(6deg,rgba(91,48,12,.025) 0 1px,transparent 1px 7px),
    linear-gradient(90deg,rgba(92,47,10,.17),transparent 8%,transparent 92%,rgba(92,47,10,.15)),
    linear-gradient(#efd5a0 0%,#f3ddb0 48%,#e6c181 100%);
  box-shadow:
    0 28px 88px rgba(0,0,0,.68),
    inset 0 0 0 2px #d39a3b,
    inset 0 0 0 6px #3b1c06,
    inset 0 0 0 9px #a5661c,
    inset 0 0 42px rgba(72,36,8,.34);
}
.vintage-puzzle-card::before{
  inset:18px;
  border:2px solid #8f5515;
  box-shadow:inset 0 0 0 1px #2a1304,0 0 0 2px rgba(238,191,95,.32);
}
.vintage-puzzle-card::after{
  content:"❦  ───────  ♛  ───────  ❦";
  top:16px;
  font-size:15px;
  letter-spacing:.12em;
  color:#70400c;
}
.vintage-corner{
  position:absolute;
  z-index:2;
  width:66px;
  height:66px;
  pointer-events:none;
  opacity:.96;
}
.vintage-corner::before,
.vintage-corner::after{
  content:"";
  position:absolute;
  border-color:#9a611c;
  filter:drop-shadow(0 1px 0 #2f1605);
}
.vintage-corner::before{
  inset:0;
  border-style:solid;
  border-width:3px 0 0 3px;
  border-radius:18px 0 0 0;
}
.vintage-corner::after{
  width:34px;height:34px;left:9px;top:9px;
  border-style:double;
  border-width:4px 0 0 4px;
  border-radius:50% 0 0 0;
  transform:rotate(-8deg);
}
.corner-tl{left:17px;top:17px}
.corner-tr{right:17px;top:17px;transform:scaleX(-1)}
.corner-bl{left:17px;bottom:17px;transform:scaleY(-1)}
.corner-br{right:17px;bottom:17px;transform:scale(-1)}
.vintage-crown{
  margin:-4px auto 0;
  font-size:28px;
  color:#8a4e0c;
}
.vintage-puzzle-card h2{
  margin:0 66px 1px;
  font-size:clamp(31px,3.7vw,45px);
  letter-spacing:.005em;
}
.puzzle-subtitle{
  margin-top:1px;
  font-size:clamp(20px,2.25vw,27px);
}
.puzzle-instruction{
  margin:3px 0 12px;
  font-size:clamp(16px,1.9vw,21px);
}
.puzzle-close{
  right:27px;top:25px;
  width:58px;height:58px;
  border:4px solid #2b1304;
  background:radial-gradient(circle at 35% 28%,#ca7e1e 0 18%,#8c490d 48%,#522605 76%,#2f1604 100%);
  box-shadow:inset 0 0 0 2px #e1ad51,inset 0 0 0 6px #512706,0 4px 12px rgba(0,0,0,.4);
}
.puzzle-board-shell{
  width:min(500px,calc(100vh - 310px),78vw);
  min-width:300px;
  padding-left:28px;
}
.puzzle-board{
  border:8px ridge #684016;
  box-shadow:0 8px 22px rgba(48,24,5,.42),inset 0 0 0 1px #d19a45;
}
.puzzle-square.light{
  background:
    linear-gradient(rgba(255,255,255,.05),rgba(255,255,255,0)),
    linear-gradient(135deg,#d9b374,#c99955);
}
.puzzle-square.dark{
  background:
    linear-gradient(rgba(255,255,255,.025),rgba(255,255,255,0)),
    linear-gradient(135deg,#82532c,#68401f);
}
.board-files{padding-top:4px;font-size:16px}
.puzzle-status{margin:8px auto 4px;min-height:22px;font-size:16px}
.puzzle-actions{margin-top:7px}
.vintage-action{
  min-width:170px;
  padding:9px 22px;
  border:4px solid #2b1404;
  border-radius:4px;
  background:linear-gradient(#965312,#542706);
  box-shadow:inset 0 0 0 2px #c98427,inset 0 -5px 10px rgba(43,19,3,.25),0 3px 7px rgba(0,0,0,.27);
  font-size:19px;
}
.vintage-puzzle-card .puzzle-board-shell::after{
  left:-79px;
  top:16%;
  font-size:102px;
  opacity:.9;
}
@media(max-height:820px) and (min-width:761px){
  .vintage-puzzle-card{padding-top:43px;padding-bottom:16px}
  .vintage-puzzle-card h2{font-size:34px}
  .puzzle-subtitle{font-size:21px}
  .puzzle-instruction{font-size:16px;margin-bottom:8px}
  .puzzle-board-shell{width:min(440px,calc(100vh - 255px),72vw)}
  .puzzle-close{width:50px;height:50px;font-size:31px}
}
@media(max-width:760px){
  .puzzle-modal{align-items:start;padding:8px}
  .vintage-puzzle-card{width:calc(100vw - 16px);padding:44px 14px 18px}
  .vintage-corner{width:48px;height:48px}
  .corner-tl{left:10px;top:10px}.corner-tr{right:10px;top:10px}.corner-bl{left:10px;bottom:10px}.corner-br{right:10px;bottom:10px}
  .puzzle-board-shell{width:min(88vw,470px);min-width:0;padding-left:22px}
  .puzzle-close{right:14px;top:13px;width:46px;height:46px;font-size:29px}
  .vintage-puzzle-card h2{font-size:clamp(27px,8vw,38px);margin-left:42px;margin-right:42px}
  .puzzle-subtitle{font-size:20px}
  .puzzle-instruction{font-size:16px}
  .vintage-action{font-size:17px;min-width:145px;padding:9px 15px}
}

/* v32: use the user's exact vintage popup artwork as the visual shell. */
.puzzle-modal{padding:10px;overflow:auto;align-items:center}
.puzzle-backdrop{background:rgba(18,10,4,.74);backdrop-filter:blur(4px) saturate(.72)}
.exact-shell-card{
  position:relative;
  width:min(860px,94vw);
  aspect-ratio:860/790;
  max-height:none;
  overflow:hidden;
  padding:0;
  border:0;
  border-radius:0;
  background:url('puzzle-panel.webp') center/100% 100% no-repeat;
  box-shadow:0 28px 90px rgba(0,0,0,.72);
}
.exact-shell-card::before,.exact-shell-card::after{display:none!important}
.exact-shell-title-mask{
  position:absolute;z-index:1;left:24%;top:5.5%;width:53%;height:15.5%;
  background:
    radial-gradient(circle at 15% 30%,rgba(115,68,20,.08) 0 1px,transparent 2px),
    linear-gradient(180deg,rgba(234,207,151,.98),rgba(229,197,137,.98));
  border-radius:8px;
  box-shadow:0 0 18px 10px rgba(231,201,145,.95);
}
.exact-shell-title{
  position:absolute;z-index:3;left:21%;right:21%;top:6.6%;text-align:center;color:#2d1807;
  font-family:Georgia,'Times New Roman',serif;
}
.exact-shell-title h2{margin:0 0 1px;font-size:clamp(30px,4vw,47px);font-style:italic;line-height:1.03;text-shadow:0 1px #f8e8c4}
.exact-shell-title .puzzle-subtitle{font-size:clamp(20px,2.5vw,28px);font-weight:700;line-height:1.05;margin:0}
.exact-shell-title .puzzle-instruction{font-size:clamp(17px,2vw,22px);font-style:italic;line-height:1.1;margin:3px 0 0}
.exact-shell-close{
  z-index:6;right:4.2%;top:4.6%;width:6.2%;height:auto;aspect-ratio:1;
  border-radius:50%;border:3px solid #2b1304;background:radial-gradient(circle at 35% 28%,#ca7e1e 0 18%,#8c490d 48%,#522605 76%,#2f1604 100%);
  color:#f6c760;font:bold clamp(24px,3.3vw,39px)/1 Georgia,serif;box-shadow:inset 0 0 0 2px #e1ad51,inset 0 0 0 6px #512706,0 4px 12px rgba(0,0,0,.4);
}
.exact-shell-board{
  position:absolute;z-index:4;left:21.4%;top:22.2%;width:53.2%;min-width:0;margin:0;padding:0;
}
.exact-shell-board .puzzle-board{width:100%;aspect-ratio:1;border:6px ridge #6b4115;box-shadow:0 5px 16px rgba(51,29,9,.38)}
.exact-shell-board .puzzle-square{font-size:clamp(26px,4.7vw,56px)}
.exact-shell-board .board-files{height:4.3%;padding-top:2px;font-size:clamp(11px,1.45vw,16px);color:#2e1908}
.exact-shell-bottom-mask{
  position:absolute;z-index:2;left:8.8%;right:8.8%;bottom:7.0%;height:12.5%;
  background:
    radial-gradient(circle at 18% 25%,rgba(107,62,16,.08) 0 1px,transparent 2px),
    repeating-linear-gradient(7deg,rgba(86,48,13,.025) 0 1px,transparent 1px 7px),
    linear-gradient(180deg,#e6c68d,#dfbb78);
  box-shadow:0 0 16px 10px rgba(226,190,124,.9);
  border-radius:8px;
}
.exact-shell-status{
  position:absolute;z-index:4;left:23%;right:23%;bottom:15.0%;margin:0;min-height:0;
  color:#382006;font:700 clamp(14px,1.7vw,18px)/1.2 Georgia,'Times New Roman',serif;text-align:center;
}
.exact-shell-actions{position:absolute;z-index:5;left:0;right:0;bottom:8.4%;margin:0;display:flex;justify-content:center}
.exact-shell-reset{
  min-width:20%;padding:1.05% 3.2%;border:4px solid #2b1404;border-radius:4px;
  background:linear-gradient(#965312,#542706);color:#f6cf75;font:700 clamp(16px,2vw,22px) Georgia,'Times New Roman',serif;
  box-shadow:inset 0 0 0 2px #c98427,inset 0 -5px 10px rgba(43,19,3,.25),0 3px 7px rgba(0,0,0,.27);
}
@media(max-width:760px){
  .puzzle-modal{padding:4px;align-items:start}
  .exact-shell-card{width:98vw;max-width:none;margin-top:4px}
  .exact-shell-title h2{font-size:clamp(20px,6vw,34px)}
  .exact-shell-title .puzzle-subtitle{font-size:clamp(14px,4.2vw,20px)}
  .exact-shell-title .puzzle-instruction{font-size:clamp(12px,3.7vw,17px)}
  .exact-shell-board .puzzle-square{font-size:clamp(20px,8.4vw,44px)}
  .exact-shell-status{font-size:clamp(11px,3vw,15px)}
  .exact-shell-reset{font-size:clamp(13px,3.8vw,17px);border-width:3px}
}

/* v33: exact vintage artwork shell with live board overlaid. */
.puzzle-modal{padding:8px;overflow:auto;align-items:center;justify-items:center}
.puzzle-backdrop{background:rgba(13,8,4,.76);backdrop-filter:blur(4px) saturate(.72)}
.vintage-puzzle-card.exact-shell-card{
  position:relative;
  width:min(1060px,96vw);
  aspect-ratio:1672/941;
  max-height:none;
  overflow:hidden;
  padding:0;
  border:0;
  border-radius:0;
  background:url('puzzle-panel.webp') center/100% 100% no-repeat;
  box-shadow:0 20px 65px rgba(0,0,0,.55);
}
.vintage-puzzle-card.exact-shell-card::before,
.vintage-puzzle-card.exact-shell-card::after{display:none!important}
.exact-shell-title-mask{
  position:absolute;left:30.5%;top:6.0%;width:45.5%;height:17.8%;
  z-index:4;border-radius:10px;
  background:linear-gradient(180deg,rgba(239,207,145,.96),rgba(225,183,109,.93));
  box-shadow:0 0 22px rgba(228,183,111,.6);
}
.exact-shell-title{
  position:absolute;left:30.5%;top:7.1%;width:45.5%;height:15.5%;z-index:5;
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  color:#1e1208;text-align:center;font-family:Georgia,'Times New Roman',serif;
  pointer-events:none;
}
.exact-shell-title h2{
  margin:0!important;font-size:clamp(22px,3.15vw,48px)!important;line-height:1.05!important;
  font-style:italic;font-weight:700;text-shadow:0 1px rgba(255,240,195,.65);
}
.exact-shell-title .puzzle-subtitle{font-size:clamp(16px,2vw,29px)!important;font-weight:700;line-height:1.05;margin-top:5px!important}
.exact-shell-title .puzzle-instruction{font-size:clamp(13px,1.55vw,22px)!important;font-style:italic;line-height:1.1;margin:4px 0 0!important;color:#2c1809}
.exact-shell-close{
  position:absolute!important;right:3.8%!important;top:5.7%!important;width:6.1%!important;height:auto!important;aspect-ratio:1!important;
  z-index:20!important;border:0!important;border-radius:50%!important;background:transparent!important;color:transparent!important;
  box-shadow:none!important;cursor:pointer!important;
}
.exact-shell-board{
  position:absolute!important;left:35.35%!important;top:24.0%!important;width:29.7%!important;height:auto!important;aspect-ratio:1!important;
  z-index:10!important;margin:0!important;padding:0!important;
}
.exact-shell-board::before,.exact-shell-board::after{display:none!important}
.exact-shell-board .puzzle-board{
  width:100%!important;height:100%!important;aspect-ratio:1!important;border:0!important;
  box-shadow:none!important;background:#7b4a27!important;
}
.exact-shell-board .puzzle-square{font-size:clamp(21px,3.55vw,55px)!important}
.exact-shell-board .puzzle-square.light{background:linear-gradient(135deg,#e6bd77,#cf9e58)!important}
.exact-shell-board .puzzle-square.dark{background:linear-gradient(135deg,#754421,#5d3319)!important}
.exact-shell-board .puzzle-square.selected{outline:4px solid #ffd16a!important;outline-offset:-4px!important}
.exact-shell-board .board-files{display:none!important}
.exact-shell-bottom-mask{
  position:absolute;left:31.0%;bottom:3.4%;width:39.0%;height:10.8%;z-index:4;
  background:linear-gradient(180deg,rgba(229,187,112,.94),rgba(212,161,82,.96));border-radius:8px;
}
.exact-shell-status{
  position:absolute!important;left:34.8%;bottom:12.3%;width:30.4%;z-index:12;
  min-height:0!important;margin:0!important;color:#241508!important;text-align:center;font:bold clamp(11px,1.3vw,18px) Georgia,'Times New Roman',serif!important;
  background:rgba(236,202,137,.84);border-radius:5px;padding:3px 6px;
}
.exact-shell-actions{position:absolute!important;left:42.55%;bottom:4.1%;width:14.9%;height:7.2%;z-index:15;margin:0!important;display:block!important}
.exact-shell-reset{
  width:100%!important;height:100%!important;margin:0!important;border:0!important;background:transparent!important;color:transparent!important;
  box-shadow:none!important;cursor:pointer!important;font-size:0!important;padding:0!important;
}
@media (max-width:700px){
  .puzzle-modal{padding:3px;align-items:start}
  .vintage-puzzle-card.exact-shell-card{width:99vw;margin-top:6px}
  .exact-shell-title h2{font-size:clamp(17px,6vw,31px)!important}
  .exact-shell-title .puzzle-subtitle{font-size:clamp(12px,4vw,20px)!important}
  .exact-shell-title .puzzle-instruction{font-size:clamp(10px,3.2vw,15px)!important}
  .exact-shell-board .puzzle-square{font-size:clamp(18px,7vw,40px)!important}
  .exact-shell-status{font-size:clamp(9px,2.7vw,13px)!important}
}

/* v34 FIX: use only the cropped vintage puzzle panel, not the whole room screenshot. */
.puzzle-modal{padding:10px;overflow:auto;align-items:center;justify-items:center}
.puzzle-backdrop{background:rgba(13,8,4,.76);backdrop-filter:blur(4px) saturate(.72)}
.vintage-puzzle-card.exact-shell-card{
  position:relative;
  width:min(860px,94vw);
  aspect-ratio:857/793;
  max-height:94vh;
  overflow:hidden;
  padding:0;
  border:0;
  border-radius:0;
  background:url('puzzle-panel.webp') center/100% 100% no-repeat;
  box-shadow:0 24px 75px rgba(0,0,0,.62);
}
.vintage-puzzle-card.exact-shell-card::before,
.vintage-puzzle-card.exact-shell-card::after{display:none!important}

/* Cover the static title in the reference artwork and render the live problem title. */
.exact-shell-title-mask{
  position:absolute!important;
  left:24.0%!important; top:4.4%!important; width:52%!important; height:16.2%!important;
  z-index:4!important;
  border-radius:10px!important;
  background:
    radial-gradient(circle at 17% 25%,rgba(104,63,22,.07) 0 1px,transparent 2px),
    repeating-linear-gradient(7deg,rgba(79,45,15,.025) 0 1px,transparent 1px 7px),
    linear-gradient(180deg,#ebcf98,#e6c486)!important;
  box-shadow:0 0 18px 10px rgba(231,198,135,.78)!important;
}
.exact-shell-title{
  position:absolute!important;
  left:24.5%!important; top:5.6%!important; width:51%!important; height:14.4%!important;
  z-index:6!important;
  display:flex!important; flex-direction:column!important; align-items:center!important; justify-content:center!important;
  color:#211206!important; text-align:center!important; font-family:Georgia,'Times New Roman',serif!important;
  pointer-events:none!important;
}
.exact-shell-title h2{margin:0!important;font-size:clamp(28px,3.9vw,48px)!important;line-height:1.02!important;font-style:italic!important;font-weight:700!important}
.exact-shell-title .puzzle-subtitle{font-size:clamp(18px,2.45vw,29px)!important;font-weight:700!important;line-height:1.03!important;margin-top:4px!important}
.exact-shell-title .puzzle-instruction{font-size:clamp(15px,1.9vw,22px)!important;font-style:italic!important;line-height:1.05!important;margin:4px 0 0!important;color:#2d1808!important}

/* Invisible click target over the exact X already painted into the artwork. */
.exact-shell-close{
  position:absolute!important;
  right:2.0%!important; top:2.3%!important; width:8.6%!important; aspect-ratio:1!important; height:auto!important;
  z-index:20!important; border:0!important; border-radius:50%!important; background:transparent!important;
  color:transparent!important; box-shadow:none!important; cursor:pointer!important;
}

/* Live chessboard sits on top of the board printed in the vintage artwork. */
.exact-shell-board{
  position:absolute!important;
  left:24.45%!important; top:23.5%!important; width:52.4%!important; aspect-ratio:1!important;
  z-index:10!important; margin:0!important; padding:0!important;
}
.exact-shell-board::before,.exact-shell-board::after{display:none!important}
.exact-shell-board .puzzle-board{
  width:100%!important; height:100%!important; aspect-ratio:1!important;
  border:0!important; box-shadow:none!important; background:#7c4b29!important;
}
.exact-shell-board .puzzle-square{font-size:clamp(25px,4.55vw,58px)!important}
.exact-shell-board .puzzle-square.light{background:linear-gradient(135deg,#d9b06f,#c99752)!important}
.exact-shell-board .puzzle-square.dark{background:linear-gradient(135deg,#7c4b28,#623718)!important}
.exact-shell-board .puzzle-square.selected{outline:4px solid #ffd36c!important;outline-offset:-4px!important}
.exact-shell-board .board-files{display:none!important}

/* Hide the original Hint and Show Solution buttons and leave a single centered Reset. */
.exact-shell-bottom-mask{
  position:absolute!important;
  left:9.5%!important; right:9.5%!important; bottom:2.9%!important; height:13.5%!important;
  z-index:11!important;
  background:
    radial-gradient(circle at 15% 30%,rgba(103,60,18,.06) 0 1px,transparent 2px),
    repeating-linear-gradient(7deg,rgba(82,46,12,.025) 0 1px,transparent 1px 7px),
    linear-gradient(180deg,#e8c98f,#dfb978)!important;
  box-shadow:0 0 13px 8px rgba(225,188,122,.72)!important;
  border-radius:8px!important;
}
.exact-shell-status{
  position:absolute!important;
  left:27%!important; right:27%!important; bottom:13.1%!important;
  z-index:14!important; min-height:0!important; margin:0!important;
  color:#2b1707!important; text-align:center!important; font:bold clamp(12px,1.55vw,18px) Georgia,'Times New Roman',serif!important;
  background:rgba(232,198,134,.78)!important; border-radius:4px!important; padding:2px 6px!important;
}
.exact-shell-actions{
  position:absolute!important; left:38%!important; bottom:5.2%!important; width:24%!important; height:7.5%!important;
  z-index:15!important; margin:0!important; display:block!important;
}
.exact-shell-reset{
  width:100%!important; height:100%!important; margin:0!important; padding:0!important;
  border:4px solid #2b1505!important; border-radius:4px!important;
  background:linear-gradient(#965313,#562805)!important;
  color:#f5cd73!important; font:700 clamp(16px,2vw,22px) Georgia,'Times New Roman',serif!important;
  box-shadow:inset 0 0 0 2px #ca852a,inset 0 -4px 9px rgba(44,20,4,.28),0 3px 7px rgba(0,0,0,.28)!important;
  cursor:pointer!important;
}

@media(max-width:760px){
  .puzzle-modal{padding:4px;align-items:start}
  .vintage-puzzle-card.exact-shell-card{width:98vw;max-height:none;margin-top:4px}
  .exact-shell-title h2{font-size:clamp(21px,6.2vw,34px)!important}
  .exact-shell-title .puzzle-subtitle{font-size:clamp(14px,4vw,20px)!important}
  .exact-shell-title .puzzle-instruction{font-size:clamp(12px,3.3vw,16px)!important}
  .exact-shell-board .puzzle-square{font-size:clamp(20px,8vw,43px)!important}
  .exact-shell-status{font-size:clamp(10px,2.9vw,14px)!important}
  .exact-shell-reset{font-size:clamp(13px,4vw,17px)!important;border-width:3px!important}
}

/* v35 exact-reference vintage puzzle overlay */
.puzzle-modal{padding:8px;overflow:auto;background:transparent}
.puzzle-backdrop{background:rgba(12,7,3,.76);backdrop-filter:blur(4px) saturate(.72)}
.vintage-puzzle-card.exact-shell-card{
  position:relative;
  width:min(851px,96vw);
  aspect-ratio:851/792;
  max-height:96vh;
  overflow:hidden;
  padding:0;
  border:0;
  border-radius:0;
  background:url('puzzle-panel.webp') center/100% 100% no-repeat;
  box-shadow:0 22px 58px rgba(0,0,0,.55);
}
.vintage-puzzle-card.exact-shell-card::before,.vintage-puzzle-card.exact-shell-card::after{display:none!important}
.exact-shell-card .vintage-corner,.exact-shell-card .vintage-crown{display:none!important}
.exact-shell-card .exact-shell-title{position:absolute;left:18%;right:18%;top:6.5%;z-index:4;text-align:center;color:#1f1208;text-shadow:0 1px #f4d796}
.exact-shell-card .exact-shell-title h2{margin:0;font-family:Georgia,'Times New Roman',serif;font-style:italic;font-size:clamp(26px,4vw,44px);line-height:1.05}
.exact-shell-card .exact-shell-title .puzzle-subtitle{font:700 clamp(17px,2.4vw,28px)/1.05 Georgia,serif;margin-top:3px}
.exact-shell-card .exact-shell-title .puzzle-instruction{font:italic clamp(15px,2vw,22px)/1.1 Georgia,serif;margin-top:4px}
.exact-shell-card .exact-shell-board{position:absolute;left:22.1%;top:22.1%;width:54.1%;margin:0;padding:0;z-index:5}
.exact-shell-card .puzzle-board{width:100%;aspect-ratio:1;border:0!important;box-shadow:none!important;background:#8d6138;overflow:hidden}
.exact-shell-card .puzzle-square{font-family:Georgia,'Times New Roman',serif;font-size:clamp(27px,5vw,57px);text-shadow:0 2px 2px rgba(0,0,0,.45);touch-action:none}
.exact-shell-card .puzzle-square.light{background:linear-gradient(135deg,rgba(224,185,123,.97),rgba(190,142,79,.98))}
.exact-shell-card .puzzle-square.dark{background:linear-gradient(135deg,rgba(116,75,40,.98),rgba(83,51,28,.99))}
.exact-shell-card .puzzle-piece{font-family:'Times New Roman',Georgia,serif;font-weight:700;transform:scale(1.08);filter:drop-shadow(0 3px 2px rgba(0,0,0,.55));cursor:grab}
.exact-shell-card .puzzle-piece.white{color:#fff0ba;text-shadow:-2px -2px 0 #5a3513,2px -2px 0 #5a3513,-2px 2px 0 #5a3513,2px 2px 0 #5a3513,0 3px 2px #231207}
.exact-shell-card .puzzle-piece.black{color:#140b05;text-shadow:-1px -1px 0 #d69a3c,1px -1px 0 #6e3c10,-1px 1px 0 #6e3c10,1px 1px 0 #d69a3c,0 3px 2px rgba(0,0,0,.7)}
.exact-shell-card .puzzle-square.selected{outline:4px solid #f5bb38;outline-offset:-4px;box-shadow:inset 0 0 18px rgba(255,208,91,.5)}
.exact-shell-card .puzzle-square.legal-target::after{background:rgba(255,210,90,.52);box-shadow:0 0 0 2px rgba(77,43,12,.55)}
.exact-shell-card .exact-shell-status{position:absolute;left:20%;right:20%;bottom:12.9%;z-index:6;margin:0;text-align:center;font:700 clamp(13px,1.7vw,18px)/1.15 Georgia,serif;color:#35200c;min-height:20px}
.exact-shell-card .exact-shell-actions{position:absolute;left:36.7%;width:26.6%;bottom:5.6%;z-index:7;margin:0;display:flex;justify-content:center}
.exact-shell-card .exact-shell-reset{width:100%;min-width:0;padding:10px 8px;border:3px solid #2d1708;border-radius:4px;background:linear-gradient(#65300d,#2c1407);color:#f2bf58;font:700 clamp(15px,2vw,20px) Georgia,serif;box-shadow:inset 0 0 0 2px #a96419,0 3px 7px rgba(0,0,0,.38)}
.exact-shell-card .exact-shell-close{position:absolute;right:3.2%;top:3.3%;z-index:9;width:8%;aspect-ratio:1;height:auto;border-radius:50%;border:3px solid #2d1708;background:radial-gradient(circle at 38% 34%,#b76413,#4a2108 72%);color:#f1b94f;font:bold clamp(28px,5vw,46px)/1 Georgia,serif;box-shadow:inset 0 0 0 2px #b8761d,0 3px 8px rgba(0,0,0,.45)}
@media(max-width:700px){
  .vintage-puzzle-card.exact-shell-card{width:98vw;max-height:none}
  .exact-shell-card .exact-shell-title h2{font-size:clamp(20px,5.8vw,34px)}
  .exact-shell-card .exact-shell-title .puzzle-subtitle{font-size:clamp(14px,4.4vw,22px)}
  .exact-shell-card .exact-shell-title .puzzle-instruction{font-size:clamp(12px,3.8vw,18px)}
  .exact-shell-card .puzzle-square{font-size:clamp(22px,7.2vw,43px)}
}


/* v38: ONE vintage board only. The artwork supplies the actual squares. */
.vintage-puzzle-card.exact-shell-card{
  background:url('puzzle-panel.webp') center/100% 100% no-repeat!important;
}
.exact-shell-card .exact-shell-board{
  left:24.18%!important;
  top:23.48%!important;
  width:52.55%!important;
  aspect-ratio:1/1!important;
  background:transparent!important;
}
.exact-shell-card .puzzle-board{
  background:transparent!important;
  border:0!important;
  box-shadow:none!important;
}
.exact-shell-card .puzzle-square,
.exact-shell-card .puzzle-square.light,
.exact-shell-card .puzzle-square.dark{
  background:transparent!important;
  box-shadow:none!important;
}
.exact-shell-card .puzzle-piece{
  width:82%!important;
  height:82%!important;
  object-fit:contain!important;
  display:block!important;
  transform:none!important;
  filter:drop-shadow(0 3px 2px rgba(0,0,0,.48))!important;
  user-select:none!important;
  -webkit-user-drag:element;
}
.exact-shell-card .puzzle-piece.white,
.exact-shell-card .puzzle-piece.black{
  color:transparent!important;
  text-shadow:none!important;
}
.exact-shell-card .puzzle-square.selected{
  outline:3px solid rgba(246,190,60,.9)!important;
  outline-offset:-3px!important;
  background:rgba(255,204,75,.10)!important;
}
.exact-shell-card .puzzle-square.legal-target::after{
  width:18%!important;
  background:rgba(84,47,13,.32)!important;
  box-shadow:0 0 0 2px rgba(246,190,60,.55)!important;
}
/* The reference artwork already contains the title and Reset button. */
.exact-shell-card .exact-shell-title,
.exact-shell-card .exact-shell-title-mask,
.exact-shell-card .exact-shell-bottom-mask{
  display:none!important;
}
.exact-shell-card .exact-shell-reset{
  background:transparent!important;
  border:0!important;
  box-shadow:none!important;
  color:transparent!important;
  font-size:0!important;
}
.exact-shell-card .exact-shell-actions{
  left:38.1%!important;
  width:23.8%!important;
  bottom:5.6%!important;
  height:7.8%!important;
}
.exact-shell-card .exact-shell-status{
  left:24%!important;
  right:24%!important;
  bottom:14.0%!important;
  background:rgba(232,198,134,.72)!important;
}

/* v46: render visible chess glyphs directly; no transparent PNG dependencies. */
.exact-shell-card .puzzle-piece{
  width:auto!important;
  height:auto!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  font-family:"Times New Roman",Georgia,serif!important;
  font-size:clamp(34px,5.4vw,68px)!important;
  line-height:1!important;
  font-weight:700!important;
  transform:none!important;
  user-select:none!important;
  -webkit-user-select:none!important;
  cursor:grab!important;
}
.exact-shell-card .puzzle-piece.white{
  color:#fff0ba!important;
  text-shadow:-2px -2px 0 #5a3513,2px -2px 0 #5a3513,-2px 2px 0 #5a3513,2px 2px 0 #5a3513,0 3px 2px #231207!important;
}
.exact-shell-card .puzzle-piece.black{
  color:#140b05!important;
  text-shadow:-1px -1px 0 #d69a3c,1px -1px 0 #6e3c10,-1px 1px 0 #6e3c10,1px 1px 0 #d69a3c,0 3px 2px rgba(0,0,0,.7)!important;
}
.exact-shell-card .exact-shell-status{display:none!important;}

/* v47 FINAL alignment + clean popup edge */
.puzzle-modal{
  background:transparent!important;
}
.puzzle-backdrop{
  position:fixed!important;
  inset:0!important;
  background:rgba(0,0,0,.42)!important;
  backdrop-filter:none!important;
  -webkit-backdrop-filter:none!important;
  border:0!important;
  box-shadow:none!important;
}
.vintage-puzzle-card.exact-shell-card{
  background:url('puzzle-panel.webp') center/100% 100% no-repeat!important;
  border:0!important;
  border-radius:0!important;
  box-shadow:none!important;
  outline:0!important;
  overflow:hidden!important;
}
.exact-shell-card .puzzle-square{
  position:relative!important;
  overflow:hidden!important;
}
.exact-shell-card .puzzle-piece{
  position:absolute!important;
  inset:0!important;
  width:100%!important;
  height:100%!important;
  margin:0!important;
  padding:0!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  font-size:clamp(30px,4.6vw,58px)!important;
  line-height:1!important;
  transform:none!important;
  box-sizing:border-box!important;
}


/* v48 requested refinements: smaller pieces, clean frame edge, dynamic problem title. */
.vintage-puzzle-card.exact-shell-card{
  background-color:transparent!important;
  box-shadow:none!important;
  filter:none!important;
  isolation:isolate;
}
/* Keep the room visible behind the artwork; only a soft dim, no extra panel. */
.puzzle-modal{background:transparent!important;}
.puzzle-backdrop{
  background:rgba(0,0,0,.34)!important;
  backdrop-filter:none!important;
  -webkit-backdrop-filter:none!important;
  border:0!important;
  box-shadow:none!important;
}
/* Make pieces comfortably smaller than a square and perfectly centered. */
.exact-shell-card .puzzle-piece{
  inset:10%!important;
  width:80%!important;
  height:80%!important;
  font-size:clamp(24px,3.75vw,48px)!important;
  line-height:1!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
}
/* Cover only the title text printed into the artwork and draw the live title above it. */
.exact-shell-card .exact-shell-title-mask{
  display:block!important;
  position:absolute!important;
  z-index:7!important;
  left:19.5%!important;
  right:19.5%!important;
  top:5.0%!important;
  height:14.2%!important;
  background:linear-gradient(90deg,rgba(225,191,132,.02),#e6c78e 12%,#ecd19a 50%,#e6c78e 88%,rgba(225,191,132,.02))!important;
  border-radius:18px!important;
  pointer-events:none!important;
}
.exact-shell-card .exact-shell-title{
  display:block!important;
  position:absolute!important;
  z-index:8!important;
  left:18%!important;
  right:18%!important;
  top:6.6%!important;
  text-align:center!important;
  color:#241308!important;
  text-shadow:0 1px #f6dfad!important;
  pointer-events:none!important;
}
.exact-shell-card .exact-shell-title h2{
  margin:0!important;
  font:italic 700 clamp(25px,3.35vw,42px)/1.02 Georgia,'Times New Roman',serif!important;
}
.exact-shell-card .puzzle-subtitle{
  margin-top:3px!important;
  font:700 clamp(17px,2.05vw,25px)/1.05 Georgia,'Times New Roman',serif!important;
}
.exact-shell-card .puzzle-instruction{
  margin-top:3px!important;
  font:italic clamp(14px,1.6vw,20px)/1.05 Georgia,'Times New Roman',serif!important;
  color:#2d1808!important;
}
@media(max-width:700px){
  .exact-shell-card .puzzle-piece{inset:12%!important;width:76%!important;height:76%!important;font-size:clamp(20px,6.2vw,36px)!important;}
  .exact-shell-card .exact-shell-title-mask{left:17%!important;right:17%!important;top:4.8%!important;height:14.7%!important;}
  .exact-shell-card .exact-shell-title{top:6.2%!important;left:16%!important;right:16%!important;}
}

/* =============================================================
   v49 cleanup requested from the 2026-09-30 screenshot
   1) Fill the entire room viewport (remove black area below scene)
   2) Remove any modal/backdrop rectangle behind the ornate artwork
   3) Make chess pieces slightly smaller and centered
   4) Fully cover the baked-in title/subtitle area so no ghost text remains
   ============================================================= */

/* Fill the complete room area beside the desktop control panel. */
@media (min-width:901px){
  .room-column,
  .stage-wrap,
  .stage{
    background:transparent!important;
  }
  .scene{
    position:absolute!important;
    inset:0!important;
    left:0!important;
    right:0!important;
    top:0!important;
    bottom:0!important;
    width:100%!important;
    height:100%!important;
    max-width:none!important;
    max-height:none!important;
    aspect-ratio:auto!important;
    transform:none!important;
    margin:0!important;
    overflow:hidden!important;
  }
  .room-bg{
    width:100%!important;
    height:100%!important;
    object-fit:fill!important;
  }
}

/* On phones/tablets also use all available stage height. */
@media (max-width:900px){
  .scene{
    inset:0!important;
    left:0!important;
    top:0!important;
    width:100%!important;
    height:100%!important;
    max-width:none!important;
    max-height:none!important;
    aspect-ratio:auto!important;
    transform:none!important;
  }
  .room-bg{width:100%!important;height:100%!important;object-fit:fill!important;}
}

/* No full-screen dark/rectangular layer behind the ornate popup. */
.puzzle-modal{
  background:transparent!important;
}
.puzzle-backdrop{
  background:transparent!important;
  backdrop-filter:none!important;
  -webkit-backdrop-filter:none!important;
  border:0!important;
  outline:0!important;
  box-shadow:none!important;
}
.vintage-puzzle-card.exact-shell-card{
  border:0!important;
  outline:0!important;
  box-shadow:none!important;
  filter:none!important;
  background-color:transparent!important;
}

/* Cover the full baked-in heading area, including the faint duplicate line. */
.exact-shell-card .exact-shell-title-mask{
  display:block!important;
  left:17.5%!important;
  right:17.5%!important;
  top:4.3%!important;
  height:18.8%!important;
  background:linear-gradient(90deg,
    rgba(229,198,143,.05) 0%,
    #e6c78e 10%,
    #ecd19a 50%,
    #e6c78e 90%,
    rgba(229,198,143,.05) 100%)!important;
  border-radius:18px!important;
}
.exact-shell-card .exact-shell-title{
  top:6.0%!important;
}

/* Slightly smaller pieces so every glyph sits comfortably inside its square. */
.exact-shell-card .puzzle-piece{
  inset:16%!important;
  width:112%!important;
  height:112%!important;
  font-size:clamp(20px,3.15vw,40px)!important;
  line-height:1!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
}

/* Do not reserve/show a second instruction/status row below the board. */
.exact-shell-card .exact-shell-status{
  display:none!important;
  min-height:0!important;
  height:0!important;
  margin:0!important;
  padding:0!important;
}

@media(max-width:700px){
  .exact-shell-card .puzzle-piece{
    inset:17%!important;
    width:66%!important;
    height:66%!important;
    font-size:clamp(18px,5.2vw,31px)!important;
  }
  .exact-shell-card .exact-shell-title-mask{
    left:15%!important;
    right:15%!important;
    top:4.0%!important;
    height:19.5%!important;
  }
  .exact-shell-card .exact-shell-title{top:5.5%!important;}
}

/* =============================================================
   v50 FINAL VIEWPORT + PIECE FIT FIX
   - Force the room artwork to fill the entire visible room column.
   - Keep the right control dock separate.
   - Make chess glyphs a little smaller and perfectly centered.
   ============================================================= */
@media (min-width:901px){
  html,body{width:100vw!important;height:100vh!important;height:100dvh!important;margin:0!important;overflow:hidden!important;}
  .app-shell{
    position:fixed!important;inset:0!important;
    width:100vw!important;height:100vh!important;height:100dvh!important;
    display:block!important;overflow:hidden!important;background:transparent!important;
  }
  .room-column{
    position:fixed!important;
    left:0!important;top:0!important;bottom:0!important;right:330px!important;
    width:auto!important;height:auto!important;min-height:100vh!important;min-height:100dvh!important;
    overflow:hidden!important;background:transparent!important;
  }
  .room-column .stage-wrap,
  .room-column .stage{
    position:absolute!important;inset:0!important;
    width:100%!important;height:100%!important;min-height:100%!important;
    margin:0!important;padding:0!important;overflow:hidden!important;background:transparent!important;
  }
  .room-column .stage-wrap{display:block!important;}
  .room-column .stage .scene{
    position:absolute!important;
    left:0!important;right:0!important;top:0!important;bottom:0!important;
    width:100%!important;height:100%!important;min-height:100%!important;
    max-width:none!important;max-height:none!important;
    margin:0!important;transform:none!important;aspect-ratio:auto!important;
    overflow:hidden!important;
  }
  .room-column .stage .scene > .room-bg{
    position:absolute!important;inset:0!important;
    width:100%!important;height:100%!important;min-height:100%!important;
    max-width:none!important;max-height:none!important;
    object-fit:fill!important;display:block!important;
  }
  .side-panel{
    position:fixed!important;top:0!important;right:0!important;bottom:0!important;left:auto!important;
    width:330px!important;height:100vh!important;height:100dvh!important;
    max-height:none!important;
  }
}

@media (max-width:900px){
  .room-column,.stage-wrap,.stage,.scene{
    position:fixed!important;inset:0!important;
    width:100vw!important;height:100vh!important;height:100dvh!important;
    max-width:none!important;max-height:none!important;
    margin:0!important;transform:none!important;aspect-ratio:auto!important;
  }
  .room-bg{width:100%!important;height:100%!important;object-fit:fill!important;}
}

/* Slightly smaller than v49, with a stable visual center in each cell. */
.exact-shell-card .puzzle-piece{
  position:absolute!important;
  inset:20%!important;
  width:60%!important;
  height:60%!important;
  font-size:clamp(18px,2.75vw,35px)!important;
  line-height:1!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  margin:0!important;padding:0!important;
  transform:none!important;
}
@media(max-width:700px){
  .exact-shell-card .puzzle-piece{
    inset:21%!important;
    width:58%!important;
    height:58%!important;
    font-size:clamp(17px,4.8vw,29px)!important;
  }
}

/* =============================================================
   v51: approved transparent ornate popup artwork
   - use the new transparent-edged panel
   - preserve live problem numbers 1-25 over the baked sample title
   - keep the board interactive with centered pieces
   ============================================================= */
.vintage-puzzle-card.exact-shell-card{
  width:min(900px,94vw)!important;
  aspect-ratio:1312/1199!important;
  max-height:94vh!important;
  overflow:visible!important;
  background:url('puzzle-panel.webp') center/100% 100% no-repeat!important;
  background-color:transparent!important;
  border:0!important;
  outline:0!important;
  box-shadow:none!important;
}
.puzzle-modal,.puzzle-backdrop{
  background:transparent!important;
  border:0!important;
  outline:0!important;
  box-shadow:none!important;
  backdrop-filter:none!important;
  -webkit-backdrop-filter:none!important;
}
/* Live title covers the baked sample title so every numbered puzzle stays correct. */
.exact-shell-card .exact-shell-title-mask{
  display:block!important;
  left:24%!important;
  right:24%!important;
  top:7.2%!important;
  height:15.8%!important;
  background:radial-gradient(ellipse at center,#e8c98f 0%,#e8c98f 68%,rgba(232,201,143,.88) 82%,rgba(232,201,143,0) 100%)!important;
  border-radius:22px!important;
  box-shadow:none!important;
}
.exact-shell-card .exact-shell-title{
  display:block!important;
  left:22%!important;
  right:22%!important;
  top:9.1%!important;
  width:auto!important;
  height:auto!important;
  text-align:center!important;
}
.exact-shell-card .exact-shell-title h2{font-size:clamp(25px,3.2vw,43px)!important;}
.exact-shell-card .puzzle-subtitle{font-size:clamp(17px,2.1vw,27px)!important;}
.exact-shell-card .puzzle-instruction{font-size:clamp(14px,1.7vw,21px)!important;}
/* Align the interactive 8x8 grid to the board painted into the approved artwork. */
.exact-shell-card .exact-shell-board{
  left:23.9%!important;
  top:26.2%!important;
  width:51.8%!important;
  aspect-ratio:1/1!important;
}
/* Slightly smaller pieces, centered in each square. */
.exact-shell-card .puzzle-piece{
  inset:22%!important;
  width:56%!important;
  height:56%!important;
  font-size:clamp(17px,2.5vw,33px)!important;
}
/* The artwork already paints the X and Reset button; these remain invisible click targets. */
.exact-shell-card .exact-shell-close{
  right:3.8%!important;
  top:3.2%!important;
  width:10%!important;
  aspect-ratio:1!important;
  border:0!important;
  background:transparent!important;
  color:transparent!important;
  box-shadow:none!important;
}
.exact-shell-card .exact-shell-actions{
  left:38.5%!important;
  width:23%!important;
  bottom:3.6%!important;
  height:9.5%!important;
}
.exact-shell-card .exact-shell-reset{
  background:transparent!important;
  border:0!important;
  color:transparent!important;
  box-shadow:none!important;
}
.exact-shell-card .exact-shell-status{display:none!important;}
@media(max-width:700px){
  .vintage-puzzle-card.exact-shell-card{width:98vw!important;}
  .exact-shell-card .puzzle-piece{inset:23%!important;width:54%!important;height:54%!important;font-size:clamp(16px,4.5vw,28px)!important;}
}

/* v52: iPhone/tablet aspect-ratio protection. Never stretch room artwork. */
html, body {
  width: 100%;
  height: 100%;
  min-height: 100%;
  overflow: hidden;
  background: #111;
}
.app-shell,
.room-column,
.stage-wrap,
.stage {
  position: fixed !important;
  inset: 0 !important;
  width: 100% !important;
  height: 100dvh !important;
  min-height: 0 !important;
  overflow: hidden !important;
}
.stage-wrap,
.stage {
  background: #111 !important;
}
.stage-wrap {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}
.scene {
  position: relative !important;
  left: auto !important;
  top: auto !important;
  width: min(100vw, calc(100dvh * 16 / 9)) !important;
  height: auto !important;
  aspect-ratio: 16 / 9 !important;
  max-width: 100vw !important;
  max-height: 100dvh !important;
  transform: none !important;
  transform-origin: center center !important;
  overflow: visible !important;
  flex: 0 0 auto !important;
}
.room-bg {
  position: absolute !important;
  inset: 0 !important;
  width: 100% !important;
  height: 100% !important;
  object-fit: contain !important;
  object-position: center center !important;
  display: block !important;
}

/* iOS dynamic viewport fallback. */
@supports (height: 100svh) {
  .app-shell,
  .room-column,
  .stage-wrap,
  .stage { height: 100svh !important; }
  .scene {
    width: min(100vw, calc(100svh * 16 / 9)) !important;
    max-height: 100svh !important;
  }
}

/* In portrait, fit the complete room by width; do not crop or distort it. */
@media (orientation: portrait) {
  .scene {
    width: 100vw !important;
    height: auto !important;
    aspect-ratio: 16 / 9 !important;
  }
}

/* Keep control panel usable on phones/tablets without changing room geometry. */
@media (max-width: 1024px) {
  .side-panel {
    width: min(300px, 82vw) !important;
    max-height: 44svh !important;
  }
}

/* =============================================================
   v53: collapsible vintage controls + persistent player score
   ============================================================= */
/* The room always owns the full viewport. The controls never reserve desktop width. */
.app-shell{display:block!important;grid-template-columns:none!important}
.room-column{position:fixed!important;inset:0!important;width:100vw!important;height:100dvh!important}

/* One Controls button on desktop, tablet and phone. */
.panel-toggle{
  display:block!important;
  position:fixed!important;
  top:calc(12px + var(--safe-top))!important;
  right:calc(14px + var(--safe-right))!important;
  z-index:910!important;
  padding:10px 16px!important;
  border:2px solid #5a3212!important;
  border-radius:9px!important;
  background:linear-gradient(#c38a42,#84501d)!important;
  color:#fff0c4!important;
  font:700 14px Georgia,"Times New Roman",serif!important;
  letter-spacing:.04em!important;
  text-shadow:0 1px #321706!important;
  box-shadow:inset 0 0 0 2px rgba(247,211,139,.45),0 5px 18px rgba(0,0,0,.3)!important;
  cursor:pointer!important;
}
.panel-toggle.hidden{display:none!important}

/* Dropdown-style panel: hidden above the viewport until Controls is clicked. */
.side-panel{
  position:fixed!important;
  top:calc(58px + var(--safe-top))!important;
  right:calc(14px + var(--safe-right))!important;
  bottom:auto!important;
  left:auto!important;
  width:min(360px,calc(100vw - 28px - var(--safe-left) - var(--safe-right)))!important;
  height:auto!important;
  max-height:calc(100dvh - 76px - var(--safe-top) - var(--safe-bottom))!important;
  overflow-y:auto!important;
  padding:44px 16px 18px!important;
  z-index:900!important;
  border:3px solid #4d2a0d!important;
  border-radius:14px!important;
  background:
    radial-gradient(circle at 14% 18%,rgba(88,45,12,.10) 0 1px,transparent 2px),
    radial-gradient(circle at 82% 72%,rgba(88,45,12,.09) 0 1px,transparent 2px),
    linear-gradient(135deg,#e5c38a,#f3ddb0 48%,#d2a461)!important;
  box-shadow:inset 0 0 0 2px #c28a37,inset 0 0 0 6px rgba(65,31,7,.48),0 16px 40px rgba(0,0,0,.38)!important;
  transform:translateY(calc(-100% - 100px))!important;
  opacity:0!important;
  visibility:hidden!important;
  pointer-events:none!important;
  transition:transform .24s ease,opacity .2s ease,visibility 0s linear .24s!important;
}
.side-panel.mobile-open{
  transform:translateY(0)!important;
  opacity:1!important;
  visibility:visible!important;
  pointer-events:auto!important;
  transition:transform .24s ease,opacity .2s ease!important;
}
.side-panel.hidden{display:none!important}
.panel-close{
  display:grid!important;
  place-items:center!important;
  position:absolute!important;
  right:10px!important;
  top:9px!important;
  width:31px!important;
  height:31px!important;
  margin:0!important;
  padding:0!important;
  border:2px solid #5b3211!important;
  border-radius:50%!important;
  background:linear-gradient(#a96520,#65320d)!important;
  color:#ffe4a1!important;
  font:700 21px/1 Georgia,serif!important;
  box-shadow:inset 0 0 0 1px #d49a45!important;
  cursor:pointer!important;
}
.panel-section{padding:12px 2px!important;border-bottom:1px solid rgba(91,51,17,.28)!important}
.panel-section h2{margin:0 0 9px!important;color:#4a260b!important;font:700 17px Georgia,"Times New Roman",serif!important;letter-spacing:.02em!important}
.panel-section textarea,.panel-section select,.admin-panel input{
  border:2px solid #9b6a31!important;border-radius:8px!important;background:rgba(255,244,215,.9)!important;color:#3c220d!important;
}
.primary-button,.secondary-button,.bounce-button{
  border:2px solid #5a3010!important;border-radius:8px!important;
  background:linear-gradient(#a86624,#6f3a10)!important;color:#fff0c2!important;
  box-shadow:inset 0 0 0 1px rgba(231,181,91,.55)!important;
}
.secondary-button{background:linear-gradient(#c99a56,#8b5a24)!important;color:#2f1908!important}
.status-text,.small-note,.admin-welcome,.person-row .meta{color:#65451f!important}
.person-row,.chat-msg,.pm-msg{background:rgba(255,245,220,.88)!important;border-color:#b88a52!important;color:#39200b!important}

/* Score belongs to the player and stays above the avatar/name. */
.player-score{
  display:inline-block;
  margin:0 auto 3px;
  padding:3px 8px;
  border:1px solid #5b3210;
  border-radius:999px;
  background:linear-gradient(#f2d691,#c79543);
  color:#3b200a;
  font:700 11px Georgia,"Times New Roman",serif;
  box-shadow:0 2px 5px rgba(0,0,0,.24),inset 0 0 0 1px rgba(255,244,196,.55);
  white-space:nowrap;
}

/* =============================================================
   v53 puzzle: all live text sits inside the ornate frame.
   Reset remains on the lower frame; result appears opposite it.
   ============================================================= */
.vintage-puzzle-card.exact-shell-card{
  background-image:url('puzzle-panel.webp')!important;
}
.exact-shell-card .exact-shell-title-mask{
  left:23.5%!important;right:23.5%!important;top:6.8%!important;height:16.6%!important;
}
.exact-shell-card .exact-shell-title{
  top:8.3%!important;left:23%!important;right:23%!important;
  color:#2b1708!important;
}
.exact-shell-card .exact-shell-title h2{font-size:clamp(24px,3.0vw,40px)!important;line-height:1!important}
.exact-shell-card .puzzle-subtitle{font-size:clamp(16px,1.9vw,25px)!important;margin-top:4px!important}
.exact-shell-card .puzzle-instruction{font-size:clamp(13px,1.55vw,20px)!important;margin-top:4px!important}

/* Footer overlays the lower parchment panel. */
.exact-shell-card .puzzle-footer{
  position:absolute!important;
  left:28%!important;right:14%!important;bottom:4.0%!important;
  height:9.5%!important;
  z-index:16!important;
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:3%!important;
  pointer-events:none!important;
}
.exact-shell-card .puzzle-footer .exact-shell-reset{
  pointer-events:auto!important;
  flex:0 0 39%!important;
  height:100%!important;
  min-width:0!important;
  padding:0!important;
  border:0!important;
  background:transparent!important;
  color:transparent!important;
  box-shadow:none!important;
  cursor:pointer!important;
}
.exact-shell-card .puzzle-footer .exact-shell-status{
  display:flex!important;
  flex:1 1 auto!important;
  position:static!important;
  min-height:0!important;
  height:72%!important;
  margin:0!important;
  align-items:center!important;
  justify-content:center!important;
  padding:4px 7px!important;
  border-radius:7px!important;
  background:rgba(235,207,150,.76)!important;
  color:#5b3010!important;
  font:700 clamp(10px,1.35vw,17px)/1.1 Georgia,"Times New Roman",serif!important;
  text-align:center!important;
  text-shadow:0 1px rgba(255,242,202,.7)!important;
}
.exact-shell-card .puzzle-footer .exact-shell-status:empty{background:transparent!important}
.exact-shell-card .puzzle-footer .exact-shell-status.solved{color:#31551f!important;background:rgba(230,211,151,.88)!important}
.exact-shell-card .puzzle-footer .exact-shell-status.wrong{color:#7b2a16!important;background:rgba(236,199,143,.88)!important}

@media(max-width:700px){
  .panel-toggle{top:calc(8px + var(--safe-top))!important;right:calc(8px + var(--safe-right))!important;padding:8px 11px!important;font-size:12px!important}
  .side-panel{top:calc(48px + var(--safe-top))!important;right:calc(8px + var(--safe-right))!important;width:min(330px,calc(100vw - 16px - var(--safe-left) - var(--safe-right)))!important;max-height:calc(100svh - 62px - var(--safe-top) - var(--safe-bottom))!important;padding:42px 12px 14px!important}
  .player-score{font-size:9px;padding:2px 6px;margin-bottom:2px}
  .exact-shell-card .exact-shell-title{top:7.9%!important;left:20%!important;right:20%!important}
  .exact-shell-card .exact-shell-title h2{font-size:clamp(19px,5.1vw,30px)!important}
  .exact-shell-card .puzzle-subtitle{font-size:clamp(12px,3.7vw,18px)!important}
  .exact-shell-card .puzzle-instruction{font-size:clamp(10px,3.0vw,14px)!important}
  .exact-shell-card .puzzle-footer{left:25%!important;right:10%!important;bottom:3.7%!important;height:10%!important}
  .exact-shell-card .puzzle-footer .exact-shell-status{font-size:clamp(8px,2.5vw,12px)!important;padding:3px 4px!important}
}

/* =============================================================
   v54: title stays INSIDE the ornate frame + full right-side walking
   ============================================================= */
/* Completely cover the title text baked into the PNG.  The live,
   numbered title is then drawn in this same parchment area INSIDE
   the ornate frame, so no second/floating title remains visible. */
.exact-shell-card .exact-shell-title-mask{
  display:block!important;
  position:absolute!important;
  z-index:20!important;
  left:20.2%!important;
  right:20.2%!important;
  top:5.0%!important;
  height:15.8%!important;
  border-radius:10px!important;
  background:
    radial-gradient(circle at 12% 20%,rgba(100,55,15,.06) 0 1px,transparent 1.8px),
    radial-gradient(circle at 75% 60%,rgba(100,55,15,.05) 0 1px,transparent 1.8px),
    linear-gradient(180deg,#ead09b 0%,#e8ca91 55%,#e5c184 100%)!important;
  box-shadow:0 0 15px 12px rgba(231,198,137,.90)!important;
  opacity:1!important;
  pointer-events:none!important;
}
.exact-shell-card .exact-shell-title{
  display:flex!important;
  flex-direction:column!important;
  align-items:center!important;
  justify-content:center!important;
  position:absolute!important;
  z-index:21!important;
  left:20.5%!important;
  right:20.5%!important;
  top:6.0%!important;
  height:13.5%!important;
  margin:0!important;
  color:#281507!important;
  text-align:center!important;
  pointer-events:none!important;
}
.exact-shell-card .exact-shell-title h2{
  margin:0!important;
  font:italic 700 clamp(24px,3.1vw,40px)/1.0 Georgia,'Times New Roman',serif!important;
}
.exact-shell-card .puzzle-subtitle{
  margin:4px 0 0!important;
  font:700 clamp(16px,1.9vw,24px)/1.0 Georgia,'Times New Roman',serif!important;
}
.exact-shell-card .puzzle-instruction{
  margin:4px 0 0!important;
  font:italic clamp(13px,1.5vw,19px)/1.0 Georgia,'Times New Roman',serif!important;
  color:#2d1808!important;
}
@media(max-width:700px){
  .exact-shell-card .exact-shell-title-mask{left:17.5%!important;right:17.5%!important;top:4.8%!important;height:16.1%!important;}
  .exact-shell-card .exact-shell-title{left:18%!important;right:18%!important;top:5.6%!important;height:14.2%!important;}
}

/* Controls are an overlay and must never reduce or block the room stage. */
.side-panel{pointer-events:none!important;}
.side-panel.mobile-open{pointer-events:auto!important;}
.room-column,.stage-wrap,.stage,.scene{max-width:none!important;}


/* =============================================================
   v55: the puzzle wording is part of the PNG frame itself.
   Only the changing problem NUMBER is drawn live, exactly over
   the baked-in number position. This removes the floating title.
   ============================================================= */
.sr-only{
  position:absolute!important;width:1px!important;height:1px!important;padding:0!important;
  margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;
  white-space:nowrap!important;border:0!important;
}
.exact-shell-card .exact-shell-title-mask,
.exact-shell-card .exact-shell-title{display:none!important;}
.exact-shell-card .exact-shell-number-mask{
  display:block!important;
  position:absolute!important;
  z-index:30!important;
  left:63.0%!important;
  top:10.3%!important;
  width:6.5%!important;
  height:6.3%!important;
  background:linear-gradient(180deg,#e7c98f 0%,#e5c287 100%)!important;
  box-shadow:0 0 7px 6px rgba(231,198,137,.88)!important;
  border-radius:5px!important;
  pointer-events:none!important;
}
.exact-shell-card .exact-shell-number{
  display:flex!important;
  align-items:center!important;
  justify-content:flex-start!important;
  position:absolute!important;
  z-index:31!important;
  left:63.1%!important;
  top:9.9%!important;
  width:7.2%!important;
  height:7.1%!important;
  color:#1f1208!important;
  font:italic 700 clamp(24px,3.1vw,40px)/1 Georgia,'Times New Roman',serif!important;
  text-shadow:0 1px #f4d796!important;
  pointer-events:none!important;
}
@media(max-width:700px){
  .exact-shell-card .exact-shell-number-mask{left:62.5%!important;top:10.0%!important;width:8.5%!important;height:6.8%!important;}
  .exact-shell-card .exact-shell-number{left:62.6%!important;top:9.7%!important;width:9.2%!important;height:7.4%!important;font-size:clamp(17px,5.6vw,28px)!important;}
}

/* =============================================================
   v58: Room 1 problem 15 + 20 click target reliability fix
   ============================================================= */
.puzzle-hotspots{
  z-index:180!important;
}
/* Keep 15 and 20 easy to click without overlapping the number above.
   Their tap area extends mostly downward from the printed medallion. */
.puzzle-number-15,
.puzzle-number-20{
  width:5.2%!important;
  height:6.0%!important;
  transform:translate(-50%,-15%)!important;
  z-index:8!important;
  pointer-events:auto!important;
}
/* 14 and 19 always own their own printed number area. */
.puzzle-number-14,
.puzzle-number-19{
  z-index:9!important;
}

/* v60 live admin voice broadcast */
.voice-broadcast-box{
  margin-top:10px;
  padding:12px;
  border:1px solid rgba(196,154,88,.55);
  border-radius:12px;
  background:linear-gradient(180deg,rgba(89,48,24,.72),rgba(46,25,14,.82));
  box-shadow:inset 0 0 0 1px rgba(255,230,176,.08);
}
.voice-broadcast-box .primary-button,
.voice-broadcast-box .secondary-button{width:100%;margin-top:6px}
.voice-broadcast-box .status-text{margin-top:8px;color:#f4ddb2}
.voice-live-indicator{
  position:fixed;
  top:max(12px,env(safe-area-inset-top));
  left:50%;
  transform:translateX(-50%);
  z-index:10020;
  padding:8px 14px;
  border:1px solid rgba(255,215,150,.75);
  border-radius:999px;
  background:rgba(55,24,15,.94);
  color:#ffe0a8;
  font:700 13px/1.1 Georgia,serif;
  letter-spacing:.04em;
  box-shadow:0 5px 18px rgba(0,0,0,.35);
  pointer-events:none;
  white-space:nowrap;
}
.voice-live-indicator::first-letter{color:#e74335}
.voice-listen-button{
  position:fixed;
  left:50%;
  bottom:max(18px,env(safe-area-inset-bottom));
  transform:translateX(-50%);
  z-index:10021;
  border:1px solid #c99b5d;
  border-radius:999px;
  padding:10px 18px;
  background:#4a2919;
  color:#ffe6b8;
  font-weight:700;
  box-shadow:0 6px 22px rgba(0,0,0,.38);
}
#adminLiveAudio{display:none}
@media (max-width: 700px){
  .voice-live-indicator{font-size:12px;max-width:82vw;overflow:hidden;text-overflow:ellipsis}
}



/* v64: Use the vintage numbered medallions already painted into each room background.
   Hotspots are invisible and aligned to the printed numbers, just like Room 1. */
body[data-room-id="2"] .puzzle-number-hit,
body[data-room-id="3"] .puzzle-number-hit,
body[data-room-id="4"] .puzzle-number-hit,
body[data-room-id="5"] .puzzle-number-hit{
  width:3.4%!important;height:5.9%!important;transform:translate(-50%,-50%)!important;
  border:0!important;background:transparent!important;box-shadow:none!important;color:transparent!important;
  padding:0!important;z-index:10!important;pointer-events:auto!important;cursor:pointer!important;border-radius:50%!important;
}
body[data-room-id="2"] .puzzle-number-hit::after,
body[data-room-id="3"] .puzzle-number-hit::after,
body[data-room-id="4"] .puzzle-number-hit::after,
body[data-room-id="5"] .puzzle-number-hit::after{content:none!important}
body[data-room-id="2"] .puzzle-number-hit:focus-visible,
body[data-room-id="3"] .puzzle-number-hit:focus-visible,
body[data-room-id="4"] .puzzle-number-hit:focus-visible,
body[data-room-id="5"] .puzzle-number-hit:focus-visible{outline:3px solid #ffd36a!important;outline-offset:1px!important;background:rgba(255,211,106,.10)!important}

/* Room 2 printed vintage numbers */
body[data-room-id="2"] .puzzle-number-1{left:26.15%!important;top:29.63%!important}body[data-room-id="2"] .puzzle-number-2{left:26.15%!important;top:35.02%!important}body[data-room-id="2"] .puzzle-number-3{left:26.15%!important;top:40.30%!important}body[data-room-id="2"] .puzzle-number-4{left:26.15%!important;top:45.80%!important}body[data-room-id="2"] .puzzle-number-5{left:26.15%!important;top:51.51%!important}
body[data-room-id="2"] .puzzle-number-6{left:36.71%!important;top:32.44%!important}body[data-room-id="2"] .puzzle-number-7{left:36.71%!important;top:37.61%!important}body[data-room-id="2"] .puzzle-number-8{left:36.71%!important;top:42.67%!important}body[data-room-id="2"] .puzzle-number-9{left:36.71%!important;top:47.84%!important}body[data-room-id="2"] .puzzle-number-10{left:36.71%!important;top:52.48%!important}
body[data-room-id="2"] .puzzle-number-11{left:55.22%!important;top:31.25%!important}body[data-room-id="2"] .puzzle-number-12{left:55.22%!important;top:36.31%!important}body[data-room-id="2"] .puzzle-number-13{left:55.22%!important;top:41.59%!important}body[data-room-id="2"] .puzzle-number-14{left:55.22%!important;top:46.66%!important}body[data-room-id="2"] .puzzle-number-15{left:55.22%!important;top:51.62%!important}
body[data-room-id="2"] .puzzle-number-16{left:68.45%!important;top:32.44%!important}body[data-room-id="2"] .puzzle-number-17{left:68.45%!important;top:37.50%!important}body[data-room-id="2"] .puzzle-number-18{left:68.45%!important;top:42.35%!important}body[data-room-id="2"] .puzzle-number-19{left:68.45%!important;top:47.63%!important}body[data-room-id="2"] .puzzle-number-20{left:68.45%!important;top:52.48%!important}
body[data-room-id="2"] .puzzle-number-21{left:84.04%!important;top:30.50%!important}body[data-room-id="2"] .puzzle-number-22{left:84.04%!important;top:35.45%!important}body[data-room-id="2"] .puzzle-number-23{left:84.04%!important;top:40.62%!important}body[data-room-id="2"] .puzzle-number-24{left:84.04%!important;top:46.55%!important}body[data-room-id="2"] .puzzle-number-25{left:84.04%!important;top:51.94%!important}

/* Room 3 printed vintage numbers */
body[data-room-id="3"] .puzzle-number-1{left:21.24%!important;top:26.40%!important}body[data-room-id="3"] .puzzle-number-2{left:21.24%!important;top:32.33%!important}body[data-room-id="3"] .puzzle-number-3{left:21.24%!important;top:38.25%!important}body[data-room-id="3"] .puzzle-number-4{left:21.24%!important;top:44.18%!important}body[data-room-id="3"] .puzzle-number-5{left:21.24%!important;top:50.00%!important}
body[data-room-id="3"] .puzzle-number-6{left:32.28%!important;top:30.39%!important}body[data-room-id="3"] .puzzle-number-7{left:32.28%!important;top:35.24%!important}body[data-room-id="3"] .puzzle-number-8{left:32.28%!important;top:40.09%!important}body[data-room-id="3"] .puzzle-number-9{left:32.28%!important;top:45.04%!important}body[data-room-id="3"] .puzzle-number-10{left:32.28%!important;top:49.89%!important}
body[data-room-id="3"] .puzzle-number-11{left:46.60%!important;top:30.60%!important}body[data-room-id="3"] .puzzle-number-12{left:46.60%!important;top:35.45%!important}body[data-room-id="3"] .puzzle-number-13{left:46.60%!important;top:40.30%!important}body[data-room-id="3"] .puzzle-number-14{left:46.60%!important;top:45.15%!important}body[data-room-id="3"] .puzzle-number-15{left:46.60%!important;top:50.00%!important}
body[data-room-id="3"] .puzzle-number-16{left:63.71%!important;top:30.50%!important}body[data-room-id="3"] .puzzle-number-17{left:63.71%!important;top:35.45%!important}body[data-room-id="3"] .puzzle-number-18{left:63.71%!important;top:40.30%!important}body[data-room-id="3"] .puzzle-number-19{left:63.71%!important;top:45.26%!important}body[data-room-id="3"] .puzzle-number-20{left:63.71%!important;top:50.11%!important}
body[data-room-id="3"] .puzzle-number-21{left:78.88%!important;top:29.31%!important}body[data-room-id="3"] .puzzle-number-22{left:78.88%!important;top:34.38%!important}body[data-room-id="3"] .puzzle-number-23{left:78.88%!important;top:39.55%!important}body[data-room-id="3"] .puzzle-number-24{left:78.88%!important;top:44.94%!important}body[data-room-id="3"] .puzzle-number-25{left:78.88%!important;top:50.11%!important}

/* Room 4 printed vintage numbers */
body[data-room-id="4"] .puzzle-number-1{left:21.48%!important;top:27.80%!important}body[data-room-id="4"] .puzzle-number-2{left:21.48%!important;top:33.30%!important}body[data-room-id="4"] .puzzle-number-3{left:21.48%!important;top:38.79%!important}body[data-room-id="4"] .puzzle-number-4{left:21.48%!important;top:44.94%!important}body[data-room-id="4"] .puzzle-number-5{left:21.48%!important;top:50.65%!important}
body[data-room-id="4"] .puzzle-number-6{left:34.83%!important;top:31.68%!important}body[data-room-id="4"] .puzzle-number-7{left:34.83%!important;top:36.75%!important}body[data-room-id="4"] .puzzle-number-8{left:34.83%!important;top:41.92%!important}body[data-room-id="4"] .puzzle-number-9{left:34.83%!important;top:47.31%!important}body[data-room-id="4"] .puzzle-number-10{left:34.83%!important;top:52.37%!important}
body[data-room-id="4"] .puzzle-number-11{left:49.09%!important;top:31.68%!important}body[data-room-id="4"] .puzzle-number-12{left:49.09%!important;top:36.75%!important}body[data-room-id="4"] .puzzle-number-13{left:49.09%!important;top:41.92%!important}body[data-room-id="4"] .puzzle-number-14{left:49.09%!important;top:47.20%!important}body[data-room-id="4"] .puzzle-number-15{left:49.09%!important;top:52.48%!important}
body[data-room-id="4"] .puzzle-number-16{left:63.96%!important;top:30.82%!important}body[data-room-id="4"] .puzzle-number-17{left:63.96%!important;top:35.88%!important}body[data-room-id="4"] .puzzle-number-18{left:63.96%!important;top:41.16%!important}body[data-room-id="4"] .puzzle-number-19{left:63.96%!important;top:46.88%!important}body[data-room-id="4"] .puzzle-number-20{left:63.96%!important;top:52.48%!important}
body[data-room-id="4"] .puzzle-number-21{left:80.10%!important;top:30.82%!important}body[data-room-id="4"] .puzzle-number-22{left:80.10%!important;top:36.10%!important}body[data-room-id="4"] .puzzle-number-23{left:80.10%!important;top:41.49%!important}body[data-room-id="4"] .puzzle-number-24{left:80.10%!important;top:47.09%!important}body[data-room-id="4"] .puzzle-number-25{left:80.10%!important;top:52.48%!important}

/* Room 5 printed vintage numbers. The artwork omits 14, so only #14 is drawn as a matching overlay medallion. */
body[data-room-id="5"] .puzzle-number-1{left:4.92%!important;top:24.03%!important}body[data-room-id="5"] .puzzle-number-2{left:4.92%!important;top:30.93%!important}body[data-room-id="5"] .puzzle-number-3{left:4.92%!important;top:37.82%!important}body[data-room-id="5"] .puzzle-number-4{left:4.92%!important;top:44.83%!important}body[data-room-id="5"] .puzzle-number-5{left:4.92%!important;top:51.72%!important}
body[data-room-id="5"] .puzzle-number-6{left:20.27%!important;top:29.74%!important}body[data-room-id="5"] .puzzle-number-7{left:20.27%!important;top:35.88%!important}body[data-room-id="5"] .puzzle-number-8{left:20.27%!important;top:42.03%!important}body[data-room-id="5"] .puzzle-number-9{left:20.27%!important;top:48.17%!important}body[data-room-id="5"] .puzzle-number-10{left:20.27%!important;top:53.99%!important}
body[data-room-id="5"] .puzzle-number-11{left:46.18%!important;top:31.25%!important}body[data-room-id="5"] .puzzle-number-12{left:46.18%!important;top:37.07%!important}body[data-room-id="5"] .puzzle-number-13{left:46.18%!important;top:42.89%!important}body[data-room-id="5"] .puzzle-number-14{left:46.18%!important;top:48.71%!important}body[data-room-id="5"] .puzzle-number-15{left:46.18%!important;top:54.53%!important}
body[data-room-id="5"] .puzzle-number-16{left:62.74%!important;top:30.71%!important}body[data-room-id="5"] .puzzle-number-17{left:62.74%!important;top:36.53%!important}body[data-room-id="5"] .puzzle-number-18{left:62.74%!important;top:42.46%!important}body[data-room-id="5"] .puzzle-number-19{left:62.74%!important;top:48.49%!important}body[data-room-id="5"] .puzzle-number-20{left:62.74%!important;top:54.63%!important}
body[data-room-id="5"] .puzzle-number-21{left:79.25%!important;top:30.93%!important}body[data-room-id="5"] .puzzle-number-22{left:79.25%!important;top:36.96%!important}body[data-room-id="5"] .puzzle-number-23{left:79.25%!important;top:42.89%!important}body[data-room-id="5"] .puzzle-number-24{left:79.25%!important;top:48.81%!important}body[data-room-id="5"] .puzzle-number-25{left:79.25%!important;top:54.63%!important}

body[data-room-id="5"] .puzzle-number-14{
  width:3.55%!important;height:6.0%!important;border:2px solid #6b3a0f!important;
  background:radial-gradient(circle at 43% 34%,#f6dda7 0 38%,#c78935 53%,#744013 72%,#d6a154 79%,#5c2f0e 92%)!important;
  color:#2a1608!important;box-shadow:0 2px 7px rgba(0,0,0,.45),inset 0 0 0 2px rgba(255,232,174,.55)!important;
  display:flex!important;align-items:center!important;justify-content:center!important;
  font:700 clamp(10px,1.15vw,18px)/1 Georgia,'Times New Roman',serif!important;
}
body[data-room-id="5"] .puzzle-number-14::after{content:"14"!important;color:#2a1608!important}

@media(max-width:700px){
 body[data-room-id="2"] .puzzle-number-hit,body[data-room-id="3"] .puzzle-number-hit,body[data-room-id="4"] .puzzle-number-hit,body[data-room-id="5"] .puzzle-number-hit{width:4.6%!important;height:6.7%!important}
 body[data-room-id="5"] .puzzle-number-14{width:4.8%!important;height:6.8%!important;font-size:10px!important}
}


/* v70 Room 5: vintage numbers are baked into room5-v70.png. */
body[data-room-id="5"] .puzzle-number-hit{width:3.4%!important;height:5.8%!important;aspect-ratio:auto!important;transform:translate(-50%,-50%)!important;border:0!important;background:transparent!important;box-shadow:none!important;color:transparent!important;padding:0!important;display:block!important;z-index:12!important;border-radius:50%!important;overflow:visible!important;}
body[data-room-id="5"] .puzzle-number-hit::after{content:none!important;display:none!important;}
body[data-room-id="5"] .puzzle-number-1{left:4.90%!important;top:23.6%!important}
body[data-room-id="5"] .puzzle-number-2{left:4.90%!important;top:30.4%!important}
body[data-room-id="5"] .puzzle-number-3{left:4.90%!important;top:37.0%!important}
body[data-room-id="5"] .puzzle-number-4{left:4.90%!important;top:44.2%!important}
body[data-room-id="5"] .puzzle-number-5{left:4.90%!important;top:51.0%!important}
body[data-room-id="5"] .puzzle-number-6{left:19.92%!important;top:29.3%!important}
body[data-room-id="5"] .puzzle-number-7{left:19.92%!important;top:35.4%!important}
body[data-room-id="5"] .puzzle-number-8{left:19.92%!important;top:41.4%!important}
body[data-room-id="5"] .puzzle-number-9{left:19.92%!important;top:47.6%!important}
body[data-room-id="5"] .puzzle-number-10{left:19.92%!important;top:53.3%!important}
body[data-room-id="5"] .puzzle-number-11{left:45.45%!important;top:29.5%!important}
body[data-room-id="5"] .puzzle-number-12{left:45.45%!important;top:35.2%!important}
body[data-room-id="5"] .puzzle-number-13{left:45.45%!important;top:40.6%!important}
body[data-room-id="5"] .puzzle-number-14{left:45.45%!important;top:45.7%!important}
body[data-room-id="5"] .puzzle-number-15{left:45.45%!important;top:51.1%!important}
body[data-room-id="5"] .puzzle-number-16{left:61.84%!important;top:30.3%!important}
body[data-room-id="5"] .puzzle-number-17{left:61.84%!important;top:36.0%!important}
body[data-room-id="5"] .puzzle-number-18{left:61.84%!important;top:42.1%!important}
body[data-room-id="5"] .puzzle-number-19{left:61.84%!important;top:48.0%!important}
body[data-room-id="5"] .puzzle-number-20{left:61.84%!important;top:53.9%!important}
body[data-room-id="5"] .puzzle-number-21{left:78.05%!important;top:30.6%!important}
body[data-room-id="5"] .puzzle-number-22{left:78.05%!important;top:36.6%!important}
body[data-room-id="5"] .puzzle-number-23{left:78.05%!important;top:42.2%!important}
body[data-room-id="5"] .puzzle-number-24{left:78.05%!important;top:48.1%!important}
body[data-room-id="5"] .puzzle-number-25{left:78.05%!important;top:54.1%!important}
@media(max-width:700px){body[data-room-id="5"] .puzzle-number-hit{width:4.2%!important;height:6.5%!important;background:transparent!important;border:0!important}}

/* v76 Room 1 Knight's Tour bonus puzzle */
.knight-tour-hotspot{
  position:absolute;left:10.75%;top:40.9%;width:7.6%;height:22.5%;
  transform:translate(-50%,-50%);z-index:78;border:0;background:transparent;
  padding:0;cursor:pointer;border-radius:10px;-webkit-tap-highlight-color:transparent;
}
.knight-tour-hotspot:focus-visible{outline:3px solid #ffd36a;outline-offset:3px;background:rgba(255,211,106,.08)}
.knight-tour-modal{position:fixed;inset:0;z-index:4000;display:flex;align-items:center;justify-content:center;padding:18px}
.knight-tour-modal.hidden{display:none}
.knight-tour-backdrop{position:absolute;inset:0;background:rgba(12,7,2,.78);backdrop-filter:blur(2px)}
.knight-tour-card{
  position:relative;z-index:1;width:min(680px,96vw);max-height:94vh;overflow:auto;
  padding:22px 24px 24px;border:5px double #6b3c12;border-radius:18px;
  background:linear-gradient(180deg,#ead3a3 0%,#c79a56 13%,#f0d6a3 48%,#bd8946 100%);
  box-shadow:0 20px 70px rgba(0,0,0,.62),inset 0 0 0 3px rgba(255,233,181,.65);
  color:#2a1608;text-align:center;font-family:Georgia,"Times New Roman",serif;
}
.knight-tour-card::before,.knight-tour-card::after{content:"";position:absolute;left:18px;right:18px;height:2px;background:linear-gradient(90deg,transparent,#704014,transparent)}
.knight-tour-card::before{top:16px}.knight-tour-card::after{bottom:16px}
.knight-tour-close{position:absolute;right:13px;top:9px;width:40px;height:40px;border-radius:50%;border:2px solid #6b3c12;background:#ecd3a2;color:#351b08;font:700 28px/1 Georgia;cursor:pointer}
.knight-tour-ornament{font-size:42px;line-height:1;margin:0 auto 2px;color:#351b08;text-shadow:0 1px #f8e4bc}
.knight-tour-card h2{margin:0;font-size:clamp(24px,4vw,38px);letter-spacing:.04em;text-transform:uppercase}
.knight-tour-instructions{margin:7px auto 12px;font-size:15px;max-width:560px}
.knight-tour-progress{display:flex;justify-content:center;gap:18px;flex-wrap:wrap;margin:8px 0 12px;font-weight:700;font-size:16px}
.knight-tour-progress span{padding:6px 12px;border:1px solid #6b3c12;border-radius:999px;background:rgba(255,244,217,.55)}
.knight-tour-board{width:min(500px,84vw);aspect-ratio:1;margin:0 auto;border:7px ridge #714316;display:grid;grid-template-columns:repeat(8,1fr);box-shadow:0 8px 22px rgba(47,26,8,.42);background:#c69a5d}
.knight-tour-square{position:relative;display:flex;align-items:center;justify-content:center;border:0;padding:0;min-width:0;min-height:0;font-family:Georgia,"Times New Roman",serif;cursor:pointer;color:#241207}
.knight-tour-square.light{background:#e7c98d}.knight-tour-square.dark{background:#8b5729}
.knight-tour-square.visited::after{content:attr(data-step);position:absolute;right:4px;bottom:2px;font-size:clamp(9px,1.25vw,14px);font-weight:700;color:rgba(36,18,7,.78)}
.knight-tour-square.current{box-shadow:inset 0 0 0 4px #ffd45e}
.knight-tour-square.current .knight-tour-piece{font-size:clamp(27px,5vw,48px);line-height:1;text-shadow:0 2px 2px rgba(255,246,211,.7)}
.knight-tour-square:focus-visible{outline:3px solid #fff3b7;outline-offset:-4px;z-index:2}
.knight-tour-footer{display:flex;align-items:center;justify-content:center;gap:14px;flex-wrap:wrap;margin-top:14px}
.knight-tour-reset{border:2px solid #5e350f;border-radius:8px;background:linear-gradient(#8e571d,#60350f);color:#fff1cc;padding:9px 18px;font:700 16px Georgia,serif;cursor:pointer;box-shadow:inset 0 1px rgba(255,255,255,.25)}
.knight-tour-status{min-height:24px;font-weight:700;font-size:15px}
.knight-tour-status.wrong{color:#7d1515}.knight-tour-status.solved{color:#145c25}
@media(max-width:700px){
  .knight-tour-modal{padding:8px}.knight-tour-card{padding:16px 10px 18px;border-width:4px}.knight-tour-board{width:min(92vw,500px)}
  .knight-tour-hotspot{width:10%;height:25%}
}

/* v77: Knight's Tour uses the approved vintage popup artwork. */
.knight-tour-modal{padding:8px;overflow:auto;align-items:center;justify-content:center}
.knight-tour-backdrop{background:rgba(8,5,2,.82);backdrop-filter:blur(4px) saturate(.75)}
.knight-tour-card{
  position:relative;
  width:min(1040px,96vw);
  aspect-ratio:1402/1122;
  max-height:96vh;
  overflow:hidden;
  padding:0;
  border:0;
  border-radius:0;
  background:url('knight-tour-panel.webp?v=184.0.0') center/100% 100% no-repeat;
  box-shadow:0 24px 78px rgba(0,0,0,.66);
  color:#271407;
}
.knight-tour-card::before,.knight-tour-card::after{display:none!important}
.knight-tour-card h2,.knight-tour-ornament,.knight-tour-instructions,.knight-tour-progress{display:none!important}
.knight-tour-close{
  position:absolute!important;left:85.2%!important;top:4.4%!important;width:9.0%!important;height:auto!important;aspect-ratio:1!important;
  z-index:30!important;border:0!important;border-radius:50%!important;background:transparent!important;color:transparent!important;
  box-shadow:none!important;padding:0!important;cursor:pointer!important;font-size:0!important;
}
.knight-tour-board{
  position:absolute!important;left:25.4%!important;top:25.1%!important;width:47.4%!important;height:auto!important;aspect-ratio:1!important;
  z-index:12!important;margin:0!important;border:0!important;box-shadow:none!important;background:transparent!important;
  display:grid!important;grid-template-columns:repeat(8,1fr)!important;
}
.knight-tour-square{background:transparent!important;border:0!important;padding:0!important;min-width:0!important;min-height:0!important;color:#201006!important;cursor:pointer!important}
.knight-tour-square.light,.knight-tour-square.dark{background:transparent!important}
.knight-tour-square.visited::after{
  right:5px!important;bottom:3px!important;font-size:clamp(8px,1.25vw,14px)!important;color:#2c1608!important;
  background:rgba(238,202,135,.78)!important;border:1px solid rgba(74,40,12,.38)!important;border-radius:50%!important;
  min-width:1.45em!important;height:1.45em!important;display:grid!important;place-items:center!important;padding:1px!important;
}
.knight-tour-square.current{box-shadow:inset 0 0 0 4px rgba(255,201,67,.92)!important;background:rgba(255,207,88,.12)!important}
.knight-tour-square.current .knight-tour-piece{font-size:clamp(26px,4.2vw,52px)!important;color:#17100a!important;text-shadow:0 1px 0 #f5d795,0 2px 3px rgba(0,0,0,.48)!important}
.knight-tour-square:focus-visible{outline:3px solid #ffd66e!important;outline-offset:-4px!important}
.knight-tour-footer{position:absolute!important;inset:0!important;margin:0!important;display:block!important;pointer-events:none!important;z-index:20!important}
.knight-tour-reset{
  position:absolute!important;left:38.2%!important;top:88.4%!important;width:22.1%!important;height:7.7%!important;
  margin:0!important;padding:0!important;border:0!important;border-radius:0!important;background:transparent!important;color:transparent!important;
  box-shadow:none!important;font-size:0!important;cursor:pointer!important;pointer-events:auto!important;
}
.knight-tour-status{
  position:absolute!important;left:27.5%!important;top:20.4%!important;width:44.0%!important;min-height:0!important;margin:0!important;padding:2px 8px!important;
  color:#2d1809!important;background:rgba(236,202,137,.76)!important;border-radius:6px!important;text-align:center!important;
  font:700 clamp(10px,1.25vw,15px) Georgia,'Times New Roman',serif!important;line-height:1.15!important;pointer-events:none!important;
}
.knight-tour-status.wrong{color:#7d1515!important}.knight-tour-status.solved{color:#145c25!important}
@media (max-width:700px){
  .knight-tour-modal{padding:3px;align-items:start}
  .knight-tour-card{width:99vw;margin-top:6px}
  .knight-tour-square.visited::after{right:2px!important;bottom:1px!important;font-size:clamp(6px,2vw,10px)!important}
  .knight-tour-square.current{box-shadow:inset 0 0 0 2px rgba(255,201,67,.92)!important}
  .knight-tour-status{font-size:clamp(7px,2.1vw,11px)!important;padding:1px 3px!important}
}


/* v78: transparent artwork surround + precisely centered live knight. */
.knight-tour-square .knight-tour-piece{
  position:absolute!important;left:50%!important;top:50%!important;
  transform:translate(-50%,-53%)!important;margin:0!important;padding:0!important;
  width:auto!important;height:auto!important;display:block!important;line-height:1!important;
  pointer-events:none!important;
}

/* =============================================================
   v80: restore Chess Problem / checkmate vintage popup artwork.
   This final override intentionally uses the known-good v63 panel
   that is included in this update ZIP, so stale/missing v49/v61
   assets cannot make the popup board disappear.
   ============================================================= */
.vintage-puzzle-card.exact-shell-card{
  background-image:url('puzzle-panel.webp')!important;
  background-position:center!important;
  background-size:100% 100%!important;
  background-repeat:no-repeat!important;
  background-color:transparent!important;
}

/* =============================================================
   v81 requested visual cleanup
   1) Knight's Tour: no black modal surround; room stays visible.
   2) Knight's Tour: smaller, centered, vintage-styled moving knight.
   3) Chess Problem: keep the gold close X, but mask the unrelated
      black ceiling-track cross that can show through beside it.
   ============================================================= */

/* Knight's Tour should float over the room with a transparent surround. */
.knight-tour-modal{
  background:transparent!important;
}
.knight-tour-backdrop{
  background:transparent!important;
  backdrop-filter:none!important;
  -webkit-backdrop-filter:none!important;
}
.knight-tour-card{
  box-shadow:none!important;
}

/* Smaller vintage knight: fully inside one square and exactly centered. */
.knight-tour-square .knight-tour-piece,
.knight-tour-square.current .knight-tour-piece{
  position:absolute!important;
  left:50%!important;
  top:50%!important;
  transform:translate(-50%,-52%)!important;
  width:auto!important;
  height:auto!important;
  margin:0!important;
  padding:0!important;
  display:block!important;
  font-family:Georgia,"Times New Roman",serif!important;
  font-size:clamp(17px,2.35vw,29px)!important;
  line-height:1!important;
  font-weight:700!important;
  color:#2a1608!important;
  text-shadow:
    -1px -1px 0 rgba(239,201,127,.72),
     1px -1px 0 rgba(117,68,22,.72),
    -1px  1px 0 rgba(117,68,22,.72),
     1px  1px 0 rgba(54,28,8,.82),
     0 2px 2px rgba(0,0,0,.38)!important;
  filter:drop-shadow(0 1px 1px rgba(48,24,7,.35))!important;
  pointer-events:none!important;
}

/* Keep the selected-square outline subtle so it does not crowd the smaller knight. */
.knight-tour-square.current{
  box-shadow:inset 0 0 0 3px rgba(255,201,67,.88)!important;
  background:rgba(255,207,88,.08)!important;
}

/*
   The Chess Problem PNG has transparent corners. A ceiling rail in room 1 can
   line up behind the top-right close control and look like a second X/cross.
   Add a small parchment underlay ONLY behind that corner, beneath the PNG.
   The actual gold X in the artwork stays untouched and clickable.
*/
.vintage-puzzle-card.exact-shell-card{
  background-image:
    url('puzzle-panel.webp'),
    radial-gradient(circle at 91.5% 9.2%,
      rgba(229,199,143,.98) 0 7.2%,
      rgba(229,199,143,.92) 7.3% 9.8%,
      rgba(229,199,143,.55) 9.9% 10.6%,
      transparent 10.9%)!important;
  background-position:center,center!important;
  background-size:100% 100%,100% 100%!important;
  background-repeat:no-repeat,no-repeat!important;
  background-color:transparent!important;
}

@media(max-width:700px){
  .knight-tour-square .knight-tour-piece,
  .knight-tour-square.current .knight-tour-piece{
    font-size:clamp(14px,4.6vw,24px)!important;
  }
  .knight-tour-square.current{
    box-shadow:inset 0 0 0 2px rgba(255,201,67,.88)!important;
  }
}


/* =============================================================
   v82 requested cleanup
   1) Remove the Knight's Tour footer text: "Choose any square to begin."
      (status starts empty after open/reset).
   2) Make Chess Problem popup surround transparent so the room shows
      through instead of a dark modal background.
   3) Keep the gold X, but further mask the unrelated black cross/ceiling
      rail that can appear beside it in room 1.
   ============================================================= */

/* Chess problem modal should float transparently like the Knight's Tour. */
.puzzle-modal{
  background:transparent!important;
}
.puzzle-backdrop{
  background:transparent!important;
  backdrop-filter:none!important;
  -webkit-backdrop-filter:none!important;
}
.vintage-puzzle-card.exact-shell-card{
  box-shadow:none!important;
}

/* Strengthen the parchment underlay near the top-right close button.
   This preserves the gold X while hiding the background rail/cross. */
.vintage-puzzle-card.exact-shell-card{
  background-image:
    url('puzzle-panel.webp'),
    radial-gradient(circle at 91.6% 9.3%,
      rgba(229,199,143,1) 0 8.8%,
      rgba(229,199,143,.98) 8.9% 11.9%,
      rgba(229,199,143,.88) 12.0% 14.2%,
      rgba(229,199,143,.52) 14.3% 15.5%,
      transparent 15.8%)!important;
  background-position:center,center!important;
  background-size:100% 100%,100% 100%!important;
  background-repeat:no-repeat,no-repeat!important;
  background-color:transparent!important;
}

/* If status is intentionally blank, do not show an empty bubble. */
.knight-tour-status:empty{
  min-height:0!important;
  padding:0!important;
  margin:0!important;
  background:transparent!important;
  border:0!important;
  box-shadow:none!important;
}


/* =============================================================
   v83 final popup cleanup
   - Chess Problem popup remains transparent around the artwork.
   - Remove the visible beige rectangle introduced in v82.
   - Keep the gold X.
   - Hide the stray room cross/ceiling rail near the X with a much
     smaller circular parchment patch tucked directly behind the X.
   ============================================================= */

/* Transparent popup surround: room should remain visible around the artwork. */
.puzzle-modal{
  background:transparent!important;
}
.puzzle-backdrop{
  background:transparent!important;
  backdrop-filter:none!important;
  -webkit-backdrop-filter:none!important;
}

/* Reset the card back to the clean transparent-edged panel image. */
.vintage-puzzle-card.exact-shell-card{
  position:relative!important;
  background-image:url('puzzle-panel.webp')!important;
  background-position:center!important;
  background-size:100% 100%!important;
  background-repeat:no-repeat!important;
  background-color:transparent!important;
  box-shadow:none!important;
  isolation:isolate!important;
}

/* Remove the large visible mask from v82 and replace it with a very small,
   soft circular parchment patch behind the top-right X only. */
.vintage-puzzle-card.exact-shell-card::before,
.vintage-puzzle-card.exact-shell-card::after{
  content:""!important;
  position:absolute!important;
  pointer-events:none!important;
}
.vintage-puzzle-card.exact-shell-card::before{
  display:block!important;
  z-index:2!important;
  right:0.8%!important;
  top:0.7%!important;
  width:15.2%!important;
  aspect-ratio:1 / 1!important;
  border-radius:50%!important;
  background:radial-gradient(circle at 50% 50%,
    rgba(232, 205, 153, .98) 0 54%,
    rgba(232, 205, 153, .92) 55% 67%,
    rgba(232, 205, 153, .46) 68% 78%,
    rgba(232, 205, 153, 0) 79% 100%)!important;
  filter:blur(.2px)!important;
}
.vintage-puzzle-card.exact-shell-card::after{
  display:none!important;
}

/* Keep close control above the patch. */
.exact-shell-card .exact-shell-close{
  z-index:9!important;
}

@media(max-width:700px){
  .vintage-puzzle-card.exact-shell-card::before{
    right:1.0%!important;
    top:0.9%!important;
    width:16.5%!important;
  }
}


/* =============================================================
   v84 clean fix
   - Remove the accidental beige/circular mask entirely.
   - Keep Chess Problem popup surround fully transparent.
   - The unwanted ceiling cross is removed from room1-v84.png itself,
     so no visible popup mask is needed.
   ============================================================= */
.puzzle-modal{
  background:transparent!important;
}
.puzzle-backdrop{
  background:transparent!important;
  backdrop-filter:none!important;
  -webkit-backdrop-filter:none!important;
}
.vintage-puzzle-card.exact-shell-card{
  background-image:url('puzzle-panel.webp')!important;
  background-position:center!important;
  background-size:100% 100%!important;
  background-repeat:no-repeat!important;
  background-color:transparent!important;
  box-shadow:none!important;
}
.vintage-puzzle-card.exact-shell-card::before,
.vintage-puzzle-card.exact-shell-card::after{
  display:none!important;
  content:none!important;
  background:none!important;
}

/* Room 1: small decorative floating star */
.room1-floating-star{
  position:absolute;
  left:12.5%;
  top:18%;
  z-index:8;
  pointer-events:none;
  user-select:none;
  font-size:clamp(14px,1.35vw,24px);
  line-height:1;
  color:#f6cf63;
  -webkit-text-stroke:1px rgba(92,52,4,.55);
  text-shadow:0 0 4px rgba(255,224,124,.95),0 0 10px rgba(244,173,36,.7);
  filter:drop-shadow(0 2px 2px rgba(65,39,8,.3));
  animation:room1StarFloat 3.4s ease-in-out infinite;
  transform-origin:center;
}
@keyframes room1StarFloat{
  0%,100%{transform:translate3d(0,0,0) rotate(-4deg) scale(1)}
  50%{transform:translate3d(0,-12px,0) rotate(5deg) scale(1.08)}
}
@media (prefers-reduced-motion:reduce){
  .room1-floating-star{animation:none}
}


/* ============================================================
   v100 — Ten-room panoramic chess gallery
   ============================================================ */
:root{--scene-ratio:3}
html,body,.app-shell,.room-column,.stage-wrap,.stage{width:100%!important;height:100%!important;min-height:100%!important;margin:0!important;overflow:hidden!important}
.stage-wrap,.stage{position:absolute!important;inset:0!important;background:#111!important}
.scene{position:absolute!important;left:50%!important;top:50%!important;width:min(100vw,calc(100dvh * 3))!important;height:auto!important;aspect-ratio:3/1!important;transform:translate(-50%,-50%)!important;overflow:visible!important}
.room-bg{position:absolute!important;inset:0!important;width:100%!important;height:100%!important;object-fit:fill!important;user-select:none!important;-webkit-user-drag:none!important}
@supports(height:100svh){.scene{width:min(100vw,calc(100svh * 3))!important}}
@media(min-width:901px){.scene{width:min(100%,calc(100dvh * 3))!important}@supports(height:100svh){.scene{width:min(100%,calc(100svh * 3))!important}}}

/* Normal cursor on the room/floor. Only interactive targets show a hand. */
.stage,.scene,.room-bg,.avatar-layer{cursor:default!important}
.puzzle-number-hit,.next-room-hotspot,.knight-tour-hotspot{cursor:pointer!important}

/* A consistent room-to-room chess knight control in the lower-right floor area. */
.next-room-hotspot{left:auto!important;right:1.4%!important;top:auto!important;bottom:3.5%!important;width:auto!important;height:auto!important;min-width:78px!important;min-height:44px!important;padding:7px 11px!important;border:2px solid #6a3e13!important;border-radius:999px!important;background:linear-gradient(#e2bd76,#9a641f)!important;box-shadow:0 3px 10px rgba(0,0,0,.35)!important;color:#2c1708!important;opacity:.96!important;z-index:95!important}
.next-room-hotspot .exit-text{display:block!important;position:static!important;opacity:1!important;color:#2c1708!important;font:700 12px/1 Georgia,serif!important;letter-spacing:.03em!important}
.next-room-hotspot .exit-text::before{content:'♞ ';font-size:18px}

/* Knight Tour stays in Room 1 and uses a matching medallion-style control. */
.knight-tour-hotspot{left:1.4%!important;right:auto!important;top:auto!important;bottom:3.5%!important;width:auto!important;height:auto!important;min-width:108px!important;min-height:44px!important;padding:7px 11px!important;border:2px solid #6a3e13!important;border-radius:999px!important;background:linear-gradient(#e2bd76,#9a641f)!important;box-shadow:0 3px 10px rgba(0,0,0,.35)!important;z-index:95!important}
.knight-tour-hotspot::before{content:'♞ Knight Tour';color:#2c1708;font:700 12px/1 Georgia,serif;white-space:nowrap}

/* Printed medallion targets are invisible but easy to tap. */
body[data-room-id] .puzzle-number-hit{border:0!important;background:transparent!important;color:transparent!important;box-shadow:none!important;border-radius:50%!important;z-index:90!important;pointer-events:auto!important}
body[data-room-id] .puzzle-number-hit:hover{background:rgba(255,211,106,.08)!important}
body[data-room-id] .puzzle-number-hit:focus-visible{outline:2px solid #ffd36a!important;outline-offset:1px!important;background:rgba(255,211,106,.12)!important}

/* Keep overlays usable on phones/tablets without shrinking the gallery. */
@media(max-width:900px){
  .panel-toggle{display:block!important;position:fixed!important;z-index:1200!important}
  .side-panel{position:fixed!important;z-index:1300!important}
  .next-room-hotspot,.knight-tour-hotspot{bottom:calc(2.2% + env(safe-area-inset-bottom))!important;min-height:42px!important;padding:6px 9px!important}
  .next-room-hotspot{right:calc(1.2% + env(safe-area-inset-right))!important}
  .knight-tour-hotspot{left:calc(1.2% + env(safe-area-inset-left))!important}
}

.room-nav-label{margin:12px 0 7px;font-weight:700;color:#294c38}
.room-nav-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px}
.room-nav-link{display:block;padding:8px 7px;border:1px solid #c7d5ca;border-radius:8px;background:#fff;color:#244c36;text-decoration:none;text-align:center;font-size:12px;font-weight:700}
.room-nav-link.current{background:#dceadf;border-color:#8db29a;color:#123b27}
.room1-admin-note{padding:10px;border:1px solid #d6e1d7;border-radius:8px;background:#f0f5f1;color:#496453;text-align:center;font-size:12px}

/* v152: Admin Login is available in every room, whether open or closed. */
.entry-card .admin-login-box{position:static!important;left:auto!important;width:auto!important;height:auto!important;overflow:visible!important;opacity:1!important;pointer-events:auto!important}
.entry-card .entry-divider{display:flex!important}


/* ============================================================
   v110 — true draggable panorama + floor-only walking
   ============================================================ */
html,body,.app-shell,.room-column,.stage-wrap,.stage{width:100%!important;height:100%!important;height:100dvh!important;overflow:hidden!important;background:#111!important}
.scene{position:absolute!important;inset:0!important;left:0!important;top:0!important;width:100%!important;height:100%!important;aspect-ratio:auto!important;transform:none!important;overflow:hidden!important}
.panorama-view{position:absolute;inset:0;width:100%;height:100%;display:block;z-index:1;touch-action:none;user-select:none;-webkit-user-select:none;background:#111}
.room-bg{position:absolute!important;inset:0!important;width:100%!important;height:100%!important;object-fit:cover!important;z-index:0!important;pointer-events:none!important}
.avatar-layer{position:absolute!important;inset:0!important;z-index:30!important;pointer-events:none!important}
.room-help{position:fixed!important;z-index:105!important;pointer-events:none!important}

/* Mate-number medallions: the number itself is the mate length. */
body[data-room-id] .puzzle-number-hit{position:absolute!important;width:34px!important;height:34px!important;transform:translate(-50%,-50%)!important;border:2px solid #6b4318!important;border-radius:50%!important;background:radial-gradient(circle at 35% 30%,#ffe7a0 0,#dbad4d 42%,#8c571c 100%)!important;color:#251305!important;box-shadow:0 2px 7px rgba(0,0,0,.42),inset 0 0 0 2px rgba(255,238,177,.45)!important;font:900 18px/30px Georgia,serif!important;text-align:center!important;padding:0!important;z-index:90!important;cursor:pointer!important;pointer-events:auto!important;text-shadow:0 1px 0 rgba(255,255,255,.35)!important}
body[data-room-id] .puzzle-number-hit:hover{filter:brightness(1.15);transform:translate(-50%,-50%) scale(1.08)!important}

/* Floor star: bright, simple, and visibly on the floor. */
.next-room-hotspot{position:absolute!important;right:auto!important;bottom:auto!important;width:70px!important;height:70px!important;min-width:0!important;min-height:0!important;transform:translate(-50%,-50%)!important;border:0!important;background:transparent!important;box-shadow:none!important;padding:0!important;z-index:96!important;cursor:pointer!important}
.next-room-hotspot .exit-star{display:block!important;font-size:58px!important;line-height:58px!important;color:#fff6a0!important;text-shadow:0 0 8px #fff,0 0 18px #ffe86a,0 0 32px #ffd21f,0 7px 8px rgba(0,0,0,.35)!important;animation:floorStarGlow 1.35s ease-in-out infinite alternate;transform:scaleY(.64) rotate(-4deg)}
.next-room-hotspot .exit-text{display:block!important;margin-top:-8px!important;color:#fff8c8!important;background:rgba(0,0,0,.48)!important;border-radius:999px!important;padding:3px 7px!important;font:700 10px/1 Arial,sans-serif!important;text-shadow:0 1px 2px #000!important}
.next-room-hotspot .exit-text::before{content:none!important}
@keyframes floorStarGlow{from{filter:brightness(.95);opacity:.86}to{filter:brightness(1.35);opacity:1}}

/* Knight Tour trigger is a knight chess piece, not a text pill. */
.knight-tour-hotspot{position:absolute!important;right:auto!important;bottom:auto!important;width:58px!important;height:70px!important;min-width:0!important;min-height:0!important;transform:translate(-50%,-50%)!important;border:0!important;background:transparent!important;box-shadow:none!important;padding:0!important;z-index:96!important;cursor:pointer!important}
.knight-tour-hotspot::before{content:'♞'!important;display:block!important;color:#2b1a0e!important;font:700 58px/64px Georgia,serif!important;text-shadow:0 2px 0 #e2bd76,0 4px 8px rgba(0,0,0,.5)!important;white-space:nowrap!important}
.knight-tour-hotspot::after{content:'Knight Tour';display:block;margin-top:-8px;color:#fff7cf;background:rgba(0,0,0,.48);border-radius:999px;padding:3px 6px;font:700 9px/1 Arial,sans-serif;white-space:nowrap}

/* Panorama interaction: JS switches between default arrow on walkable floor and grab/grabbing above the floor. */
.stage{touch-action:none!important;cursor:grab}
.puzzle-number-hit,.next-room-hotspot,.knight-tour-hotspot{touch-action:manipulation!important}

@media(max-width:700px){
  body[data-room-id] .puzzle-number-hit{width:30px!important;height:30px!important;font-size:16px!important;line-height:26px!important}
  .next-room-hotspot{width:58px!important;height:60px!important}
  .next-room-hotspot .exit-star{font-size:48px!important;line-height:48px!important}
  .knight-tour-hotspot{width:50px!important;height:62px!important}
  .knight-tour-hotspot::before{font-size:50px!important;line-height:54px!important}
}

/* ============================================================
   v111 — corrected 10-room gallery interaction
   ============================================================ */
/* The canvas is the displayed room; the source IMG is only a fallback. */
.panorama-view{z-index:2!important;cursor:inherit!important;touch-action:none!important}
.room-bg{z-index:1!important;pointer-events:none!important}
.avatar-layer{z-index:40!important}
.stage{cursor:grab!important;touch-action:none!important}
.stage.pan-floor{cursor:default!important}
.stage.pan-dragging{cursor:grabbing!important}

/* Strong, unmistakable glowing yellow floor star in every room. */
.next-room-hotspot{
  width:88px!important;height:82px!important;z-index:150!important;
  filter:none!important;opacity:1!important;
}
.next-room-hotspot .exit-star{
  display:block!important;color:#ffd400!important;font-size:76px!important;line-height:72px!important;
  -webkit-text-stroke:2px #8a5a00!important;
  text-shadow:0 0 6px #fff7a8,0 0 14px #ffe94d,0 0 28px #ffd400,0 0 48px #ffb800,0 8px 8px rgba(0,0,0,.40)!important;
  transform:scaleY(.60) rotate(-3deg)!important;
  animation:starPulse111 1s ease-in-out infinite alternate!important;
}
.next-room-hotspot .exit-text{margin-top:-12px!important;background:rgba(35,22,0,.72)!important;color:#fff3a3!important;font-size:10px!important}
@keyframes starPulse111{from{transform:scaleY(.60) scale(.93) rotate(-3deg);filter:brightness(1)}to{transform:scaleY(.60) scale(1.12) rotate(3deg);filter:brightness(1.35)}}

/* Number medallions are obvious clickable objects. */
body[data-room-id] .puzzle-number-hit{
  width:38px!important;height:38px!important;line-height:34px!important;
  background:radial-gradient(circle at 34% 28%,#fff0a8 0 14%,#e9bd59 35%,#a66b24 72%,#6b3d13 100%)!important;
  border:2px solid #4d2a0b!important;color:#211000!important;font:900 19px/34px Georgia,serif!important;
  box-shadow:0 0 0 2px rgba(255,227,145,.55),0 3px 8px rgba(0,0,0,.46)!important;
  pointer-events:auto!important;cursor:pointer!important;opacity:1!important;
}
body[data-room-id] .puzzle-number-hit:hover{filter:brightness(1.18)!important}

/* Room 1 Knight Tour is represented by a large golden knight piece. */
.knight-tour-hotspot{width:72px!important;height:82px!important;z-index:151!important}
.knight-tour-hotspot::before{
  content:'♞'!important;color:#d7a62e!important;font-size:70px!important;line-height:70px!important;
  -webkit-text-stroke:1px #5b350b!important;text-shadow:0 0 5px #fff0a0,0 3px 5px rgba(0,0,0,.5)!important;
}
.knight-tour-hotspot::after{content:'Knight Tour'!important;background:rgba(35,22,0,.72)!important;color:#fff3a3!important}

/* No numbered room shortcuts in the control panel. */
.room-nav-label,.room-nav-grid{display:none!important}

@media(max-width:700px){
  body[data-room-id] .puzzle-number-hit{width:34px!important;height:34px!important;font-size:17px!important;line-height:30px!important}
  .next-room-hotspot{width:72px!important;height:70px!important}
  .next-room-hotspot .exit-star{font-size:62px!important;line-height:58px!important}
  .knight-tour-hotspot{width:62px!important;height:72px!important}
  .knight-tour-hotspot::before{font-size:60px!important;line-height:60px!important}
}


/* ============================================================
   v112 — single-image panorama, real medallion hotspots, persistent room hops
   ============================================================ */
/* Never draw replacement coins: the clickable area sits on the medallions already in the artwork. */
body[data-room-id] .puzzle-number-hit{
  width:42px!important;height:42px!important;line-height:42px!important;
  border:0!important;background:transparent!important;box-shadow:none!important;color:transparent!important;
  text-shadow:none!important;opacity:1!important;z-index:170!important;cursor:pointer!important;
}
body[data-room-id] .puzzle-number-hit:hover{background:rgba(255,220,90,.16)!important;box-shadow:0 0 0 2px rgba(255,210,60,.45)!important;filter:none!important}
body[data-room-id] .puzzle-number-hit:focus-visible{outline:3px solid #ffd400!important;outline-offset:1px!important;background:rgba(255,220,90,.18)!important}

/* Yellow glowing star is unmistakable and stays above the panorama canvas. */
.next-room-hotspot{z-index:190!important;width:96px!important;height:92px!important;pointer-events:auto!important}
.next-room-hotspot .exit-star{color:#ffd000!important;font-size:84px!important;line-height:78px!important;-webkit-text-stroke:2px #704300!important;text-shadow:0 0 8px #fff7a0,0 0 18px #ffe14a,0 0 36px #ffc400,0 0 62px #ffae00,0 9px 9px rgba(0,0,0,.45)!important}
.next-room-hotspot .exit-text{display:block!important;color:#fff8b0!important;background:rgba(44,26,0,.78)!important;font-size:11px!important}
.knight-tour-hotspot{z-index:191!important;pointer-events:auto!important}

/* Source image is single-pan only; no duplicated edge copy is ever shown. */
.panorama-view{background:#111!important}

@media(max-width:700px){
 body[data-room-id] .puzzle-number-hit{width:38px!important;height:38px!important}
 .next-room-hotspot{width:82px!important;height:78px!important}
 .next-room-hotspot .exit-star{font-size:70px!important;line-height:66px!important}
}

/* ============================================================
   v113 - floor-only avatar, real medallion targets, frame-only panorama drag
   ============================================================ */
.stage{cursor:default!important}
.stage.pan-floor{cursor:default!important}
.stage.pan-dragging{cursor:grabbing!important}

/* Real printed medallions remain visible in the image. These are only transparent hit areas. */
body[data-room-id] .puzzle-number-hit{
  width:36px!important;height:36px!important;
  border:0!important;background:transparent!important;box-shadow:none!important;
  color:transparent!important;text-shadow:none!important;opacity:1!important;
  border-radius:50%!important;cursor:pointer!important;z-index:205!important;
}
body[data-room-id] .puzzle-number-hit:hover,
body[data-room-id] .puzzle-number-hit:active{background:transparent!important;box-shadow:none!important;filter:none!important}
body[data-room-id] .puzzle-number-hit:focus-visible{outline:3px solid #ffd400!important;outline-offset:1px!important;background:rgba(255,220,90,.12)!important}

/* Large unmistakable yellow glowing star on the floor in every room. */
.next-room-hotspot{
  width:112px!important;height:106px!important;z-index:230!important;
  border:0!important;background:transparent!important;box-shadow:none!important;
  pointer-events:auto!important;cursor:pointer!important;opacity:1!important;
}
.next-room-hotspot .exit-star{
  display:block!important;color:#ffe000!important;font-size:94px!important;line-height:86px!important;
  -webkit-text-stroke:2px #6f4300!important;
  text-shadow:0 0 7px #fffbd0,0 0 18px #fff06a,0 0 35px #ffd400,0 0 64px #ffad00,0 9px 10px rgba(0,0,0,.42)!important;
  transform:scaleY(.62)!important;animation:floorStar113 1.05s ease-in-out infinite alternate!important;
}
.next-room-hotspot .exit-text{display:block!important;margin-top:-14px!important;padding:4px 8px!important;border-radius:999px!important;background:rgba(50,30,0,.78)!important;color:#fff8bb!important;font:800 11px/1 Arial,sans-serif!important}
@keyframes floorStar113{from{filter:brightness(1);transform:scaleY(.62) scale(.94)}to{filter:brightness(1.38);transform:scaleY(.62) scale(1.12)}}

/* Knight Tour: visible knight piece placed on the Room 1 floor. */
.knight-tour-hotspot{
  width:96px!important;height:104px!important;z-index:231!important;border:0!important;background:transparent!important;
  box-shadow:none!important;pointer-events:auto!important;cursor:pointer!important;
}
.knight-tour-hotspot::before{
  content:'♞'!important;display:block!important;color:#d9a82f!important;font:700 88px/86px Georgia,serif!important;
  -webkit-text-stroke:2px #543009!important;text-shadow:0 0 8px #fff0a0,0 0 18px #d9a82f,0 8px 10px rgba(0,0,0,.48)!important;
  transform:scaleY(.78)!important;
}
.knight-tour-hotspot::after{content:'Knight Tour'!important;display:block!important;margin-top:-14px!important;padding:4px 7px!important;border-radius:999px!important;background:rgba(45,27,0,.78)!important;color:#fff4ae!important;font:800 10px/1 Arial,sans-serif!important;white-space:nowrap!important}

@media(max-width:700px){
  body[data-room-id] .puzzle-number-hit{width:32px!important;height:32px!important}
  .next-room-hotspot{width:94px!important;height:92px!important}
  .next-room-hotspot .exit-star{font-size:78px!important;line-height:72px!important}
  .knight-tour-hotspot{width:82px!important;height:92px!important}
  .knight-tour-hotspot::before{font-size:74px!important;line-height:72px!important}
}


/* ============================================================
   v115 - exact scene-coordinate overlays and strict floor-only walking
   ============================================================ */
.stage{cursor:default!important;}
.stage.pan-frame{cursor:grab!important;}
.stage.pan-dragging{cursor:grabbing!important;}
.panorama-view{position:absolute!important;inset:0!important;width:100%!important;height:100%!important;z-index:2!important;touch-action:none!important;}
.room-bg{position:absolute!important;inset:0!important;width:100%!important;height:100%!important;}
.avatar-layer{z-index:80!important;}

/* Transparent targets only: the painted medallions under the frames remain the visible controls. */
body[data-room-id] .puzzle-number-hit{
  position:absolute!important;width:30px!important;height:30px!important;
  transform:translate(-50%,-50%)!important;border:0!important;background:transparent!important;
  box-shadow:none!important;color:transparent!important;text-shadow:none!important;opacity:1!important;
  border-radius:50%!important;z-index:320!important;pointer-events:auto!important;cursor:pointer!important;
}
body[data-room-id] .puzzle-number-hit:hover,
body[data-room-id] .puzzle-number-hit:active{background:rgba(255,215,35,.10)!important;box-shadow:0 0 0 1px rgba(255,210,40,.22)!important;}
body[data-room-id] .puzzle-number-hit:focus-visible{outline:3px solid #ffd400!important;outline-offset:1px!important;}

/* A real floor marker: bright yellow, flattened in perspective, and always above the room image. */
.next-room-hotspot{
  position:absolute!important;width:126px!important;height:92px!important;transform:translate(-50%,-50%)!important;
  z-index:350!important;border:0!important;background:transparent!important;box-shadow:none!important;
  padding:0!important;pointer-events:auto!important;cursor:pointer!important;opacity:1!important;visibility:visible!important;
}
.next-room-hotspot::before{
  content:'';position:absolute;left:50%;top:58%;width:94px;height:30px;transform:translate(-50%,-50%);
  border-radius:50%;background:rgba(255,205,0,.28);filter:blur(5px);box-shadow:0 0 24px 12px rgba(255,206,0,.36);
}
.next-room-hotspot .exit-star{
  position:relative;display:block!important;color:#ffd900!important;font-size:104px!important;line-height:78px!important;
  -webkit-text-stroke:2px #744600!important;text-shadow:0 0 7px #fffbd2,0 0 18px #fff16a,0 0 34px #ffd400,0 0 58px #ffb000!important;
  transform:scaleY(.48)!important;transform-origin:50% 63%!important;animation:floorStar115 .9s ease-in-out infinite alternate!important;
}
.next-room-hotspot .exit-text{
  position:relative;display:block!important;width:max-content;margin:-20px auto 0!important;padding:4px 8px!important;
  border-radius:999px!important;background:rgba(45,27,0,.82)!important;color:#fff8ad!important;font:800 11px/1 Arial,sans-serif!important;
}
@keyframes floorStar115{from{filter:brightness(1);transform:scaleY(.48) scale(.94)}to{filter:brightness(1.45);transform:scaleY(.48) scale(1.10)}}

/* Room 1 Knight Tour piece sits on the floor and is an obvious live control. */
.knight-tour-hotspot{
  position:absolute!important;width:104px!important;height:100px!important;transform:translate(-50%,-50%)!important;
  z-index:351!important;border:0!important;background:transparent!important;box-shadow:none!important;
  padding:0!important;pointer-events:auto!important;cursor:pointer!important;opacity:1!important;visibility:visible!important;
}
.knight-tour-hotspot::before{
  content:'♞'!important;display:block!important;color:#d6a125!important;font:700 88px/78px Georgia,serif!important;
  -webkit-text-stroke:2px #553008!important;text-shadow:0 0 8px #fff0a0,0 0 18px #d9aa2f,0 8px 10px rgba(0,0,0,.48)!important;
  transform:scaleY(.66)!important;transform-origin:50% 70%!important;
}
.knight-tour-hotspot::after{
  content:'Knight Tour'!important;display:block!important;width:max-content;margin:-15px auto 0!important;padding:4px 7px!important;
  border-radius:999px!important;background:rgba(45,27,0,.82)!important;color:#fff4ae!important;font:800 10px/1 Arial,sans-serif!important;white-space:nowrap!important;
}
@media(max-width:700px){
  body[data-room-id] .puzzle-number-hit{width:36px!important;height:36px!important;}
  .next-room-hotspot{width:108px!important;height:82px!important;}
  .next-room-hotspot .exit-star{font-size:88px!important;line-height:68px!important;}
  .knight-tour-hotspot{width:92px!important;height:90px!important;}
  .knight-tour-hotspot::before{font-size:76px!important;line-height:70px!important;}
}
body[data-room-id] .puzzle-number-hit[hidden]{display:none!important;pointer-events:none!important;}


/* ============================================================
   v116 final interaction fixes — centered floor star, all medallions live, avatar floor-only
   ============================================================ */
.stage,.scene{overflow:hidden!important;}
body[data-room-id] .puzzle-hotspots{position:absolute!important;inset:0!important;z-index:360!important;pointer-events:none!important;}
body[data-room-id] .puzzle-number-hit{
  position:absolute!important;
  width:42px!important;height:42px!important;
  transform:translate(-50%,-50%)!important;
  border:0!important;background:transparent!important;box-shadow:none!important;color:transparent!important;
  text-shadow:none!important;opacity:1!important;border-radius:50%!important;
  z-index:361!important;pointer-events:auto!important;cursor:pointer!important;display:block!important;
}
body[data-room-id] .puzzle-number-hit:hover,
body[data-room-id] .puzzle-number-hit:active{background:rgba(255,215,35,.08)!important;box-shadow:0 0 0 2px rgba(255,215,35,.18)!important;}
body[data-room-id] .puzzle-number-hit:focus-visible{outline:3px solid #ffd400!important;outline-offset:1px!important;background:rgba(255,220,90,.12)!important;}
body[data-room-id] .puzzle-number-hit[hidden]{display:none!important;pointer-events:none!important;}

.next-room-hotspot{
  position:absolute!important;display:flex!important;flex-direction:column!important;align-items:center!important;justify-content:flex-start!important;
  width:118px!important;height:94px!important;overflow:visible!important;
  transform:translate(-50%,-50%)!important;border:0!important;background:transparent!important;box-shadow:none!important;
  padding:0!important;z-index:370!important;pointer-events:auto!important;cursor:pointer!important;opacity:1!important;visibility:visible!important;
}
.next-room-hotspot::before{
  content:''!important;position:absolute!important;left:50%!important;top:58%!important;width:88px!important;height:24px!important;
  transform:translate(-50%,-50%)!important;border-radius:50%!important;
  background:rgba(255,213,0,.36)!important;filter:blur(4px)!important;box-shadow:0 0 18px 8px rgba(255,210,30,.32)!important;
}
.next-room-hotspot .exit-star{
  position:relative!important;display:block!important;overflow:visible!important;
  margin:0 auto!important;font-size:96px!important;line-height:72px!important;color:#ffd700!important;
  -webkit-text-stroke:2px #7a4b00!important;
  text-shadow:0 0 8px #fffcd0,0 0 18px #fff060,0 0 34px #ffd000,0 0 56px #ffb300,0 8px 8px rgba(0,0,0,.38)!important;
  transform:scaleY(.52)!important;transform-origin:50% 62%!important;animation:v116StarPulse 1s ease-in-out infinite alternate!important;
}
.next-room-hotspot .exit-text{
  position:relative!important;display:block!important;margin:-12px auto 0!important;padding:4px 8px!important;border-radius:999px!important;
  background:rgba(48,28,0,.78)!important;color:#fff7b2!important;font:800 11px/1 Arial,sans-serif!important;white-space:nowrap!important;
}
@keyframes v116StarPulse{from{filter:brightness(1);transform:scaleY(.52) scale(.95)!important}to{filter:brightness(1.28);transform:scaleY(.52) scale(1.08)!important}}

.knight-tour-hotspot{
  position:absolute!important;display:flex!important;flex-direction:column!important;align-items:center!important;justify-content:flex-start!important;
  width:102px!important;height:96px!important;overflow:visible!important;transform:translate(-50%,-50%)!important;
  z-index:371!important;border:0!important;background:transparent!important;box-shadow:none!important;padding:0!important;
  pointer-events:auto!important;cursor:pointer!important;opacity:1!important;visibility:visible!important;
}
.knight-tour-hotspot::before{
  content:'♞'!important;display:block!important;color:#d7a62e!important;font:700 86px/72px Georgia,serif!important;
  -webkit-text-stroke:2px #5b350b!important;text-shadow:0 0 6px #fff0a0,0 0 14px #d9aa2f,0 8px 10px rgba(0,0,0,.48)!important;
  transform:scaleY(.70)!important;transform-origin:50% 65%!important;
}
.knight-tour-hotspot::after{
  content:'Knight Tour'!important;display:block!important;margin:-10px auto 0!important;padding:4px 8px!important;border-radius:999px!important;
  background:rgba(45,27,0,.80)!important;color:#fff4ae!important;font:800 10px/1 Arial,sans-serif!important;white-space:nowrap!important;
}

@media(max-width:700px){
  body[data-room-id] .puzzle-number-hit{width:46px!important;height:46px!important;}
  .next-room-hotspot{width:104px!important;height:84px!important;}
  .next-room-hotspot .exit-star{font-size:84px!important;line-height:64px!important;}
  .knight-tour-hotspot{width:92px!important;height:88px!important;}
  .knight-tour-hotspot::before{font-size:76px!important;line-height:66px!important;}
}


/* ============================================================
   V117 FINAL: star locked to center floor, exact medallion targets, floor-only avatar
   ============================================================ */
.next-room-hotspot{
  left:50%!important;top:84%!important;right:auto!important;bottom:auto!important;
  position:absolute!important;display:flex!important;flex-direction:column!important;align-items:center!important;
  width:126px!important;height:100px!important;transform:translate(-50%,-50%)!important;
  z-index:500!important;overflow:visible!important;pointer-events:auto!important;visibility:visible!important;opacity:1!important;
}
.next-room-hotspot .exit-star{
  display:block!important;color:#ffd400!important;font-size:104px!important;line-height:78px!important;
  -webkit-text-stroke:2px #754600!important;
  text-shadow:0 0 8px #fffbd2,0 0 18px #ffef63,0 0 34px #ffd400,0 0 58px #ffb400,0 9px 9px rgba(0,0,0,.45)!important;
  transform:scaleY(.50)!important;transform-origin:50% 62%!important;
}
.next-room-hotspot .exit-text{display:block!important;margin-top:-13px!important;white-space:nowrap!important;}

/* Painted medallions stay visible. These are large transparent click targets centered on each real medallion. */
body[data-room-id] .puzzle-hotspots{position:absolute!important;inset:0!important;z-index:480!important;pointer-events:none!important;}
body[data-room-id] .puzzle-number-hit{
  position:absolute!important;width:50px!important;height:50px!important;transform:translate(-50%,-50%)!important;
  display:block!important;border:0!important;border-radius:50%!important;background:transparent!important;box-shadow:none!important;
  color:transparent!important;opacity:1!important;z-index:481!important;pointer-events:auto!important;cursor:pointer!important;
}
body[data-room-id] .puzzle-number-hit:hover{background:rgba(255,213,40,.10)!important;box-shadow:0 0 0 2px rgba(255,213,40,.16)!important;}
body[data-room-id] .puzzle-number-hit[hidden]{display:none!important;pointer-events:none!important;}

/* Room 1 knight lives on the visible floor and never follows the panorama. */
.knight-tour-hotspot{
  left:30%!important;top:84%!important;right:auto!important;bottom:auto!important;
  position:absolute!important;width:108px!important;height:100px!important;transform:translate(-50%,-50%)!important;
  z-index:501!important;overflow:visible!important;pointer-events:auto!important;visibility:visible!important;opacity:1!important;
}

/* Avatar layer cannot intercept frame/medallion controls except the avatar itself. */
.avatar-layer{pointer-events:none!important;}
.avatar-layer .player{pointer-events:auto!important;}

@media(max-width:700px){
  .next-room-hotspot{top:83%!important;width:108px!important;height:90px!important;}
  .next-room-hotspot .exit-star{font-size:88px!important;line-height:70px!important;}
  body[data-room-id] .puzzle-number-hit{width:54px!important;height:54px!important;}
  .knight-tour-hotspot{left:27%!important;top:83%!important;width:96px!important;height:92px!important;}
}


/* ============================================================
   v118 — exact medallion hitboxes for Rooms 2-10
   Keep the clickable area inside the painted medallion instead of spilling onto frames.
   ============================================================ */
body[data-room-id] .puzzle-number-hit{
  width:28px!important;
  height:28px!important;
  min-width:0!important;
  min-height:0!important;
  padding:0!important;
  margin:0!important;
  border:0!important;
  border-radius:50%!important;
  background:transparent!important;
  box-shadow:none!important;
  transform:translate(-50%,-50%)!important;
  pointer-events:auto!important;
  cursor:pointer!important;
  z-index:380!important;
}
body[data-room-id] .puzzle-number-hit:hover,
body[data-room-id] .puzzle-number-hit:active{background:rgba(255,215,35,.06)!important;box-shadow:none!important;}
@media (pointer:coarse){
  body[data-room-id] .puzzle-number-hit{width:32px!important;height:32px!important;}
}


/* v119 performance + exact medallion alignment */
body[data-room-id] .puzzle-number-hit{
  min-width:0!important;min-height:0!important;padding:0!important;margin:0!important;
  border:0!important;background:transparent!important;box-shadow:none!important;
  transform:translate(-50%,-50%)!important;pointer-events:auto!important;cursor:pointer!important;
}
body[data-room-id] .puzzle-number-hit:hover,
body[data-room-id] .puzzle-number-hit:active{background:transparent!important;box-shadow:none!important;}
.panorama-view{will-change:transform;contain:strict;}
.avatar-layer,.puzzle-hotspots{contain:layout style;}


/* =========================
   v120 FINAL USER FIXES
   - every medallion clickable
   - non-glowing yellow star in a frame
   - knight tour trigger in a frame
   - avatar stays on floor and moves faster
   ========================= */
body[data-room-id] .puzzle-number-hit{
  position:absolute!important;
  border:0!important;
  background:transparent!important;
  box-shadow:none!important;
  color:transparent!important;
  border-radius:50%!important;
  z-index:140!important;
  cursor:pointer!important;
  pointer-events:auto!important;
}
body[data-room-id] .puzzle-number-hit:hover,
body[data-room-id] .puzzle-number-hit:active{background:rgba(255,215,35,.05)!important;box-shadow:0 0 0 1px rgba(255,215,35,.12)!important;}
body[data-room-id] .puzzle-number-hit:focus-visible{outline:3px solid #ffd400!important;outline-offset:1px!important;background:rgba(255,220,90,.10)!important;}
body[data-room-id] .puzzle-number-hit[hidden]{display:none!important;pointer-events:none!important;}

.next-room-hotspot{
  position:absolute!important;
  width:74px!important;
  height:72px!important;
  min-width:0!important;
  min-height:0!important;
  transform:translate(-50%,-50%)!important;
  border:0!important;
  background:transparent!important;
  box-shadow:none!important;
  padding:0!important;
  z-index:180!important;
  pointer-events:auto!important;
}
.next-room-hotspot::before{content:none!important;display:none!important;}
.next-room-hotspot .exit-star{
  display:block!important;
  font-size:62px!important;
  line-height:56px!important;
  color:#ffd200!important;
  text-shadow:0 2px 4px rgba(0,0,0,.38)!important;
  animation:none!important;
  transform:none!important;
}
.next-room-hotspot .exit-text{
  display:block!important;
  margin-top:-10px!important;
  padding:2px 6px!important;
  border-radius:999px!important;
  background:rgba(43,27,0,.74)!important;
  color:#fff3a3!important;
  font:800 10px/1 Arial,sans-serif!important;
  white-space:nowrap!important;
  text-shadow:none!important;
}
.next-room-hotspot .exit-text::before{content:none!important;display:none!important;}

.knight-tour-hotspot{
  position:absolute!important;
  width:66px!important;
  height:72px!important;
  min-width:0!important;
  min-height:0!important;
  transform:translate(-50%,-50%)!important;
  border:0!important;
  background:transparent!important;
  box-shadow:none!important;
  padding:0!important;
  z-index:181!important;
  pointer-events:auto!important;
}
.knight-tour-hotspot::before{
  content:'♞'!important;
  display:block!important;
  color:#d4aa2a!important;
  font:700 60px/56px Georgia,serif!important;
  text-shadow:0 2px 4px rgba(0,0,0,.40)!important;
  white-space:nowrap!important;
}
.knight-tour-hotspot::after{
  content:'Knight Tour'!important;
  display:block!important;
  margin-top:-8px!important;
  padding:2px 6px!important;
  border-radius:999px!important;
  background:rgba(43,27,0,.74)!important;
  color:#fff3a3!important;
  font:800 10px/1 Arial,sans-serif!important;
  white-space:nowrap!important;
  text-shadow:none!important;
}

@media(max-width:700px){
  .next-room-hotspot{width:64px!important;height:64px!important;}
  .next-room-hotspot .exit-star{font-size:54px!important;line-height:50px!important;}
  .knight-tour-hotspot{width:58px!important;height:64px!important;}
  .knight-tour-hotspot::before{font-size:52px!important;line-height:50px!important;}
}


/* ============================================================
   v121 exact requested behavior
   ============================================================ */
/* EVERY visible medallion hotspot stays directly clickable. */
body[data-room-id] .puzzle-hotspots{z-index:500!important;pointer-events:none!important;}
body[data-room-id] .puzzle-number-hit{
  border:0!important;background:transparent!important;box-shadow:none!important;color:transparent!important;
  opacity:1!important;border-radius:50%!important;z-index:501!important;pointer-events:auto!important;cursor:pointer!important;
  touch-action:manipulation!important;-webkit-tap-highlight-color:transparent!important;
}
body[data-room-id] .puzzle-number-hit:hover,
body[data-room-id] .puzzle-number-hit:active{background:rgba(255,210,25,.06)!important;box-shadow:none!important;}
body[data-room-id] .puzzle-number-hit[hidden]{display:none!important;pointer-events:none!important;}

/* Yellow next-room star: IN A FRAME, not on the floor, and absolutely NO glow/animation. */
.next-room-hotspot{
  width:62px!important;height:76px!important;transform:translate(-50%,-50%)!important;
  border:5px solid #7b501d!important;outline:2px solid #caa257!important;outline-offset:-7px!important;
  border-radius:2px!important;background:#f4e2b7!important;box-shadow:0 3px 7px rgba(0,0,0,.25)!important;
  padding:4px!important;z-index:510!important;pointer-events:auto!important;cursor:pointer!important;overflow:visible!important;
}
.next-room-hotspot::before{content:none!important;display:none!important;}
.next-room-hotspot .exit-star{
  display:block!important;color:#ffd100!important;font-size:46px!important;line-height:48px!important;
  animation:none!important;filter:none!important;transform:none!important;text-shadow:none!important;-webkit-text-stroke:1px #7b5600!important;
}
.next-room-hotspot .exit-text{
  display:block!important;margin:-2px auto 0!important;padding:0!important;background:transparent!important;color:#4b2c0c!important;
  font:800 8px/1 Arial,sans-serif!important;text-shadow:none!important;white-space:nowrap!important;
}
.next-room-hotspot .exit-text::before{content:none!important;display:none!important;}

/* Knight Tour: removed from floor and shown INSIDE a framed plaque. */
.knight-tour-hotspot{
  width:72px!important;height:82px!important;transform:translate(-50%,-50%)!important;
  border:5px solid #7b501d!important;outline:2px solid #caa257!important;outline-offset:-7px!important;
  border-radius:2px!important;background:#f4e2b7!important;box-shadow:0 3px 7px rgba(0,0,0,.25)!important;
  padding:4px!important;z-index:511!important;pointer-events:auto!important;cursor:pointer!important;overflow:visible!important;
}
.knight-tour-hotspot::before{
  content:'♞'!important;display:block!important;color:#5e3b15!important;font:700 50px/52px Georgia,serif!important;
  text-shadow:none!important;-webkit-text-stroke:0!important;transform:none!important;
}
.knight-tour-hotspot::after{
  content:'Knight Tour'!important;display:block!important;margin:-1px auto 0!important;padding:0!important;background:transparent!important;
  color:#4b2c0c!important;font:800 8px/1 Arial,sans-serif!important;text-shadow:none!important;white-space:nowrap!important;
}

/* Avatar remains strictly in the walkable floor layer. */
.avatar-layer{z-index:90!important;pointer-events:none!important;}
.avatar-layer .player{pointer-events:auto!important;}

@media(max-width:700px){
  .next-room-hotspot{width:56px!important;height:68px!important;border-width:4px!important;}
  .next-room-hotspot .exit-star{font-size:40px!important;line-height:42px!important;}
  .knight-tour-hotspot{width:64px!important;height:72px!important;border-width:4px!important;}
  .knight-tour-hotspot::before{font-size:44px!important;line-height:46px!important;}
}


/* ============================================================
   v122 EXACT FINAL OVERRIDES — user instructions are authoritative
   ============================================================ */
/* All medallion click targets are invisible and remain directly over the painted medallions. */
body[data-room-id] .puzzle-hotspots{position:absolute!important;inset:0!important;z-index:600!important;pointer-events:none!important;}
body[data-room-id] .puzzle-number-hit{
  position:absolute!important;min-width:0!important;min-height:0!important;margin:0!important;padding:0!important;
  border:0!important;border-radius:50%!important;background:transparent!important;box-shadow:none!important;
  color:transparent!important;text-shadow:none!important;opacity:1!important;visibility:visible!important;
  z-index:601!important;pointer-events:auto!important;cursor:pointer!important;touch-action:manipulation!important;
  transform:translate(-50%,-50%)!important;-webkit-tap-highlight-color:transparent!important;
}
body[data-room-id] .puzzle-number-hit:hover,
body[data-room-id] .puzzle-number-hit:active{background:transparent!important;box-shadow:none!important;filter:none!important;}
body[data-room-id] .puzzle-number-hit:focus-visible{outline:3px solid #ffd400!important;outline-offset:1px!important;}
body[data-room-id] .puzzle-number-hit[hidden]{display:none!important;pointer-events:none!important;}

/* NEXT ROOM: yellow NON-GLOWING star, framed on the WALL. Never on the floor. */
.next-room-hotspot{
  position:absolute!important;right:auto!important;bottom:auto!important;
  width:64px!important;height:78px!important;min-width:0!important;min-height:0!important;
  transform:translate(-50%,-50%)!important;margin:0!important;padding:4px!important;
  border:5px solid #72501e!important;outline:2px solid #c7a050!important;outline-offset:-7px!important;border-radius:2px!important;
  background:#f1dfb1!important;box-shadow:0 3px 7px rgba(0,0,0,.26)!important;
  z-index:610!important;overflow:visible!important;pointer-events:auto!important;cursor:pointer!important;
  opacity:1!important;visibility:visible!important;filter:none!important;animation:none!important;
}
.next-room-hotspot::before{content:none!important;display:none!important;box-shadow:none!important;filter:none!important;}
.next-room-hotspot .exit-star{
  display:block!important;margin:0 auto!important;color:#ffd000!important;font-size:48px!important;line-height:50px!important;
  -webkit-text-stroke:1px #755100!important;text-shadow:none!important;filter:none!important;animation:none!important;transform:none!important;
}
.next-room-hotspot .exit-text{
  display:block!important;margin:-1px auto 0!important;padding:0!important;background:transparent!important;border:0!important;
  color:#4b2c0c!important;font:800 8px/1 Arial,sans-serif!important;text-shadow:none!important;white-space:nowrap!important;
}
.next-room-hotspot .exit-text::before{content:none!important;display:none!important;}

/* KNIGHT TOUR: framed on the WALL in Room 1. Never on the floor. */
.knight-tour-hotspot{
  position:absolute!important;right:auto!important;bottom:auto!important;
  width:72px!important;height:82px!important;min-width:0!important;min-height:0!important;
  transform:translate(-50%,-50%)!important;margin:0!important;padding:4px!important;
  border:5px solid #72501e!important;outline:2px solid #c7a050!important;outline-offset:-7px!important;border-radius:2px!important;
  background:#f1dfb1!important;box-shadow:0 3px 7px rgba(0,0,0,.26)!important;
  z-index:611!important;overflow:visible!important;pointer-events:auto!important;cursor:pointer!important;
  opacity:1!important;visibility:visible!important;filter:none!important;animation:none!important;
}
.knight-tour-hotspot::before{
  content:'♞'!important;display:block!important;margin:0 auto!important;color:#5b3a16!important;
  font:700 52px/54px Georgia,serif!important;-webkit-text-stroke:0!important;text-shadow:none!important;filter:none!important;animation:none!important;transform:none!important;
}
.knight-tour-hotspot::after{
  content:'Knight Tour'!important;display:block!important;margin:-1px auto 0!important;padding:0!important;background:transparent!important;border:0!important;
  color:#4b2c0c!important;font:800 8px/1 Arial,sans-serif!important;text-shadow:none!important;white-space:nowrap!important;
}

/* Avatar layer itself does not steal medallion/frame interaction; feet remain constrained by JS walkable-floor checks. */
.avatar-layer{z-index:90!important;pointer-events:none!important;}
.avatar-layer .player{pointer-events:auto!important;}

@media(max-width:700px){
  .next-room-hotspot{width:58px!important;height:70px!important;border-width:4px!important;}
  .next-room-hotspot .exit-star{font-size:42px!important;line-height:44px!important;}
  .knight-tour-hotspot{width:64px!important;height:74px!important;border-width:4px!important;}
  .knight-tour-hotspot::before{font-size:46px!important;line-height:48px!important;}
}


/* v123 final overrides: transparent small wall-frame star/knight, no dark popup backdrop, lighter performance */
.next-room-hotspot,
.knight-tour-hotspot{
  position:absolute!important;
  transform:translate(-50%,-50%)!important;
  background:transparent!important;
  border:0!important;
  box-shadow:none!important;
  min-width:0!important;
  min-height:0!important;
  padding:0!important;
  overflow:visible!important;
}
.next-room-hotspot .exit-star{
  display:block!important;
  color:#f2cb00!important;
  font-size:42px!important;
  line-height:38px!important;
  -webkit-text-stroke:0!important;
  text-shadow:0 2px 4px rgba(0,0,0,.28)!important;
  animation:none!important;
  transform:none!important;
}
.next-room-hotspot .exit-text{
  position:absolute!important;
  width:1px!important;height:1px!important;overflow:hidden!important;
  clip:rect(0,0,0,0)!important;white-space:nowrap!important;
}
.knight-tour-hotspot{
  width:46px!important;
  height:54px!important;
  z-index:191!important;
}
.knight-tour-hotspot::before{
  content:'♞'!important;
  display:block!important;
  color:#2b1a0e!important;
  font:700 42px/44px Georgia,serif!important;
  text-shadow:0 2px 4px rgba(0,0,0,.30)!important;
  white-space:nowrap!important;
}
.knight-tour-hotspot::after{
  content:none!important;
  display:none!important;
}
@media (max-width:900px){
  .next-room-hotspot .exit-star{font-size:34px!important;line-height:32px!important;}
  .knight-tour-hotspot{width:38px!important;height:46px!important;}
  .knight-tour-hotspot::before{font-size:36px!important;line-height:38px!important;}
}
.puzzle-modal,.knight-tour-modal{background:transparent!important;}
.puzzle-backdrop,.knight-tour-backdrop{
  background:transparent!important;
  backdrop-filter:none!important;
}
.vintage-puzzle-card,.knight-tour-card{
  box-shadow:0 14px 34px rgba(0,0,0,.28)!important;
}


/* v124 FORCE OVERRIDES */
.next-room-hotspot, .knight-tour-hotspot {
  background: transparent !important;
  border: none !important;
  outline: none !important;
  box-shadow: none !important;
  filter: none !important;
}
.next-room-hotspot::before, .knight-tour-hotspot::after {
  content: none !important;
  display: none !important;
}
.next-room-hotspot .exit-text {
  display: none !important;
}
.next-room-hotspot {
  width: 44px !important;
  height: 44px !important;
  min-width: 0 !important;
  min-height: 0 !important;
  padding: 0 !important;
  overflow: visible !important;
  z-index: 250 !important;
}
.next-room-hotspot .exit-star {
  display: block !important;
  color: #e2bf00 !important;
  font-size: 34px !important;
  line-height: 34px !important;
  text-shadow: 0 1px 3px rgba(0,0,0,.35) !important;
  -webkit-text-stroke: 0 !important;
  animation: none !important;
  filter: none !important;
  transform: none !important;
}
.knight-tour-hotspot {
  width: 40px !important;
  height: 42px !important;
  min-width: 0 !important;
  min-height: 0 !important;
  padding: 0 !important;
  overflow: visible !important;
  z-index: 251 !important;
}
.knight-tour-hotspot::before {
  content: '♞' !important;
  display: block !important;
  color: #2b1a0e !important;
  font: 700 34px/34px Georgia, serif !important;
  text-shadow: 0 1px 3px rgba(0,0,0,.32) !important;
  white-space: nowrap !important;
}
.puzzle-modal, .knight-tour-modal, .puzzle-modal.open, .knight-tour-modal.open {
  background: transparent !important;
}
.puzzle-backdrop, .knight-tour-backdrop {
  background: transparent !important;
  opacity: 0 !important;
  backdrop-filter: none !important;
}
@media (max-width: 900px){
  .next-room-hotspot { width: 38px !important; height: 38px !important; }
  .next-room-hotspot .exit-star { font-size: 30px !important; line-height: 30px !important; }
  .knight-tour-hotspot { width: 34px !important; height: 36px !important; }
  .knight-tour-hotspot::before { font-size: 30px !important; line-height: 30px !important; }
}


/* v125 exact visual fixes */
.next-room-hotspot,
.knight-tour-hotspot{
  -webkit-appearance:none!important;appearance:none!important;
  background:none!important;background-color:transparent!important;background-image:none!important;
  border:0!important;border-radius:0!important;outline:0!important;box-shadow:none!important;filter:none!important;
  padding:0!important;margin:0!important;
  overflow:visible!important;
}
.next-room-hotspot:focus, .next-room-hotspot:focus-visible,
.knight-tour-hotspot:focus, .knight-tour-hotspot:focus-visible{
  outline:0!important;box-shadow:none!important;background:transparent!important;
}
.next-room-hotspot{width:34px!important;height:34px!important;min-width:34px!important;min-height:34px!important;}
.next-room-hotspot::before,.next-room-hotspot::after{content:none!important;display:none!important;}
.next-room-hotspot .exit-star{
  display:block!important;width:auto!important;height:auto!important;
  color:#e1bd00!important;font-size:30px!important;line-height:30px!important;
  text-shadow:none!important;-webkit-text-stroke:0!important;
  animation:none!important;transform:none!important;filter:none!important;
}
.next-room-hotspot .exit-text{display:none!important;}
.knight-tour-hotspot{width:34px!important;height:34px!important;min-width:34px!important;min-height:34px!important;}
.knight-tour-hotspot::before{
  content:'♞'!important;display:block!important;width:auto!important;height:auto!important;
  color:#2b1a0e!important;font:700 30px/30px Georgia,serif!important;
  text-shadow:none!important;filter:none!important;transform:none!important;
}
.knight-tour-hotspot::after{content:none!important;display:none!important;}
/* No dark/black screen behind chess-problem or knight-tour popups. */
.puzzle-backdrop,.knight-tour-backdrop{display:none!important;background:none!important;opacity:0!important;backdrop-filter:none!important;-webkit-backdrop-filter:none!important;}
.puzzle-modal,.knight-tour-modal{background:transparent!important;backdrop-filter:none!important;-webkit-backdrop-filter:none!important;}
.vintage-puzzle-card.exact-shell-card,.knight-tour-card{box-shadow:0 10px 24px rgba(0,0,0,.18)!important;}
@media(max-width:900px){
  .next-room-hotspot{width:30px!important;height:30px!important;min-width:30px!important;min-height:30px!important;}
  .next-room-hotspot .exit-star{font-size:26px!important;line-height:26px!important;}
  .knight-tour-hotspot{width:30px!important;height:30px!important;min-width:30px!important;min-height:30px!important;}
  .knight-tour-hotspot::before{font-size:26px!important;line-height:26px!important;}
}


/* =============================================================
   v126 exact screenshot corrections
   ============================================================= */
/* No black or dark backdrop behind either puzzle. */
.puzzle-modal,.knight-tour-modal{background:transparent!important;backdrop-filter:none!important;-webkit-backdrop-filter:none!important;}
.puzzle-backdrop,.knight-tour-backdrop{background:transparent!important;opacity:0!important;backdrop-filter:none!important;-webkit-backdrop-filter:none!important;}
.vintage-puzzle-card.exact-shell-card{
  background-image:url('puzzle-panel.webp')!important;
  background-color:transparent!important;
  box-shadow:none!important;
  filter:none!important;
}
/* Do not show the initial Mate-in-X / points badge. Status appears only for actual play feedback. */
.exact-shell-card .puzzle-footer .exact-shell-status:empty{display:none!important;background:transparent!important;border:0!important;box-shadow:none!important;}
/* Star and knight are only the symbols — no square, no frame, no label box. */
.next-room-hotspot,.knight-tour-hotspot{
  background:transparent!important;border:0!important;outline:0!important;box-shadow:none!important;filter:none!important;padding:0!important;
}
.next-room-hotspot::before,.next-room-hotspot::after,.knight-tour-hotspot::after{content:none!important;display:none!important;background:none!important;border:0!important;box-shadow:none!important;}
.next-room-hotspot{width:38px!important;height:38px!important;min-width:0!important;min-height:0!important;}
.next-room-hotspot .exit-star{
  display:block!important;color:#e0bd00!important;font-size:31px!important;line-height:31px!important;
  background:transparent!important;border:0!important;box-shadow:none!important;text-shadow:0 1px 2px rgba(0,0,0,.24)!important;
  -webkit-text-stroke:0!important;animation:none!important;filter:none!important;transform:none!important;
}
.next-room-hotspot .exit-text{display:none!important;}
.knight-tour-hotspot{width:36px!important;height:38px!important;min-width:0!important;min-height:0!important;}
.knight-tour-hotspot::before{
  content:'♞'!important;display:block!important;color:#2b1a0e!important;font:700 31px/31px Georgia,serif!important;
  background:transparent!important;border:0!important;box-shadow:none!important;text-shadow:0 1px 2px rgba(0,0,0,.24)!important;
}
@media(max-width:900px){
  .next-room-hotspot{width:34px!important;height:34px!important;}
  .next-room-hotspot .exit-star{font-size:27px!important;line-height:27px!important;}
  .knight-tour-hotspot{width:32px!important;height:34px!important;}
  .knight-tour-hotspot::before{font-size:27px!important;line-height:27px!important;}
}


/* v127 — visible Knight Tour trigger + improved floor movement */
.knight-tour-hotspot{
  width:52px!important;
  height:52px!important;
  min-width:0!important;
  min-height:0!important;
  background:transparent!important;
  border:0!important;
  outline:0!important;
  box-shadow:none!important;
  padding:0!important;
  overflow:visible!important;
  z-index:420!important;
  pointer-events:auto!important;
}
.knight-tour-hotspot::before{
  content:'♞'!important;
  display:block!important;
  color:#d6a620!important;
  font:700 46px/46px Georgia,serif!important;
  text-shadow:-1px -1px 0 #2f1a07,1px -1px 0 #2f1a07,-1px 1px 0 #2f1a07,1px 1px 0 #2f1a07,0 2px 4px rgba(0,0,0,.3)!important;
  background:transparent!important;
  border:0!important;
  box-shadow:none!important;
}
.knight-tour-hotspot::after{content:none!important;display:none!important;}
@media(max-width:900px){
  .knight-tour-hotspot{width:46px!important;height:46px!important;}
  .knight-tour-hotspot::before{font-size:40px!important;line-height:40px!important;}
}


/* v128 movement tuning */
.player{will-change:left,top,transform;}
.avatar{will-change:transform;}

/* v129 final cleanup */
.puzzle-close::before,.puzzle-close::after,.exact-shell-close::before,.exact-shell-close::after{content:none!important;display:none!important}
.puzzle-modal,.knight-tour-modal{background:transparent!important}
.puzzle-backdrop,.knight-tour-backdrop{background:transparent!important;opacity:0!important;backdrop-filter:none!important;-webkit-backdrop-filter:none!important}
.next-room-hotspot,.knight-tour-hotspot{background:transparent!important;border:0!important;outline:0!important;box-shadow:none!important;padding:0!important;border-radius:0!important;overflow:visible!important}
.next-room-hotspot::before,.next-room-hotspot::after,.knight-tour-hotspot::after{content:none!important;display:none!important}
.next-room-hotspot .exit-star{color:#f1cb00!important;font-size:32px!important;line-height:32px!important;text-shadow:none!important;filter:none!important;animation:none!important;transform:none!important;-webkit-text-stroke:0!important}
.next-room-hotspot .exit-text{display:none!important}
.knight-tour-hotspot{width:38px!important;height:40px!important}
.knight-tour-hotspot::before{content:'♞'!important;display:block!important;color:#3a2411!important;font:700 34px/36px Georgia,serif!important;text-shadow:none!important;background:transparent!important;border:0!important}
.player.walking .avatar{animation:bob .22s infinite alternate ease-in-out!important}


/* ============================================================
   V130 HARD CACHE-BUSTED FINAL FIXES
   ============================================================ */
/* Popup: transparent outside the ornate panel. */
.puzzle-modal,.knight-tour-modal{background:transparent!important;}
.puzzle-backdrop,.knight-tour-backdrop{display:none!important;background:transparent!important;opacity:0!important;backdrop-filter:none!important;-webkit-backdrop-filter:none!important;}
.vintage-puzzle-card.exact-shell-card{
  background-color:transparent!important;
  background-image:url('puzzle-panel.webp')!important;
  background-repeat:no-repeat!important;
  background-position:center!important;
  background-size:100% 100%!important;
  border:0!important;
  box-shadow:none!important;
}
.vintage-puzzle-card.exact-shell-card::before,
.vintage-puzzle-card.exact-shell-card::after{display:none!important;content:none!important;}
/* Keep only the artwork's ornate X; the HTML close button is an invisible hit target. */
.exact-shell-card .exact-shell-close{
  background:transparent!important;border:0!important;box-shadow:none!important;color:transparent!important;
  text-shadow:none!important;font-size:0!important;outline:0!important;
}
.exact-shell-card .exact-shell-close::before,
.exact-shell-card .exact-shell-close::after{display:none!important;content:none!important;}
/* Star and knight: symbol only, no square, no badge, no glow. */
.next-room-hotspot,.knight-tour-hotspot{
  background:transparent!important;border:0!important;outline:0!important;box-shadow:none!important;border-radius:0!important;
  padding:0!important;min-width:0!important;min-height:0!important;overflow:visible!important;
}
.next-room-hotspot::before,.next-room-hotspot::after,.knight-tour-hotspot::after{display:none!important;content:none!important;}
.next-room-hotspot{width:38px!important;height:38px!important;z-index:260!important;}
.next-room-hotspot .exit-star{
  display:block!important;color:#e8c400!important;font-size:30px!important;line-height:30px!important;
  background:transparent!important;border:0!important;box-shadow:none!important;text-shadow:none!important;filter:none!important;
  animation:none!important;transform:none!important;-webkit-text-stroke:0!important;
}
.next-room-hotspot .exit-text{display:none!important;}
.knight-tour-hotspot{width:40px!important;height:42px!important;z-index:261!important;}
.knight-tour-hotspot::before{
  content:'♞'!important;display:block!important;color:#2c1b0e!important;font:700 34px/36px Georgia,serif!important;
  background:transparent!important;border:0!important;box-shadow:none!important;text-shadow:none!important;
}
.player.walking .avatar{animation:bob .20s infinite alternate ease-in-out!important;}
@media(max-width:900px){
 .next-room-hotspot{width:34px!important;height:34px!important}
 .next-room-hotspot .exit-star{font-size:27px!important;line-height:27px!important}
 .knight-tour-hotspot{width:36px!important;height:38px!important}
 .knight-tour-hotspot::before{font-size:30px!important;line-height:32px!important}
}


/* v132: hard placement cleanup for star / Knight Tour */
.next-room-hotspot,.knight-tour-hotspot{
  position:absolute!important;
  right:auto!important;
  bottom:auto!important;
  transform:translate(-50%,-50%)!important;
  background:transparent!important;
  border:0!important;
  box-shadow:none!important;
  outline:0!important;
  padding:0!important;
}
.next-room-hotspot .exit-star{background:transparent!important;border:0!important;box-shadow:none!important;}
.knight-tour-hotspot::after{content:none!important;display:none!important;}

/* v135: use the approved transparent Knight's Tour panel asset. */
.knight-tour-modal{
  background:transparent!important;
  backdrop-filter:none!important;
  -webkit-backdrop-filter:none!important;
}
.knight-tour-backdrop{
  display:none!important;
  background:transparent!important;
  opacity:0!important;
  backdrop-filter:none!important;
  -webkit-backdrop-filter:none!important;
}
.knight-tour-card{
  position:relative!important;
  width:min(1040px,96vw)!important;
  aspect-ratio:4/3!important;
  max-height:96vh!important;
  overflow:visible!important;
  padding:0!important;
  border:0!important;
  border-radius:0!important;
  background:url('knight-tour-panel.webp?v=184.0.0') center/100% 100% no-repeat!important;
  box-shadow:none!important;
}
/* Interactive overlays aligned to the new transparent artwork. */
.knight-tour-board{
  left:27.3%!important;
  top:25.0%!important;
  width:42.4%!important;
  height:auto!important;
  aspect-ratio:1!important;
}
.knight-tour-close{
  left:84.9%!important;
  top:6.2%!important;
  width:8.5%!important;
  aspect-ratio:1!important;
}
.knight-tour-reset{
  left:39.1%!important;
  top:87.2%!important;
  width:19.8%!important;
  height:7.4%!important;
}
.knight-tour-status{
  left:30%!important;
  top:20.7%!important;
  width:40%!important;
}
@media (max-width:700px){
  .knight-tour-card{width:99vw!important;aspect-ratio:4/3!important;}
}


/* ============================================================
   V136 — next-room star replaced with a vintage medallion
   ============================================================ */
.next-room-hotspot{
  width:44px!important;
  height:44px!important;
  min-width:44px!important;
  min-height:44px!important;
  background:transparent url('next-room-star.webp?v=184.0.0') center/contain no-repeat!important;
  border:0!important;
  box-shadow:none!important;
  filter:drop-shadow(0 1px 1px rgba(0,0,0,.22))!important;
  transform:translate(-50%,-50%)!important;
}
.next-room-hotspot .exit-star,
.next-room-hotspot .exit-text{
  display:none!important;
}
@media (max-width:900px){
  .next-room-hotspot{
    width:38px!important;
    height:38px!important;
    min-width:38px!important;
    min-height:38px!important;
  }
}

/* ============================================================
   V143 — FULL RESPONSIVE / MOBILE-FIRST HARDENING
   Phones, iPhone, Android, iPad/tablets, notebooks, desktop.
   The panorama always fills the available viewport without
   stretching the room image; overlays stay mapped by JS.
   ============================================================ */
:root{
  --ui-safe-top: env(safe-area-inset-top, 0px);
  --ui-safe-right: env(safe-area-inset-right, 0px);
  --ui-safe-bottom: env(safe-area-inset-bottom, 0px);
  --ui-safe-left: env(safe-area-inset-left, 0px);
  --responsive-dock: 330px;
}
html,body{
  width:100%!important;
  height:100%!important;
  min-width:0!important;
  min-height:0!important;
  margin:0!important;
  overflow:hidden!important;
  overscroll-behavior:none!important;
  -webkit-text-size-adjust:100%!important;
  text-size-adjust:100%!important;
  touch-action:manipulation;
}
body{min-height:100dvh!important;}
.app-shell{
  position:fixed!important;
  inset:0!important;
  width:100%!important;
  height:100dvh!important;
  min-width:0!important;
  min-height:0!important;
  overflow:hidden!important;
}
.room-column,.stage-wrap,.stage{
  position:absolute!important;
  inset:0!important;
  width:100%!important;
  height:100%!important;
  min-width:0!important;
  min-height:0!important;
  overflow:hidden!important;
}
/* Let the panorama engine do the aspect-ratio work. This prevents
   stretched rooms and makes portrait phones usable via horizontal pan. */
.scene{
  position:absolute!important;
  inset:0!important;
  left:0!important;
  top:0!important;
  right:0!important;
  bottom:0!important;
  width:100%!important;
  height:100%!important;
  max-width:none!important;
  max-height:none!important;
  aspect-ratio:auto!important;
  transform:none!important;
  margin:0!important;
  overflow:hidden!important;
}
.panorama-view{
  position:absolute!important;
  inset:0!important;
  width:100%!important;
  height:100%!important;
  max-width:none!important;
  max-height:none!important;
  touch-action:none!important;
}
.room-bg{position:absolute!important;inset:0!important;width:100%!important;height:100%!important;object-fit:cover!important;}

/* Desktop/notebook: reserve space only when the side dock is actually open. */
@media (min-width:1101px){
  .app-shell{display:block!important;}
  .room-column{right:0!important;}
  .side-panel{
    position:fixed!important;
    top:0!important;right:0!important;bottom:0!important;left:auto!important;
    width:var(--responsive-dock)!important;
    max-width:var(--responsive-dock)!important;
    height:100dvh!important;
    max-height:100dvh!important;
    border-radius:0!important;
    overflow-y:auto!important;
    overscroll-behavior:contain!important;
  }
  .side-panel:not(.hidden) ~ *{}
  .panel-toggle,.panel-close{display:none!important;}
}

/* Tablet, iPad, phone, small notebook: controls are an overlay drawer so
   the room keeps the full screen. */
@media (max-width:1100px){
  .side-panel{
    position:fixed!important;
    top:calc(8px + var(--ui-safe-top))!important;
    right:calc(8px + var(--ui-safe-right))!important;
    bottom:calc(8px + var(--ui-safe-bottom))!important;
    left:auto!important;
    width:min(360px,calc(100vw - 16px - var(--ui-safe-left) - var(--ui-safe-right)))!important;
    height:auto!important;
    max-height:calc(100dvh - 16px - var(--ui-safe-top) - var(--ui-safe-bottom))!important;
    padding:48px 14px 16px!important;
    border-radius:16px!important;
    overflow-y:auto!important;
    overscroll-behavior:contain!important;
    -webkit-overflow-scrolling:touch!important;
    transform:translateX(calc(100% + 32px + var(--ui-safe-right)))!important;
    transition:transform .2s ease!important;
    z-index:1200!important;
  }
  .side-panel.mobile-open{transform:translateX(0)!important;}
  .panel-toggle{
    display:block!important;
    position:fixed!important;
    top:calc(8px + var(--ui-safe-top))!important;
    right:calc(8px + var(--ui-safe-right))!important;
    z-index:1250!important;
    min-width:44px!important;
    min-height:44px!important;
    padding:8px 12px!important;
    font-size:13px!important;
    touch-action:manipulation!important;
  }
  .panel-close{
    display:grid!important;
    place-items:center!important;
    position:absolute!important;
    top:8px!important;right:8px!important;
    width:40px!important;height:40px!important;
    min-width:40px!important;min-height:40px!important;
    margin:0!important;padding:0!important;
    z-index:2!important;
  }
  .panel-section button,.panel-section select,.panel-section input{min-height:44px!important;}
  .panel-section textarea{font-size:16px!important;min-height:72px!important;}
  .room-help{
    left:calc(8px + var(--ui-safe-left))!important;
    top:calc(8px + var(--ui-safe-top))!important;
    right:auto!important;
    width:auto!important;
    max-width:calc(100vw - 118px - var(--ui-safe-left) - var(--ui-safe-right))!important;
    padding:6px 8px!important;
    font-size:10px!important;
    line-height:1.2!important;
    white-space:normal!important;
  }
}

@media (max-width:600px){
  .room-help{font-size:9px!important;max-width:calc(100vw - 104px - var(--ui-safe-left) - var(--ui-safe-right))!important;}
  .panel-toggle{font-size:12px!important;padding:7px 9px!important;}
  .side-panel{width:calc(100vw - 16px - var(--ui-safe-left) - var(--ui-safe-right))!important;padding:46px 12px 14px!important;}
  .panel-section{padding:10px 0!important;}
  .panel-section h2{font-size:15px!important;}
  .people-list,.chat-list,.pm-messages{max-height:26dvh!important;}
  .player{transform:translate(-50%,-100%) scale(.72)!important;transform-origin:50% 100%!important;}
  .player-name{font-size:10px!important;max-width:120px!important;padding:3px 6px!important;}
  .overhead-pm{max-width:min(160px,48vw)!important;font-size:10px!important;}
  .announcement{top:calc(8px + var(--ui-safe-top))!important;width:calc(100vw - 16px - var(--ui-safe-left) - var(--ui-safe-right))!important;font-size:13px!important;}
}

/* Login works with iPhone keyboard/notch and narrow screens. */
.overlay{
  padding:calc(10px + var(--ui-safe-top)) calc(10px + var(--ui-safe-right)) calc(10px + var(--ui-safe-bottom)) calc(10px + var(--ui-safe-left))!important;
  overflow:auto!important;
  -webkit-overflow-scrolling:touch!important;
}
.entry-card{
  width:min(430px,100%)!important;
  max-width:100%!important;
  max-height:calc(100dvh - 20px - var(--ui-safe-top) - var(--ui-safe-bottom))!important;
  overflow:auto!important;
  padding:clamp(16px,4vw,34px)!important;
}
.entry-card input,.entry-card select,.entry-card textarea{font-size:16px!important;}
.entry-card button{min-height:44px!important;}

/* ============================================================
   RESPONSIVE CHESS PROBLEM POPUP
   Keep the exact ornate artwork ratio and fit BOTH viewport width
   and viewport height. This is critical on landscape phones.
   ============================================================ */
.puzzle-modal{
  position:fixed!important;
  inset:0!important;
  width:100%!important;
  height:100dvh!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  padding:calc(6px + var(--ui-safe-top)) calc(6px + var(--ui-safe-right)) calc(6px + var(--ui-safe-bottom)) calc(6px + var(--ui-safe-left))!important;
  overflow:hidden!important;
  background:transparent!important;
}
.puzzle-modal.hidden{display:none!important;}
.vintage-puzzle-card.exact-shell-card{
  position:relative!important;
  flex:0 0 auto!important;
  width:min(96vw,1000px,calc((100dvh - 12px - var(--ui-safe-top) - var(--ui-safe-bottom)) * 1.0942452))!important;
  height:auto!important;
  max-width:calc(100vw - 12px - var(--ui-safe-left) - var(--ui-safe-right))!important;
  max-height:calc(100dvh - 12px - var(--ui-safe-top) - var(--ui-safe-bottom))!important;
  aspect-ratio:1312 / 1199!important;
  overflow:hidden!important;
  margin:0!important;
}
.exact-shell-card .exact-shell-board{touch-action:manipulation!important;}
.exact-shell-card .puzzle-square{min-width:0!important;min-height:0!important;touch-action:manipulation!important;}
.exact-shell-card .exact-shell-close{min-width:36px!important;min-height:36px!important;touch-action:manipulation!important;}
.exact-shell-card .exact-shell-reset{touch-action:manipulation!important;}

/* ============================================================
   RESPONSIVE KNIGHT'S TOUR POPUP
   Fit to the shorter of width/height and keep the transparent panel.
   ============================================================ */
.knight-tour-modal{
  position:fixed!important;
  inset:0!important;
  width:100%!important;
  height:100dvh!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  padding:calc(6px + var(--ui-safe-top)) calc(6px + var(--ui-safe-right)) calc(6px + var(--ui-safe-bottom)) calc(6px + var(--ui-safe-left))!important;
  overflow:hidden!important;
  background:transparent!important;
}
.knight-tour-modal.hidden{display:none!important;}
.knight-tour-card{
  position:relative!important;
  flex:0 0 auto!important;
  width:min(96vw,1040px,calc((100dvh - 12px - var(--ui-safe-top) - var(--ui-safe-bottom)) * 1.3333333))!important;
  height:auto!important;
  max-width:calc(100vw - 12px - var(--ui-safe-left) - var(--ui-safe-right))!important;
  max-height:calc(100dvh - 12px - var(--ui-safe-top) - var(--ui-safe-bottom))!important;
  aspect-ratio:4 / 3!important;
  overflow:hidden!important;
  margin:0!important;
}
.knight-tour-board,.knight-tour-square{touch-action:manipulation!important;}
.knight-tour-close{min-width:36px!important;min-height:36px!important;touch-action:manipulation!important;}

/* Small portrait phones: make controls easy to touch without changing artwork alignment. */
@media (max-width:430px) and (orientation:portrait){
  .vintage-puzzle-card.exact-shell-card{width:min(98vw,calc((100dvh - 16px) * 1.0942452))!important;}
  .knight-tour-card{width:min(98vw,calc((100dvh - 16px) * 1.3333333))!important;}
  .next-room-hotspot{width:42px!important;height:42px!important;min-width:42px!important;min-height:42px!important;}
  .knight-tour-hotspot{width:44px!important;height:44px!important;min-width:44px!important;min-height:44px!important;}
}

/* Short landscape phones: height is the limiting dimension. */
@media (max-height:500px) and (orientation:landscape){
  .room-help{max-width:62vw!important;font-size:8px!important;padding:4px 6px!important;}
  .panel-toggle{min-height:38px!important;padding:5px 8px!important;}
  .side-panel{top:calc(4px + var(--ui-safe-top))!important;bottom:calc(4px + var(--ui-safe-bottom))!important;max-height:calc(100dvh - 8px - var(--ui-safe-top) - var(--ui-safe-bottom))!important;}
  .vintage-puzzle-card.exact-shell-card{width:calc((100dvh - 8px - var(--ui-safe-top) - var(--ui-safe-bottom)) * 1.0942452)!important;}
  .knight-tour-card{width:calc((100dvh - 8px - var(--ui-safe-top) - var(--ui-safe-bottom)) * 1.3333333)!important;}
  .player{transform:translate(-50%,-100%) scale(.62)!important;transform-origin:50% 100%!important;}
}

/* Tablets / iPad: preserve usable controls and popup scale. */
@media (min-width:601px) and (max-width:1100px){
  .player{transform:translate(-50%,-100%) scale(.88)!important;transform-origin:50% 100%!important;}
  .room-help{font-size:11px!important;}
  .panel-toggle{font-size:13px!important;}
}

@media (prefers-reduced-motion:reduce){
  .side-panel{transition:none!important;}
  .player.walking .avatar{animation:none!important;}
}

/* ============================================================
   v145 — iPhone / iPad / tablet touch-control upgrade
   ============================================================ */
html,body{
  overscroll-behavior:none!important;
  -webkit-overflow-scrolling:auto!important;
}
.stage,.scene,.panorama-view{
  touch-action:none!important;
  -webkit-user-select:none!important;
  user-select:none!important;
  -webkit-touch-callout:none!important;
  -webkit-tap-highlight-color:transparent!important;
}

/* Keep visible artwork size unchanged while giving fingers a larger invisible target. */
@media (pointer:coarse){
  body[data-room-id] .puzzle-number-hit{
    min-width:44px!important;
    min-height:44px!important;
    width:44px!important;
    height:44px!important;
    touch-action:manipulation!important;
  }
  .next-room-hotspot{
    min-width:48px!important;
    min-height:48px!important;
    width:48px!important;
    height:48px!important;
    touch-action:manipulation!important;
  }
  .knight-tour-hotspot{
    min-width:48px!important;
    min-height:48px!important;
    width:48px!important;
    height:48px!important;
    touch-action:manipulation!important;
  }
  .panel-toggle,.panel-close,
  .primary-button,.secondary-button,
  #chatSend,#pmSend,#announceSend,#announceClear,#clearChat,
  .puzzle-close,.vintage-action,.knight-tour-close,.knight-tour-reset{
    min-height:44px!important;
    min-width:44px!important;
    touch-action:manipulation!important;
  }
}

/* iPhone portrait: controls remain reachable around the notch/home indicator. */
@media (max-width:480px) and (orientation:portrait){
  .panel-toggle{
    top:calc(8px + env(safe-area-inset-top,0px))!important;
    right:calc(8px + env(safe-area-inset-right,0px))!important;
  }
  .room-help{
    left:calc(6px + env(safe-area-inset-left,0px))!important;
    bottom:calc(6px + env(safe-area-inset-bottom,0px))!important;
    max-width:calc(100vw - 20px - env(safe-area-inset-left,0px) - env(safe-area-inset-right,0px))!important;
  }
}

/* Landscape iPhone: protect the play area from notch/home-indicator overlap. */
@media (max-height:500px) and (orientation:landscape){
  .panel-toggle{
    top:calc(5px + env(safe-area-inset-top,0px))!important;
    right:calc(6px + env(safe-area-inset-right,0px))!important;
  }
  .room-help{
    left:calc(6px + env(safe-area-inset-left,0px))!important;
    bottom:calc(4px + env(safe-area-inset-bottom,0px))!important;
  }
}

/* ============================================================
   v146 — iPhone help-overlay fix
   The old white instruction panel could expand across Safari's viewport.
   On touch phones we remove it completely so it never covers the room or
   intercepts the visual play area. Tablets get a compact dark hint only.
   ============================================================ */
@media (pointer:coarse) and (max-width:700px){
  .room-help{
    display:none!important;
    visibility:hidden!important;
    width:0!important;
    height:0!important;
    max-width:0!important;
    max-height:0!important;
    padding:0!important;
    margin:0!important;
    border:0!important;
    background:transparent!important;
    box-shadow:none!important;
    opacity:0!important;
    overflow:hidden!important;
    pointer-events:none!important;
  }
}

/* Larger touch tablets keep the hint, but it can never become a screen-sized white layer. */
@media (pointer:coarse) and (min-width:701px) and (max-width:1100px){
  .room-help{
    display:block!important;
    position:fixed!important;
    left:calc(8px + var(--ui-safe-left))!important;
    top:calc(8px + var(--ui-safe-top))!important;
    right:auto!important;
    bottom:auto!important;
    width:max-content!important;
    height:auto!important;
    max-width:min(58vw,560px)!important;
    padding:5px 8px!important;
    margin:0!important;
    border:1px solid rgba(255,255,255,.18)!important;
    border-radius:8px!important;
    background:rgba(18,14,10,.66)!important;
    color:#fff8e8!important;
    box-shadow:none!important;
    font:700 10px/1.25 Arial,sans-serif!important;
    white-space:normal!important;
    overflow:visible!important;
    opacity:1!important;
    pointer-events:none!important;
  }
}

/* ============================================================
   v147 — Desktop admin/control dock restoration
   Desktop/notebook: keep the controls permanently visible on the
   right, Conference Room style. Phone/tablet retain the v145/v146
   slide-out touch drawer.
   ============================================================ */
@media (min-width:1101px){
  :root{--desktop-dock-width:340px;}

  html,body{
    width:100%!important;
    height:100%!important;
    overflow:hidden!important;
  }

  .app-shell{
    display:block!important;
    width:100vw!important;
    height:100dvh!important;
  }

  .room-column{
    position:fixed!important;
    left:0!important;
    top:0!important;
    right:var(--desktop-dock-width)!important;
    bottom:0!important;
    width:auto!important;
    height:100dvh!important;
    min-width:0!important;
  }

  .stage-wrap,.stage{
    width:100%!important;
    max-width:none!important;
    height:100%!important;
  }

  .side-panel:not(.hidden){
    display:block!important;
    position:fixed!important;
    top:0!important;
    right:0!important;
    bottom:0!important;
    left:auto!important;
    width:var(--desktop-dock-width)!important;
    height:100dvh!important;
    max-height:none!important;
    padding:16px 16px 24px!important;
    border:0!important;
    border-left:3px solid #4d2a0d!important;
    border-radius:0!important;
    overflow-y:auto!important;
    overscroll-behavior:contain!important;
    transform:none!important;
    opacity:1!important;
    visibility:visible!important;
    pointer-events:auto!important;
    transition:none!important;
    z-index:900!important;
  }

  .panel-toggle,.panel-close{
    display:none!important;
  }

  .side-panel .panel-section:first-of-type{
    padding-top:2px!important;
  }

  .admin-panel:not(.hidden){
    display:block!important;
  }
}

/* ============================================================
   v148 — Desktop collapsible Controls/Admin dropdown
   Desktop/notebook now behaves like the requested pull-down panel:
   room stays full-screen; Controls button opens/closes Room Controls
   and Admin Controls together. Mobile/tablet behavior is unchanged.
   ============================================================ */
@media (min-width:1101px){
  html,body{
    width:100%!important;
    height:100%!important;
    overflow:hidden!important;
  }

  .app-shell{
    display:block!important;
    width:100vw!important;
    height:100dvh!important;
  }

  .room-column{
    position:fixed!important;
    inset:0!important;
    width:100vw!important;
    height:100dvh!important;
  }

  .stage-wrap,.stage{
    width:100%!important;
    max-width:none!important;
    height:100%!important;
  }

  .panel-toggle:not(.hidden){
    display:block!important;
    position:fixed!important;
    top:calc(12px + var(--safe-top))!important;
    right:calc(14px + var(--safe-right))!important;
    z-index:1250!important;
  }

  .side-panel:not(.hidden){
    display:block!important;
    position:fixed!important;
    top:calc(58px + var(--safe-top))!important;
    right:calc(14px + var(--safe-right))!important;
    bottom:auto!important;
    left:auto!important;
    width:min(370px,calc(100vw - 28px - var(--safe-left) - var(--safe-right)))!important;
    height:auto!important;
    max-height:calc(100dvh - 76px - var(--safe-top) - var(--safe-bottom))!important;
    padding:44px 16px 18px!important;
    border:3px solid #4d2a0d!important;
    border-radius:14px!important;
    overflow-y:auto!important;
    overscroll-behavior:contain!important;
    transform:translateY(calc(-100% - 100px))!important;
    opacity:0!important;
    visibility:hidden!important;
    pointer-events:none!important;
    transition:transform .22s ease,opacity .18s ease,visibility 0s linear .22s!important;
    z-index:1200!important;
  }

  .side-panel:not(.hidden).mobile-open{
    transform:translateY(0)!important;
    opacity:1!important;
    visibility:visible!important;
    pointer-events:auto!important;
    transition:transform .22s ease,opacity .18s ease!important;
  }

  .panel-close{
    display:grid!important;
    place-items:center!important;
    position:absolute!important;
    top:9px!important;
    right:10px!important;
    width:34px!important;
    height:34px!important;
    z-index:2!important;
  }

  .admin-panel:not(.hidden){
    display:block!important;
  }
}


/* ============================================================
   V150 — Room 1 Knight Tour medallion + motion performance
   ============================================================ */
.knight-tour-hotspot{
  width:48px!important;
  height:48px!important;
  min-width:48px!important;
  min-height:48px!important;
  padding:0!important;
  border-radius:50%!important;
  border:2px solid #5c3814!important;
  background:
    radial-gradient(circle at 37% 30%,rgba(255,232,159,.95) 0 9%,rgba(218,166,72,.95) 22%,rgba(151,96,31,.98) 51%,rgba(80,44,14,1) 72%,rgba(194,137,52,.98) 82%,rgba(74,40,13,1) 100%)!important;
  box-shadow:
    inset 0 0 0 2px rgba(247,210,124,.72),
    inset 0 0 0 5px rgba(84,47,16,.70),
    0 2px 4px rgba(0,0,0,.28)!important;
  filter:none!important;
  overflow:hidden!important;
  transform:translate(-50%,-50%)!important;
  cursor:pointer!important;
  -webkit-tap-highlight-color:transparent!important;
  touch-action:manipulation!important;
}
.knight-tour-hotspot::before{
  content:'♞'!important;
  display:grid!important;
  place-items:center!important;
  position:absolute!important;
  inset:5px!important;
  border-radius:50%!important;
  color:#2d1808!important;
  font:700 31px/1 Georgia,'Times New Roman',serif!important;
  text-shadow:0 1px 0 rgba(255,224,151,.55)!important;
  background:radial-gradient(circle,rgba(238,190,93,.36),rgba(111,61,20,.12))!important;
  border:1px solid rgba(78,42,13,.52)!important;
  box-shadow:none!important;
}
.knight-tour-hotspot::after{content:none!important;display:none!important;}
.knight-tour-hotspot:focus-visible{outline:3px solid #fff1b7!important;outline-offset:3px!important;}

/* Keep animation work on compositor-friendly layers and remove decorative
   effects while walking that can trigger extra paint on mobile Safari. */
.player{will-change:left,top,transform!important;backface-visibility:hidden;-webkit-backface-visibility:hidden;}
.player.walking .avatar{animation:bob .24s infinite alternate ease-in-out!important;will-change:transform!important;}
.panorama-view{contain:strict!important;}

@media (pointer:coarse){
  .knight-tour-hotspot{
    width:52px!important;height:52px!important;min-width:52px!important;min-height:52px!important;
  }
  .knight-tour-hotspot::before{font-size:33px!important;}
}
@media (max-width:480px){
  .knight-tour-hotspot{
    width:48px!important;height:48px!important;min-width:48px!important;min-height:48px!important;
  }
  .knight-tour-hotspot::before{font-size:30px!important;}
}


/* v151 iPhone free-swipe panorama tuning */
html,body{overscroll-behavior-x:none!important;}
.stage,.panorama-view{touch-action:none!important;-webkit-user-select:none!important;user-select:none!important;}
@media (pointer:coarse){
  .stage{-webkit-tap-highlight-color:transparent!important;}
}


/* ============================================================
   V156 — Room 1 vintage Knight's Tour trigger
   Only changes the single Knight Tour trigger artwork.
   ============================================================ */
body[data-room-id="1"] .knight-tour-hotspot{
  width:48px!important;
  height:48px!important;
  min-width:48px!important;
  min-height:48px!important;
  padding:0!important;
  border:0!important;
  border-radius:0!important;
  background:transparent url('knight-trigger.webp?v=184.0.0') center/contain no-repeat!important;
  box-shadow:none!important;
  filter:drop-shadow(0 2px 2px rgba(0,0,0,.28))!important;
  overflow:visible!important;
  transform:translate(-50%,-50%)!important;
}
body[data-room-id="1"] .knight-tour-hotspot::before,
body[data-room-id="1"] .knight-tour-hotspot::after{
  content:none!important;
  display:none!important;
}
@media (pointer:coarse){
  body[data-room-id="1"] .knight-tour-hotspot{
    width:52px!important;height:52px!important;min-width:52px!important;min-height:52px!important;
  }
}
@media (max-width:480px){
  body[data-room-id="1"] .knight-tour-hotspot{
    width:48px!important;height:48px!important;min-width:48px!important;min-height:48px!important;
  }
}

/* ============================================================
   V175 — single clean Eight Queens implementation.
   One popup artwork, one live status line, no duplicate labels/images.
   ============================================================ */
body[data-room-id="1"] .eight-queens-hotspot{
  position:absolute!important;
  width:48px!important;height:48px!important;min-width:48px!important;min-height:48px!important;
  padding:0!important;border:0!important;border-radius:0!important;
  background:transparent url('queen-trigger.webp?v=184.0.0') center/contain no-repeat!important;
  box-shadow:none!important;filter:drop-shadow(0 2px 2px rgba(0,0,0,.28))!important;
  transform:translate(-50%,-50%)!important;overflow:visible!important;z-index:262!important;
  cursor:pointer!important;touch-action:manipulation!important;-webkit-tap-highlight-color:transparent!important;
  pointer-events:auto!important;
}
body[data-room-id="1"] .eight-queens-hotspot::before,
body[data-room-id="1"] .eight-queens-hotspot::after{content:none!important;display:none!important;}
body[data-room-id="1"] .eight-queens-hotspot:focus-visible{outline:3px solid #fff1b7!important;outline-offset:3px!important;}

body[data-room-id="1"] .eight-queens-modal{
  position:fixed!important;inset:0!important;z-index:52000!important;
  display:flex!important;align-items:center!important;justify-content:center!important;
  padding:6px!important;overflow:hidden!important;background:transparent!important;
  backdrop-filter:none!important;-webkit-backdrop-filter:none!important;pointer-events:auto!important;
}
body[data-room-id="1"] .eight-queens-modal.hidden{display:none!important;}
body[data-room-id="1"] .eight-queens-card{
  position:relative!important;
  width:min(980px,96vw,calc(96dvh * 4 / 3))!important;
  aspect-ratio:4/3!important;max-height:96dvh!important;
  overflow:visible!important;padding:0!important;border:0!important;border-radius:0!important;
  background:transparent url('eight-queens-popup.webp?v=184.0.0') center/100% 100% no-repeat!important;
  box-shadow:none!important;clip-path:none!important;color:#2b1708!important;
}
body[data-room-id="1"] .eight-queens-card::before,
body[data-room-id="1"] .eight-queens-card::after,
body[data-room-id="1"] .eight-queens-heading,
body[data-room-id="1"] .eight-queens-emblem{display:none!important;content:none!important;}
body[data-room-id="1"] .eight-queens-close{
  position:absolute!important;left:80.3%!important;top:7.1%!important;width:8.8%!important;height:auto!important;aspect-ratio:1!important;
  z-index:40!important;border:0!important;background:transparent!important;color:transparent!important;box-shadow:none!important;
  font-size:0!important;padding:0!important;margin:0!important;cursor:pointer!important;touch-action:manipulation!important;
}
body[data-room-id="1"] .eight-queens-board{
  position:absolute!important;
  left:29.558%!important;top:29.374%!important;width:40.401%!important;height:50.552%!important;
  z-index:25!important;margin:0!important;padding:0!important;border:0!important;box-shadow:none!important;
  background:transparent!important;background-image:none!important;
  display:grid!important;grid-template-columns:repeat(8,1fr)!important;grid-template-rows:repeat(8,1fr)!important;
  overflow:visible!important;touch-action:manipulation!important;pointer-events:auto!important;
}
body[data-room-id="1"] .eight-queens-square,
body[data-room-id="1"] .eight-queens-square.light,
body[data-room-id="1"] .eight-queens-square.dark,
body[data-room-id="1"] .eight-queens-square.occupied,
body[data-room-id="1"] .eight-queens-square.conflict{
  position:relative!important;display:grid!important;place-items:center!important;
  background:transparent!important;background-image:none!important;border:0!important;box-shadow:none!important;outline:0!important;
  padding:0!important;min-width:0!important;min-height:0!important;overflow:visible!important;
  cursor:pointer!important;touch-action:manipulation!important;-webkit-tap-highlight-color:transparent!important;
}
body[data-room-id="1"] .eight-queens-square:hover{background:rgba(255,225,145,.08)!important;}
body[data-room-id="1"] .eight-queens-square:focus-visible{outline:2px solid rgba(255,216,111,.82)!important;outline-offset:-3px!important;}
body[data-room-id="1"] .eight-queens-piece{
  position:absolute!important;left:50%!important;top:50%!important;
  width:68%!important;height:68%!important;display:block!important;margin:0!important;padding:0!important;
  pointer-events:none!important;transform:translate(-50%,-50%)!important;transform-origin:center center!important;
  background:transparent url('eight-queen-piece.webp?v=184.0.0') center/contain no-repeat!important;
  image-rendering:auto!important;
}
body[data-room-id="1"] .eight-queens-piece.conflict-piece{
  filter:hue-rotate(-18deg) saturate(1.2) brightness(.95)!important;
}
body[data-room-id="1"] .eight-queens-status{
  position:absolute!important;left:29.0%!important;top:85.55%!important;width:42%!important;z-index:35!important;
  min-height:0!important;margin:0!important;padding:0!important;
  background:transparent!important;background-color:transparent!important;border:0!important;border-radius:0!important;box-shadow:none!important;
  color:#2b1708!important;text-align:center!important;
  font:700 clamp(10px,1.08vw,13px)/1.08 Georgia,'Times New Roman',serif!important;
  white-space:nowrap!important;pointer-events:none!important;
}
body[data-room-id="1"] .eight-queens-status:empty{display:none!important;}
body[data-room-id="1"] .eight-queens-status.wrong{color:#7d1f16!important;}
body[data-room-id="1"] .eight-queens-status.solved{color:#1e5b28!important;}
body[data-room-id="1"] .eight-queens-reset{
  position:absolute!important;left:39.1%!important;top:88.0%!important;width:19.5%!important;height:7.2%!important;
  z-index:40!important;border:0!important;background:transparent!important;color:transparent!important;box-shadow:none!important;
  font-size:0!important;padding:0!important;margin:0!important;cursor:pointer!important;touch-action:manipulation!important;
}
body.eight-queens-open .stage{pointer-events:none!important;}
body.eight-queens-open .eight-queens-modal,
body.eight-queens-open .eight-queens-modal *{pointer-events:auto!important;}
@media(pointer:coarse){
  body[data-room-id="1"] .eight-queens-hotspot{width:52px!important;height:52px!important;min-width:52px!important;min-height:52px!important;}
}
@media(max-width:700px){
  body[data-room-id="1"] .eight-queens-card{width:min(99vw,calc(96dvh * 4 / 3))!important;}
  body[data-room-id="1"] .eight-queens-status{font-size:clamp(7px,1.75vw,10px)!important;}
}
@media(max-width:480px){
  body[data-room-id="1"] .eight-queens-hotspot{width:48px!important;height:48px!important;min-width:48px!important;min-height:48px!important;}
}


/* ============================================================
   V181 — exact Knight Tour board calibration + centered piece.
   Uses the same approach that fixed the Eight Queens board:
   exact live-grid bounds, a tightly-cropped piece asset, and
   absolute 50%/50% centering inside each square.
   ============================================================ */
body[data-room-id="1"] .knight-tour-board{
  position:absolute!important;
  left:29.213%!important;
  top:26.151%!important;
  width:41.575%!important;
  height:53.499%!important;
  aspect-ratio:auto!important;
  margin:0!important;
  padding:0!important;
  border:0!important;
  box-shadow:none!important;
  background:transparent!important;
  display:grid!important;
  grid-template-columns:repeat(8,1fr)!important;
  grid-template-rows:repeat(8,1fr)!important;
  overflow:visible!important;
  touch-action:manipulation!important;
}
body[data-room-id="1"] .knight-tour-square{
  position:relative!important;
  display:grid!important;
  place-items:center!important;
  min-width:0!important;
  min-height:0!important;
  padding:0!important;
  border:0!important;
  background:transparent!important;
  overflow:visible!important;
}
body[data-room-id="1"] .knight-tour-square .knight-tour-piece,
body[data-room-id="1"] .knight-tour-square.current .knight-tour-piece{
  position:absolute!important;
  left:50%!important;
  top:50%!important;
  width:68%!important;
  height:68%!important;
  margin:0!important;
  padding:0!important;
  display:block!important;
  font-size:0!important;
  line-height:0!important;
  color:transparent!important;
  text-shadow:none!important;
  -webkit-text-stroke:0!important;
  transform:translate(-50%,-50%)!important;
  transform-origin:center center!important;
  background:transparent url('knight-tour-piece.webp?v=184.0.0') center/contain no-repeat!important;
  filter:none!important;
  pointer-events:none!important;
}
@media(max-width:700px){
  body[data-room-id="1"] .knight-tour-square .knight-tour-piece,
  body[data-room-id="1"] .knight-tour-square.current .knight-tour-piece{
    width:68%!important;
    height:68%!important;
  }
}


/* ============================================================
   V182 — Knight Tour current-square highlight removed.
   Keep the knight centered with no yellow box around the active square.
   ============================================================ */
body[data-room-id="1"] .knight-tour-square.current{
  box-shadow:none!important;
  background:transparent!important;
  outline:none!important;
}
body[data-room-id="1"] .knight-tour-square:focus,
body[data-room-id="1"] .knight-tour-square:focus-visible{
  outline:none!important;
  box-shadow:none!important;
}


/* v185: exact visual centering for all standard chess-problem pieces.
   Use a tightly centered sprite instead of font glyph metrics. */
.exact-shell-card .puzzle-square{
  position:relative!important;
  overflow:visible!important;
}
.exact-shell-card .puzzle-piece{
  position:absolute!important;
  inset:auto!important;
  left:50%!important;
  top:50%!important;
  right:auto!important;
  bottom:auto!important;
  width:112%!important;
  height:112%!important;
  margin:0!important;
  padding:0!important;
  transform:translate(-50%,-50%)!important;
  display:block!important;
  background-image:url('chess-problem-pieces-v186.webp?v=186.0.0')!important;
  background-repeat:no-repeat!important;
  background-size:300% 100%!important;
  color:transparent!important;
  text-shadow:none!important;
  filter:drop-shadow(0 2px 1px rgba(0,0,0,.38))!important;
  box-sizing:border-box!important;
  cursor:grab!important;
}
.exact-shell-card .puzzle-piece.piece-wk{background-position:0% 50%!important;}
.exact-shell-card .puzzle-piece.piece-wq{background-position:50% 50%!important;}
.exact-shell-card .puzzle-piece.piece-bk{background-position:100% 50%!important;}
@media(max-width:700px){
  .exact-shell-card .puzzle-piece{width:108%!important;height:108%!important;}
}

/* ============================================================
   v189 — exact vertical alignment for standard chess-problem board.
   The live 8x8 interaction grid now matches the printed board artwork
   from y=323 through y=1012, so piece centers land at the visual center
   of every printed square (same calibration method used for Queen/Knight).
   ============================================================ */
.exact-shell-card .exact-shell-board{
  left:24.18%!important;
  top:26.94%!important;
  width:52.55%!important;
  aspect-ratio:1/1!important;
}

/* v200: M-navigation medal matches the ordinary gold chess medallion. */
body[data-room-id] a#nextRoomHotspot.next-room-hotspot{
  box-sizing:border-box!important; width:34px!important;height:34px!important;
  min-width:34px!important;min-height:34px!important;
  padding:0!important;border:2px solid #6b4318!important;border-radius:50%!important;
  background:radial-gradient(circle at 35% 30%,#ffe7a0 0,#dbad4d 42%,#8c571c 100%)!important;
  box-shadow:0 2px 7px rgba(0,0,0,.42),inset 0 0 0 2px rgba(255,238,177,.45)!important;
  transform:translate(-50%,-50%)!important;z-index:150!important;
  display:flex!important;align-items:center!important;justify-content:center!important;cursor:pointer!important;
  filter:none!important;opacity:1!important;touch-action:manipulation!important;
}
body[data-room-id] .next-room-hotspot .exit-star{
  display:block!important;position:static!important;transform:none!important;
  animation:none!important;color:#251305!important;-webkit-text-stroke:0!important;
  font:900 19px/1 Georgia,serif!important;text-shadow:0 1px 0 rgba(255,255,255,.4)!important;
}
body[data-room-id] .next-room-hotspot .exit-text{display:none!important}
@media(pointer:coarse){
 body[data-room-id] a#nextRoomHotspot.next-room-hotspot{width:44px!important;height:44px!important;min-width:44px!important;min-height:44px!important}
 body[data-room-id] .next-room-hotspot .exit-star{font-size:19px!important}
}
/* V400 visual layout, using EscapeRoomBig's native panorama camera for functionality. */
.room-zoom-controls{display:grid;gap:8px;margin-top:10px}
.room-zoom-pair{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
.room-zoom-controls .secondary-button{min-height:44px;width:100%;touch-action:manipulation;-webkit-tap-highlight-color:transparent}
.room-zoom-status{text-align:center;font-size:12px;opacity:.8;margin-top:5px}

/* V202: painted coins are the visible medallions: exact transparent hotspots only. */
body[data-room-id] .puzzle-number-hit{background:transparent!important;border:0!important;box-shadow:none!important;color:transparent!important;text-shadow:none!important;}
body[data-room-id] .puzzle-number-hit:hover,body[data-room-id] .puzzle-number-hit:active{background:rgba(255,214,62,.10)!important;}
body[data-room-id] .puzzle-number-hit:focus-visible{outline:3px solid #ffd66e!important;}

/* V203: full room image visible at original display; no covering of medallion taps. */
body[data-room-id] .puzzle-hotspots{pointer-events:none!important;z-index:850!important;}
body[data-room-id] .puzzle-number-hit{pointer-events:auto!important;z-index:851!important;touch-action:manipulation!important;}
body[data-room-id] .puzzle-modal:not(.hidden){z-index:10000!important;}

/* V206 responsive room rendering adapted from V400 mobile strategy.
   The actual room bitmap stays visible behind canvas, never black. */
html,body,.app-shell,.room-column,.stage-wrap,.stage,.scene{background-color:#42352a!important;}
.panorama-view{background:transparent!important;}
.room-bg{visibility:visible!important;object-fit:cover!important;z-index:0!important;}
.panorama-view{z-index:2!important;}
@media (max-width:1180px), (pointer:coarse){
 html,body,.app-shell,.room-column,.stage-wrap,.stage,.scene{height:100dvh!important;min-height:100svh!important;}
 .scene{inset:0!important;}
 body[data-room-id] .puzzle-number-hit{min-width:44px!important;min-height:44px!important;touch-action:manipulation!important;pointer-events:auto!important;}
 .panel-toggle{top:max(8px,env(safe-area-inset-top,0px))!important;right:max(8px,env(safe-area-inset-right,0px))!important;}
 .room-help{bottom:max(7px,env(safe-area-inset-bottom,0px))!important;}
}

/* V207: never allow the former instructions panel to obscure the game. */
.room-help {display:none!important;visibility:hidden!important;pointer-events:none!important;}

/* V208: The upper M is already painted onto the panorama.
   Only a transparent clickable hotspot should occupy that location;
   no additional visible medallion should be drawn on the floor. */
body[data-room-id] #nextRoomHotspot.next-room-hotspot {
 background:transparent!important; box-shadow:none!important; border:0!important;
 filter:none!important; opacity:1!important; padding:0!important;
 width:40px!important; height:40px!important; min-width:40px!important; min-height:40px!important;
 z-index:900!important; pointer-events:auto!important; touch-action:manipulation!important;
}
body[data-room-id] #nextRoomHotspot .exit-star,
body[data-room-id] #nextRoomHotspot .exit-text {display:none!important;visibility:hidden!important;}
body[data-room-id] #nextRoomHotspot:focus-visible {outline:3px solid #ffe188!important;outline-offset:2px!important;}

/* V209: ensure hit targets sit ABOVE the panorama canvas, never underneath it. */
body[data-room-id] .puzzle-hotspots {position:absolute!important; inset:0!important; z-index:995!important; pointer-events:none!important; overflow:visible!important;}
body[data-room-id] .puzzle-hotspots .puzzle-number-hit:not([hidden]) {position:absolute!important; display:block!important; z-index:996!important; pointer-events:auto!important; touch-action:manipulation!important; transform:translate(-50%,-50%)!important; border:0!important; background:transparent!important;}
body[data-room-id] #nextRoomHotspot {z-index:1002!important; pointer-events:auto!important; touch-action:manipulation!important;}
body[data-room-id] .panorama-view {z-index:2!important;}

/* V210: iOS/Android gestures: canvas is not a native scrolling surface. */
body[data-room-id] .stage,body[data-room-id] .scene,body[data-room-id] .panorama-view {touch-action:none!important;overscroll-behavior:contain!important;}
body[data-room-id] .puzzle-hotspots {pointer-events:none!important;}
body[data-room-id] .puzzle-number-hit:not([hidden]) {pointer-events:auto!important;touch-action:manipulation!important;}

/* V212: consistent hit testing; room medallions remain click-through only at their buttons. */
body[data-room-id] .puzzle-hotspots{position:absolute!important;inset:0!important;z-index:995!important;pointer-events:none!important;}
body[data-room-id] .puzzle-hotspots button.puzzle-number-hit:not([hidden]){pointer-events:auto!important;z-index:996!important;}
body[data-room-id] #nextRoomHotspot{pointer-events:auto!important;z-index:1002!important;}
body[data-room-id] .stage,body[data-room-id] .panorama-view{touch-action:none!important;}

/* V215: dedicated native anchor hotspot over the artwork M. */
body[data-room-id] a#nextRoomHotspot.next-room-hotspot {
  display:block!important;position:absolute!important;box-sizing:border-box!important;
  width:64px!important;height:64px!important;min-width:64px!important;min-height:64px!important;
  padding:0!important;margin:0!important;transform:translate(-50%,-50%)!important;
  border:0!important;background:transparent!important;box-shadow:none!important;
  opacity:1!important;visibility:visible!important;pointer-events:auto!important;
  z-index:3000!important;touch-action:manipulation!important;cursor:pointer!important;
  -webkit-tap-highlight-color:rgba(255,218,90,.25)!important;
}
body[data-room-id] a#nextRoomHotspot .exit-star,
body[data-room-id] a#nextRoomHotspot .exit-text{display:none!important;}
@media(max-width:640px){body[data-room-id] a#nextRoomHotspot.next-room-hotspot{width:72px!important;height:72px!important;min-width:72px!important;min-height:72px!important;}}

/* V217 corrected painted medallion hotspot and native navigation fallback */
body[data-room-id] a#nextRoomHotspot.next-room-hotspot{
 width:112px!important;height:104px!important;min-width:112px!important;min-height:104px!important;
 z-index:5000!important;pointer-events:auto!important;
}
body[data-room-id] a#nextRoomHotspot:focus-visible,body[data-room-id] a#nextRoomHotspot:hover{outline:2px solid rgba(255,216,100,.7)!important;border-radius:50%!important;}
a.v217-room-next-fallback{position:fixed;right:86px;top:10px;z-index:99999;display:inline-flex;align-items:center;justify-content:center;min-height:38px;padding:4px 12px;border-radius:6px;border:1px solid #d3a962;background:#604018;color:#fff7db;font:bold 13px Arial,sans-serif;text-decoration:none;touch-action:manipulation;}
a.v217-room-next-fallback:hover,a.v217-room-next-fallback:focus{background:#8b601e;}
@media(max-width:650px){a.v217-room-next-fallback{right:76px;top:8px;min-height:34px;font-size:11px;padding:3px 6px;}body[data-room-id] a#nextRoomHotspot.next-room-hotspot{width:100px!important;height:94px!important;min-width:100px!important;min-height:94px!important;}}

/* V219 - the painting's gold M is the ONLY next-room control.
   The canvas camera sets left/top in pixels on every pan/zoom. */
a.v217-room-next-fallback{display:none!important;pointer-events:none!important}
body[data-room-id] a#nextRoomHotspot.next-room-hotspot{
  position:absolute!important;right:auto!important;bottom:auto!important;
  width:76px!important;height:76px!important;min-width:76px!important;min-height:76px!important;
  padding:0!important;margin:0!important;transform:translate(-50%,-50%)!important;
  background:transparent!important;border:0!important;box-shadow:none!important;
  opacity:1!important;visibility:visible!important;pointer-events:auto!important;
  z-index:5000!important;touch-action:manipulation!important;cursor:pointer!important;
}
body[data-room-id] a#nextRoomHotspot .exit-star,body[data-room-id] a#nextRoomHotspot .exit-text{display:none!important}
@media(max-width:650px){body[data-room-id] a#nextRoomHotspot.next-room-hotspot{width:76px!important;height:76px!important;min-width:76px!important;min-height:76px!important}}


/* V220: only the printed BIG M in the room image is used for next-room navigation.
   The overlay hotspot is invisible and sits directly on the top M, not on the floor. */
body[data-room-id] a#nextRoomHotspot.next-room-hotspot{
  position:absolute!important;
  width:104px!important;
  height:84px!important;
  min-width:104px!important;
  min-height:84px!important;
  padding:0!important;
  margin:0!important;
  border:0!important;
  border-radius:0!important;
  background:transparent!important;
  box-shadow:none!important;
  outline:0!important;
  overflow:visible!important;
  z-index:950!important;
  opacity:1!important;
  cursor:pointer!important;
  pointer-events:auto!important;
  touch-action:manipulation!important;
  transform:translate(-50%,-50%)!important;
  display:block!important;
}
body[data-room-id] a#nextRoomHotspot.next-room-hotspot::before,
body[data-room-id] a#nextRoomHotspot.next-room-hotspot::after,
body[data-room-id] a#nextRoomHotspot.next-room-hotspot .exit-star,
body[data-room-id] a#nextRoomHotspot.next-room-hotspot .exit-text{
  display:none!important;
  content:none!important;
}
@media (pointer:coarse), (max-width:700px){
  body[data-room-id] a#nextRoomHotspot.next-room-hotspot{
    width:118px!important;
    height:94px!important;
    min-width:118px!important;
    min-height:94px!important;
  }
}


/* V222 independent BIG M link. No historic .next-room-hotspot rules apply.
   The panorama update positions this node at the printed upper medallion. */
body[data-room-id] #bigMNavigation.big-m-only-link{
  position:absolute!important;
  display:block!important;
  width:66px!important;
  height:66px!important;
  min-width:66px!important;
  min-height:66px!important;
  box-sizing:border-box!important;
  transform:translate(-50%,-50%)!important;
  border:0!important;
  border-radius:50%!important;
  background:transparent!important;
  box-shadow:none!important;
  padding:0!important;
  outline:0!important;
  opacity:1!important;
  z-index:6000!important;
  cursor:pointer!important;
  pointer-events:auto!important;
  touch-action:manipulation!important;
  -webkit-tap-highlight-color:transparent!important;
}
body[data-room-id] #bigMNavigation.big-m-only-link:focus-visible{
  outline:3px solid #ffd66e!important;
}
@media(pointer:coarse){
 body[data-room-id] #bigMNavigation.big-m-only-link{
   width:76px!important;height:76px!important;min-width:76px!important;min-height:76px!important;
 }
}

/* V225: fixed top-level BIG M navigation link. No scene overlay or floor hitbox. */
body[data-room-id] a#bigMNavigation.big-m-only-link {
 position:fixed!important; z-index:9900!important; display:block!important;
 left:-1000px; top:-1000px; right:auto!important; bottom:auto!important;
 width:78px!important; height:78px!important; min-width:78px!important; min-height:78px!important;
 border:0!important; background:transparent!important; box-shadow:none!important;
 border-radius:50%!important; padding:0!important; opacity:1!important;
 transform:translate(-50%,-50%)!important; pointer-events:auto!important;
 cursor:pointer!important; touch-action:manipulation!important;
}
@media(pointer:coarse){body[data-room-id] a#bigMNavigation.big-m-only-link{width:88px!important;height:88px!important;min-width:88px!important;min-height:88px!important;}}


/* V227: Rooms 11–20 lacked a painted M in their panoramic artwork.
   Display the medallion inside the EXISTING working independent link.
   Link position and click behavior are unchanged; no floor hotspot. */
body[data-room-id] a#bigMNavigation .big-m-visible{
  position:absolute!important;left:50%!important;top:50%!important;
  transform:translate(-50%,-50%)!important;
  box-sizing:border-box!important;
  display:flex!important;align-items:center!important;justify-content:center!important;
  width:54px!important;height:54px!important;
  border:4px ridge #a46b20!important;border-radius:50%!important;
  background:radial-gradient(circle at 30% 22%,#fff3b5 0%,#e8ba53 38%,#a16719 75%,#6b3d0d 100%)!important;
  color:#38200d!important;font:bold 33px/1 Georgia,serif!important;
  text-shadow:0 1px 1px #fce7ae!important;
  box-shadow:0 3px 8px #0008,inset 0 0 0 2px #edcc7d!important;
  pointer-events:none!important;
}


/* V228: exact gold M medallion from Room 1, on existing working links in rooms 11–20. */
body[data-room-id] a#bigMNavigation .big-m-visible {
  background:transparent url("room1-big-m-medallion.png?v=228") center center / contain no-repeat!important;
  border:0!important;
  box-shadow:none!important;
  width:62px!important;
  height:62px!important;
  font-size:0!important;
  line-height:0!important;
  text-shadow:none!important;
  pointer-events:none!important;
}

/* V229: vintage panel asset supplied in the V400 reference ZIP. */
body .exact-shell-card{background-image:url('vintage-puzzle-panel-v400.webp')!important;background-size:100% 100%!important;}

/* V230: separate fixed puzzle layer, matched to the working M navigation architecture. */
body[data-room-id] #puzzleHotspots.puzzle-hotspots{position:fixed!important;inset:0!important;width:100vw!important;height:100vh!important;z-index:9750!important;pointer-events:none!important;overflow:visible!important;transform:none!important;contain:none!important;}
body[data-room-id] #puzzleHotspots button.puzzle-number-hit:not([hidden]){position:fixed!important;z-index:9751!important;pointer-events:auto!important;cursor:pointer!important;background:transparent!important;border:0!important;box-shadow:none!important;transform:translate(-50%,-50%)!important;touch-action:manipulation!important;}

/* V231: independent fixed screen-level puzzle targets, without scene clipping. */
body[data-room-id] > #puzzleHotspots.puzzle-hotspots {position:fixed!important;inset:0!important;z-index:9750!important;pointer-events:none!important;overflow:visible!important;contain:none!important;transform:none!important;}
body[data-room-id] > #puzzleHotspots.puzzle-hotspots > .puzzle-number-hit:not([hidden]) {position:fixed!important;pointer-events:auto!important;z-index:9751!important;cursor:pointer!important;touch-action:manipulation!important;}

/* V233: ensure chess modal appears ABOVE independent numbered hotspot layer. */
#chessPuzzleModal:not(.hidden){z-index:120000!important;pointer-events:auto!important;}
#chessPuzzleModal.hidden{display:none!important;}

/* V235 ensure modal remains above all instrumented targets */
body[data-room-id] #chessPuzzleModal:not(.hidden){z-index:250000!important;pointer-events:auto!important;}

/* V236: disable stale coins; the independent screen layer owns coin taps. */
body[data-room-id] #puzzleHotspots button.puzzle-number-hit{pointer-events:none!important;}
body[data-room-id] .puzzle-modal:not(.hidden){z-index:12000!important;}

/* V238: exact Room 1 coin targets; all other pixel areas remain click-through. */
#v236CoinLayer{position:fixed!important;inset:0!important;pointer-events:none!important;z-index:9900!important}
#v236CoinLayer button.v236-coin{pointer-events:auto!important;cursor:pointer!important;touch-action:manipulation!important;border-radius:50%!important;background:transparent!important;border:0!important;box-shadow:none!important}
#v236CoinLayer button.v236-coin:not(:focus-visible){outline:none!important}

/* V240: legacy coin buttons cannot be accidental targets in artwork. */
body[data-room-id] #puzzleHotspots,body[data-room-id] #puzzleHotspots *{pointer-events:none!important;}
#v240CoinLayer{position:fixed!important;inset:0!important;z-index:190000!important;pointer-events:none!important;}
#v240CoinLayer .v240-coin{position:fixed!important;transform:translate(-50%,-50%)!important;padding:0!important;margin:0!important;background:transparent!important;border:0!important;box-shadow:none!important;outline:0!important;border-radius:50%!important;pointer-events:auto!important;cursor:pointer!important;touch-action:manipulation!important;-webkit-tap-highlight-color:transparent!important;}
#v240CoinLayer .v240-coin:focus-visible{outline:2px solid #ffe475!important;}
#chessPuzzleModal:not(.hidden){z-index:300000!important;}

/* V241: remove abandoned HTML coin overlays; direct bitmap click test only. */
#v240CoinLayer, #v240CoinLayer *, #puzzleHotspots, #puzzleHotspots * {pointer-events:none!important;display:none!important;}
#chessPuzzleModal:not(.hidden){z-index:200000!important;pointer-events:auto!important;}

/* V242: Room 2 uses the same direct image-coordinate hit test as working Room 1. */
body[data-room-id="2"] .puzzle-hotspots, body[data-room-id="2"] .puzzle-number-hit { pointer-events:none!important; }

/* V255 chess popup calibration: align the live 8x8 grid with the real
   1312 x 1199 vintage board artwork, not with a differently cropped
   coordinate screenshot. The user-supplied 64 square rectangles define
   ordering and centers; coordinates are mapped to this artwork's grid.
   Artwork board edges: x=318..1008, y=323..1012 (source pixels).
   Keep the 8x8 click targets and sprites concentric at every viewport. */
body .vintage-puzzle-card.exact-shell-card .exact-shell-board {
  left:24.2378%!important;
  top:26.9391%!important;
  width:52.5915%!important;
  height:auto!important;
  aspect-ratio:1/1!important;
  padding:0!important;
  margin:0!important;
  transform:none!important;
}
body .vintage-puzzle-card.exact-shell-card .puzzle-board {
  display:grid!important;
  grid-template-columns:repeat(8,minmax(0,1fr))!important;
  grid-template-rows:repeat(8,minmax(0,1fr))!important;
  width:100%!important;
  height:100%!important;
  aspect-ratio:1/1!important;
  border:0!important;
  padding:0!important;
  margin:0!important;
}
body .vintage-puzzle-card.exact-shell-card .puzzle-square {
  box-sizing:border-box!important;
  position:relative!important;
  width:100%!important;
  height:100%!important;
  padding:0!important;
  margin:0!important;
  overflow:visible!important;
}
body .vintage-puzzle-card.exact-shell-card .puzzle-piece {
  position:absolute!important;
  left:50%!important;
  top:50%!important;
  right:auto!important;
  bottom:auto!important;
  inset:auto!important;
  transform:translate(-50%,-50%)!important;
  width:88%!important;
  height:88%!important;
  padding:0!important;
  margin:0!important;
  box-sizing:border-box!important;
  background-size:300% 100%!important;
  pointer-events:none!important;
}

/* V256: user-supplied 64 dot centers drive all board square hit areas.
   Each square is positioned by data from the pixel coordinate table,
   normalized to the V255-calibrated vintage artwork's board extent. */
body .vintage-puzzle-card.exact-shell-card #puzzleBoard.puzzle-board {
  display:block!important;position:relative!important;
}
body .vintage-puzzle-card.exact-shell-card #puzzleBoard .puzzle-square {
  position:absolute!important;
  left:var(--dot-left)!important;top:var(--dot-top)!important;
  width:var(--dot-width)!important;height:var(--dot-height)!important;
  display:block!important;overflow:visible!important;
  background:transparent!important;border:0!important;
}
body .vintage-puzzle-card.exact-shell-card #puzzleBoard .puzzle-piece {
  position:absolute!important;left:50%!important;top:50%!important;
  transform:translate(-50%,-50%)!important;
  width:88%!important;height:88%!important;
  pointer-events:none!important;
}