/* ===== unnamed-style ===== */
*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}html,body{margin:0;width:100%;height:100%;overflow:hidden;background:#071713;font-family:Arial,sans-serif;color:#fff}
#game{cursor:default;position:fixed;inset:0;overflow:hidden;background:#071713;touch-action:none}
#world{position:absolute;left:0;top:0;width:1672px;height:941px;transform-origin:0 0}
#scene{position:absolute;inset:0;width:1672px;height:941px;user-select:none;pointer-events:none}
#hotspots{position:absolute;inset:0;width:1672px;height:941px;overflow:visible}
.hit{fill:transparent;stroke:transparent;stroke-width:16;stroke-linejoin:round;pointer-events:all;cursor:default}
.found-outline{fill:rgba(255,211,76,.08);stroke:#ffd34c;stroke-width:5;stroke-linejoin:round;vector-effect:non-scaling-stroke;pointer-events:none}
#hud{position:fixed;inset:0;pointer-events:none;z-index:10}
.pill{position:absolute;background:rgba(8,55,45,.94);border:1px solid rgba(255,255,255,.14);box-shadow:0 2px 12px rgba(0,0,0,.22)}
#progress{left:10px;top:8px;padding:9px 12px;border-radius:0 0 12px 12px;font-weight:800}
#bonus{left:10px;top:52px;padding:7px 10px;border-radius:10px;font-size:13px}
#hint{right:54px;top:8px;padding:9px 12px;border:0;border-radius:10px;background:#ffd34c;color:#20352e;font-weight:900;pointer-events:auto}
#sound{right:10px;top:8px;width:38px;height:38px;border:0;border-radius:10px;background:rgba(8,55,45,.94);color:#fff;font-size:18px;pointer-events:auto}
#drawerTab{position:absolute;right:0;top:50%;transform:translateY(-50%);background:#ffd34c;color:#21342e;border:0;border-radius:12px 0 0 12px;padding:13px 8px;font-weight:900;writing-mode:vertical-rl;pointer-events:auto}
#drawer{position:absolute;right:0;top:0;height:100%;width:min(300px,76vw);background:rgba(7,32,27,.97);padding:64px 18px 20px;transform:translateX(100%);transition:transform .2s ease;pointer-events:auto;overflow:auto}
#drawer.open{transform:translateX(0)}
#drawer h2{font-size:19px;margin:0 0 12px}.item{padding:7px 0;border-bottom:1px solid rgba(255,255,255,.09);font-size:14px}.item.done{text-decoration:line-through;opacity:.42}
#message{position:absolute;left:50%;top:13px;transform:translateX(-50%);background:rgba(8,55,45,.94);padding:9px 15px;border-radius:11px;font-weight:800;opacity:0;transition:opacity .15s;white-space:nowrap}
#message.show{opacity:1}
#zoom{position:absolute;left:10px;bottom:10px;display:flex;gap:6px;pointer-events:auto}
#zoom button{width:42px;height:42px;border:0;border-radius:10px;background:rgba(8,55,45,.94);color:#fff;font-size:22px;font-weight:900}
#start,#finish{position:fixed;inset:0;z-index:30;background:rgba(5,24,20,.91);display:flex;align-items:center;justify-content:center;padding:22px}
.card{width:min(440px,92vw);background:#f4ead5;color:#20352e;border-radius:20px;padding:24px;text-align:center;box-shadow:0 16px 60px rgba(0,0,0,.4)}
.card h1{font-size:28px;margin:0 0 8px}.card p{line-height:1.45}.primary{border:0;border-radius:12px;padding:13px 20px;background:#176d5b;color:#fff;font-size:17px;font-weight:900}
#finish{display:none}.hint-ring{fill:none;stroke:#ffd34c;stroke-width:7;vector-effect:non-scaling-stroke;pointer-events:none;animation:pulse 1s ease-in-out 3}
@keyframes pulse{50%{stroke-width:13;opacity:.35}}
@media (prefers-reduced-motion:reduce){#drawer{transition:none}.hint-ring{animation:none}}

@media (min-width:901px) and (pointer:fine), (min-width:901px) and (pointer:none), (min-width:901px) and (min-height:500.01px), (min-width:901px) and (orientation:portrait){
  #game{bottom:118px}
  #hud{bottom:0}
  #drawerTab{display:none}
  #drawer{
    position:absolute;left:0;right:0;top:auto;bottom:0;width:100%;height:118px;
    transform:none!important;padding:10px 170px 10px 120px;overflow:hidden;
    background:rgba(7,32,27,.97);border-top:1px solid rgba(255,255,255,.13)
  }
  #drawer h2{display:none}
  #list{display:grid;grid-template-columns:repeat(8,minmax(0,1fr));gap:3px 16px}
  .item{padding:5px 0;border:0;font-size:13px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  #progress{top:auto;bottom:38px;left:12px;border-radius:10px}
  #bonus{top:auto;bottom:8px;left:12px}
  #hint{top:auto;bottom:37px;right:58px}
  #sound{top:auto;bottom:37px;right:12px}
  #zoom{bottom:128px}
  #message{top:12px}
}


/* ===== v3-ui ===== */
:root{
  --cream:#f6ecd7;--paper:#fff8e9;--ink:#173b33;--teal:#174f43;
  --teal2:#0f3b32;--gold:#e5b73f;--soft:#d9c9a7;
}
#start,#finish{background:rgba(8,30,26,.78);backdrop-filter:blur(4px)}
.card{
  position:relative;overflow:hidden;width:min(520px,92vw);
  background:linear-gradient(180deg,#fff9eb,#f1e1c3);
  color:var(--ink);border:1px solid rgba(92,67,30,.24);border-radius:24px;
  padding:34px 38px 30px;box-shadow:0 20px 70px rgba(0,0,0,.42);
}
.card:before,.card:after{
  content:"";position:absolute;border-radius:50%;background:rgba(23,79,67,.07)
}
.card:before{width:170px;height:170px;right:-75px;top:-85px}
.card:after{width:120px;height:120px;left:-60px;bottom:-70px}
.card h1{font-family:Georgia,serif;font-size:34px;line-height:1.05;margin:0 0 10px;color:#123d34}
.card .eyebrow{font-size:12px;letter-spacing:.16em;text-transform:uppercase;font-weight:900;color:#9a7421;margin-bottom:10px}
.card .intro{font-size:17px;line-height:1.55;margin:12px auto 18px;max-width:410px}
.mission{
  position:relative;margin:20px 0;padding:15px 16px;border-top:1px solid rgba(23,79,67,.16);
  border-bottom:1px solid rgba(23,79,67,.16);font-weight:800
}
.secret{font-size:13px;opacity:.8;margin:12px 0 22px}
.primary{
  position:relative;min-width:210px;padding:14px 24px;border-radius:14px;
  background:#176653;box-shadow:0 4px 0 #0d493c;font-size:17px
}
.primary:hover{background:#1d725e}
#desktopPanel{display:none}
@media (min-width:901px) and (pointer:fine), (min-width:901px) and (pointer:none), (min-width:901px) and (min-height:500.01px), (min-width:901px) and (orientation:portrait){
  #game{position:fixed;left:0;right:0;top:0;bottom:132px;background:#0b1c18}
  #hud{position:fixed;inset:0;pointer-events:none}
  #drawer,#drawerTab,#progress,#bonus{display:none!important}
  #desktopPanel{
    display:grid;position:fixed;z-index:18;left:0;right:0;bottom:0;height:132px;
    grid-template-columns:150px minmax(0,1fr) 180px;gap:16px;align-items:center;
    padding:13px 18px;background:
      linear-gradient(180deg,rgba(31,83,70,.98),rgba(13,54,46,.99));
    border-top:3px solid #d4a83b;color:#fff;box-shadow:0 -8px 30px rgba(0,0,0,.2);
    pointer-events:auto
  }
  #desktopPanel .score{align-self:stretch;display:flex;flex-direction:column;justify-content:center;
    border-right:1px solid rgba(255,255,255,.14);padding-right:15px}
  #desktopPanel .score strong{font-family:Georgia,serif;font-size:24px}
  #desktopPanel .score span{font-size:12px;opacity:.75;margin-top:3px}
  #desktopList{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:7px 18px;min-width:0}
  #desktopList .item{position:relative;border:0;padding:2px 0 2px 19px;font-size:13px;line-height:1.2;
    white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:#fff}
  #desktopList .item:before{content:"○";position:absolute;left:0;color:#e5c66d}
  #desktopList .item.done{opacity:.42;text-decoration:line-through}
  #desktopList .item.done:before{content:"✓";text-decoration:none;color:#f4d86f;font-weight:900}
  #desktopActions{display:grid;grid-template-columns:1fr 44px;gap:8px;align-items:center}
  #desktopHint{height:44px;border:0;border-radius:12px;background:#f0c84f;color:#263d35;font-weight:900}
  #desktopSound{height:44px;border:1px solid rgba(255,255,255,.18);border-radius:12px;background:rgba(255,255,255,.09);color:#fff;font-size:18px}
  #desktopBone{grid-column:1/-1;text-align:center;font-size:13px;padding-top:4px;color:#f3dc92}
  #hint,#sound{display:none}
  #zoom{left:12px;bottom:144px}
  #message{top:12px}
}
@media (max-width:900px), (pointer:coarse) and (max-height:500px) and (orientation:landscape){
  #desktopPanel{display:none!important}
}


/* ===== v4-cinematic ===== */
:root{}
#start{background:#07130f;padding:0}
.titleScene{position:relative;width:min(1280px,100vw);aspect-ratio:16/9;max-height:100vh;background-size:cover;background-position:center;border-radius:0;overflow:hidden;box-shadow:0 30px 100px rgba(0,0,0,.5)}
.titleShade{position:absolute;inset:0;background:linear-gradient(90deg,rgba(4,13,11,.90) 0%,rgba(5,17,14,.76) 28%,rgba(7,20,16,.30) 52%,rgba(7,20,16,.03) 72%)}
.titleCopy{position:absolute;z-index:2;left:6.5%;top:50%;transform:translateY(-50%);width:min(470px,42%);color:#f4ead4;text-align:left;text-shadow:0 2px 4px rgba(0,0,0,.55)}
.titleKicker{font-size:12px;letter-spacing:.19em;text-transform:uppercase;color:#d8b765;font-weight:800;margin-bottom:12px}
.titleCopy h1{font-family:Georgia,'Times New Roman',serif;font-size:clamp(36px,4vw,62px);line-height:.98;font-weight:500;margin:0 0 24px;color:#f7e9c8;letter-spacing:-.025em}
.titleCopy p{font-family:Georgia,'Times New Roman',serif;font-size:clamp(15px,1.35vw,19px);line-height:1.55;margin:0 0 10px;color:#eee4d2}
.titleFacts{display:flex;gap:10px;flex-wrap:wrap;margin:24px 0 26px;font-size:12px;color:#e7d5a5}
.titleFacts span{padding:7px 10px;border-top:1px solid rgba(218,183,101,.42);border-bottom:1px solid rgba(218,183,101,.22)}
.adventureStart{min-height:48px;padding:0 25px;border:1px solid #d5b35e;border-radius:3px;background:linear-gradient(#285f51,#17483d);color:#fff4d7;font-family:Georgia,'Times New Roman',serif;font-size:17px;letter-spacing:.035em;box-shadow:inset 0 0 0 2px rgba(9,34,28,.7),0 5px 18px rgba(0,0,0,.28);cursor:pointer}
.adventureStart:hover{filter:brightness(1.08)}
@media (min-width:901px) and (pointer:fine), (min-width:901px) and (pointer:none), (min-width:901px) and (min-height:500.01px), (min-width:901px) and (orientation:portrait){
  #game{bottom:150px;background:#07120f}
  #desktopPanel{height:150px;grid-template-columns:150px minmax(0,1fr) 190px;gap:15px;padding:20px 31px 18px;background:transparent;border:0;box-shadow:0 -8px 28px rgba(0,0,0,.30);color:#f4ead1}
  #desktopPanel .score{border:0;padding:0 13px 0 7px;text-align:center}
  #desktopPanel .score:before{content:"TE VINDEN";display:block;font-family:Georgia,'Times New Roman',serif;font-size:11px;letter-spacing:.15em;color:#d7b866;margin-bottom:4px}
  #desktopPanel .score strong{font-family:Georgia,'Times New Roman',serif;font-size:29px;font-weight:500;color:#fff0c8;text-shadow:0 1px 2px #000}
  #desktopPanel .score span{font-family:Georgia,'Times New Roman',serif;font-size:11px;color:#d7cfbd;opacity:.9}
  #desktopList{grid-template-columns:repeat(5,minmax(0,1fr));gap:8px 16px;padding:2px 10px;align-content:center}
  #desktopList .item{font-family:Georgia,'Times New Roman',serif;font-size:13px;color:#f0e7d2;padding:1px 0 1px 17px;text-shadow:0 1px 2px #000}
  #desktopList .item:before{content:"◆";font-size:7px;top:5px;color:#caa64e}
  #desktopList .item.done{opacity:.42;text-decoration:line-through}
  #desktopList .item.done:before{content:"✓";font-size:12px;top:1px;color:#e1c15d}
  #desktopActions{padding:0 5px 0 14px;grid-template-columns:1fr 42px;gap:7px}
  #desktopHint{font-family:Georgia,'Times New Roman',serif;height:42px;border:1px solid #c9a34f;border-radius:3px;background:linear-gradient(#4b735f,#294f42);color:#fff0c8;box-shadow:inset 0 0 0 1px rgba(0,0,0,.35);font-size:12px;letter-spacing:.04em}
  #desktopHint:before{content:"SNUFFEL ";font-size:9px;letter-spacing:.10em;color:#d7bd75}
  #desktopSound{height:42px;border:1px solid #806c42;border-radius:3px;background:rgba(12,41,34,.68);color:#f1dfb1}
  #desktopBone{font-family:Georgia,'Times New Roman',serif;font-size:12px;color:#e4c66d;padding-top:4px;text-shadow:0 1px 2px #000}
  #zoom{bottom:162px}
}
@media (max-width:900px), (pointer:coarse) and (max-height:500px) and (orientation:landscape){
  .titleScene{width:100%;min-height:420px;aspect-ratio:auto;background-position:62% center}
  .titleShade{background:linear-gradient(90deg,rgba(4,13,11,.93),rgba(4,13,11,.65) 58%,rgba(4,13,11,.14))}
  .titleCopy{left:7%;width:62%}
  .titleCopy h1{font-size:36px}
  .titleCopy p{font-size:15px}
  .titleFacts{display:none}
}
@media (max-width:560px){
  .titleScene{min-height:480px;background-position:67% center}
  .titleShade{background:linear-gradient(90deg,rgba(4,13,11,.95),rgba(4,13,11,.73) 66%,rgba(4,13,11,.25))}
  .titleCopy{width:72%;left:7%}
  .titleCopy h1{font-size:31px}
  .titleCopy p{font-size:14px}
}


/* ===== v5-background-fix ===== */
.titleScene{background:#081713}
.titleArtwork{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center;z-index:0;pointer-events:none;user-select:none}
.titleShade{z-index:1}
.titleCopy{z-index:2}
#desktopPanel{isolation:isolate;overflow:hidden;background:#123d34}
.panelArtwork{position:absolute;inset:0;width:100%;height:100%;object-fit:fill;z-index:-1;pointer-events:none;user-select:none}
#desktopPanel .score,#desktopList,#desktopActions{position:relative;z-index:1}
@media (max-width:900px), (pointer:coarse) and (max-height:500px) and (orientation:landscape){
  .titleArtwork{object-position:62% center}
}
@media (max-width:560px){
  .titleArtwork{object-position:67% center}
}


/* ===== v6-polish ===== */
/* Desktop panel: three slices, so corners and side ornaments never stretch. */
@media (min-width:901px) and (pointer:fine), (min-width:901px) and (pointer:none), (min-width:901px) and (min-height:500.01px), (min-width:901px) and (orientation:portrait){
  #desktopPanel{
    height:164px;
    grid-template-columns:158px minmax(0,1fr) 195px;
    gap:16px;
    padding:24px 34px 22px;
    background:
      url("assets/8a05b4aad06f.webp") left top / 260px 100% no-repeat,
      url("assets/2e6afe16ff05.webp") right top / 260px 100% no-repeat,
      url("assets/dac8fb6a0b54.webp") center top / calc(100% - 500px) 100% no-repeat,
      #123d34;
    overflow:hidden;
  }
  #game{bottom:164px}
  #zoom{bottom:176px}
  #desktopList{gap:10px 17px}
  #desktopList .item{font-size:13px;line-height:1.28}
  .panelArtwork{display:none!important}
}
/* Mobile drawer can be closed with the same tab, a close button, or swipe. */
#drawer{z-index:2}
#drawerTab{z-index:3;transition:right .2s ease,transform .2s ease}
#drawerTab.drawer-open{right:min(300px,76vw)}
#drawerClose{
  display:none;position:absolute;right:12px;top:12px;width:38px;height:38px;
  border:1px solid rgba(229,183,63,.55);border-radius:50%;background:#143f35;
  color:#f5e7c5;font-size:25px;line-height:1;cursor:pointer
}
@media (max-width:900px), (pointer:coarse) and (max-height:500px) and (orientation:landscape){
  #drawerClose{display:block}
}
/* Portrait phone notice. */
#rotateNotice{
  display:none;position:fixed;inset:0;z-index:100;background:rgba(5,22,18,.96);
  align-items:center;justify-content:center;padding:28px;text-align:center;color:#f6ecd7
}
.rotateCard{max-width:330px;font-family:Georgia,'Times New Roman',serif}
.rotateCard .phoneIcon{font-size:64px;line-height:1;transform:rotate(90deg);color:#d8b765;margin-bottom:18px}
.rotateCard strong{display:block;font-size:27px;font-weight:500;margin-bottom:10px}
.rotateCard span{display:block;font-size:15px;line-height:1.5;color:#e5dbc7}
@media (max-width:900px) and (orientation:portrait){
  #rotateNotice{display:flex}
}
/* Wrong-click feedback remains readable above the scene. */
#message{z-index:25}


/* ===== v7-layout ===== */
/* Text screens */
.titleScene,.storyScene{position:relative;width:min(1280px,100vw);aspect-ratio:16/9;max-height:100vh;overflow:hidden;background:#07130f}
.storyArtwork{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:0}
.storyShade{position:absolute;inset:0;z-index:1;background:linear-gradient(90deg,rgba(5,17,14,.90),rgba(5,17,14,.68) 31%,rgba(5,17,14,.20) 53%,rgba(5,17,14,0) 72%)}
.storyCopy{position:absolute;z-index:2;left:7%;top:50%;transform:translateY(-50%);width:min(430px,38%);color:#f4ead4;text-align:left;text-shadow:0 2px 4px rgba(0,0,0,.65)}
.storyLogo{display:block;width:min(260px,80%);height:auto;margin:0 0 16px}
.storyLogoMain{width:min(330px,90%);margin-bottom:4px}
.storySubtitle{font-family:Georgia,'Times New Roman',serif;color:#e1c36d;letter-spacing:.17em;font-size:13px;margin:0 0 24px 4px}
.titleCopy{width:min(500px,42%);left:7%}
.titleCopy p,.storyCopy p{font-family:Georgia,'Times New Roman',serif;font-size:clamp(15px,1.25vw,18px);line-height:1.48;color:#f1e7d5;margin:0 0 12px}
.titleCopy p strong{color:#fff1cd}
.storyCopy h1{font-family:Georgia,'Times New Roman',serif;font-size:clamp(28px,3vw,44px);font-weight:500;line-height:1.05;color:#f7e9c8;margin:0 0 18px}
.startHelp{margin-top:18px!important}
#finish{padding:0;background:#07130f}
#continueLevel2{margin-top:12px}

/* Clean supplied desktop panel. It stays proportional; dark green fills any extra width. */
@media (min-width:901px) and (pointer:fine), (min-width:901px) and (pointer:none), (min-width:901px) and (min-height:500.01px), (min-width:901px) and (orientation:portrait){
 #desktopPanel{
   height:166px;grid-template-columns:150px minmax(0,1fr) 178px;gap:18px;
   padding:27px 48px 24px;
   background-color:#123d34;
   background-image:url("assets/a0838b4df7c6.webp");
   background-size:auto 100%;
   background-position:center;
   background-repeat:repeat-x;
   border:0;box-shadow:0 -8px 28px rgba(0,0,0,.32);
 }
 #game{bottom:166px}
 #zoom{bottom:178px}
 #desktopPanel .score{padding:0 12px 0 4px;align-items:center;text-align:center}
 #desktopPanel .score:before{display:none}
 .scoreLabel{font-family:Georgia,'Times New Roman',serif;font-size:11px;letter-spacing:.16em;color:#d9bd70;margin-bottom:4px}
 #desktopPanel .score strong{font-size:31px}
 #desktopPanel .score span:not(.scoreLabel){display:none}
 #desktopList{grid-template-columns:repeat(5,minmax(0,1fr));gap:10px 18px;padding:0 8px;align-content:center}
 #desktopList .item{font-size:15px;line-height:1.25;padding-left:18px;white-space:normal}
 #desktopActions{display:flex;flex-direction:column;justify-content:center;gap:10px;padding:0 0 0 8px}
 .desktopTopActions{display:grid;grid-template-columns:1fr 42px;gap:8px}
 #desktopBone{display:flex;align-items:center;justify-content:center;gap:7px;height:38px;border:1px solid rgba(207,171,83,.55);border-radius:4px;background:rgba(10,47,39,.72);font-family:Georgia,'Times New Roman',serif;color:#e8cf86;font-size:12px;letter-spacing:.06em}
 #desktopBone .boneIcon{font-size:12px;color:#d9b44f;transform:rotate(45deg)}
 #desktopBone b{font-size:18px;color:#e9cb68;font-weight:400}
 #desktopSound{height:38px}
 #desktopHint{height:42px;font-size:14px;text-transform:none}
 #desktopHint:before{display:none}
}

/* Mobile HUD */
#mobileProgressRow{position:absolute;left:10px;top:10px;display:flex;align-items:center;gap:7px;pointer-events:none}
#mobileProgressRow #progress,#mobileProgressRow #bonus{position:static!important;pointer-events:auto}
#mobileProgressRow #bonus{font-size:12px;padding:9px 11px}
.boneMini{display:inline-block;color:#e0ba4f;transform:rotate(45deg);font-size:9px;margin-right:5px}

/* Better portrait artwork */
.rotateGraphic{position:relative;width:110px;height:82px;margin:0 auto 18px}
.phoneShape{position:absolute;left:20px;top:18px;width:66px;height:38px;border:4px solid #d6bd7a;border-radius:8px;transform:rotate(-7deg);box-shadow:0 0 0 2px rgba(54,106,86,.35)}
.phoneShape:before{content:"";position:absolute;inset:5px;border:1px solid rgba(240,226,189,.55);border-radius:3px}
.phoneShape span{position:absolute;right:3px;top:50%;width:3px;height:3px;border-radius:50%;background:#d6bd7a;transform:translateY(-50%)}
.rotateArrow{position:absolute;right:0;bottom:0;font-size:34px;color:#d6bd7a;transform:rotate(20deg)}

@media (max-width:900px), (pointer:coarse) and (max-height:500px) and (orientation:landscape){
 .titleScene,.storyScene{width:100%;height:100%;aspect-ratio:auto;max-height:none}
 .titleArtwork,.storyArtwork{object-position:center}
 .titleCopy,.storyCopy{left:6%;width:52%}
 .storyLogoMain{width:min(245px,92%)}
 .storyLogo{width:min(205px,82%)}
 .storySubtitle{font-size:10px;margin-bottom:13px}
 .titleCopy p,.storyCopy p{font-size:13px;line-height:1.36;margin-bottom:8px}
 .startHelp{margin-top:8px!important}
 .adventureStart{min-height:40px;font-size:14px;padding:0 18px}
 .storyCopy h1{font-size:27px;margin-bottom:11px}
}


/* ===== v8-final-fixes ===== */
/* Keep the dark text treatment off the decorative wooden frame itself. */
.titleShade{
  inset:4.5% 3.4%;
  border-radius:2px;
  background:linear-gradient(90deg,rgba(4,13,11,.90) 0%,rgba(5,17,14,.76) 30%,rgba(7,20,16,.28) 56%,rgba(7,20,16,0) 78%);
}
.storySubtitleArtwork{
  display:block;
  width:min(350px,92%);
  height:auto;
  max-height:76px;
  object-fit:contain;
  object-position:left center;
  margin:0 0 18px 0;
}

/* New supplied desktop item panel, with proportional decorative end pieces. */
@media (min-width:901px) and (pointer:fine), (min-width:901px) and (pointer:none), (min-width:901px) and (min-height:500.01px), (min-width:901px) and (orientation:portrait){
  #desktopPanel{
    height:172px;
    grid-template-columns:185px minmax(0,1fr) 205px;
    gap:22px;
    padding:28px 43px 25px;
    background-color:#123c33;
    background-image:
      url("assets/066b899f9fd4.webp"),
      url("assets/7306afecc67a.webp"),
      url("assets/9bb9a6917064.webp");
    background-position:left center,right center,center center;
    background-size:218px 172px,238px 172px,calc(100% - 410px) 172px;
    background-repeat:no-repeat,no-repeat,no-repeat;
    box-shadow:0 -8px 28px rgba(0,0,0,.32);
  }
  #game{bottom:172px}
  #zoom{bottom:184px}
  #desktopList{
    grid-template-columns:repeat(5,minmax(0,1fr));
    gap:11px 20px;
    padding:0 7px;
  }
  #desktopList .item{
    font-size:17px;
    line-height:1.22;
    padding-left:19px;
    overflow:visible;
    text-overflow:clip;
  }
  #desktopPanel .score strong{font-size:32px}
  .scoreLabel{font-size:12px}
  #desktopActions{gap:9px}
  #desktopHint{font-size:15px}
}

/* Mobile: progress + bone stay left, Hint stays at the far right and above the drawer. */
@media (max-width:900px), (pointer:coarse) and (max-height:500px) and (orientation:landscape){
  #mobileProgressRow{left:8px;top:8px;gap:5px;max-width:calc(100% - 155px)}
  #mobileProgressRow #progress{padding:8px 10px;font-size:12px}
  #mobileProgressRow #bonus{padding:8px 9px;font-size:11px}
  #hint{
    position:absolute;
    right:10px!important;
    top:8px!important;
    z-index:8;
    min-width:86px;
    padding:9px 10px;
  }
  #sound{
    right:104px!important;
    top:8px!important;
    z-index:8;
  }
  #drawer{z-index:5;padding-top:62px}
  #drawerTab{z-index:7}
  #drawerClose{z-index:7}
  .rotateGraphic{width:132px;height:90px;color:#e8dcc0;margin:0 auto 16px}
  .rotateGraphic svg{display:block;width:100%;height:100%}
  .phoneShape,.rotateArrow{display:none!important}
  .storySubtitleArtwork{width:min(245px,92%);max-height:52px;margin-bottom:10px}
}


/* ===== v9-polish ===== */
/* Text Screen 1: softer vignette, no obvious dark corners on the frame. */
#start{
 background:
   radial-gradient(ellipse at 50% 46%, #172a24 0%, #0d1b17 58%, #08110f 100%);
}
.titleShade{
 inset:5.3% 4.1%;
 border-radius:3px;
 background:
   linear-gradient(90deg,
     rgba(5,17,14,.82) 0%,
     rgba(5,17,14,.69) 29%,
     rgba(5,17,14,.28) 54%,
     rgba(5,17,14,.06) 70%,
     rgba(5,17,14,0) 82%);
}
/* Center the subtitle under the Paws & Clues logo and bring them closer together. */
.storyLogoMain{
 margin-left:auto;
 margin-right:auto;
 margin-bottom:0;
}
.storySubtitleArtwork{
 width:min(320px,88%);
 max-height:68px;
 object-fit:contain;
 object-position:center;
 margin:2px auto 12px;
}
/* Bring body copy upward while leaving a deliberate gap before the CTA. */
.titleCopy p{
 margin-bottom:9px;
}
.titleCopy .startHelp{
 margin-top:9px!important;
 margin-bottom:22px!important;
}
.titleCopy .adventureStart{
 margin-top:0;
}

/* Desktop panel alignment. */
@media (min-width:901px) and (pointer:fine), (min-width:901px) and (pointer:none), (min-width:901px) and (min-height:500.01px), (min-width:901px) and (orientation:portrait){
 #desktopPanel{
   grid-template-columns:185px minmax(0,1fr) 205px;
   padding-top:22px;
   padding-bottom:29px;
 }
 #desktopPanel .score{
   transform:translate(17px,-4px);
 }
 #desktopList{
   transform:translateY(-7px);
 }
 #desktopActions{
   transform:translate(-15px,-4px);
   padding-left:0;
   align-items:center;
 }
 .desktopTopActions{
   width:154px;
   grid-template-columns:98px 46px;
 }
 #desktopBone{
   height:42px;
   display:flex;
   align-items:center;
   justify-content:center;
   border:0;
   background:transparent;
 }
 #desktopBoneIcon{
   display:block;
   width:66px;
   height:36px;
   object-fit:contain;
 }
 #desktopSound{
   width:46px;
   height:42px;
 }
 #desktopHint{
   width:154px;
   height:43px;
   border:1px solid #9c6b22;
   background:linear-gradient(#e8c45e,#c8952f);
   color:#34200b;
   text-shadow:0 1px rgba(255,255,255,.25);
   box-shadow:inset 0 1px rgba(255,255,255,.35),0 2px 4px rgba(0,0,0,.28);
 }
 #desktopHint:hover{
   background:linear-gradient(#f0d173,#d5a43a);
 }
}

/* Mobile: only the collectible icon beside the score, Hint remains far right. */
#bonus{
 min-width:48px;
 height:36px;
 padding:3px 6px!important;
 display:flex;
 align-items:center;
 justify-content:center;
}
#mobileBoneIcon{
 display:block;
 width:42px;
 height:26px;
 object-fit:contain;
}
@media (max-width:900px), (pointer:coarse) and (max-height:500px) and (orientation:landscape){
 #mobileProgressRow{max-width:calc(100% - 205px)}
 #hint{right:9px!important;top:8px!important;z-index:9}
 #sound{right:101px!important;top:8px!important;z-index:9}
 #drawer{z-index:5}
}


/* ===== v10-full-story ===== */
body{
  background:
    radial-gradient(ellipse at 50% 42%,#17251f 0%,#101a16 48%,#070c0a 100%);
}
#game{
  background:
    radial-gradient(ellipse at center,#1a2b24 0%,#101a16 55%,#070c0a 100%)!important;
}

/* No inset rectangle, so there can be no visible rectangular gradient corners. */
.titleShade{
  inset:0!important;
  border-radius:0!important;
  background:
    radial-gradient(ellipse at 18% 49%,rgba(5,16,13,.80) 0%,rgba(5,16,13,.68) 24%,rgba(5,16,13,.34) 47%,rgba(5,16,13,0) 72%)!important;
}
.titleCopy{padding-top:1.5vh}
.storyLogoMain{margin-bottom:0!important}
.storySubtitleArtwork{margin:0 auto 8px!important;width:min(315px,88%)!important}
.titleCopy p{margin-top:6px!important;margin-bottom:7px!important}
.titleCopy .startHelp{margin-top:6px!important;margin-bottom:24px!important}
.presentedBy{
  margin:16px auto 0;
  display:flex;align-items:center;justify-content:center;gap:8px;
  color:#d8cfbb;font:11px Georgia,serif;opacity:.88;
}
.presentedBy img{width:58px;height:30px;object-fit:contain}

/* Desktop panel: content centered inside the painted green compartments. */
@media (min-width:901px) and (pointer:fine), (min-width:901px) and (pointer:none), (min-width:901px) and (min-height:500.01px), (min-width:901px) and (orientation:portrait){
  #desktopPanel{padding-top:18px!important;padding-bottom:31px!important}
  #desktopPanel .score{transform:translate(31px,-7px)!important}
  #desktopList{transform:translateY(-10px)!important}
  #desktopActions{transform:translate(-31px,-7px)!important;gap:7px!important}
  .desktopTopActions{width:126px!important;grid-template-columns:72px 44px!important;gap:7px!important}
  #desktopBoneIcon{width:58px!important;height:31px!important}
  #desktopSound{
    width:42px!important;height:38px!important;border-radius:12px!important;
  }
  #desktopHint{
    width:126px!important;height:37px!important;
    border-radius:13px!important;
    font-size:13px!important;
    padding:0 12px!important;
  }
}

/* Temporary testing controls */
.testSkipBtn{
  border:1px dashed rgba(255,255,255,.7);
  border-radius:10px;
  background:rgba(112,38,38,.92);
  color:#fff5e9;
  padding:8px 11px;
  font:700 10px Arial,sans-serif;
  letter-spacing:.05em;
  cursor:pointer;
}
#testSkip1{position:absolute;left:12px;top:12px;z-index:40}
@media (max-width:900px), (pointer:coarse) and (max-height:500px) and (orientation:landscape){
  #testSkip1{left:50%;top:auto;bottom:9px;transform:translateX(-50%)}
}

/* Full test/story screens */
.fullOverlay{
  position:fixed;inset:0;z-index:70;display:none;
  align-items:center;justify-content:center;
  background:radial-gradient(ellipse at center,#17251f 0%,#0d1713 58%,#060b09 100%);
}
.storyCard,.testSceneStage,.cutsceneFrame{
  position:relative;
  width:min(94vw,1500px);
  aspect-ratio:16/9;
  overflow:hidden;
  border:16px solid #3a2418;
  outline:3px solid #9b783f;
  box-shadow:0 18px 55px rgba(0,0,0,.58),inset 0 0 0 2px #18100b;
  background:#101713;
}
.storyBg,.testSceneStage>img{
  width:100%;height:100%;display:block;object-fit:cover;
}
.storySoftShade{
  position:absolute;inset:0;
  background:linear-gradient(90deg,rgba(5,16,13,.86) 0%,rgba(5,16,13,.62) 32%,rgba(5,16,13,.15) 56%,transparent 75%);
}
.storyOverlayCopy,.endCopy{
  position:absolute;z-index:2;left:6%;top:50%;transform:translateY(-50%);
  width:min(39%,540px);color:#f4ead4;text-shadow:0 2px 5px rgba(0,0,0,.8);
}
.overlayLogo{display:block;width:min(310px,90%);height:auto;margin:0 0 18px}
.storyOverlayCopy h1,.endCopy h1{font:700 clamp(27px,2.4vw,46px) Georgia,serif;margin:0 0 14px;color:#f1d992}
.storyOverlayCopy p,.endCopy p{font:clamp(15px,1.25vw,20px)/1.55 Georgia,serif;margin:0 0 18px}
.testSceneLabel{
  position:absolute;left:18px;top:18px;padding:8px 11px;border-radius:9px;
  background:rgba(20,47,39,.88);color:#f2e6c8;font:700 11px Arial,sans-serif;letter-spacing:.06em
}
.sceneSkip{position:absolute;left:50%;bottom:18px;transform:translateX(-50%);z-index:3}

/* Chest pseudo animation: fixed frame, only image changes and slowly zooms. */
.chestOverlay{z-index:80}
.cutsceneFrame{background:#0d1512}
.cutsceneViewport{position:absolute;inset:0;overflow:hidden}
.chestFrame{
  position:absolute;inset:0;width:100%;height:100%;object-fit:cover;
  opacity:0;transform:scale(1);transition:opacity .20s ease;
}
.chestFrame.active{opacity:1}
.chestOverlay.playing .chestFrame{animation:slowCutsceneZoom 3.2s linear forwards}
@keyframes slowCutsceneZoom{from{transform:scale(1)}to{transform:scale(1.03)}}

/* Ending */
.endShade{
  position:absolute;inset:0;
  background:linear-gradient(90deg,rgba(5,16,13,.82) 0%,rgba(5,16,13,.60) 34%,rgba(5,16,13,.10) 60%,transparent 78%);
}
.endBrand{display:flex;align-items:center;gap:9px;margin:18px 0;color:#ddd1b8;font:12px Georgia,serif}
.endBrand img{width:68px;height:38px;object-fit:contain}
#restartGame{margin-top:3px}

@media (max-width:900px), (pointer:coarse) and (max-height:500px) and (orientation:landscape){
  .storyCard,.testSceneStage,.cutsceneFrame{width:96vw;border-width:8px}
  .storyOverlayCopy,.endCopy{left:5%;width:47%}
  .overlayLogo{width:min(220px,90%);margin-bottom:8px}
  .storyOverlayCopy p,.endCopy p{font-size:12px;line-height:1.35;margin-bottom:9px}
  .storyOverlayCopy h1,.endCopy h1{font-size:21px;margin-bottom:7px}
  .endBrand{margin:8px 0}
  .endBrand img{width:50px;height:28px}
}


/* ===== v12-recovery ===== */
/* Decorative background is on the game container only. */
#game {
  background-image:url("assets/eeb9f6a80418.webp") !important;
  background-size:cover !important;
  background-position:center !important;
  background-repeat:no-repeat !important;
}
#world {
  box-sizing:border-box;
  outline:1px solid rgba(191,151,76,.72);
  box-shadow:
    0 0 0 4px #2a1a12,
    0 0 0 5px rgba(191,151,76,.48),
    0 8px 24px rgba(0,0,0,.45);
}
#hotspots { z-index:5 !important; pointer-events:auto !important; }
.hit { pointer-events:all !important; cursor:default !important; }
#scene { pointer-events:none !important; }

/* New combined Part 1 logo. No separate subtitle asset. */
.storyLogoMain {
  width:min(390px,88%) !important;
  margin-bottom:12px !important;
}
.storyLogo {
  width:min(300px,80%) !important;
}
.storySubtitleArtwork,.subtitleArtwork {display:none!important}

/* Opening OHC mark */
.ohcOpeningLogo {
  position:absolute;right:3.2%;bottom:4.5%;
  width:116px;height:82px;object-fit:contain;z-index:8;
  filter:drop-shadow(0 2px 4px rgba(0,0,0,.45));
}
.presentedBy{display:none!important}

/* Story gradients: soft local vignette, never a rectangular dark card. */
.storyText::before,.storyCopy::before,.storyContent::before {
  content:"";
  position:absolute;
  left:-12%;top:-18%;width:128%;height:136%;
  z-index:-1;pointer-events:none;
  background:radial-gradient(ellipse at 42% 50%,
    rgba(4,15,13,.76) 0%,
    rgba(4,15,13,.58) 37%,
    rgba(4,15,13,.22) 67%,
    rgba(4,15,13,0) 82%);
}
.storyText,.storyCopy,.storyContent {position:relative;background:none!important;box-shadow:none!important}

/* Desktop panel: each zone positioned independently. */
@media (min-width:901px) and (pointer:fine), (min-width:901px) and (pointer:none), (min-width:901px) and (min-height:500.01px), (min-width:901px) and (orientation:portrait){
  #desktopPanel .score {
    position:relative!important;
    left:-9px!important;
    top:0!important;
    transform:none!important;
  }
  #desktopList {
    position:relative!important;
    top:12px!important;
    transform:none!important;
  }
  #desktopActions {
    position:relative!important;
    left:18px!important;
    top:0!important;
    transform:none!important;
    padding-left:0!important;
  }
  .desktopTopActions {
    display:grid!important;
    grid-template-columns:58px 40px!important;
    justify-content:end!important;
    gap:8px!important;
  }
  #desktopBoneIcon{width:55px!important;height:29px!important}
  #desktopSound{width:40px!important;height:36px!important;border-radius:13px!important}
  #desktopHint{
    width:110px!important;height:35px!important;
    border-radius:14px!important;font-size:12px!important;
    align-self:flex-end!important;
  }
}

/* Mobile HUD */
@media (max-width:900px), (pointer:coarse) and (max-height:500px) and (orientation:landscape){
  #mobileProgressRow{max-width:calc(100% - 176px)!important}
  #hint{
    right:8px!important;top:8px!important;width:68px!important;min-width:68px!important;
    height:31px!important;padding:0 8px!important;border-radius:12px!important;font-size:11px!important;
    z-index:35!important;
  }
  #sound{
    right:82px!important;top:8px!important;width:34px!important;min-width:34px!important;
    height:31px!important;padding:0!important;border-radius:12px!important;z-index:35!important;
  }
  #world{
    outline-width:1px;
    box-shadow:0 0 0 2px #2a1a12,0 0 0 3px rgba(191,151,76,.48),0 4px 12px rgba(0,0,0,.35);
  }
}

/* Search-list tab */
#drawerTab {
  background:linear-gradient(90deg,#2b1a12,#51311e 55%,#2e1c13)!important;
  border:1px solid #9a783f!important;border-right:0!important;
  color:#f1e2c0!important;
  box-shadow:inset 0 1px rgba(255,231,175,.16),inset 0 -1px rgba(0,0,0,.45),-3px 4px 12px rgba(0,0,0,.30)!important;
  border-radius:10px 0 0 10px!important;letter-spacing:.075em!important;gap:4px!important;
}
#drawerTab .drawerArrow{color:#d7b765;font-size:17px;line-height:1;transition:transform .22s ease}
#drawerTab.drawer-open .drawerArrow{transform:rotate(180deg)}
#drawer {
  background:linear-gradient(180deg,rgba(12,43,36,.965),rgba(7,28,24,.975))!important;
  border-left:1px solid #9a783f!important;
  box-shadow:inset 1px 0 rgba(225,194,119,.10),-8px 0 24px rgba(0,0,0,.30)!important;
}
#drawer h2 {
  color:#ead9b4!important;font-family:Georgia,'Times New Roman',serif!important;
  font-size:13px!important;letter-spacing:.13em!important;font-weight:normal!important;
  text-align:center!important;margin:0 15px 14px!important;padding-bottom:9px!important;
  border-bottom:1px solid rgba(184,145,70,.55)!important;
}
#drawer .item {
  color:#f0e6d2!important;border-bottom:1px solid rgba(194,157,85,.13)!important;
  padding-top:7px!important;padding-bottom:7px!important;
}
#drawer .item.done{color:#a99d88!important;opacity:.62!important}

/* Test skip always clickable but never covers object area except its own small button. */
.testSkipBtn{z-index:80!important;pointer-events:auto!important;touch-action:manipulation!important}


/* ===== v12-4-hotspot-fix ===== */
#hotspots{pointer-events:none!important}
#hotspots .hit{pointer-events:all!important;cursor:default!important}
#hotspots .found-outline,#hotspots .hint-ring{pointer-events:none!important}


/* ===== v13-consolidation ===== */
/* Story 1 stays untouched. These screens get a local, soft gradient only. */
#finish .storyShade,
#story3 .storySoftShade,
#endScreen .endShade {
  background:
    radial-gradient(ellipse at 29% 49%,
      rgba(3,14,12,.80) 0%,
      rgba(3,14,12,.62) 31%,
      rgba(3,14,12,.28) 54%,
      rgba(3,14,12,.08) 67%,
      rgba(3,14,12,0) 78%) !important;
  width:72% !important;
  right:auto !important;
  left:0 !important;
  border-radius:0 !important;
}
#finish .storyCopy,#story3 .storyOverlayCopy,#endScreen .endCopy {
  background:none!important; box-shadow:none!important;
}
#finish .storyLogo,#story3 .overlayLogo,#endScreen .overlayLogo {
  width:min(320px,75%)!important;height:auto!important;
}

