/* v115 — unified control dock. Desktop controls retain their existing layout. */
#viewer .mobile-dock{display:none}
#viewer.mobile-dock-active .viewer-top{display:none!important}
#viewer.mobile-dock-active .image-stage{
 inset:var(--view-top,0px) var(--view-right,0px) var(--view-bottom,0px) var(--view-left,0px)!important;
}
#viewer.mobile-dock-active .mobile-dock{
 position:absolute!important;z-index:40!important;
 display:flex!important;align-items:center!important;justify-content:center!important;gap:7px!important;
 left:var(--dock-center,50%)!important;
 bottom:calc(var(--view-bottom,0px) + max(10px,env(safe-area-inset-bottom,0px)))!important;
 transform:translateX(-50%)!important;
 box-sizing:border-box!important;width:max-content!important;
 max-width:calc(var(--dock-space,100%) - 20px)!important;
 padding:7px!important;border:1px solid #ffffff1f!important;border-radius:13px!important;
 background:rgba(19,24,28,.88)!important;
 -webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);
 box-shadow:0 5px 18px #0005!important;
 opacity:1;visibility:visible;pointer-events:auto;transition:opacity .16s ease;
}
#viewer.mobile-dock-active .mobile-dock .viewer-nav,
#viewer.mobile-dock-active .mobile-dock #close,
#viewer.mobile-dock-active .mobile-dock #single-download{
 position:relative!important;inset:auto!important;transform:none!important;
 display:grid!important;place-items:center!important;flex:0 0 44px!important;
 width:44px!important;height:44px!important;min-width:44px!important;min-height:44px!important;
 margin:0!important;padding:0!important;border:0!important;border-radius:8px!important;
 background:transparent!important;color:#f1f3f4!important;align-self:center!important;
 visibility:inherit!important;opacity:1!important;pointer-events:auto!important;
}
#viewer.mobile-dock-active .mobile-dock #photo-counter{
 flex:0 1 auto!important;min-width:52px!important;max-width:90px!important;
 padding:0 2px!important;margin:0!important;line-height:1.2!important;font-size:13px!important;
 font-variant-numeric:tabular-nums;white-space:normal!important;text-align:center!important;
 color:#e9eded!important;background:none!important;
}
#viewer.mobile-dock-active .mobile-dock #single-download span{display:none!important}
#viewer.mobile-dock-active .mobile-dock .viewer-nav svg{width:25px!important;height:25px!important}
#viewer.mobile-dock-active .mobile-dock #single-download svg{width:22px!important;height:22px!important}
#viewer.mobile-dock-active .mobile-dock .viewer-nav::before,
#viewer.mobile-dock-active .mobile-dock #close::after{
 content:''!important;display:block!important;position:absolute!important;inset:0!important;
 width:44px!important;height:44px!important;transform:none!important;
 opacity:.85!important;filter:none!important;pointer-events:none!important;
 background-position:center!important;background-repeat:no-repeat!important;background-size:44px 44px!important;
 background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 44 44'%3E%3Cg fill='none' stroke='%2326b9d7' stroke-width='1.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M13 3H9a6 6 0 0 0-6 6v4M31 3h4a6 6 0 0 1 6 6v4M3 31v4a6 6 0 0 0 6 6h4M41 31v4a6 6 0 0 1-6 6h-4'/%3E%3C/g%3E%3C/svg%3E")!important;
}
#viewer.mobile-dock-active .mobile-dock #close::after{
 background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 44 44'%3E%3Cg fill='none' stroke='%23d96c70' stroke-width='1.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M13 3H9a6 6 0 0 0-6 6v4M31 3h4a6 6 0 0 1 6 6v4M3 31v4a6 6 0 0 0 6 6h4M41 31v4a6 6 0 0 1-6 6h-4'/%3E%3C/g%3E%3C/svg%3E")!important;
}
#viewer.mobile-dock-active .mobile-dock #close{font-size:0!important;line-height:0!important}
#viewer.mobile-dock-active .mobile-dock #close::before{
 content:''!important;position:absolute!important;inset:0!important;pointer-events:none!important;
 background:center / 20px 20px no-repeat url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='m6 6 12 12M18 6 6 18' fill='none' stroke='%23f1f2f2' stroke-width='1.8' stroke-linecap='round'/%3E%3C/svg%3E")!important;
}
#viewer.mobile-dock-active .mobile-dock button:active,
#viewer.mobile-dock-active .mobile-dock a:active{background:#ffffff12!important}
#viewer.mobile-dock-active .mobile-dock #single-download[aria-busy=true]{opacity:.45!important}
#viewer.mobile-dock-active.mobile-controls-hidden .mobile-dock{
 opacity:0!important;visibility:hidden!important;pointer-events:none!important;
}
#viewer.mobile-dock-active.mobile-controls-hidden .mobile-dock *{pointer-events:none!important}
#viewer.mobile-dock-active .mobile-status{bottom:calc(var(--view-bottom,0px) + 80px + env(safe-area-inset-bottom,0px))!important}
@media(prefers-reduced-motion:reduce){#viewer .mobile-dock{transition:none!important}}

/* v116: CSS alone owns photo and dock geometry; no transient viewport insets. */
#viewer.mobile-dock-active{
 position:fixed!important;inset:0!important;margin:0!important;padding:0!important;
 width:100%!important;max-width:none!important;
 height:100vh!important;height:100dvh!important;max-height:none!important;
 overflow:hidden!important;
}
#viewer.mobile-dock-active .image-stage{inset:0!important;width:auto!important;height:auto!important}
#viewer.mobile-dock-active .mobile-dock{
 left:50%!important;bottom:max(10px,env(safe-area-inset-bottom,0px))!important;
 max-width:calc(100% - env(safe-area-inset-left,0px) - env(safe-area-inset-right,0px) - 20px)!important;
 gap:7px!important;
}
#viewer.mobile-dock-active .mobile-dock #single-download{
 margin-left:15px!important;
}
#viewer.mobile-dock-active .mobile-dock #single-download::before{
 content:'';position:absolute;left:-11px;top:10px;bottom:10px;width:1px;
 background:rgba(255,255,255,.23);pointer-events:none;
}
#viewer.mobile-dock-active .mobile-status{bottom:calc(80px + env(safe-area-inset-bottom,0px))!important}
#viewer.mobile-dock-active.mobile-rotating .mobile-dock{
 opacity:0!important;visibility:hidden!important;pointer-events:none!important;transition:none!important;
}
#viewer.mobile-dock-active.mobile-rotating .mobile-dock *{pointer-events:none!important}
@media(max-width:360px){
 #viewer.mobile-dock-active .mobile-dock{gap:5px!important;padding:6px!important}
 #viewer.mobile-dock-active .mobile-dock #single-download{margin-left:12px!important}
}