/* Comic Book Spatial remote access. Independent of page/image/turn layers. */
.cr-shell .cr-spatial-access-menu-placeholder{display:none!important}
.cr-shell>.cr-spatial-access-panel[hidden]{display:none!important}
.cr-shell>.cr-spatial-access-panel{
 position:fixed!important;
 top:max(14px,env(safe-area-inset-top,0px))!important;
 right:max(12px,env(safe-area-inset-right,0px))!important;
 left:auto!important;
 z-index:3000!important;
 box-sizing:border-box!important;
 display:grid!important;
 width:min(348px,calc(100dvw - 24px))!important;
 max-height:calc(100dvh - 36px)!important;
 overflow:auto!important;
 padding:16px!important;
 gap:12px!important;
 border:1px solid rgba(157,233,255,.68)!important;
 border-radius:16px!important;
 color:#e5faff!important;
 background:linear-gradient(150deg,rgba(30,65,84,.985),rgba(4,15,27,.99) 54%,rgba(11,31,47,.99))!important;
 box-shadow:inset 0 1px 0 rgba(255,255,255,.26),inset 0 -2px 0 rgba(0,0,0,.62),0 10px 38px rgba(0,0,0,.78),0 0 24px rgba(93,226,255,.14)!important;
 font:700 11px/1.4 system-ui,-apple-system,sans-serif!important;
 pointer-events:auto!important;
 touch-action:pan-y!important;
}
.cr-spatial-access-panel>header{display:flex!important;align-items:center!important;justify-content:space-between!important;gap:14px!important}
.cr-spatial-access-panel>header>div{display:grid!important;gap:3px!important}
.cr-spatial-access-panel>header small{font:800 9px/1.3 ui-monospace,monospace!important;color:#8ccee4!important;letter-spacing:.15em!important}
.cr-spatial-access-panel>header strong{font:850 15px/1.2 system-ui,sans-serif!important;letter-spacing:.1em!important;color:#f7fcff!important}
.cr-spatial-access-panel button{touch-action:manipulation!important;cursor:pointer!important}
.cr-spatial-access-panel>header>button{width:34px!important;height:34px!important;padding:0!important;border-radius:9px!important;border:1px solid rgba(159,237,255,.55)!important;background:rgba(20,58,75,.9)!important;color:#fff!important;font:800 22px/1 sans-serif!important}
.cr-spatial-access-panel>.cr-spatial-menu-power{
 display:flex!important;align-items:center!important;justify-content:space-between!important;
 gap:10px!important;min-height:45px!important;padding:10px 13px!important;
 border:1px solid rgba(111,220,248,.42)!important;border-radius:10px!important;
 color:#f5fdff!important;
 font:800 11px/1.1 ui-monospace,monospace!important;letter-spacing:.06em!important;
 background:linear-gradient(180deg,rgba(69,139,167,.36),rgba(9,35,53,.9))!important;
}
.cr-spatial-menu-power[aria-pressed="true"]{border-color:#89edff!important;box-shadow:inset 0 0 17px rgba(50,211,255,.17),0 0 14px rgba(90,226,255,.12)!important}
.cr-spatial-menu-power>span{margin-left:auto!important;color:#9bddf2!important}
.cr-spatial-access-panel>label{display:flex!important;justify-content:space-between!important;gap:10px!important;font:800 10px/1.2 ui-monospace,monospace!important;letter-spacing:.1em!important}
.cr-spatial-access-panel output{color:#a7f0ff!important;font-variant-numeric:tabular-nums!important}
.cr-spatial-access-panel input[type="range"]{display:block!important;width:100%!important;accent-color:#83e9ff!important}
.cr-spatial-access-panel p{margin:0!important;font-size:10px!important;line-height:1.5!important;color:#9fbac7!important}
.cr-shell .cr-spatial-group>.cr-spatial-menu-access{
 display:flex!important;flex:0 0 auto!important;align-items:center!important;justify-content:center!important;
 gap:4px!important;min-width:39px!important;min-height:28px!important;
 border:1px solid rgba(146,234,255,.46)!important;border-radius:9px!important;
 padding:4px 6px!important;
 color:#d9faff!important;
 background:linear-gradient(180deg,rgba(75,138,165,.38),rgba(4,22,38,.91))!important;
 box-shadow:inset 0 1px 0 rgba(234,252,255,.2),0 2px 5px rgba(0,0,0,.38)!important;
 touch-action:manipulation!important;pointer-events:auto!important;
 font:800 9px/1 ui-monospace,monospace!important;letter-spacing:.035em!important;
}
.cr-shell .cr-spatial-menu-access[aria-expanded="true"]{border-color:#9ceaff!important;background:rgba(26,95,130,.8)!important}
.cr-shell .cr-spatial-menu-access>span:first-child{font-size:18px!important;line-height:1!important}
.cr-shell .cr-spatial-menu-access:focus-visible,
.cr-spatial-access-panel button:focus-visible,
.cr-spatial-access-panel input:focus-visible{outline:2px solid #adf0ff!important;outline-offset:2px!important}
@media (orientation:portrait) and (max-width:820px){
 .cr-shell[data-view="reader"][data-layout="single"]>.cr-toolbar>.cr-spatial-group{gap:1px!important}
 .cr-shell[data-view="reader"][data-layout="single"]>.cr-toolbar #spatialBtn{
  min-width:0!important;flex:1 1 0!important;padding:0 1px!important;
 }
 .cr-shell[data-view="reader"][data-layout="single"]>.cr-toolbar #spatialBtn .cr-spatial-label{display:none!important}
 .cr-shell[data-view="reader"][data-layout="single"]>.cr-toolbar #spatialMenuBtn{
  min-width:29px!important;width:29px!important;max-width:29px!important;
  flex:0 0 29px!important;height:36px!important;min-height:36px!important;
  padding:0 1px!important;border-radius:8px!important;
 }
 .cr-shell[data-view="reader"][data-layout="single"]>.cr-toolbar #spatialMenuBtn .cr-spatial-access-label{display:none!important}
 .cr-shell[data-view="reader"][data-layout="single"][data-spatial-available="false"]>.cr-toolbar>.cr-enhance-group{
  grid-area:2 / 9 / 3 / 11!important;
 }
 .cr-shell[data-view="reader"][data-layout="single"]>.cr-toolbar #spatialBtn[disabled]{display:none!important}
}
@media (orientation:landscape){
 .cr-shell[data-view="reader"]>.cr-toolbar>.cr-spatial-group:not([hidden]){gap:4px!important}
 .cr-shell[data-view="reader"]>.cr-toolbar>.cr-spatial-group:not([hidden])>#spatialBtn,
 .cr-shell[data-view="reader"]>.cr-toolbar>.cr-spatial-group:not([hidden])>#spatialMenuBtn{
  width:auto!important;flex:1 1 0!important;min-height:30px!important;
 }
}
@media (prefers-reduced-motion:reduce){.cr-spatial-access-panel *{transition:none!important}}

/* Source-verified MapMask preview lives in the existing Spatial settings.
 * It never draws a second overlay or captures page-turn gestures. */
.cr-spatial-access-panel #spatialSceneStatus{
 padding:9px 11px!important;border:1px solid rgba(114,221,250,.32)!important;
 border-radius:9px!important;background:rgba(1,17,27,.58)!important;
 color:#d2f4ff!important;font:700 10px/1.5 ui-monospace,monospace!important;
}
.cr-spatial-access-panel .cr-spatial-menu-preview{
 min-height:40px!important;padding:9px 12px!important;
 border:1px solid rgba(118,236,253,.8)!important;border-radius:10px!important;
 background:linear-gradient(160deg,rgba(34,125,162,.69),rgba(7,45,72,.91))!important;
 color:#f6fdff!important;font:800 11px/1.25 ui-monospace,monospace!important;
 letter-spacing:.05em!important;text-align:center!important;
}
.cr-spatial-access-panel .cr-spatial-menu-preview:active{
 background:rgba(39,145,186,.94)!important;
}