/* Definitive bone icon, never old star/BOT text. */
#desktopBone,#bonus{font-size:0!important}
#desktopBone::before,#desktopBone::after,#bonus::before,#bonus::after{content:none!important}
#desktopBoneIcon{display:block!important}
#mobileBoneIcon{display:block!important}

/* Full search shell for Levels 2 and 3 */
.sharedSearchShell{
  position:fixed;inset:0;z-index:120;display:none;
  align-items:center;justify-content:center;
  background:url("assets/eeb9f6a80418.webp") center/cover no-repeat;
  overflow:hidden;
}
.sharedSearchBackdrop{position:absolute;inset:0;background:radial-gradient(ellipse at center,transparent 42%,rgba(0,0,0,.18));pointer-events:none}
.sharedSearchSceneFrame{
  position:absolute;left:50%;top:calc(50% - 54px);transform:translate(-50%,-50%);
  width:min(calc((100vh - 150px)*1.77778),94vw);aspect-ratio:16/9;
  outline:1px solid rgba(191,151,76,.72);
  box-shadow:0 0 0 4px #2a1a12,0 0 0 5px rgba(191,151,76,.48),0 8px 24px rgba(0,0,0,.45);
  overflow:hidden;background:#111;
}
.sharedSearchScene{width:100%;height:100%;object-fit:cover;display:block}
.sharedDesktopPanel{
  position:absolute;left:50%;bottom:0;transform:translateX(-50%);
  width:min(1180px,96vw);height:112px;
  background:url("assets/3eebd207aea0.webp") center/100% 100% no-repeat;
  display:grid;grid-template-columns:205px 1fr 215px;align-items:center;
  color:#f3e7cb;font-family:Georgia,'Times New Roman',serif;
}
.sharedScore{text-align:center;transform:translateX(-8px)}
.sharedScore span{display:block;font-size:12px;letter-spacing:.12em}
.sharedScore strong{display:block;font-size:22px;margin-top:3px}
.sharedDesktopItems{
  align-self:center;position:relative;top:10px;
  display:grid;grid-template-columns:repeat(5,1fr);grid-template-rows:repeat(3,auto);
  gap:5px 10px;text-align:center;font-size:13px;line-height:1.05;
}
.sharedActions{
  display:grid;grid-template-columns:58px 42px;grid-template-rows:38px 36px;
  justify-content:end;align-content:center;gap:7px 8px;padding-right:18px;
}
.sharedBone{width:55px;height:29px;object-fit:contain;align-self:center}
.sharedSound,.sharedHint,.sharedMobileSound,.sharedMobileHint{
  border:1px solid rgba(180,137,61,.75);background:linear-gradient(#6b4b25,#3d2817);
  color:#f4e5bd;box-shadow:inset 0 1px rgba(255,255,255,.12);cursor:pointer;
}
.sharedSound{width:40px;height:36px;border-radius:13px}
.sharedHint{grid-column:1/3;width:110px;height:35px;border-radius:14px;justify-self:end;background:linear-gradient(#d4ad50,#9d742c);color:#24170c;font-weight:700}
.sharedMobileHud{display:none}
.testSceneLabel{position:absolute;left:10px;top:10px;z-index:4}
.sceneSkip{z-index:5}

/* Credits / teaser */
.creditsOverlay{display:none;position:fixed;inset:0;z-index:180;background:#06100f;overflow:hidden}
.creditsBg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.creditsContent{
  position:absolute;left:6%;top:5%;bottom:5%;width:min(650px,57vw);
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  text-align:center;color:#f3ead5;text-shadow:0 2px 6px rgba(0,0,0,.75);
}
.creditsSeriesLogo{width:min(390px,70%);height:auto;margin-bottom:2px}
.creditsEyebrow{font:600 14px/1.2 Georgia,serif;letter-spacing:.12em;text-transform:uppercase;color:#d8c08a;margin-top:0}
.creditsContent h1{font:700 clamp(28px,3.1vw,48px)/1.05 Georgia,serif;color:#ead19a;margin:8px 0 12px}
.creditsTagline{font:18px/1.45 Georgia,serif;margin:0 0 9px}
.creditsSoon{margin:0 0 13px;font-size:15px}
#waitlistBtn{margin:0 0 7px}
.creditsNote{font-size:12px;opacity:.84}
.creditsFooter{margin-top:17px;display:flex;align-items:center;gap:14px;text-align:left;font-size:12px;line-height:1.5}
.creditsFooter img{width:92px;height:58px;object-fit:contain}
.creditsFooter span{opacity:.82}
.creditsRestart{margin-top:10px;border:0;background:none;color:#e8d8b5;text-decoration:underline;cursor:pointer;font-size:12px}
.nextTease{margin-top:14px!important;color:#f0ddb2!important}

/* Mobile shell for level 2/3 */
@media (max-width:900px), (pointer:coarse) and (max-height:500px) and (orientation:landscape){
 .sharedSearchSceneFrame{top:50%;width:96vw;max-height:86vh}
 .sharedDesktopPanel{display:none}
 .sharedMobileHud{display:block;position:absolute;inset:0;pointer-events:none}
 .sharedMobileProgress{position:absolute;left:8px;top:8px;background:rgba(10,38,32,.92);border:1px solid #9a783f;border-radius:12px;padding:7px 10px;color:#f1e2c0;font-size:11px}
 .sharedMobileBone{position:absolute;left:113px;top:10px;width:48px;height:25px;object-fit:contain}
 .sharedMobileSound,.sharedMobileHint,.sharedDrawerTab,.sharedDrawer,.sharedDrawerClose{pointer-events:auto}
 .sharedMobileSound{position:absolute;right:82px;top:8px;width:34px;height:31px;border-radius:12px}
 .sharedMobileHint{position:absolute;right:8px;top:8px;width:68px;height:31px;border-radius:12px;background:linear-gradient(#d4ad50,#9d742c);color:#24170c;font-weight:700}
 .sharedDrawerTab{position:absolute;right:0;top:50%;transform:translateY(-50%);padding:9px 8px;background:linear-gradient(90deg,#2b1a12,#51311e);border:1px solid #9a783f;border-right:0;border-radius:10px 0 0 10px;color:#f1e2c0;font-size:10px;writing-mode:vertical-rl}
 .sharedDrawer{position:absolute;right:-230px;top:0;width:210px;height:100%;padding:48px 14px 14px;background:linear-gradient(rgba(12,43,36,.98),rgba(7,28,24,.98));border-left:1px solid #9a783f;color:#f0e6d2;transition:right .22s ease;overflow:auto}
 .sharedDrawer.open{right:0}
 .sharedDrawer h2{text-align:center;font:13px Georgia,serif;letter-spacing:.13em;border-bottom:1px solid rgba(184,145,70,.55);padding-bottom:9px}
 .sharedDrawerClose{position:absolute;right:8px;top:8px;width:30px;height:30px;border:1px solid #9a783f;border-radius:9px;background:#3b2719;color:#ead9b4}
 .shellItem{padding:6px 3px;border-bottom:1px solid rgba(194,157,85,.13);font-size:12px}
 .creditsContent{left:3%;top:3%;bottom:3%;width:61vw;justify-content:center}
 .creditsSeriesLogo{width:min(280px,72%)}
 .creditsContent h1{font-size:clamp(22px,4vw,34px);margin:5px 0 8px}
 .creditsTagline{font-size:13px}
 .creditsSoon{font-size:12px}
 .creditsFooter{margin-top:8px;font-size:10px}
 .creditsFooter img{width:68px;height:42px}
}


/* ===== v13-1-layout-corrections ===== */
/* Level 2 + 3 now use Level 1's exact desktop geometry: 172px panel and a 16:9 scene above it. */
@media (min-width:901px) and (pointer:fine), (min-width:901px) and (pointer:none), (min-width:901px) and (min-height:500.01px), (min-width:901px) and (orientation:portrait){
  #level2Search.sharedSearchShell,#level3Search.sharedSearchShell{
    display:none;
    position:fixed;inset:0;z-index:120;
    background:url("assets/eeb9f6a80418.webp") center/cover no-repeat!important;
    overflow:hidden;
  }
  #level2Search .sharedSearchBackdrop,#level3Search .sharedSearchBackdrop{
    position:absolute;left:0;right:0;top:0;bottom:172px;
    background:transparent!important;
  }
  #level2Search .sharedSearchSceneFrame,#level3Search .sharedSearchSceneFrame{
    position:absolute!important;
    top:0!important;bottom:172px!important;left:0!important;right:0!important;
    width:auto!important;height:auto!important;aspect-ratio:auto!important;
    transform:none!important;
    display:flex;align-items:center;justify-content:center;
    overflow:hidden;background:transparent!important;
    outline:0!important;box-shadow:none!important;
  }
  #level2Search .sharedSearchScene,#level3Search .sharedSearchScene{
    display:block;
    width:auto!important;height:100%!important;
    max-width:100%!important;
    object-fit:contain!important;
    border:4px solid #2b1b12;
    outline:1px solid rgba(206,168,83,.82);
    box-shadow:0 0 0 1px rgba(28,17,10,.95),0 7px 22px rgba(0,0,0,.38);
    box-sizing:border-box;
  }
  #level2Search .sharedDesktopPanel,#level3Search .sharedDesktopPanel{
    position:fixed!important;left:0!important;right:0!important;bottom:0!important;
    transform:none!important;width:100%!important;height:172px!important;
    box-sizing:border-box;
    display:grid!important;
    grid-template-columns:185px minmax(0,1fr) 205px!important;
    gap:22px!important;
    align-items:center!important;
    padding:18px 43px 31px!important;
    background-color:#123c33!important;
    background-image:url("assets/3eebd207aea0.webp")!important;
    background-position:center!important;
    background-size:100% 172px!important;
    background-repeat:no-repeat!important;
    border:0!important;
    box-shadow:0 -8px 28px rgba(0,0,0,.32)!important;
    color:#f4ead1;
  }
  #level2Search .sharedScore,#level3Search .sharedScore{
    transform:translate(31px,-7px)!important;
    text-align:center!important;padding:0 12px 0 4px!important;
    font-family:Georgia,'Times New Roman',serif;
  }
  #level2Search .sharedScore span,#level3Search .sharedScore span{
    display:block;font-size:12px!important;letter-spacing:.16em;color:#d9bd70;margin-bottom:4px
  }
  #level2Search .sharedScore strong,#level3Search .sharedScore strong{font-size:31px!important}
  #level2Search .sharedDesktopItems,#level3Search .sharedDesktopItems{
    position:relative!important;top:2px!important;
    transform:translateY(2px)!important;
    display:grid!important;grid-template-columns:repeat(5,minmax(0,1fr))!important;
    grid-template-rows:repeat(3,auto)!important;
    gap:11px 20px!important;padding:0 7px!important;
    align-content:center;text-align:left!important;
    font-family:Arial,sans-serif;font-size:17px!important;line-height:1.22!important;
  }
  #level2Search .sharedDesktopItems span,#level3Search .sharedDesktopItems span{
    position:relative;padding-left:19px;white-space:normal;
  }
  #level2Search .sharedDesktopItems span:before,#level3Search .sharedDesktopItems span:before{
    content:"";position:absolute;left:0;top:.42em;width:7px;height:7px;
    border:1px solid #d6b765;border-radius:50%;
  }
  #level2Search .sharedActions,#level3Search .sharedActions{
    transform:translate(-31px,-7px)!important;
    display:flex!important;flex-direction:column!important;
    justify-content:center!important;align-items:center!important;
    gap:7px!important;padding:0!important;
  }
  #level2Search .sharedActions:before,#level3Search .sharedActions:before{content:"";display:none}
  #level2Search .sharedBone,#level3Search .sharedBone{width:58px!important;height:31px!important;object-fit:contain}
  #level2Search .sharedSound,#level3Search .sharedSound{
    position:absolute;right:8px;top:0;width:42px!important;height:38px!important;border-radius:12px!important;
  }
  #level2Search .sharedHint,#level3Search .sharedHint{
    width:126px!important;height:37px!important;border-radius:13px!important;
    font-size:13px!important;padding:0 12px!important;margin-top:4px;
  }
  #level2Search .testSceneLabel,#level3Search .testSceneLabel{left:18px;top:16px}
  #level2Search .sceneSkip,#level3Search .sceneSkip{right:18px;top:16px}
}

/* On mobile, retain the same compact Level 1 HUD proportions. */
@media (max-width:900px), (pointer:coarse) and (max-height:500px) and (orientation:landscape){
 #level2Search .sharedSearchSceneFrame,#level3Search .sharedSearchSceneFrame{
   position:absolute;inset:0!important;transform:none!important;width:100%!important;height:100%!important;
   display:flex;align-items:center;justify-content:center;background:transparent!important;
 }
 #level2Search .sharedSearchScene,#level3Search .sharedSearchScene{
   width:100%!important;height:100%!important;object-fit:contain!important;
 }
}

/* Credits screen uses the same centered 16:9 game window as the other story screens. */
#creditsScreen{
  align-items:center!important;justify-content:center!important;
  background:radial-gradient(ellipse at 50% 42%,#17251f 0%,#101a16 48%,#070c0a 100%)!important;
}
#creditsScreen .creditsCard{
  position:relative;width:min(100vw,calc(100vh * 16 / 9));aspect-ratio:16/9;
  max-height:100vh;overflow:hidden;background:#07120f;
  box-shadow:0 16px 55px rgba(0,0,0,.42);
}
#creditsScreen .creditsBg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
#creditsScreen .creditsContent{
  position:absolute!important;left:6%!important;top:5%!important;bottom:5%!important;
  width:min(650px,57%)!important;
}


/* ===== v14-final-consolidation ===== */
#finish,#story3,#endScreen{padding:0!important;background:radial-gradient(ellipse at 50% 46%,#172a24 0%,#0d1b17 58%,#08110f 100%)!important;align-items:center!important;justify-content:center!important}
#finish .textSceneTemplate,#story3 .textSceneTemplate,#endScreen .textSceneTemplate{position:relative!important;width:min(1280px,100vw)!important;aspect-ratio:16/9!important;max-height:100vh!important;min-height:0!important;overflow:hidden!important;background:#07130f!important;box-shadow:0 30px 100px rgba(0,0,0,.5)!important}
#finish .titleArtwork,#story3 .titleArtwork,#endScreen .titleArtwork{position:absolute!important;inset:0!important;width:100%!important;height:100%!important;object-fit:cover!important;object-position:center!important;pointer-events:none!important}
#finish .titleShade,#story3 .titleShade,#endScreen .titleShade{position:absolute!important;inset:0!important;width:auto!important;right:0!important;background:linear-gradient(90deg,rgba(4,13,11,.90) 0%,rgba(5,17,14,.76) 28%,rgba(7,20,16,.30) 52%,rgba(7,20,16,.03) 72%)!important;border-radius:0!important}
#finish .titleCopy,#story3 .titleCopy,#endScreen .titleCopy{position:absolute!important;z-index:2!important;left:6.5%!important;top:50%!important;transform:translateY(-50%)!important;width:min(470px,42%)!important;color:#f4ead4!important;text-align:left!important;text-shadow:0 2px 4px rgba(0,0,0,.55)!important;background:none!important;box-shadow:none!important}
#finish .storyLogoMain,#story3 .storyLogoMain,#endScreen .storyLogoMain{width:min(410px,92%)!important;height:auto!important}
#endScreen .nextTease{margin-top:14px!important;color:#f0ddb2!important}
#level2Search.sharedSearchShell,#level3Search.sharedSearchShell{position:fixed!important;inset:0!important;z-index:120!important;background-color:#07120f!important;background-image:url("assets/eeb9f6a80418.webp")!important;background-position:center!important;background-size:cover!important;background-repeat:no-repeat!important;overflow:hidden!important}
#level2Search .sharedSearchBackdrop,#level3Search .sharedSearchBackdrop{display:none!important}
#level2Search .sharedSearchSceneFrame,#level3Search .sharedSearchSceneFrame{position:absolute!important;left:0!important;right:0!important;top:0!important;bottom:172px!important;width:auto!important;height:auto!important;aspect-ratio:auto!important;transform:none!important;display:flex!important;align-items:center!important;justify-content:center!important;overflow:hidden!important;background:transparent!important;outline:0!important;box-shadow:none!important}
#level2Search .sharedSearchScene,#level3Search .sharedSearchScene{display:block!important;width:auto!important;height:auto!important;max-width:calc(100% - 10px)!important;max-height:calc(100% - 10px)!important;object-fit:contain!important;border:0!important;outline:1px solid rgba(191,151,76,.72)!important;box-shadow:0 0 0 4px #2a1a12,0 0 0 5px rgba(191,151,76,.48),0 8px 24px rgba(0,0,0,.45)!important;transform-origin:center center!important;transition:transform .12s ease!important}
#level2Search .sharedDesktopPanel,#level3Search .sharedDesktopPanel{display:grid!important;position:fixed!important;z-index:130!important;left:0!important;right:0!important;bottom:0!important;transform:none!important;width:100%!important;height:172px!important;grid-template-columns:185px minmax(0,1fr) 205px!important;gap:22px!important;align-items:center!important;padding:18px 43px 31px!important;box-sizing:border-box!important;background-color:#123c33!important;background-image:url("assets/066b899f9fd4.webp")!important;background-size:100% 172px!important;background-position:center!important;background-repeat:no-repeat!important;border:0!important;box-shadow:0 -8px 28px rgba(0,0,0,.30)!important;color:#f4ead1!important}
#level2Search .sharedScore,#level3Search .sharedScore{position:relative!important;left:-9px!important;top:0!important;transform:none!important;padding:0 12px 0 4px!important;text-align:center!important;align-items:center!important}
#level2Search .sharedScore span,#level3Search .sharedScore span{display:block!important;font-size:12px!important;letter-spacing:.16em!important;color:#d9bd70!important;margin-bottom:4px!important}
#level2Search .sharedScore strong,#level3Search .sharedScore strong{font-size:31px!important}
#level2Search .sharedDesktopItems,#level3Search .sharedDesktopItems{position:relative!important;top:12px!important;transform:none!important;display:grid!important;grid-template-columns:repeat(5,minmax(0,1fr))!important;grid-template-rows:repeat(3,auto)!important;gap:11px 20px!important;padding:0 7px!important;align-content:center!important;text-align:left!important;font-family:Arial,sans-serif!important;font-size:17px!important;line-height:1.22!important}
#level2Search .sharedDesktopItems span,#level3Search .sharedDesktopItems span{position:relative!important;padding-left:19px!important}
#level2Search .sharedDesktopItems span:before,#level3Search .sharedDesktopItems span:before{content:""!important;position:absolute!important;left:0!important;top:.42em!important;width:7px!important;height:7px!important;border:1px solid #d6b765!important;border-radius:50%!important}
#level2Search .sharedActions,#level3Search .sharedActions{position:relative!important;left:18px!important;top:0!important;transform:none!important;padding:0!important;display:flex!important;flex-direction:column!important;justify-content:center!important;align-items:flex-end!important;gap:7px!important}
#level2Search .sharedBone,#level3Search .sharedBone{position:absolute!important;right:56px!important;top:1px!important;width:55px!important;height:29px!important;object-fit:contain!important}
#level2Search .sharedSound,#level3Search .sharedSound{position:absolute!important;right:8px!important;top:0!important;width:40px!important;height:36px!important;border-radius:13px!important}
#level2Search .sharedHint,#level3Search .sharedHint{width:110px!important;height:35px!important;border-radius:14px!important;font-size:12px!important;align-self:flex-end!important;margin-top:44px!important}
#level2Search .sharedZoom,#level3Search .sharedZoom{position:absolute!important;left:12px!important;bottom:184px!important;z-index:140!important;display:flex!important;gap:6px!important}
#level2Search .sharedZoom button,#level3Search .sharedZoom button{width:38px!important;height:38px!important;border:1px solid rgba(202,169,94,.72)!important;border-radius:10px!important;background:rgba(10,47,39,.92)!important;color:#f3e3bd!important;font-size:22px!important;line-height:1!important;cursor:pointer!important}
#level2Search .testSceneLabel,#level3Search .testSceneLabel{left:14px!important;top:12px!important}
#level2Search .sceneSkip,#level3Search .sceneSkip{right:14px!important;top:12px!important}
#creditsScreen{padding:0!important;align-items:center!important;justify-content:center!important;background:radial-gradient(ellipse at 50% 46%,#172a24 0%,#0d1b17 58%,#08110f 100%)!important}
#creditsScreen .creditsCard{position:relative!important;width:min(1280px,100vw)!important;aspect-ratio:16/9!important;max-height:100vh!important;overflow:hidden!important;background:#07130f!important;box-shadow:0 30px 100px rgba(0,0,0,.5)!important}
#creditsScreen .creditsBg{position:absolute!important;inset:0!important;width:100%!important;height:100%!important;object-fit:cover!important}
#creditsScreen .creditsContent{position:absolute!important;left:6.5%!important;top:5%!important;bottom:5%!important;width:min(560px,44%)!important}
@media (max-width:900px), (pointer:coarse) and (max-height:500px) and (orientation:landscape){#finish .textSceneTemplate,#story3 .textSceneTemplate,#endScreen .textSceneTemplate,#creditsScreen .creditsCard{width:100%!important;min-height:420px!important;aspect-ratio:auto!important;max-height:none!important}#finish .titleArtwork,#story3 .titleArtwork,#endScreen .titleArtwork{object-position:62% center!important}#finish .titleCopy,#story3 .titleCopy,#endScreen .titleCopy{left:7%!important;width:62%!important}#level2Search .sharedDesktopPanel,#level3Search .sharedDesktopPanel{display:none!important}#level2Search .sharedSearchSceneFrame,#level3Search .sharedSearchSceneFrame{inset:0!important;bottom:0!important}#level2Search .sharedMobileHud,#level3Search .sharedMobileHud{display:block!important}#level2Search .sharedZoom,#level3Search .sharedZoom{left:8px!important;bottom:8px!important}}


/* ===== v15-level2-playable ===== */
/* Level 2 uses the same search-screen proportions as Level 1. */
#level2Search.l2Overlay{display:none;position:fixed;inset:0;z-index:120;background:#07120f url("assets/eeb9f6a80418.webp") center/cover no-repeat;overflow:hidden;touch-action:none}
#l2GameArea{position:absolute;left:0;right:0;top:0;bottom:172px;overflow:hidden;touch-action:none}
#l2World{position:absolute;left:0;top:0;width:1672px;height:941px;transform-origin:0 0}
#l2Scene{position:absolute;inset:0;width:1672px;height:941px;display:block;user-select:none;pointer-events:none;outline:1px solid rgba(191,151,76,.72);box-shadow:0 0 0 4px #2a1a12,0 0 0 5px rgba(191,151,76,.48),0 8px 24px rgba(0,0,0,.45)}
#l2Hotspots{position:absolute;inset:0;width:1672px;height:941px;overflow:visible;pointer-events:none}
.l2Hit{fill:transparent;stroke:transparent;stroke-width:16;stroke-linejoin:round;pointer-events:all;cursor:default}
.l2FoundOutline{fill:rgba(255,211,76,.08);stroke:#ffd34c;stroke-width:5;stroke-linejoin:round;vector-effect:non-scaling-stroke;pointer-events:none}
.l2HintRing{fill:none;stroke:#ffd34c;stroke-width:7;vector-effect:non-scaling-stroke;pointer-events:none;animation:pulse 1s ease-in-out 3}
#l2Message{position:absolute;z-index:145;left:50%;top:12px;transform:translateX(-50%);background:rgba(8,55,45,.94);padding:9px 15px;border-radius:11px;font-weight:800;opacity:0;transition:opacity .15s;white-space:nowrap;pointer-events:none}
#l2Message.show{opacity:1}
#level2Search #testSkip2{z-index:146;right:14px;top:12px}
#l2Zoom{position:absolute;z-index:145;left:12px;bottom:184px;display:flex;gap:6px}
#l2Zoom button{width:42px;height:42px;border:0;border-radius:10px;background:rgba(8,55,45,.94);color:#fff;font-size:22px;font-weight:900}

/* Literal Level-1-style desktop bar. */
#l2DesktopPanel{display:grid;position:absolute;z-index:140;left:0;right:0;bottom:0;height:172px;grid-template-columns:185px minmax(0,1fr) 205px;gap:22px;align-items:center;padding:18px 43px 31px;background-color:#123c33;background-image:url("assets/066b899f9fd4.webp");background-size:100% 172px;background-position:center;background-repeat:no-repeat;box-shadow:0 -8px 28px rgba(0,0,0,.30);color:#f4ead1;pointer-events:auto}
.l2Score{position:relative;left:-9px;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:0 12px 0 4px}
.l2Score .scoreLabel{font-size:12px;letter-spacing:.16em;color:#d9bd70;margin-bottom:4px}
.l2Score strong{font-family:Georgia,'Times New Roman',serif;font-size:31px}
#l2DesktopList{position:relative;top:12px;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:11px 20px;padding:0 7px;align-content:center;min-width:0}
.l2Item{position:relative;padding:0 0 0 19px;font-size:17px;line-height:1.22;color:#f0e7d2;text-shadow:0 1px 2px #000}
.l2Item:before{content:'○';position:absolute;left:0;color:#e5c66d}
.l2Item.done{opacity:.42;text-decoration:line-through}
.l2Item.done:before{content:'✓';text-decoration:none;color:#f4d86f;font-weight:900}
#l2DesktopActions{position:relative;left:18px;display:flex;flex-direction:column;justify-content:center;align-items:flex-end;gap:7px}
.l2DesktopTopActions{display:grid;grid-template-columns:58px 40px;justify-content:end;gap:8px}
#l2DesktopBone{height:36px;display:flex;align-items:center;justify-content:center}
#l2DesktopBone img{width:55px;height:29px;object-fit:contain}
#l2DesktopSound{width:40px;height:36px;border:1px solid #806c42;border-radius:13px;background:rgba(12,41,34,.68);color:#f1dfb1;font-size:18px}
#l2DesktopHint{width:110px;height:35px;border:1px solid #9c6b22;border-radius:14px;background:linear-gradient(#e8c45e,#c8952f);color:#34200b;font-weight:900;font-size:12px;box-shadow:inset 0 1px rgba(255,255,255,.35),0 2px 4px rgba(0,0,0,.28)}

#l2MobileHud{display:none}
@media (max-width:900px), (pointer:coarse) and (max-height:500px) and (orientation:landscape){
 #l2GameArea{bottom:0}
 #l2DesktopPanel{display:none!important}
 #l2MobileHud{display:block;position:absolute;inset:0;z-index:140;pointer-events:none}
 #l2MobileProgressRow{position:absolute;left:8px;top:8px;display:flex;gap:5px;align-items:center;max-width:calc(100% - 176px);pointer-events:none}
 #l2Progress,.l2BonePill{position:static!important;padding:8px 10px;border-radius:10px;font-size:12px}
 .l2BonePill img{display:block;width:44px;height:23px;object-fit:contain}
 #l2MobileHint,#l2MobileSound,#l2DrawerTab,#l2Drawer,#l2DrawerClose{pointer-events:auto}
 #l2MobileHint{position:absolute;right:50px;top:8px;width:68px;height:32px;border:0;border-radius:12px;background:#ffd34c;color:#20352e;font-weight:900}
 #l2MobileSound{position:absolute;right:8px;top:8px;width:36px;height:32px;border:0;border-radius:12px;background:rgba(8,55,45,.94);color:#fff}
 #l2DrawerTab{position:absolute;right:0;top:50%;transform:translateY(-50%);background:linear-gradient(90deg,#2b1a12,#51311e);color:#f1e2c0;border:1px solid #9a783f;border-right:0;border-radius:10px 0 0 10px;padding:10px 8px;font-weight:900;writing-mode:vertical-rl}
 #l2Drawer{position:absolute;right:0;top:0;height:100%;width:min(300px,76vw);background:rgba(7,32,27,.97);padding:64px 18px 20px;transform:translateX(100%);transition:transform .2s ease;overflow:auto;border-left:1px solid #9a783f}
 #l2Drawer.open{transform:translateX(0)}
 #l2DrawerClose{position:absolute;right:9px;top:9px;width:31px;height:31px;border:1px solid #9a783f;border-radius:9px;background:#3b2719;color:#ead9b4}
 #l2Drawer h2{font-size:17px;margin:0 0 12px;text-align:center}
 .l2DrawerItem{padding:7px 0;border-bottom:1px solid rgba(255,255,255,.09);font-size:14px}
 .l2DrawerItem.done{text-decoration:line-through;opacity:.42}
 #l2Zoom{left:8px;bottom:8px}
 #level2Search #testSkip2{top:52px;right:8px}
}


/* ===== v16-search1-master ===== */
/* SEARCH SCREEN 1 MASTER: three independent artwork slices. */
@media (min-width:901px) and (pointer:fine), (min-width:901px) and (pointer:none), (min-width:901px) and (min-height:500.01px), (min-width:901px) and (orientation:portrait){
  #desktopPanel{
    height:172px!important;
    display:grid!important;
    grid-template-columns:225px minmax(0,1fr) 244px!important;
    gap:0!important;
    align-items:stretch!important;
    padding:0!important;
    background-color:#123c33!important;
    background-image:url("assets/ff9aecf14e1e.webp"),url("assets/329fb0678777.webp"),url("assets/1e1231ae9a65.webp")!important;
    background-position:left center,right center,center center!important;
    background-size:225px 172px,244px 172px,100% 172px!important;
    background-repeat:no-repeat,no-repeat,no-repeat!important;
    box-shadow:0 -8px 28px rgba(0,0,0,.32)!important;
    overflow:hidden!important;
  }
  #game{bottom:172px!important}
  #zoom{bottom:184px!important}

  #desktopPanel .score{
    transform:none!important;
    margin:0!important;
    padding:8px 18px 0 16px!important;
    display:flex!important;
    flex-direction:column!important;
    align-items:center!important;
    justify-content:center!important;
    text-align:center!important;
    min-width:0!important;
  }
  #desktopPanel .score:before{display:none!important}
  #desktopPanel .score .scoreLabel{
    display:block!important;
    margin:0 0 5px!important;
    font:600 12px/1.1 Georgia,'Times New Roman',serif!important;
    letter-spacing:.16em!important;
    color:#d9bd70!important;
  }
  #desktopPanel .score strong{
    font:500 32px/1 Georgia,'Times New Roman',serif!important;
    color:#fff0c8!important;
  }

  #desktopList{
    transform:translateY(9px)!important;
    margin:0!important;
    padding:17px 34px 16px!important;
    display:grid!important;
    grid-template-columns:repeat(5,minmax(0,1fr))!important;
    grid-template-rows:repeat(3,auto)!important;
    align-content:center!important;
    gap:9px 20px!important;
    min-width:0!important;
  }
  #desktopList .item{
    margin:0!important;
    padding:0 3px 0 18px!important;
    font:400 16px/1.2 Arial,sans-serif!important;
    color:#f0e7d2!important;
    white-space:normal!important;
    overflow:visible!important;
    text-overflow:clip!important;
    text-shadow:0 1px 2px rgba(0,0,0,.9)!important;
  }
  #desktopList .item:before{
    left:0!important;
    top:.43em!important;
  }

  #desktopActions{
    transform:none!important;
    margin:0!important;
    padding:8px 17px 0 12px!important;
    display:flex!important;
    flex-direction:column!important;
    justify-content:center!important;
    align-items:center!important;
    gap:8px!important;
    min-width:0!important;
  }
  .desktopTopActions{
    width:156px!important;
    display:grid!important;
    grid-template-columns:100px 46px!important;
    gap:8px!important;
  }
  #desktopBone{
    width:100px!important;
    height:42px!important;
    border:0!important;
    background:transparent!important;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
  }
  #desktopBoneIcon{width:72px!important;height:38px!important;object-fit:contain!important}
  #desktopSound{width:46px!important;height:42px!important}
  #desktopHint{width:156px!important;height:43px!important;font-size:15px!important}
}

/* The cat is intentionally invisible as a hotspot. */
#hotspots .ambient-hit{fill:transparent!important;stroke:transparent!important;pointer-events:all!important;cursor:default!important}


/* ===== v17-search1-finetune ===== */
@media (min-width:901px) and (pointer:fine), (min-width:901px) and (pointer:none), (min-width:901px) and (min-height:500.01px), (min-width:901px) and (orientation:portrait){
  #desktopPanel .score{
    padding:8px 10px 0 2px!important;
    transform:translateX(-14px)!important;
  }
  #desktopPanel .score .scoreLabel,
  #desktopPanel .score strong{
    position:relative!important;
    left:-7px!important;
  }
  #desktopList{
    transform:translateY(-2px)!important;
    padding:11px 34px 20px!important;
  }
  #desktopActions{
    padding:4px 9px 0 6px!important;
    gap:6px!important;
  }
  .desktopTopActions{
    width:128px!important;
    grid-template-columns:76px 42px!important;
    gap:6px!important;
    justify-content:center!important;
  }
  #desktopBone{
    width:76px!important;
    height:36px!important;
  }
  #desktopBoneIcon{
    width:56px!important;
    height:28px!important;
  }
  #desktopSound{
    width:42px!important;
    height:38px!important;
    border-radius:12px!important;
  }
  #desktopHint{
    width:auto!important;
    min-width:108px!important;
    max-width:122px!important;
    height:36px!important;
    padding:0 14px!important;
    display:inline-flex!important;
    align-items:center!important;
    justify-content:center!important;
    align-self:center!important;
    border-radius:12px!important;
    font-size:13px!important;
    line-height:1!important;
    margin-top:1px!important;
    white-space:nowrap!important;
  }
}


/* ===== v18-search1-finetune-2 ===== */
@media (min-width:901px) and (pointer:fine), (min-width:901px) and (pointer:none), (min-width:901px) and (min-height:500.01px), (min-width:901px) and (orientation:portrait){
  #desktopPanel .score{
    padding:8px 10px 0 4px!important;
    transform:translateX(-10px)!important;
  }
  #desktopPanel .score .scoreLabel,
  #desktopPanel .score strong{
    left:-3px!important;
  }

  #desktopActions{
    display:grid!important;
    grid-template-columns:42px 80px!important;
    grid-template-rows:32px 36px!important;
    width:130px!important;
    gap:5px 8px!important;
    padding:2px 6px 0 0!important;
    align-content:center!important;
    justify-content:center!important;
  }
  .desktopTopActions{
    display:contents!important;
    width:auto!important;
  }
  #desktopSound{
    grid-column:1!important;
    grid-row:1 / span 2!important;
    width:42px!important;
    height:38px!important;
    align-self:center!important;
    justify-self:center!important;
    border-radius:12px!important;
  }
  #desktopBone{
    grid-column:2!important;
    grid-row:1!important;
    width:80px!important;
    height:31px!important;
    align-self:end!important;
    justify-self:center!important;
  }
  #desktopBoneIcon{
    width:58px!important;
    height:28px!important;
  }
  #desktopHint{
    grid-column:2!important;
    grid-row:2!important;
    width:80px!important;
    min-width:80px!important;
    max-width:80px!important;
    height:36px!important;
    padding:0 8px!important;
    align-self:start!important;
    justify-self:center!important;
    margin-top:0!important;
    border-radius:12px!important;
    font-size:13px!important;
    white-space:nowrap!important;
  }
}


/* ===== v19-search1-right-controls ===== */
@media (min-width:901px) and (pointer:fine), (min-width:901px) and (pointer:none), (min-width:901px) and (min-height:500.01px), (min-width:901px) and (orientation:portrait){
  #desktopActions{
    transform:translateX(-12px)!important;
  }
  #desktopBone{
    transform:translate(-8px,-5px)!important;
  }
  #desktopHint{
    transform:translateX(-8px)!important;
  }
  #desktopSound{
    transform:translateX(-10px)!important;
    background:transparent!important;
    border:0!important;
    box-shadow:none!important;
    padding:0!important;
  }
  #desktopSoundIcon{
    width:34px!important;
    height:34px!important;
    object-fit:contain!important;
    display:block!important;
    pointer-events:none!important;
  }
}
#sound{background:transparent!important;border:0!important;box-shadow:none!important;padding:0!important}
#soundIcon{width:29px!important;height:29px!important;object-fit:contain!important;display:block!important;pointer-events:none!important}


/* ===== v22-search1-rightpanel-bigshift ===== */
@media (min-width:901px) and (pointer:fine), (min-width:901px) and (pointer:none), (min-width:901px) and (min-height:500.01px), (min-width:901px) and (orientation:portrait){
  /* Larger correction based on the latest screenshot. */
  #desktopSound{
    position:relative!important;
    left:8px!important;
    width:52px!important;
    height:52px!important;
  }
  #desktopSound img,
  #desktopSoundIcon{
    width:40px!important;
    height:40px!important;
    object-fit:contain!important;
    display:block!important;
  }
  #desktopBone{
    position:relative!important;
    left:79px!important;
    transform:translate(0,-9px)!important;
  }
  #desktopHint{
    position:relative!important;
    left:79px!important;
  }
}


/* ===== v23-search1-rightpanel-finalalign ===== */
@media (min-width:901px) and (pointer:fine), (min-width:901px) and (pointer:none), (min-width:901px) and (min-height:500.01px), (min-width:901px) and (orientation:portrait){
  #desktopBone{
    position:relative!important;
    left:0!important;
    transform:translate(0,-5px)!important;
  }
  #desktopHint{
    position:relative!important;
    left:-4px!important;
  }
}


/* ===== v24-search1-rightpanel-clean ===== */
@media (min-width:901px) and (pointer:fine), (min-width:901px) and (pointer:none), (min-width:901px) and (min-height:500.01px), (min-width:901px) and (orientation:portrait){
  /* Clean slate for search screen 1 right controls. */
  #desktopActions{
    transform:none!important;
    position:relative!important;
    left:0!important;
    top:0!important;
  }
  .desktopTopActions{
    transform:none!important;
  }
  #desktopSound{
    position:relative!important;
    left:8px!important;
    top:0!important;
    transform:none!important;
    width:52px!important;
    height:52px!important;
  }
  #desktopSound img,
  #desktopSoundIcon{
    width:40px!important;
    height:40px!important;
    object-fit:contain!important;
    display:block!important;
  }
  #desktopBone{
    position:relative!important;
    left:43px!important;
    top:-5px!important;
    transform:none!important;
  }
  #desktopHint{
    position:relative!important;
    left:43px!important;
    top:0!important;
    transform:none!important;
  }
}


/* ===== v25-search1-microalign ===== */
@media (min-width:901px) and (pointer:fine), (min-width:901px) and (pointer:none), (min-width:901px) and (min-height:500.01px), (min-width:901px) and (orientation:portrait){
  /* Slight final refinement based on latest screenshot. */
  #desktopSound{
    left:2px!important;
  }
  #desktopBone{
    left:58px!important;
    top:-7px!important;
  }
  #desktopHint{
    left:58px!important;
  }
}


/* ===== v27-search-master-all-levels ===== */
/* v26 Search Screen 1 is now the master layout for Levels 2 and 3. */
@media (min-width:901px) and (pointer:fine), (min-width:901px) and (pointer:none), (min-width:901px) and (min-height:500.01px), (min-width:901px) and (orientation:portrait){
  #l2DesktopPanel,
  #level3Search .sharedDesktopPanel{
    left:0!important;right:0!important;bottom:0!important;transform:none!important;
    width:auto!important;height:172px!important;
    display:grid!important;
    grid-template-columns:225px minmax(0,1fr) 244px!important;
    gap:0!important;align-items:stretch!important;padding:0!important;
    background-color:#123c33!important;
    box-shadow:0 -8px 28px rgba(0,0,0,.32)!important;
    overflow:hidden!important;
  }
  #l2GameArea{bottom:172px!important}
  #l2Zoom{bottom:184px!important}
  #level3Search .sharedSearchSceneFrame{
    top:0!important;left:0!important;right:0!important;bottom:172px!important;
    width:auto!important;height:auto!important;aspect-ratio:auto!important;
    transform:none!important;margin:0!important;
  }
  #level3Search .sharedZoom{bottom:184px!important}

  .l2Score,
  #level3Search .sharedScore{
    position:relative!important;left:0!important;top:0!important;transform:translateX(-10px)!important;
    margin:0!important;padding:8px 10px 0 4px!important;
    display:flex!important;flex-direction:column!important;
    align-items:center!important;justify-content:center!important;text-align:center!important;
    min-width:0!important;
  }
  .l2Score .scoreLabel,
  #level3Search .sharedScore span{
    position:relative!important;left:-3px!important;
    display:block!important;margin:0 0 5px!important;
    font:600 12px/1.1 Georgia,'Times New Roman',serif!important;
    letter-spacing:.16em!important;color:#d9bd70!important;
  }
  .l2Score strong,
  #level3Search .sharedScore strong{
    position:relative!important;left:-3px!important;
    font:500 32px/1 Georgia,'Times New Roman',serif!important;
    color:#fff0c8!important;
  }

  #l2DesktopList,
  #level3Search .sharedDesktopItems{
    position:relative!important;top:0!important;transform:translateY(-2px)!important;
    margin:0!important;padding:11px 34px 20px!important;
    display:grid!important;grid-template-columns:repeat(5,minmax(0,1fr))!important;
    grid-template-rows:repeat(3,auto)!important;align-content:center!important;
    gap:9px 20px!important;min-width:0!important;text-align:left!important;
  }
  .l2Item,
  #level3Search .sharedDesktopItems span{
    position:relative!important;margin:0!important;padding:0 3px 0 18px!important;
    font:400 16px/1.2 Arial,sans-serif!important;color:#f0e7d2!important;
    white-space:normal!important;overflow:visible!important;text-overflow:clip!important;
    text-shadow:0 1px 2px rgba(0,0,0,.9)!important;
  }
  #level3Search .sharedDesktopItems span:before{
    content:'○';position:absolute;left:0;top:.02em;color:#e5c66d;
  }

  #l2DesktopActions,
  #level3Search .sharedActions{
    position:relative!important;left:0!important;top:0!important;transform:none!important;
    margin:0!important;padding:2px 6px 0 0!important;
    display:grid!important;grid-template-columns:42px 80px!important;
    grid-template-rows:32px 36px!important;width:130px!important;
    gap:5px 8px!important;align-content:center!important;justify-content:center!important;
    justify-self:center!important;align-self:center!important;
  }
  .l2DesktopTopActions{display:contents!important}

  #l2DesktopSound,
  #level3Search .sharedSound{
    grid-column:1!important;grid-row:1 / span 2!important;
    position:relative!important;left:2px!important;top:0!important;transform:none!important;
    width:52px!important;height:52px!important;align-self:center!important;justify-self:center!important;
    background:transparent!important;border:0!important;box-shadow:none!important;padding:0!important;
  }
  #l2DesktopSound img,
  #level3Search .sharedSound img{
    width:38px!important;height:38px!important;object-fit:contain!important;display:block!important;pointer-events:none!important;
  }

  #l2DesktopBone,
  #level3Search .sharedBone{
    grid-column:2!important;grid-row:1!important;
    position:relative!important;left:58px!important;top:-7px!important;transform:none!important;
    width:80px!important;height:31px!important;align-self:end!important;justify-self:center!important;
    border:0!important;background:transparent!important;
  }
  #l2DesktopBoneIcon,
  #level3Search .sharedBone{
    width:58px!important;height:28px!important;object-fit:contain!important;
  }

  #l2DesktopHint,
  #level3Search .sharedHint{
    grid-column:2!important;grid-row:2!important;
    position:relative!important;left:58px!important;top:0!important;transform:none!important;
    width:80px!important;min-width:80px!important;max-width:80px!important;height:36px!important;
    padding:0 8px!important;align-self:start!important;justify-self:center!important;margin-top:0!important;
    border-radius:12px!important;font-size:13px!important;white-space:nowrap!important;
  }
}


/* ===== v35-search-master-hard-reset ===== */
/* V35: hard final desktop master. Search 1 geometry is authoritative. */
@media (min-width:901px) and (pointer:fine), (min-width:901px) and (pointer:none), (min-width:901px) and (min-height:500.01px), (min-width:901px) and (orientation:portrait){
  #l2DesktopPanel,
  #level3Search .sharedDesktopPanel{
    box-sizing:border-box!important;
    position:absolute!important;
    left:0!important; right:0!important; bottom:0!important; top:auto!important;
    width:100%!important; height:172px!important;
    margin:0!important; padding:0!important;
    transform:none!important;
    display:grid!important;
    grid-template-columns:225px minmax(0,1fr) 244px!important;
    gap:0!important;
    align-items:stretch!important;
    isolation:isolate!important;
    overflow:hidden!important;
    background-color:#123c33!important;
    background-position:left center,right center,center center!important;
    background-size:225px 172px,244px 172px,100% 172px!important;
    background-repeat:no-repeat,no-repeat,no-repeat!important;
    box-shadow:0 -8px 28px rgba(0,0,0,.32)!important;
    z-index:130!important;
  }

  /* Same score block as Search 1. */
  .l2Score,
  #level3Search .sharedScore{
    box-sizing:border-box!important;
    position:relative!important;
    left:0!important; top:0!important;
    transform:translateX(-10px)!important;
    margin:0!important;
    padding:8px 10px 0 4px!important;
    display:flex!important;
    flex-direction:column!important;
    align-items:center!important;
    justify-content:center!important;
    text-align:center!important;
    min-width:0!important;
  }
  .l2Score .scoreLabel,
  #level3Search .sharedScore span{
    position:relative!important; left:-3px!important;
    display:block!important;
    margin:0 0 5px!important;
    font:600 12px/1.1 Georgia,'Times New Roman',serif!important;
    letter-spacing:.16em!important;
    color:#d9bd70!important;
  }
  .l2Score strong,
  #level3Search .sharedScore strong{
    position:relative!important; left:-3px!important;
    font:500 32px/1 Georgia,'Times New Roman',serif!important;
    color:#fff0c8!important;
  }

  /* Same five-column item grid as Search 1. */
  #l2DesktopList,
  #level3Search .sharedDesktopItems{
    box-sizing:border-box!important;
    position:relative!important;
    left:0!important; top:0!important;
    transform:translateY(-2px)!important;
    margin:0!important;
    padding:11px 34px 20px!important;
    display:grid!important;
    grid-template-columns:repeat(5,minmax(0,1fr))!important;
    grid-template-rows:repeat(3,auto)!important;
    align-content:center!important;
    gap:9px 20px!important;
    min-width:0!important;
    text-align:left!important;
  }
  .l2Item,
  #level3Search .sharedDesktopItems span{
    box-sizing:border-box!important;
    position:relative!important;
    margin:0!important;
    padding:0 3px 0 18px!important;
    font:400 16px/1.2 Arial,sans-serif!important;
    color:#f0e7d2!important;
    white-space:normal!important;
    overflow:visible!important;
    text-overflow:clip!important;
    text-shadow:0 1px 2px rgba(0,0,0,.9)!important;
  }
  #desktopList .item:before,
  .l2Item:before,
  #level3Search .sharedDesktopItems span:before{
    content:'◆'!important;
    position:absolute!important;
    left:0!important;
    top:-.08em!important;
    width:auto!important; height:auto!important;
    border:0!important; border-radius:0!important;
    font-size:14px!important;
    line-height:1!important;
    color:#caa64e!important;
  }

  /* Same right-control geometry as approved Search 1. */
  #l2DesktopActions,
  #level3Search .sharedActions{
    box-sizing:border-box!important;
    position:relative!important;
    left:0!important; top:0!important;
    transform:none!important;
    margin:0!important;
    padding:2px 6px 0 0!important;
    display:grid!important;
    grid-template-columns:42px 80px!important;
    grid-template-rows:32px 36px!important;
    width:130px!important;
    gap:5px 8px!important;
    align-content:center!important;
    justify-content:center!important;
    justify-self:center!important;
    align-self:center!important;
  }
  .l2DesktopTopActions{display:contents!important}
  #l2DesktopSound,#level3Search .sharedSound{
    grid-column:1!important; grid-row:1 / span 2!important;
    position:relative!important; left:2px!important; top:0!important;
    transform:none!important;
    width:52px!important; height:52px!important;
    align-self:center!important; justify-self:center!important;
    background:transparent!important; border:0!important; box-shadow:none!important; padding:0!important;
  }
  #l2DesktopSound img,#level3Search .sharedSound img{
    width:40px!important; height:40px!important; object-fit:contain!important; display:block!important;
  }
  #l2DesktopBone,#level3Search .sharedBone{
    grid-column:2!important; grid-row:1!important;
    position:relative!important; left:58px!important; top:-7px!important;
    transform:none!important;
    width:80px!important; height:31px!important;
    align-self:end!important; justify-self:center!important;
    border:0!important; background:transparent!important;
  }
  #l2DesktopBoneIcon,#level3Search .sharedBone{
    width:58px!important; height:28px!important; object-fit:contain!important;
  }
  #l2DesktopHint,#level3Search .sharedHint{
    grid-column:2!important; grid-row:2!important;
    position:relative!important; left:58px!important; top:0!important;
    transform:none!important;
    width:80px!important; min-width:80px!important; max-width:80px!important; height:36px!important;
    padding:0 8px!important; margin:0!important;
    align-self:start!important; justify-self:center!important;
    border-radius:12px!important; font-size:13px!important; white-space:nowrap!important;
  }

  /* Search 2 and 3 use the full viewport above the 172px master bar. */
  #l2GameArea{
    position:absolute!important; left:0!important; right:0!important; top:0!important; bottom:172px!important;
    width:auto!important; height:auto!important; margin:0!important; transform:none!important;
  }
  #level3Search{
    position:fixed!important; inset:0!important; width:100vw!important; height:100vh!important;
    margin:0!important; padding:0!important; transform:none!important;
    display:none; background:#050b0a!important;
  }
  #level3Search .sharedSearchBackdrop{display:none!important}
  #level3Search .sharedSearchSceneFrame{
    box-sizing:border-box!important;
    position:absolute!important;
    left:0!important; right:0!important; top:0!important; bottom:172px!important;
    width:100%!important; height:auto!important; max-width:none!important; max-height:none!important;
    margin:0!important; padding:0!important; transform:none!important;
    aspect-ratio:auto!important; overflow:hidden!important;
    border-radius:0!important;
  }
  #level3Search .sharedSearchScene{
    position:absolute!important; inset:0!important;
    width:100%!important; height:100%!important;
    max-width:none!important; max-height:none!important;
    object-fit:cover!important; object-position:center center!important;
    margin:0!important;
  }
  #l2Zoom,#level3Search .sharedZoom{bottom:184px!important}

  #testSkip2,#testSkip3{
    position:absolute!important; right:14px!important; top:12px!important; left:auto!important; bottom:auto!important;
    width:auto!important; height:auto!important; min-width:0!important; max-width:none!important;
    margin:0!important; padding:8px 11px!important; transform:none!important;
    display:inline-block!important;
    font:700 10px/1.2 Arial,sans-serif!important;
    letter-spacing:.05em!important;
    z-index:180!important;
  }
}


/* ===== v28-story-screens-and-sound ===== */
.ohcOpeningLogo{display:none!important}
#start .titleShade,
#finish .titleShade,
#story3 .titleShade,
#endScreen .titleShade{
  inset:38px auto 38px 38px!important;
  width:min(58%,700px)!important;
  right:auto!important;
  border-radius:0!important;
  pointer-events:none!important;
  background:linear-gradient(90deg,rgba(4,13,11,.92) 0%,rgba(5,17,14,.78) 38%,rgba(7,20,16,.34) 76%,rgba(7,20,16,0) 100%)!important;
}
@media (max-width:900px), (pointer:coarse) and (max-height:500px) and (orientation:landscape){
  #start .titleShade,
  #finish .titleShade,
  #story3 .titleShade,
  #endScreen .titleShade{
    inset:18px auto 18px 18px!important;
    width:min(68%,440px)!important;
  }
}
.overlaySoundBtn{
  position:absolute!important;
  top:clamp(16px,2.6vw,30px)!important;
  right:clamp(16px,2.6vw,30px)!important;
  z-index:6!important;
  width:56px!important;
  height:56px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  border:1px solid rgba(191,151,76,.88)!important;
  border-radius:14px!important;
  background:rgba(8,55,45,.88)!important;
  box-shadow:0 6px 18px rgba(0,0,0,.28), inset 0 1px 0 rgba(255,255,255,.08)!important;
  padding:0!important;
  cursor:pointer!important;
}
.overlaySoundBtn img{
  width:34px!important;
  height:34px!important;
  object-fit:contain!important;
  display:block!important;
  pointer-events:none!important;
}
@media (max-width:900px), (pointer:coarse) and (max-height:500px) and (orientation:landscape){
  .overlaySoundBtn{width:46px!important;height:46px!important;border-radius:12px!important}
  .overlaySoundBtn img{width:28px!important;height:28px!important}
}
#l2DesktopSound img,
#l2MobileSound img,
#level3Search .sharedSound img,
#level3Search .sharedMobileSound img{
  width:40px!important;
  height:40px!important;
  object-fit:contain!important;
  display:block!important;
  pointer-events:none!important;
}
#l2MobileSound img,
#level3Search .sharedMobileSound img{width:28px!important;height:28px!important}


/* ===== v29-waitlist-and-ending-tweaks ===== */
#creditsAdventureLogo{
  display:block!important;
  width:min(94%,780px)!important;
  max-width:100%!important;
  height:auto!important;
  margin:10px 0 14px!important;
}
.creditsExtraLinks{
  margin:10px 0 6px!important;
}
.creditsExtraLinks a{
  color:#f3e0a5!important;
  text-decoration:underline!important;
  font-weight:700!important;
  text-underline-offset:3px!important;
}
.creditsFooter strong{
  display:block!important;
  font-size:1.15rem!important;
  line-height:1.25!important;
  margin-bottom:6px!important;
}
#boneResult{
  display:block!important;
  font-size:1.02rem!important;
  line-height:1.35!important;
}
#waitlistBtn{
  margin-top:8px!important;
}
#restartFromCredits{
  padding:10px 18px!important;
  min-height:auto!important;
  font-size:17px!important;
  width:auto!important;
  margin-top:14px!important;
}
/* Slightly richer framed look for the mid-story interstitial artwork that lacks the built-in ornate border. */
#finish .titleScene,
#story3 .titleScene{
  position:relative!important;
  overflow:hidden!important;
}
#finish .titleScene::before,
#story3 .titleScene::before{
  content:"";
  position:absolute;
  inset:12px;
  border:18px solid rgba(88,46,19,.92);
  box-shadow:inset 0 0 0 2px rgba(212,163,86,.92), inset 0 0 0 8px rgba(114,61,26,.78), 0 0 0 1px rgba(27,12,6,.75);
  pointer-events:none;
  z-index:2;
}
#finish .titleScene::after,
#story3 .titleScene::after{
  content:"";
  position:absolute;
  inset:32px;
  border:2px solid rgba(228,191,114,.55);
  pointer-events:none;
  z-index:2;
}
/* Move the final adventure teaser content a bit higher on desktop. */
#endScreen .titleCopy{
  transform:translateY(-34px)!important;
}
#endScreen .titleCopy p{
  margin-bottom:14px!important;
}
#endScreen .titleCopy .titleAction,
#endScreen .titleCopy button,
#endScreen .titleCopy a{
  margin-top:16px!important;
}
/* Small, unobtrusive copyright only on desktop. */
.v29DesktopCopyright{
  position:absolute;
  left:50%;
  bottom:-44px;
  transform:translateX(-50%);
  z-index:6;
  font-size:18px;
  letter-spacing:.08em;
  color:rgba(230,230,230,.88);
  text-shadow:0 1px 2px rgba(0,0,0,.55);
}
.v29DesktopCopyright a{color:inherit!important;text-decoration:none!important}
@media (max-width:900px), (pointer:coarse) and (max-height:500px) and (orientation:landscape){
  #creditsAdventureLogo{width:min(100%,560px)!important;margin:8px 0 12px!important}
  #restartFromCredits{font-size:15px!important;padding:9px 14px!important}
  #endScreen .titleCopy{transform:translateY(-10px)!important}
  #finish .titleScene::before,
  #story3 .titleScene::before{inset:8px;border-width:10px}
  #finish .titleScene::after,
  #story3 .titleScene::after{inset:20px}
  .v29DesktopCopyright{display:none!important}
}


/* ===== v30-textscreen1-master ===== */
/* V30: Text screen 1 is rebuilt as the future story-screen master.
   Layer order: clean background -> text gradient -> transparent frame -> content -> controls. */
#start .titleScene{
  position:relative!important;
  isolation:isolate!important;
  overflow:hidden!important;
  background:#07130f!important;
}
#start .titleArtwork{
  position:absolute!important;
  inset:0!important;
  width:100%!important;
  height:100%!important;
  object-fit:cover!important;
  object-position:center!important;
  z-index:0!important;
  pointer-events:none!important;
  user-select:none!important;
}
#start .titleShade{
  position:absolute!important;
  z-index:1!important;
  /* The fade belongs to the picture, not to the decorative frame. */
  top:7.2%!important;
  bottom:7.2%!important;
  left:6.0%!important;
  right:auto!important;
  width:54%!important;
  border-radius:0!important;
  pointer-events:none!important;
  background:linear-gradient(90deg,
    rgba(4,13,11,.91) 0%,
    rgba(5,17,14,.78) 35%,
    rgba(7,20,16,.34) 72%,
    rgba(7,20,16,0) 100%)!important;
}
#start .titleFrameArtwork{
  position:absolute!important;
  inset:0!important;
  width:100%!important;
  height:100%!important;
  object-fit:fill!important;
  z-index:3!important;
  pointer-events:none!important;
  user-select:none!important;
}
#start .titleCopy{
  z-index:4!important;
}
#start .overlaySoundBtn{
  z-index:7!important;
}
#start .v29DesktopCopyright{
  z-index:5!important;
}
@media (max-width:900px), (pointer:coarse) and (max-height:500px) and (orientation:landscape){
  #start .titleArtwork{object-position:center!important}
  #start .titleShade{
    top:6.5%!important;
    bottom:6.5%!important;
    left:5.2%!important;
    width:62%!important;
  }
}
@media (max-width:560px){
  #start .titleArtwork{object-position:center!important}
  #start .titleShade{
    top:5.8%!important;
    bottom:5.8%!important;
    left:4.8%!important;
    width:68%!important;
  }
}


/* ===== v31-textscreen1-gradient-under-frame ===== */
/* V31: enlarge only Text Screen 1 gradient so its edges disappear beneath the separate frame. */
#start .titleShade{
  top:-3%!important;
  bottom:-3%!important;
  left:-2%!important;
  width:66%!important;
}
@media (max-width:900px), (pointer:coarse) and (max-height:500px) and (orientation:landscape){
  #start .titleShade{
    top:-3%!important;
    bottom:-3%!important;
    left:-2%!important;
    width:72%!important;
  }
}
@media (max-width:560px){
  #start .titleShade{
    top:-3%!important;
    bottom:-3%!important;
    left:-2%!important;
    width:76%!important;
  }
}


/* ===== v32-textscreen-master ===== */
/* V32: Text Screen 1 (v31) is the sole master for story screens. */
#finish .titleScene::before,#finish .titleScene::after,
#story3 .titleScene::before,#story3 .titleScene::after{content:none!important;display:none!important}

#finish .titleScene,#story3 .titleScene,#endScreen .titleScene,
#creditsScreen .creditsCard,#chestSequence .cutsceneFrame{
  position:relative!important;width:min(1280px,100vw)!important;aspect-ratio:16/9!important;
  max-height:100vh!important;overflow:hidden!important;background:#07130f!important;
  box-shadow:0 30px 100px rgba(0,0,0,.5)!important;
}
#finish .titleArtwork,#story3 .titleArtwork,#endScreen .titleArtwork,
#creditsScreen .creditsBg{
  position:absolute!important;inset:0!important;width:100%!important;height:100%!important;
  object-fit:cover!important;object-position:center!important;z-index:1!important;
}
#finish .titleShade,#story3 .titleShade,#endScreen .titleShade{
  position:absolute!important;top:-3%!important;bottom:-3%!important;left:-2%!important;right:auto!important;
  width:66%!important;border-radius:0!important;pointer-events:none!important;z-index:2!important;
  background:linear-gradient(90deg,rgba(4,13,11,.91) 0%,rgba(5,17,14,.78) 35%,rgba(7,20,16,.34) 72%,rgba(7,20,16,0) 100%)!important;
}
#finish .titleFrameArtwork,#story3 .titleFrameArtwork,#endScreen .titleFrameArtwork,
#creditsScreen .titleFrameArtwork,#chestSequence .chestMasterFrame{
  position:absolute!important;inset:0!important;width:100%!important;height:100%!important;
  object-fit:fill!important;z-index:3!important;pointer-events:none!important;user-select:none!important;
}
#finish .titleCopy,#story3 .titleCopy,#endScreen .titleCopy{z-index:4!important}
#finish .overlaySoundBtn,#story3 .overlaySoundBtn,#endScreen .overlaySoundBtn,#creditsScreen .overlaySoundBtn{z-index:7!important}
#creditsScreen .creditsContent{z-index:4!important}

/* Chest images sit below the same master frame. */
#chestSequence .cutsceneViewport{position:absolute!important;inset:0!important;z-index:1!important;width:100%!important;height:100%!important;overflow:hidden!important}
#chestSequence .chestFrame{width:100%!important;height:100%!important;object-fit:cover!important}

@media (max-width:900px), (pointer:coarse) and (max-height:500px) and (orientation:landscape){
 #finish .titleShade,#story3 .titleShade,#endScreen .titleShade{top:-3%!important;bottom:-3%!important;left:-2%!important;width:72%!important}
}
@media(max-width:560px){
 #finish .titleShade,#story3 .titleShade,#endScreen .titleShade{top:-3%!important;bottom:-3%!important;left:-2%!important;width:76%!important}
}


/* ===== v33-search-master-final ===== */
/* v33: Search Screen 1 is the definitive desktop HUD master for all search levels. */
@media (min-width:901px) and (pointer:fine), (min-width:901px) and (pointer:none), (min-width:901px) and (min-height:500.01px), (min-width:901px) and (orientation:portrait){
  #l2DesktopPanel,
  #level3Search .sharedDesktopPanel{
    position:absolute!important;
    left:0!important;right:0!important;bottom:0!important;
    width:auto!important;height:172px!important;
    display:grid!important;
    grid-template-columns:225px minmax(0,1fr) 244px!important;
    gap:0!important;align-items:stretch!important;padding:0!important;
    background-color:#123c33!important;
    background-image:url("assets/ff9aecf14e1e.webp"),url("assets/329fb0678777.webp"),url("assets/1e1231ae9a65.webp")!important;
    background-position:left center,right center,center center!important;
    background-size:225px 172px,244px 172px,100% 172px!important;
    background-repeat:no-repeat,no-repeat,no-repeat!important;
    box-shadow:0 -8px 28px rgba(0,0,0,.32)!important;
    overflow:hidden!important;
  }

  .l2Score,
  #level3Search .sharedScore{
    transform:translateX(-10px)!important;
    margin:0!important;padding:8px 10px 0 4px!important;
    display:flex!important;flex-direction:column!important;
    align-items:center!important;justify-content:center!important;text-align:center!important;
    min-width:0!important;
  }
  .l2Score .scoreLabel,
  #level3Search .sharedScore span{
    position:relative!important;left:-3px!important;
    display:block!important;margin:0 0 5px!important;
    font:600 12px/1.1 Georgia,'Times New Roman',serif!important;
    letter-spacing:.16em!important;color:#d9bd70!important;
  }
  .l2Score strong,
  #level3Search .sharedScore strong{
    position:relative!important;left:-3px!important;
    font:500 32px/1 Georgia,'Times New Roman',serif!important;color:#fff0c8!important;
  }

  #l2DesktopList,
  #level3Search .sharedDesktopItems{
    position:relative!important;top:0!important;transform:translateY(-2px)!important;
    margin:0!important;padding:11px 34px 20px!important;
    display:grid!important;grid-template-columns:repeat(5,minmax(0,1fr))!important;
    grid-template-rows:repeat(3,auto)!important;align-content:center!important;
    gap:9px 20px!important;min-width:0!important;text-align:left!important;
  }
  .l2Item,
  #level3Search .sharedDesktopItems span{
    position:relative!important;margin:0!important;padding:0 3px 0 18px!important;
    font:400 16px/1.2 Arial,sans-serif!important;color:#f0e7d2!important;
    white-space:normal!important;overflow:visible!important;text-overflow:clip!important;
    text-shadow:0 1px 2px rgba(0,0,0,.9)!important;
  }

  /* Same right-hand control alignment as the approved Search Screen 1. */
  #l2DesktopActions,
  #level3Search .sharedActions{
    position:relative!important;left:0!important;top:0!important;transform:none!important;
    margin:0!important;padding:2px 6px 0 0!important;
    display:grid!important;grid-template-columns:42px 80px!important;
    grid-template-rows:32px 36px!important;width:130px!important;
    gap:5px 8px!important;align-content:center!important;justify-content:center!important;
    justify-self:center!important;align-self:center!important;
  }
  .l2DesktopTopActions{display:contents!important}
  #l2DesktopSound,#level3Search .sharedSound{
    grid-column:1!important;grid-row:1 / span 2!important;
    position:relative!important;left:2px!important;top:0!important;transform:none!important;
    width:52px!important;height:52px!important;align-self:center!important;justify-self:center!important;
    background:transparent!important;border:0!important;box-shadow:none!important;padding:0!important;
  }
  #l2DesktopSound img,#level3Search .sharedSound img{width:40px!important;height:40px!important;object-fit:contain!important;display:block!important}
  #l2DesktopBone,#level3Search .sharedBone{
    grid-column:2!important;grid-row:1!important;position:relative!important;
    left:58px!important;top:-7px!important;transform:none!important;
    width:80px!important;height:31px!important;align-self:end!important;justify-self:center!important;
    border:0!important;background:transparent!important;
  }
  #l2DesktopBoneIcon,#level3Search .sharedBone{width:58px!important;height:28px!important;object-fit:contain!important}
  #l2DesktopHint,#level3Search .sharedHint{
    grid-column:2!important;grid-row:2!important;position:relative!important;
    left:58px!important;top:0!important;transform:none!important;
    width:80px!important;min-width:80px!important;max-width:80px!important;height:36px!important;
    padding:0 8px!important;align-self:start!important;justify-self:center!important;margin-top:0!important;
    border-radius:12px!important;font-size:13px!important;white-space:nowrap!important;
  }

  /* Test buttons stay small and never stretch across the following screen. */
  #testSkip2,#testSkip3{
    position:absolute!important;left:auto!important;right:14px!important;top:12px!important;bottom:auto!important;
    transform:none!important;width:auto!important;height:auto!important;min-width:0!important;max-width:none!important;
    display:inline-block!important;padding:8px 11px!important;
    font:700 10px/1.2 Arial,sans-serif!important;letter-spacing:.05em!important;
    z-index:180!important;
  }
}

/* Larger gold diamonds, while keeping the item text exactly the same size and position. */
#desktopList .item:before,
.l2Item:before,
#level3Search .sharedDesktopItems span:before{
  content:'◆'!important;
  position:absolute!important;
  left:0!important;
  top:-0.08em!important;
  font-size:14px!important;
  line-height:1!important;
  color:#caa64e!important;
  border:0!important;
  border-radius:0!important;
  width:auto!important;height:auto!important;
}
#desktopList .item.done:before,
.l2Item.done:before,
#level3Search .sharedDesktopItems span.done:before{
  content:'✓'!important;font-size:12px!important;top:.02em!important;color:#e1c15d!important;
}


/* ===== v34-ending-position-fixes ===== */
/* V34 targeted corrections only. Keep approved masters intact. */

/* Gevonden: move the complete content block upward. */
@media (min-width:901px) and (pointer:fine), (min-width:901px) and (pointer:none), (min-width:901px) and (min-height:500.01px), (min-width:901px) and (orientation:portrait){
  #endScreen .titleCopy{
    top:50%!important;
    transform:translateY(-64%)!important;
  }
}

/* Credits: lower the Paws & Clues series logo, and pull the Night Train logo closer to its eyebrow. */
@media (min-width:901px) and (pointer:fine), (min-width:901px) and (pointer:none), (min-width:901px) and (min-height:500.01px), (min-width:901px) and (orientation:portrait){
  #creditsScreen .creditsSeriesLogo{
    transform:translateY(24px)!important;
  }
  #creditsScreen #creditsAdventureLogo{
    margin-top:-2px!important;
    margin-bottom:12px!important;
  }
}

/* Chest cutscene: use a larger 16:9 stage so the same master frame fills the screen like Text Screen 1. */
@media (min-width:901px) and (pointer:fine), (min-width:901px) and (pointer:none), (min-width:901px) and (min-height:500.01px), (min-width:901px) and (orientation:portrait){
  #chestSequence .cutsceneFrame{
    width:min(1420px,96vw)!important;
    aspect-ratio:16/9!important;
    max-height:96vh!important;
  }
  #chestSequence .chestMasterFrame{
    inset:0!important;
    width:100%!important;
    height:100%!important;
    object-fit:fill!important;
    transform:none!important;
  }
}

@media (max-width:900px), (pointer:coarse) and (max-height:500px) and (orientation:landscape){
  #endScreen .titleCopy{transform:translateY(-18px)!important;}
  #creditsScreen .creditsSeriesLogo{transform:translateY(10px)!important;}
  #creditsScreen #creditsAdventureLogo{margin-top:0!important;}
}


/* ===== v38-searchhud-component-css ===== */
/* V38: one reusable SearchHUD layout. The stronger selectors deliberately neutralize all old level-specific HUD CSS, and visibility is now limited to active search screens only. */
@media (min-width:901px) and (pointer:fine), (min-width:901px) and (pointer:none), (min-width:901px) and (min-height:500.01px), (min-width:901px) and (orientation:portrait){
  #desktopPanel.searchHudHost,
  #l2DesktopPanel.searchHudHost,
  #level3Search .sharedDesktopPanel.searchHudHost{
    position:absolute!important;left:0!important;right:0!important;bottom:0!important;
    width:auto!important;height:172px!important;
    display:grid!important;grid-template-columns:225px minmax(0,1fr) 244px!important;
    gap:0!important;align-items:stretch!important;padding:0!important;
    background-color:#123c33!important;
    background-position:left center,right center,center center!important;
    background-size:225px 172px,244px 172px,100% 172px!important;
    background-repeat:no-repeat,no-repeat,no-repeat!important;
    box-shadow:0 -8px 28px rgba(0,0,0,.32)!important;
    overflow:hidden!important;z-index:80!important;isolation:isolate!important;
    transform:none!important;margin:0!important;
  }

  #desktopPanel.searchHudHost:not(.searchHudVisible),
  #l2DesktopPanel.searchHudHost:not(.searchHudVisible),
  #level3Search .sharedDesktopPanel.searchHudHost:not(.searchHudVisible){
    display:none!important;
  }
  #desktopPanel.searchHudHost.searchHudVisible,
  #l2DesktopPanel.searchHudHost.searchHudVisible,
  #level3Search .sharedDesktopPanel.searchHudHost.searchHudVisible{
    display:grid!important;
  }

  #desktopPanel.searchHudHost .searchHudScore,
  #l2DesktopPanel.searchHudHost .searchHudScore,
  #level3Search .searchHudHost .searchHudScore{
    position:relative!important;left:0!important;top:0!important;
    transform:translate(-11px,-3px)!important;margin:0!important;padding:8px 10px 0 0!important;
    display:flex!important;flex-direction:column!important;align-items:center!important;
    justify-content:center!important;text-align:center!important;min-width:0!important;
  }
  #desktopPanel.searchHudHost .searchHudScoreLabel,
  #l2DesktopPanel.searchHudHost .searchHudScoreLabel,
  #level3Search .searchHudHost .searchHudScoreLabel{
    position:relative!important;left:-8px!important;display:block!important;margin:0 0 5px!important;
    font:600 12px/1.1 Georgia,'Times New Roman',serif!important;letter-spacing:.16em!important;
    color:#d9bd70!important;
  }
  #desktopPanel.searchHudHost .searchHudScoreValue,
  #l2DesktopPanel.searchHudHost .searchHudScoreValue,
  #level3Search .searchHudHost .searchHudScoreValue{
    position:relative!important;left:-8px!important;display:block!important;margin:0!important;
    font:500 32px/1 Georgia,'Times New Roman',serif!important;color:#fff0c8!important;
    text-shadow:0 1px 2px #000!important;
  }

  #desktopPanel.searchHudHost .searchHudItems,
  #l2DesktopPanel.searchHudHost .searchHudItems,
  #level3Search .searchHudHost .searchHudItems{
    position:relative!important;left:0!important;top:0!important;transform:translateY(5px)!important;
    margin:0!important;padding:11px 34px 20px!important;width:auto!important;
    display:grid!important;grid-template-columns:repeat(5,minmax(0,1fr))!important;
    grid-template-rows:repeat(3,auto)!important;align-content:center!important;
    gap:9px 20px!important;min-width:0!important;text-align:left!important;box-sizing:border-box!important;
  }
  #desktopPanel.searchHudHost .searchHudItem,
  #l2DesktopPanel.searchHudHost .searchHudItem,
  #level3Search .searchHudHost .searchHudItem{
    position:relative!important;margin:0!important;padding:0 3px 0 18px!important;
    font:400 16px/1.2 Arial,sans-serif!important;color:#f0e7d2!important;
    white-space:normal!important;overflow:visible!important;text-overflow:clip!important;
    text-shadow:0 1px 2px rgba(0,0,0,.9)!important;
  }
  #desktopPanel.searchHudHost .searchHudItem:before,
  #l2DesktopPanel.searchHudHost .searchHudItem:before,
  #level3Search .searchHudHost .searchHudItem:before{
    content:'◆'!important;position:absolute!important;left:0!important;top:-.08em!important;
    width:auto!important;height:auto!important;border:0!important;border-radius:0!important;
    font-size:14px!important;line-height:1!important;color:#caa64e!important;
  }
  #desktopPanel.searchHudHost .searchHudItem.done,
  #l2DesktopPanel.searchHudHost .searchHudItem.done,
  #level3Search .searchHudHost .searchHudItem.done{opacity:.42!important;text-decoration:line-through!important}
  #desktopPanel.searchHudHost .searchHudItem.done:before,
  #l2DesktopPanel.searchHudHost .searchHudItem.done:before,
  #level3Search .searchHudHost .searchHudItem.done:before{
    content:'✓'!important;top:.02em!important;font-size:12px!important;color:#e1c15d!important;text-decoration:none!important;
  }

  #desktopPanel.searchHudHost .searchHudActions,
  #l2DesktopPanel.searchHudHost .searchHudActions,
  #level3Search .searchHudHost .searchHudActions{
    position:relative!important;left:0!important;top:0!important;transform:none!important;
    margin:0!important;padding:2px 0 0 0!important;display:grid!important;
    grid-template-columns:42px 80px!important;grid-template-rows:32px 36px!important;
    width:122px!important;gap:5px 6px!important;align-content:center!important;justify-content:center!important;
    justify-self:center!important;align-self:center!important;transform:translateX(-32px)!important;
  }
  #desktopPanel.searchHudHost .searchHudSound,
  #l2DesktopPanel.searchHudHost .searchHudSound,
  #level3Search .searchHudHost .searchHudSound{
    grid-column:1!important;grid-row:1 / span 2!important;position:relative!important;
    left:-31px!important;top:0!important;transform:none!important;width:50px!important;height:50px!important;
    align-self:center!important;justify-self:center!important;background:transparent!important;border:0!important;
    box-shadow:none!important;padding:0!important;margin:0!important;cursor:pointer!important;
  }
  #desktopPanel.searchHudHost .searchHudSound img,
  #l2DesktopPanel.searchHudHost .searchHudSound img,
  #level3Search .searchHudHost .searchHudSound img{
    width:38px!important;height:38px!important;object-fit:contain!important;display:block!important;
    margin:auto!important;pointer-events:none!important;
  }
  #desktopPanel.searchHudHost .searchHudBone,
  #l2DesktopPanel.searchHudHost .searchHudBone,
  #level3Search .searchHudHost .searchHudBone{
    grid-column:2!important;grid-row:1!important;position:relative!important;left:30px!important;right:auto!important;
    top:-7px!important;transform:none!important;width:80px!important;height:31px!important;
    align-self:end!important;justify-self:center!important;display:flex!important;align-items:center!important;
    justify-content:center!important;border:0!important;background:transparent!important;margin:0!important;padding:0!important;
  }
  #desktopPanel.searchHudHost .searchHudBone img,
  #l2DesktopPanel.searchHudHost .searchHudBone img,
  #level3Search .searchHudHost .searchHudBone img.sharedBone,
  #level3Search .searchHudHost .searchHudBone img{
    position:relative!important;left:auto!important;right:auto!important;top:auto!important;transform:none!important;
    width:58px!important;height:28px!important;object-fit:contain!important;display:block!important;margin:0!important;
  }
  #desktopPanel.searchHudHost .searchHudHint,
  #l2DesktopPanel.searchHudHost .searchHudHint,
  #level3Search .searchHudHost .searchHudHint{
    grid-column:2!important;grid-row:2!important;position:relative!important;left:30px!important;top:0!important;
    transform:none!important;width:80px!important;min-width:80px!important;max-width:80px!important;height:36px!important;
    padding:0 8px!important;align-self:start!important;justify-self:center!important;margin:0!important;
    border:1px solid #9c6b22!important;border-radius:12px!important;background:linear-gradient(#e8c45e,#c8952f)!important;
    color:#34200b!important;box-shadow:inset 0 1px rgba(255,255,255,.35),0 2px 4px rgba(0,0,0,.28)!important;
    font:900 13px/1 Arial,sans-serif!important;white-space:nowrap!important;cursor:pointer!important;
  }
}


/* ===== v39-level3-cutscene-fit-fixes ===== */
/* V39: make Search Scene 3 fit like Search Scene 2 and show the full framed cutscene artwork. */
#level3Search .sharedSearchSceneFrame{
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  overflow:hidden!important;
  background:#061410!important;
}
#level3Search .sharedSearchScene{
  position:relative!important;
  inset:auto!important;
  left:auto!important;
  top:auto!important;
  width:auto!important;
  height:auto!important;
  max-width:100%!important;
  max-height:100%!important;
  object-fit:contain!important;
  object-position:center center!important;
  transform-origin:center center!important;
}
#chestSequence .cutsceneViewport{
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  overflow:hidden!important;
  background:#07130f!important;
}
#chestSequence .chestFrame{
  position:relative!important;
  inset:auto!important;
  left:auto!important;
  top:auto!important;
  width:auto!important;
  height:auto!important;
  max-width:100%!important;
  max-height:100%!important;
  object-fit:contain!important;
  object-position:center center!important;
}


/* ===== v43-search3-true-scene-template ===== */
/* V43: Search 3 now uses the same 1672x941 fit geometry as the proven Level 2 scene. */
#level3Search #l3GameArea{
  position:absolute!important;
  left:0!important;right:0!important;top:0!important;bottom:172px!important;
  width:auto!important;height:auto!important;
  overflow:hidden!important;
  touch-action:none!important;
  background:transparent!important;
  margin:0!important;padding:0!important;
  display:block!important;
}
#level3Search #l3World{
  position:absolute!important;
  left:0!important;top:0!important;
  width:1672px!important;height:941px!important;
  transform-origin:0 0!important;
  margin:0!important;padding:0!important;
}
#level3Search #l3Scene{
  position:absolute!important;
  inset:0!important;
  width:1672px!important;height:941px!important;
  max-width:none!important;max-height:none!important;
  display:block!important;
  object-fit:fill!important;
  object-position:center!important;
  user-select:none!important;
  pointer-events:none!important;
  outline:1px solid rgba(191,151,76,.72)!important;
  box-shadow:0 0 0 4px #2a1a12,0 0 0 5px rgba(191,151,76,.48),0 8px 24px rgba(0,0,0,.45)!important;
  margin:0!important;
  transform:none!important;
}
@media (max-width:900px), (pointer:coarse) and (max-height:500px) and (orientation:landscape){
  #level3Search #l3GameArea{bottom:0!important;}
}


/* ===== v44-chest-storyframe-master ===== */
/* V44: chest animation uses exactly the same 1280x720 story-frame geometry.
   Remove the legacy outer border/outline container and the later 1420px enlargement. */
#chestSequence .cutsceneFrame{
  box-sizing:border-box!important;
  position:relative!important;
  width:min(1280px,100vw)!important;
  aspect-ratio:16/9!important;
  height:auto!important;
  max-width:1280px!important;
  max-height:100vh!important;
  margin:0!important;
  padding:0!important;
  overflow:hidden!important;
  border:0!important;
  outline:0!important;
  border-radius:0!important;
  background:#07130f!important;
  box-shadow:0 30px 100px rgba(0,0,0,.5)!important;
}
#chestSequence .cutsceneViewport{
  position:absolute!important;
  inset:0!important;
  width:100%!important;
  height:100%!important;
  margin:0!important;
  padding:0!important;
  border:0!important;
  outline:0!important;
  overflow:hidden!important;
  z-index:1!important;
}
#chestSequence .chestMasterFrame{
  position:absolute!important;
  inset:0!important;
  width:100%!important;
  height:100%!important;
  max-width:none!important;
  max-height:none!important;
  margin:0!important;
  padding:0!important;
  border:0!important;
  outline:0!important;
  object-fit:fill!important;
  transform:none!important;
  z-index:3!important;
  pointer-events:none!important;
}
#chestSequence .chestFrame{
  position:absolute!important;
  inset:0!important;
  width:100%!important;
  height:100%!important;
  max-width:none!important;
  max-height:none!important;
  object-fit:cover!important;
  object-position:center center!important;
  margin:0!important;
  border:0!important;
  outline:0!important;
}
@media (max-width:900px), (pointer:coarse) and (max-height:500px) and (orientation:landscape){
  #chestSequence .cutsceneFrame{
    width:min(1280px,100vw)!important;
    max-width:100vw!important;
    border:0!important;
    outline:0!important;
  }
}


/* ===== v46-endstory-content-down43 ===== */
/* V46: only the Gevonden story screen after Search 3 / chest animation moves down 43px. */
@media (min-width:901px) and (pointer:fine), (min-width:901px) and (pointer:none), (min-width:901px) and (min-height:500.01px), (min-width:901px) and (orientation:portrait){
  #endScreen .titleCopy{
    top:calc(50% + 43px)!important;
    transform:translateY(-64%)!important;
  }
}


/* ===== v47-credits-positioning ===== */
/* V47: final credits-screen micro-positioning. Desktop only. */
@media (min-width:901px) and (pointer:fine), (min-width:901px) and (pointer:none), (min-width:901px) and (min-height:500.01px), (min-width:901px) and (orientation:portrait){
  #creditsScreen .creditsEyebrow{
    transform:translateY(15px)!important;
  }
  #creditsScreen #creditsAdventureLogo{
    transform:translateY(-31px)!important;
  }
  #creditsScreen #creditsAdventureLogo ~ .creditsTagline,
  #creditsScreen #creditsAdventureLogo ~ .creditsSoon,
  #creditsScreen #creditsAdventureLogo ~ #waitlistBtn,
  #creditsScreen #creditsAdventureLogo ~ .creditsNote,
  #creditsScreen #creditsAdventureLogo ~ .creditsExtraLinks,
  #creditsScreen #creditsAdventureLogo ~ .creditsFooter,
  #creditsScreen #creditsAdventureLogo ~ #restartFromCredits{
    transform:translateY(-70px)!important;
  }
}


/* ===== paws-debug-mode-css ===== */
html:not(.paws-debug) .testSkipBtn,
html:not(.paws-debug) .testSceneLabel{display:none!important;}


/* ===== v52-stability-css ===== */
/* V52 stability only: no visual redesign. */
#rotateNotice{z-index:10000!important;}
#l3Hotspots{position:absolute;inset:0;width:1672px;height:941px;overflow:visible;pointer-events:none;z-index:4;}
.l3Hit{fill:transparent;stroke:transparent;stroke-width:20;stroke-linejoin:round;pointer-events:all;cursor:default;}
.l3FoundOutline{fill:rgba(255,211,76,.08);stroke:#ffd34c;stroke-width:5;stroke-linejoin:round;vector-effect:non-scaling-stroke;pointer-events:none;}
#l3Message{position:absolute;z-index:145;left:50%;top:12px;transform:translateX(-50%);background:rgba(8,55,45,.94);padding:9px 15px;border-radius:11px;font-weight:800;opacity:0;transition:opacity .15s;white-space:nowrap;pointer-events:none;color:#f7ead0;}
#l3Message.show{opacity:1;}
#level3Search .shellItem.done{opacity:.42;text-decoration:line-through;}

@media (max-width:900px), (pointer:coarse) and (max-height:500px) and (orientation:landscape){
  #hotspots .hit,#l2Hotspots .l2Hit,#l3Hotspots .l3Hit{stroke-width:32px!important;}
}
.i18nAdventureTitle{font-family:Georgia,serif;font-weight:700;letter-spacing:.05em;text-transform:uppercase;color:#f1dfb2;text-shadow:0 2px 7px rgba(0,0,0,.75);font-size:clamp(18px,2.2vw,30px);margin:-4px 0 10px;text-align:center}
.i18nNextAdventureTitle{font-family:Georgia,serif;font-weight:700;letter-spacing:.045em;text-transform:uppercase;color:#ead8aa;text-shadow:0 2px 7px rgba(0,0,0,.75);font-size:clamp(20px,2.6vw,34px);margin:0 0 7px;text-align:center}

/* ===== v63 results: trophy-room report ===== */
#pawsStreakToast{
  position:fixed;left:50%;top:13%;transform:translate(-50%,-16px) scale(.94);
  z-index:12000;pointer-events:none;opacity:0;
  padding:12px 22px;border:1px solid #d9b75f;border-radius:4px;
  background:linear-gradient(180deg,rgba(35,91,75,.97),rgba(13,54,45,.98));
  color:#fff1c8;font:700 clamp(18px,2.4vw,30px)/1 Georgia,'Times New Roman',serif;
  letter-spacing:.08em;text-shadow:0 2px 6px rgba(0,0,0,.55);
  box-shadow:inset 0 0 0 2px rgba(5,27,22,.65),0 10px 34px rgba(0,0,0,.42);
  transition:opacity .18s ease,transform .22s ease;
}
#pawsStreakToast.show{opacity:1;transform:translate(-50%,0) scale(1)}

#resultScreen.resultsOverlay{
  display:none;position:fixed;inset:0;z-index:175;background:#07110f;
  align-items:center;justify-content:center;overflow:hidden;
}
#resultScreen .resultsCard{
  position:relative;width:min(1280px,100vw);aspect-ratio:16/9;max-height:100vh;
  overflow:hidden;background:#07130f;box-shadow:0 30px 100px rgba(0,0,0,.55);
}
#resultScreen .resultsBg{
  position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center;
  filter:saturate(.94) brightness(.88);
}
#resultScreen .resultsCard:after{
  content:"";position:absolute;inset:0;z-index:1;pointer-events:none;
  background:linear-gradient(90deg,rgba(3,16,13,.93) 0%,rgba(4,21,17,.84) 43%,rgba(4,18,15,.30) 64%,rgba(3,12,10,.05) 100%);
}
#resultScreen .resultsFrame{
  position:absolute!important;inset:0!important;width:100%!important;height:100%!important;
  object-fit:fill!important;z-index:4!important;pointer-events:none!important;
}
#resultScreen .resultsContent{
  position:absolute;left:5.8%;top:5.5%;bottom:5.5%;z-index:5;width:min(600px,48%);
  display:flex;flex-direction:column;justify-content:center;color:#f5ead3;
  font-family:Georgia,'Times New Roman',serif;
  padding:clamp(16px,2vw,27px);
  border:1px solid rgba(218,184,103,.43);border-radius:10px;
  background:linear-gradient(180deg,rgba(7,35,29,.84),rgba(5,27,23,.79));
  box-shadow:inset 0 0 0 1px rgba(2,17,14,.56),0 16px 45px rgba(0,0,0,.28);
  backdrop-filter:blur(2px);
}
#resultScreen .resultsSeriesLogo{
  width:min(235px,48%);height:auto;margin:0 0 2px;
  filter:drop-shadow(0 4px 12px rgba(0,0,0,.48));
}
#resultScreen h1{
  margin:2px 0 12px;color:#f0d89f;
  font:700 clamp(26px,2.8vw,42px)/1 Georgia,'Times New Roman',serif;
  text-shadow:0 3px 10px rgba(0,0,0,.5);
}
#resultScreen .resultsStats{
  display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:7px 9px;margin:0 0 12px;
}
#resultScreen .resultStat{
  min-height:52px;padding:7px 10px;border:1px solid rgba(217,183,95,.48);border-radius:5px;
  background:rgba(7,37,30,.72);box-shadow:inset 0 0 0 1px rgba(4,22,18,.48);
  display:flex;flex-direction:column;justify-content:center;
}
#resultScreen .resultStat:nth-child(3){grid-column:1/-1;min-height:46px}
#resultScreen .resultStat span{
  font:600 10px/1.2 Arial,sans-serif;letter-spacing:.095em;text-transform:uppercase;
  color:#cdbf9d;margin-bottom:3px;
}
#resultScreen .resultStat strong{
  font:700 clamp(16px,1.55vw,23px)/1.05 Georgia,'Times New Roman',serif;color:#fff3d4;
}
#resultScreen .resultsTrophiesBlock{
  margin:0 0 11px;padding-top:1px;border-top:1px solid rgba(218,184,103,.23);
}
#resultScreen .resultsTrophiesBlock h2{
  margin:8px 0 6px;color:#e3c474;font:700 14px/1.1 Georgia,'Times New Roman',serif;
  letter-spacing:.06em;text-transform:uppercase;
}
#resultScreen .resultsTrophies{display:flex;gap:6px;flex-wrap:wrap}
#resultScreen .resultTrophy{
  flex:1 1 30%;min-width:145px;display:flex;align-items:center;gap:7px;padding:7px 8px;
  border:1px solid rgba(217,183,95,.42);border-radius:5px;background:rgba(6,31,26,.73);
}
#resultScreen .resultTrophyMark{
  flex:0 0 30px;width:30px;height:30px;border-radius:50%;display:grid;place-items:center;
  border:1px solid #e0bd61;background:radial-gradient(circle at 35% 30%,#f4dc98,#9b7228 74%);
  color:#173c33;font:700 15px Georgia,serif;
  box-shadow:inset 0 0 0 2px rgba(66,40,5,.24),0 3px 9px rgba(0,0,0,.28);
}
#resultScreen .resultTrophy strong{display:block;color:#fff0c9;font:700 12px/1.1 Georgia,serif;margin-bottom:2px}
#resultScreen .resultTrophy span{display:block;color:#d7ccb4;font:10px/1.22 Arial,sans-serif}
#resultScreen .resultsNoTrophies{color:#d6cab0;font:13px/1.35 Arial,sans-serif;padding:5px 0}
#resultScreen #resultsContinue{align-self:flex-start;margin-top:1px}

@media (max-width:900px), (pointer:coarse) and (max-height:500px) and (orientation:landscape){
  #pawsStreakToast{top:9%;padding:9px 15px;font-size:16px}
  #resultScreen{overflow:auto!important;align-items:flex-start!important}
  #resultScreen .resultsCard{width:100%!important;min-height:100vh!important;height:auto!important;aspect-ratio:auto!important;max-height:none!important}
  #resultScreen .resultsBg{position:fixed;inset:0;object-position:68% center;filter:saturate(.9) brightness(.64)}
  #resultScreen .resultsCard:after{position:fixed;background:rgba(4,22,18,.72)}
  #resultScreen .resultsFrame{position:fixed!important}
  #resultScreen .resultsContent{
    position:relative;left:auto;top:auto;bottom:auto;width:auto;min-height:100vh;
    margin:0;padding:32px 7% 26px;justify-content:center;border:0;border-radius:0;
    background:linear-gradient(90deg,rgba(4,27,22,.92),rgba(4,27,22,.76));box-shadow:none;backdrop-filter:none;
  }
  #resultScreen .resultsSeriesLogo{width:min(210px,49%)}
  #resultScreen h1{font-size:clamp(25px,6vw,36px);margin-bottom:10px}
  #resultScreen .resultsStats{gap:6px;grid-template-columns:repeat(2,minmax(0,1fr))}
  #resultScreen .resultStat{min-height:50px;padding:7px 9px}
  #resultScreen .resultStat strong{font-size:16px}
  #resultScreen .resultTrophy{flex-basis:100%;min-width:0}
}
@media(max-width:540px){
  #resultScreen .resultsContent{padding-top:27px;padding-bottom:23px}
  #resultScreen .resultStat span{font-size:9px}
  #resultScreen .resultStat strong{font-size:14px}
  #resultScreen .resultsTrophiesBlock h2{font-size:13px}
  #resultScreen .resultTrophy span{font-size:10px}
}



/* ===== v65-audio-results-credits-fixes ===== */
/* Restore the v62 result layout; keep the v64 supplied trophy-room background. */
#resultScreen.resultsOverlay{
  display:none;position:fixed;inset:0;z-index:175;background:#06100f;
  align-items:center;justify-content:center;overflow:hidden;
}
#resultScreen .resultsCard{
  position:relative;width:min(1280px,100vw);aspect-ratio:16/9;max-height:100vh;
  overflow:hidden;background:#07130f;box-shadow:0 30px 100px rgba(0,0,0,.5);
}
#resultScreen .resultsBg{
  position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center!important;
  filter:none!important;
}
#resultScreen .resultsCard:after{
  content:"";position:absolute;inset:0;z-index:1;pointer-events:none;
  background:linear-gradient(90deg,rgba(4,18,15,.94) 0%,rgba(8,29,24,.88) 39%,rgba(8,24,21,.54) 63%,rgba(5,17,14,.18) 100%)!important;
}
#resultScreen .resultsFrame{
  position:absolute!important;inset:0!important;width:100%!important;height:100%!important;
  object-fit:fill!important;z-index:4!important;pointer-events:none!important;
}
#resultScreen .resultsContent{
  position:absolute!important;left:7%!important;top:5%!important;bottom:5%!important;z-index:5!important;
  width:min(650px,53%)!important;display:flex!important;flex-direction:column!important;
  justify-content:center!important;color:#f5ead3!important;font-family:Georgia,'Times New Roman',serif!important;
  padding:0!important;margin:0!important;border:0!important;border-radius:0!important;
  background:none!important;box-shadow:none!important;backdrop-filter:none!important;
}
#resultScreen .resultsSeriesLogo{
  width:min(260px,54%)!important;height:auto!important;margin:0 0 4px!important;
  filter:drop-shadow(0 4px 12px rgba(0,0,0,.5))!important;
}
#resultScreen h1{
  margin:2px 0 12px!important;color:#ead19a!important;
  font:700 clamp(28px,3vw,46px)/1 Georgia,'Times New Roman',serif!important;
  text-shadow:0 3px 10px rgba(0,0,0,.5)!important;
}
#resultScreen .resultsStats{
  display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;
  gap:8px 10px!important;margin:0 0 13px!important;
}
#resultScreen .resultStat{
  min-height:58px!important;padding:8px 12px!important;border:1px solid rgba(217,183,95,.58)!important;
  border-radius:4px!important;background:rgba(9,45,37,.8)!important;
  box-shadow:inset 0 0 0 1px rgba(5,24,20,.62)!important;
  display:flex!important;flex-direction:column!important;justify-content:center!important;
}
#resultScreen .resultStat:nth-child(3){grid-column:auto!important;min-height:58px!important}
#resultScreen .resultStat span{
  font:600 11px/1.2 Arial,sans-serif!important;letter-spacing:.095em!important;text-transform:uppercase!important;
  color:#cabd9c!important;margin-bottom:3px!important;
}
#resultScreen .resultStat strong{
  font:700 clamp(17px,1.65vw,25px)/1.05 Georgia,'Times New Roman',serif!important;color:#fff3d4!important;
}
#resultScreen .resultsTrophiesBlock{margin:0 0 13px!important;padding-top:0!important;border-top:0!important}
#resultScreen .resultsTrophiesBlock h2{
  margin:0 0 6px!important;color:#e3c474!important;
  font:700 16px/1.1 Georgia,'Times New Roman',serif!important;letter-spacing:.05em!important;text-transform:uppercase!important;
}
#resultScreen .resultsTrophies{display:flex!important;gap:7px!important;flex-wrap:wrap!important}
#resultScreen .resultTrophy{
  flex:1 1 175px!important;min-width:0!important;display:flex!important;align-items:center!important;gap:8px!important;
  padding:8px 9px!important;border:1px solid rgba(217,183,95,.5)!important;border-radius:4px!important;
  background:rgba(8,37,31,.82)!important;
}
#resultScreen .resultTrophyMark{
  flex:0 0 32px!important;width:32px!important;height:32px!important;border-radius:50%!important;
  display:grid!important;place-items:center!important;border:1px solid #e0bd61!important;
  background:radial-gradient(circle at 35% 30%,#f1d98f,#9d762e 72%)!important;
  color:#173c33!important;font:700 16px Georgia,serif!important;
  box-shadow:inset 0 0 0 2px rgba(66,40,5,.24),0 3px 9px rgba(0,0,0,.28)!important;
}
#resultScreen .resultTrophy strong{display:block!important;color:#fff0c9!important;font:700 13px/1.1 Georgia,'Times New Roman',serif!important;margin-bottom:2px!important}
#resultScreen .resultTrophy span{display:block!important;color:#d6cab0!important;font:11px/1.25 Arial,sans-serif!important}
#resultScreen .resultsNoTrophies{color:#d6cab0!important;font:13px/1.35 Arial,sans-serif!important;padding:6px 0!important}
#resultScreen #resultsContinue{align-self:flex-start!important;margin-top:1px!important}

/* Credits: no OHC logo, production credit matches teaser tagline, and add one blank line before More games. */
#creditsScreen .creditsFooter img{display:none!important}
#creditsScreen .creditsFooter{
  display:block!important;text-align:center!important;margin-top:17px!important;
  font:18px/1.45 Georgia,'Times New Roman',serif!important;color:#f3ead5!important;
}
#creditsScreen .creditsFooter strong,
#creditsScreen .creditsFooter div{
  font:inherit!important;line-height:inherit!important;margin:0!important;color:inherit!important;
}
#creditsScreen .creditsExtraLinks{margin-top:28px!important}

@media (max-width:900px), (pointer:coarse) and (max-height:500px) and (orientation:landscape){
  #resultScreen{overflow:auto!important;align-items:flex-start!important}
  #resultScreen .resultsCard{width:100%!important;min-height:100vh!important;height:auto!important;aspect-ratio:auto!important;max-height:none!important}
  #resultScreen .resultsBg{position:fixed!important;inset:0!important;filter:none!important}
  #resultScreen .resultsCard:after{position:fixed!important;background:rgba(5,24,20,.86)!important}
  #resultScreen .resultsFrame{position:fixed!important}
  #resultScreen .resultsContent{
    position:relative!important;left:auto!important;top:auto!important;bottom:auto!important;width:auto!important;
    min-height:100vh!important;padding:34px 7% 28px!important;justify-content:center!important;
  }
  #resultScreen .resultsSeriesLogo{width:min(220px,52%)!important}
  #resultScreen h1{font-size:clamp(25px,6vw,36px)!important;margin-bottom:10px!important}
  #resultScreen .resultsStats{gap:6px!important;grid-template-columns:repeat(2,minmax(0,1fr))!important}
  #resultScreen .resultStat{min-height:52px!important;padding:7px 9px!important}
  #resultScreen .resultStat strong{font-size:16px!important}
  #resultScreen .resultTrophy{flex-basis:100%!important}
  #creditsScreen .creditsFooter{font-size:13px!important;line-height:1.45!important}
  #creditsScreen .creditsExtraLinks{margin-top:22px!important}
}
@media(max-width:540px){
  #resultScreen .resultsContent{padding-top:28px!important;padding-bottom:24px!important}
  #resultScreen .resultsStats{grid-template-columns:1fr 1fr!important}
  #resultScreen .resultStat span{font-size:9px!important}
  #resultScreen .resultStat strong{font-size:14px!important}
  #resultScreen .resultsTrophiesBlock h2{font-size:13px!important}
  #resultScreen .resultTrophy span{font-size:10px!important}
}

/* ===== v66-mobile-story-and-hud-master ===== */
:root{--paws-vh:100dvh}
html,body{height:var(--paws-vh)!important;min-height:var(--paws-vh)!important}

/* All four story screens share one content anchor. */
#start .titleCopy,#finish .titleCopy,#story3 .titleCopy,#endScreen .titleCopy{
  left:67px!important;top:28px!important;transform:none!important;width:min(500px,44%)!important;padding-top:0!important;
}
#start .storyLogoMain,#finish .storyLogoMain,#story3 .storyLogoMain,#endScreen .storyLogoMain{
  position:static!important;display:block!important;width:min(410px,92%)!important;height:auto!important;margin:0 0 14px 0!important;
}
#start .titleCopy h1,#finish .titleCopy h1,#story3 .titleCopy h1,#endScreen .titleCopy h1{margin-top:0!important}
#resultScreen .resultsSeriesLogo{width:min(310px,62%)!important;height:auto!important}

@media (max-width:900px), (pointer:coarse) and (max-height:500px) and (orientation:landscape){
  html,body,#game,#hud,#start,#finish,#story3,#endScreen,#resultScreen,#creditsScreen,#chestSequence,#level2Search,#level3Search{
    height:var(--paws-vh)!important;max-height:var(--paws-vh)!important;
  }
  #start,#finish,#story3,#endScreen,#resultScreen,#creditsScreen,#chestSequence{
    padding:0!important;overflow:hidden!important;align-items:center!important;justify-content:center!important;
  }
  #start .titleScene,#finish .titleScene,#story3 .titleScene,#endScreen .titleScene,
  #resultScreen .resultsCard,#creditsScreen .creditsCard,#chestSequence .cutsceneFrame{
    width:min(100vw,calc(var(--paws-vh) * 1.7777778))!important;
    height:min(var(--paws-vh),calc(100vw * .5625))!important;
    min-height:0!important;max-height:var(--paws-vh)!important;aspect-ratio:16/9!important;flex:0 0 auto!important;
  }
  #start .titleCopy,#finish .titleCopy,#story3 .titleCopy,#endScreen .titleCopy{
    left:5.25%!important;top:3.9%!important;width:min(500px,44%)!important;padding-top:0!important;
  }
  #start .storyLogoMain,#finish .storyLogoMain,#story3 .storyLogoMain,#endScreen .storyLogoMain{
    width:min(34vw,410px)!important;max-width:92%!important;margin-bottom:8px!important;
  }
  #start .titleCopy h1,#finish .titleCopy h1,#story3 .titleCopy h1,#endScreen .titleCopy h1{
    font-size:clamp(20px,3.5vw,34px)!important;margin-bottom:8px!important;
  }
  #start .titleCopy p,#finish .titleCopy p,#story3 .titleCopy p,#endScreen .titleCopy p{
    font-size:clamp(11px,1.7vw,15px)!important;line-height:1.32!important;margin-bottom:6px!important;
  }
  #start .adventureStart,#finish .adventureStart,#story3 .adventureStart,#endScreen .adventureStart{
    margin-top:7px!important;padding:9px 14px!important;font-size:12px!important;
  }

  /* Pinch replaces +/- on mobile. */
  #zoom,#l2Zoom,#level3Search .sharedZoom{display:none!important}

  /* One mobile HUD geometry for Search 1, 2 and 3. */
  #progress,#l2Progress,#level3Search .sharedMobileProgress{
    position:absolute!important;left:max(8px,env(safe-area-inset-left))!important;top:max(8px,env(safe-area-inset-top))!important;
    height:31px!important;padding:0 10px!important;display:flex!important;align-items:center!important;
    border:1px solid rgba(180,137,61,.72)!important;border-radius:12px!important;background:rgba(8,55,45,.94)!important;
    color:#f4e5bd!important;font:800 11px/1 Arial,sans-serif!important;box-shadow:0 2px 10px rgba(0,0,0,.25)!important;
    z-index:160!important;white-space:nowrap!important;
  }
  #bonus,.l2BonePill{
    position:absolute!important;left:max(116px,calc(env(safe-area-inset-left) + 116px))!important;top:max(9px,calc(env(safe-area-inset-top) + 1px))!important;
    width:50px!important;height:29px!important;padding:0!important;border:0!important;background:transparent!important;box-shadow:none!important;z-index:161!important;
  }
  #mobileBoneIcon,#l2MobileBone,#level3Search .sharedMobileBone{
    position:absolute!important;left:max(116px,calc(env(safe-area-inset-left) + 116px))!important;top:max(9px,calc(env(safe-area-inset-top) + 1px))!important;
    width:50px!important;height:29px!important;object-fit:contain!important;border:0!important;background:transparent!important;z-index:161!important;
  }
  #bonus #mobileBoneIcon,.l2BonePill #l2MobileBone{left:0!important;top:0!important}
  #hint,#l2MobileHint,#level3Search .sharedMobileHint{
    position:absolute!important;right:max(8px,env(safe-area-inset-right))!important;top:max(8px,env(safe-area-inset-top))!important;
    width:72px!important;height:31px!important;padding:0 8px!important;border-radius:12px!important;z-index:161!important;font-size:11px!important;pointer-events:auto!important;
  }
  #sound,#l2MobileSound,#level3Search .sharedMobileSound{
    position:absolute!important;right:max(86px,calc(env(safe-area-inset-right) + 86px))!important;top:max(8px,env(safe-area-inset-top))!important;
    width:34px!important;height:31px!important;padding:0!important;border-radius:12px!important;z-index:161!important;pointer-events:auto!important;
  }
  #sound img,#l2MobileSound img,#level3Search .sharedMobileSound img{width:20px!important;height:20px!important;object-fit:contain!important}
  #drawerTab,#l2DrawerTab,#level3Search .sharedDrawerTab{
    top:50%!important;right:0!important;transform:translateY(-50%)!important;z-index:162!important;pointer-events:auto!important;
  }
  #drawer,#l2Drawer,#level3Search .sharedDrawer{
    top:0!important;height:var(--paws-vh)!important;max-height:var(--paws-vh)!important;z-index:161!important;
  }
  #level2Search #l2MobileHud,#level3Search .sharedMobileHud{display:block!important;position:absolute!important;inset:0!important;z-index:150!important}
}
#mobileGestureTip{
  position:fixed;left:50%;bottom:max(18px,env(safe-area-inset-bottom));transform:translateX(-50%);z-index:10020;
  max-width:min(560px,88vw);padding:9px 14px;border:1px solid rgba(218,184,103,.65);border-radius:12px;
  background:rgba(7,36,30,.94);color:#f5e7c6;box-shadow:0 5px 20px rgba(0,0,0,.35);
  font:600 12px/1.3 Arial,sans-serif;text-align:center;opacity:0;transition:opacity .2s ease;pointer-events:none;
}
#mobileGestureTip.show{opacity:1}



/* ===== v67-mobile-stability ===== */
@media (max-width:900px) and (orientation:landscape), (pointer:coarse) and (max-height:500px) and (orientation:landscape){
  /* First story screen must be usable before fullscreen is allowed by the browser. */
  #start .titleCopy{
    top:3.3%!important;
    left:5.25%!important;
    width:min(470px,42%)!important;
    transform-origin:top left!important;
  }
  #start .storyLogoMain{
    width:min(29vw,250px)!important;
    margin-bottom:6px!important;
  }
  #start .titleCopy p{
    font-size:clamp(9px,1.35vw,12.5px)!important;
    line-height:1.22!important;
    margin-bottom:4px!important;
  }
  #start .titleCopy .startHelp{margin-top:3px!important;margin-bottom:4px!important}
  #start .adventureStart{margin-top:4px!important;padding:7px 12px!important;font-size:11px!important}

  /* One literal mobile HUD layout for all three search scenes. */
  .pawsMobileHudMaster{
    position:absolute!important;
    left:max(8px,env(safe-area-inset-left))!important;
    right:max(8px,env(safe-area-inset-right))!important;
    top:max(8px,env(safe-area-inset-top))!important;
    height:34px!important;
    display:flex!important;
    align-items:center!important;
    justify-content:space-between!important;
    z-index:190!important;
    pointer-events:none!important;
  }
  .pawsHudLeft,.pawsHudRight{
    display:flex!important;align-items:center!important;gap:6px!important;min-width:0!important;
    pointer-events:none!important;
  }
  .pawsMobileHudMaster .pawsHudCount,
  .pawsMobileHudMaster .pawsHudBone,
  .pawsMobileHudMaster .pawsHudSound,
  .pawsMobileHudMaster .pawsHudHint{
    position:static!important;left:auto!important;right:auto!important;top:auto!important;bottom:auto!important;
    margin:0!important;transform:none!important;box-sizing:border-box!important;
  }
  .pawsMobileHudMaster .pawsHudCount{
    min-width:94px!important;width:auto!important;height:32px!important;padding:0 10px!important;
    display:flex!important;align-items:center!important;justify-content:center!important;
    border:1px solid rgba(180,137,61,.75)!important;border-radius:11px!important;
    background:rgba(8,55,45,.94)!important;color:#f4e5bd!important;
    font:800 11px/1 Arial,sans-serif!important;white-space:nowrap!important;
    box-shadow:0 2px 10px rgba(0,0,0,.28)!important;pointer-events:none!important;
  }
  .pawsMobileHudMaster .pawsHudBone{
    width:46px!important;height:32px!important;padding:3px 5px!important;
    display:flex!important;align-items:center!important;justify-content:center!important;
    border:1px solid rgba(180,137,61,.62)!important;border-radius:11px!important;
    background:rgba(8,55,45,.91)!important;box-shadow:0 2px 10px rgba(0,0,0,.25)!important;
    object-fit:contain!important;pointer-events:none!important;
  }
  .pawsMobileHudMaster .pawsHudBone img{max-width:100%!important;max-height:100%!important;object-fit:contain!important;position:static!important}
  .pawsMobileHudMaster .pawsHudSound{
    width:36px!important;height:32px!important;padding:0!important;display:flex!important;align-items:center!important;justify-content:center!important;
    border:1px solid rgba(180,137,61,.72)!important;border-radius:11px!important;background:rgba(8,55,45,.94)!important;
    box-shadow:0 2px 10px rgba(0,0,0,.25)!important;pointer-events:auto!important;
  }
  .pawsMobileHudMaster .pawsHudSound img{width:20px!important;height:20px!important;object-fit:contain!important}
  .pawsMobileHudMaster .pawsHudHint{
    width:72px!important;height:32px!important;padding:0 8px!important;display:flex!important;align-items:center!important;justify-content:center!important;
    border:1px solid rgba(115,77,19,.85)!important;border-radius:11px!important;
    background:linear-gradient(#d4ad50,#9d742c)!important;color:#24170c!important;
    font:800 11px/1 Arial,sans-serif!important;box-shadow:0 2px 10px rgba(0,0,0,.25)!important;pointer-events:auto!important;
  }
  /* Empty legacy rows no longer affect geometry after their children are moved into the master HUD. */
  #mobileProgressRow,#l2MobileProgressRow{position:static!important;display:contents!important}
}
@media (min-width:901px) and (pointer:fine), (min-width:901px) and (pointer:none), (min-width:901px) and (min-height:500.01px), (min-width:901px) and (orientation:portrait){.pawsMobileHudMaster{display:none!important}}


/* ===== v68 mobile tap + HUD polish ===== */
@media (max-width:900px) and (orientation:landscape), (pointer:coarse) and (max-height:500px) and (orientation:landscape){
  /* Give the opening copy more breathing room before fullscreen is available. */
  #start .titleCopy{
    top:2.1%!important;
    left:5.0%!important;
    width:min(470px,42%)!important;
  }
  #start .storyLogoMain{width:min(27vw,235px)!important;margin-bottom:4px!important}
  #start .titleCopy p{font-size:clamp(8.5px,1.25vw,11.5px)!important;line-height:1.18!important;margin-bottom:3px!important}
  #start .titleCopy .startHelp{margin-top:2px!important;margin-bottom:3px!important}
  #start .adventureStart{margin-top:3px!important;padding:6px 10px!important;min-height:30px!important;font-size:10.5px!important;line-height:1.05!important}

  /* Opening/story music control: smaller green plate, slightly higher and farther right. */
  #start .overlaySoundBtn{
    width:36px!important;height:36px!important;border-radius:10px!important;
    top:max(5px,env(safe-area-inset-top))!important;
    right:max(7px,env(safe-area-inset-right))!important;
  }
  #start .overlaySoundBtn img{width:23px!important;height:23px!important}

  /* Search HUD: count above bone on the left; readable music + compact hint on the right. */
  .pawsMobileHudMaster{top:max(7px,env(safe-area-inset-top))!important;height:64px!important;align-items:flex-start!important}
  .pawsHudLeft{flex-direction:column!important;align-items:flex-start!important;gap:4px!important}
  .pawsHudRight{align-items:flex-start!important;gap:5px!important}
  .pawsMobileHudMaster .pawsHudCount{height:31px!important;min-width:94px!important;padding:0 9px!important}
  .pawsMobileHudMaster .pawsHudBone{
    width:47px!important;height:25px!important;padding:2px 5px!important;
    border-radius:9px!important;margin-left:0!important;
  }
  .pawsMobileHudMaster .pawsHudSound{
    width:40px!important;height:34px!important;border-radius:10px!important;
    background:rgba(8,55,45,.96)!important;
  }
  .pawsMobileHudMaster .pawsHudSound img{width:25px!important;height:25px!important}
  .pawsMobileHudMaster .pawsHudHint{
    width:auto!important;min-width:58px!important;height:34px!important;
    padding:0 5px!important;border-radius:10px!important;
  }

  /* The list tab/swipe now does all opening and closing. */
  #drawerClose,#l2DrawerClose,.sharedDrawerClose{display:none!important}
  #drawer,#l2Drawer,.sharedDrawer{padding-top:42px!important}
}



/* ===== v69 portrait mobile start + level1 HUD master polish ===== */
#mobilePortraitStart{display:none}
#rotateNotice .rotateAdventureLogo{
  display:block;width:min(255px,76vw);height:auto;max-height:105px;object-fit:contain;
  margin:0 auto 14px;
}
@media (max-width:600px) and (pointer:coarse){
  body:not(.pawsMobileStarted) #rotateNotice{display:none!important}
  body:not(.pawsMobileStarted) #mobilePortraitStart{display:flex!important}
  #mobilePortraitStart{
    position:fixed;inset:0;z-index:10060;align-items:center;justify-content:center;
    background:#071713;color:#f6ecd7;overflow:hidden;padding:0;
  }
  #mobilePortraitStart .mobilePortraitStage{
    position:relative;overflow:hidden;flex:0 0 auto;
    width:min(100vw,calc(var(--paws-vh) * .5625));
    height:min(var(--paws-vh),calc(100vw * 1.7777778));
    max-width:100vw;max-height:var(--paws-vh);background:#0a1d18;
  }
  #mobilePortraitStart .mobilePortraitArtwork{
    position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:72% center;
    transform:scale(1.035);transform-origin:center;filter:saturate(.92) brightness(.8);
  }
  #mobilePortraitStart .mobilePortraitFrame{
    position:absolute;inset:0;z-index:4;width:100%;height:100%;object-fit:fill;pointer-events:none;
  }
  #mobilePortraitStart .mobilePortraitShade{
    position:absolute;inset:0;background:
      linear-gradient(180deg,rgba(3,16,13,.84) 0%,rgba(4,22,18,.68) 32%,rgba(4,22,18,.20) 58%,rgba(4,22,18,.05) 77%,rgba(4,22,18,.18) 100%);
  }
  #mobilePortraitStart .mobilePortraitContent{
    position:absolute;z-index:5;left:8%;right:8%;top:max(28px,calc(env(safe-area-inset-top) + 18px));
    display:flex;flex-direction:column;align-items:center;text-align:center;text-shadow:0 2px 5px rgba(0,0,0,.62);
  }
  #mobilePortraitStart .mobilePortraitLogo{
    display:block;width:min(78vw,305px);max-width:100%;height:auto;max-height:120px;object-fit:contain;margin:0 auto 13px;
  }
  #mobilePortraitStart h1{
    margin:0 0 10px;font:500 clamp(24px,7vw,32px)/1.06 Georgia,'Times New Roman',serif;color:#fff0cb;
  }
  #mobilePortraitStart p{
    margin:0 auto 18px;max-width:310px;font:500 clamp(12px,3.5vw,14px)/1.42 Georgia,'Times New Roman',serif;color:#eee4d2;
  }
  #mobilePortraitStart .mobilePortraitStartBtn{
    min-width:178px;min-height:46px;padding:11px 22px;border:1px solid rgba(218,184,103,.62);border-radius:12px;
    background:#176653;color:#fff7df;box-shadow:0 6px 18px rgba(0,0,0,.35);
    font:800 15px/1 Arial,sans-serif;cursor:pointer;
  }
  #mobilePortraitStart .mobilePortraitStartBtn:active{transform:translateY(1px);box-shadow:0 3px 10px rgba(0,0,0,.30)}
}
@media (max-width:600px) and (pointer:coarse) and (orientation:landscape){
  #mobilePortraitStart .mobilePortraitContent{top:16px;left:7%;right:7%}
  #mobilePortraitStart .mobilePortraitLogo{width:min(78%,185px);max-height:78px;margin-bottom:6px}
  #mobilePortraitStart h1{font-size:18px;margin-bottom:5px}
  #mobilePortraitStart p{font-size:9.5px;line-height:1.28;margin-bottom:8px}
  #mobilePortraitStart .mobilePortraitStartBtn{min-width:145px;min-height:34px;padding:8px 12px;font-size:11px;border-radius:9px}
}

/* Search screen 1 only: this is the mobile HUD master until approved. */
@media (max-width:900px) and (orientation:landscape), (pointer:coarse) and (max-height:500px) and (orientation:landscape){
  #hud .pawsMobileHudMaster{height:67px!important;top:max(7px,env(safe-area-inset-top))!important}
  #hud .pawsHudLeft{gap:4px!important}
  #hud .pawsHudBone{
    width:47px!important;height:25px!important;margin-left:23px!important;padding:2px 5px!important;
    border:1px solid rgba(180,137,61,.62)!important;border-radius:9px!important;background:rgba(8,55,45,.91)!important;
  }
  #hud .pawsHudSound{
    width:42px!important;height:35px!important;padding:0!important;border-radius:10px!important;
    border:1px solid rgba(180,137,61,.74)!important;background:rgba(8,55,45,.97)!important;
    box-shadow:0 2px 10px rgba(0,0,0,.28)!important;
  }
  #hud .pawsHudSound img{width:27px!important;height:27px!important;object-fit:contain!important}
  #hud .pawsHudHint{
    width:auto!important;min-width:0!important;height:35px!important;padding:0 7px!important;border:0!important;border-radius:10px!important;
    background:#ffd34c!important;color:#20352e!important;font-weight:900!important;
  }
}

/* v77: smoother scene transforms on mobile */
#world,#l2World,#l3World{will-change:transform;}


/* ===== v79 mobile search 1 and story polish ===== */
@media (max-width:900px) and (orientation:landscape), (pointer:coarse) and (max-height:500px) and (orientation:landscape){
  /* Search 1 only: count, bone and sound form one vertical stack. */
  #hud .pawsMobileHudMaster{height:108px!important}
  #hud .pawsHudLeft{gap:4px!important}
  #hud .pawsHudBone{margin-left:23px!important}
  #hud .pawsHudSound{
    margin-left:25px!important;width:43px!important;height:34px!important;padding:0!important;
    border-radius:10px!important;border:1px solid rgba(180,137,61,.74)!important;
    background:rgba(8,55,45,.97)!important;box-shadow:0 2px 10px rgba(0,0,0,.28)!important;
  }
  #hud .pawsHudSound img{width:26px!important;height:26px!important;object-fit:contain!important}
  #hud .pawsHudHint{
    background:#ffd34c!important;color:#20352e!important;border:1px solid #d3a82e!important;
    min-width:72px!important;height:35px!important;padding:0 8px!important;
  }
  /* Search 1 drawer follows its longest current item, with a safe mobile maximum. */
  #drawer{width:var(--paws-drawer-width,auto)!important;max-width:75vw!important;padding-left:16px!important;padding-right:16px!important}
  #drawerTab.drawer-open{right:var(--paws-drawer-width,240px)!important}
  #drawer .item{position:relative!important;padding-left:16px!important;white-space:nowrap!important}
  #drawer .item:before{content:"◆";position:absolute;left:1px;top:10px;font-size:7px;color:#caa64e}
  #drawer .item.done:before{content:"✓";top:7px;font-size:12px;color:#e1c15d;font-weight:900}

  /* Story 2 and 3: nudge only the logo, not the whole text block. */
  #finish .storyLogoMain,#story3 .storyLogoMain{position:relative!important;left:10px!important;top:6px!important;margin-bottom:14px!important}
  /* v100e: story 3 logo slightly lower. */
  #story3 .storyLogoMain{top:14px!important}

  /* Story 4: compact, readable mobile composition that keeps CTA on screen. */
  #endScreen .storyLogoMain{width:min(29vw,330px)!important;margin-bottom:4px!important}
  #endScreen .titleCopy{top:3.2%!important}
  #endScreen .titleCopy h1{font-size:clamp(18px,3.1vw,29px)!important;margin-bottom:5px!important}
  #endScreen .titleCopy p{font-size:clamp(10px,1.55vw,14px)!important;line-height:1.25!important;margin-bottom:4px!important}
  #endScreen .titleCopy .nextTease{margin-top:4px!important;margin-bottom:3px!important}
  #endScreen .adventureStart{margin-top:5px!important;padding:8px 12px!important;font-size:11px!important}
}