#callbook-shelf {
  position: fixed;
  z-index: 16;
  top: max(88px, calc(env(safe-area-inset-top) + 80px));
  bottom: max(200px, calc(var(--ir-dock-bottom, 108px) + var(--ir-theme-height, 0px) + 62px));
  left: max(12px, calc(env(safe-area-inset-left) + 12px));
  width: min(420px, calc(100vw - 24px));
  color: #f2faff;
  pointer-events: none;
}
body.venue-compare-active #callbook-shelf { visibility: hidden; }
#callbook-shelf button, #callbook-shelf select, #callbook-shelf input, #callbook-shelf a {
  min-height: 32px;
  padding: 0 9px;
  border: 1px solid #356781;
  border-radius: 8px;
  background: #123047;
  color: #f2faff;
  font: inherit;
  font-size: 12px;
}
#callbook-shelf button:hover, #callbook-shelf a:hover { background: #1c435d; border-color: #66ccff; }
#callbook-shelf button:disabled { opacity: .4; cursor: default; }
#callbook-shelf :is(button, select, input, a):focus-visible { outline: 2px solid #ffe066; outline-offset: 2px; }
#callbook-shelf #callbook-toggle {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 7px;
  width: 40px;
  min-height: 118px;
  padding: 9px 5px;
  border-radius: 12px;
  background: #0b2133ed;
  color: #66ccff;
  box-shadow: 0 4px 18px #0006;
  pointer-events: auto;
}
#callbook-toggle svg { width: 22px; height: 22px; }
#callbook-toggle span { writing-mode: vertical-rl; letter-spacing: 3px; }
#callbook-panel {
  display: flex;
  flex-direction: column;
  height: 100%;
  overflow: hidden;
  border: 1px solid #356781;
  border-top: 3px solid #66ccff;
  border-radius: 14px;
  background: #0b2133f5;
  box-shadow: 0 12px 36px #0006;
  backdrop-filter: blur(12px);
  pointer-events: auto;
}
.callbook-header { display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 8px 10px; }
.callbook-header h2 { margin: 0; font-size: 14px; color: #66ccff; }
.callbook-header-actions { display: flex; align-items: center; gap: 5px; }
#callbook-shelf #callbook-fold { width: 32px; padding: 0; font-size: 19px; }
.callbook-picker { display: flex; align-items: center; gap: 8px; padding: 0 10px 8px; }
#callbook-select { flex: 1; min-width: 0; width: 100%; }
#callbook-shelf #callbook-original { display: inline-flex; align-items: center; flex-shrink: 0; color: #66ccff; text-decoration: none; }
.callbook-toolbar { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 5px; padding: 0 10px 8px; }
#callbook-page-form { display: flex; align-items: center; gap: 4px; margin: 0; }
#callbook-shelf #callbook-page-number { width: 48px; padding: 0 3px; text-align: center; appearance: textfield; }
#callbook-page-number::-webkit-inner-spin-button { appearance: none; }
#callbook-page-total { color: #afc8d9; font-size: 11px; min-width: 32px; }
.callbook-zoom-controls { display: flex; align-items: center; gap: 4px; }
#callbook-shelf #callbook-previous, #callbook-shelf #callbook-next, #callbook-shelf #callbook-zoom-in, #callbook-shelf #callbook-zoom-out { width: 30px; padding: 0; font-size: 18px; }
#callbook-shelf #callbook-zoom { min-width: 45px; padding: 0 4px; font-size: 11px; }
#callbook-viewport { position: relative; flex: 1; min-height: 80px; overflow: auto; padding: 12px; background: #071825; overscroll-behavior: contain; touch-action: pan-x pan-y pinch-zoom; scrollbar-color: #356781 #071825; }
#callbook-page { position: relative; margin: 0 auto; background: #fff; box-shadow: 0 3px 14px #0008; }
#callbook-page:empty { display: none; }
#callbook-page canvas, #callbook-page img { display: block; max-width: none; }
.callbook-page-links { position: absolute; inset: 0; }
#callbook-shelf .callbook-page-link { position: absolute; min-height: 0; padding: 0; border: 0; border-radius: 0; background: transparent; box-shadow: none; cursor: pointer; }
#callbook-shelf .callbook-page-link:hover { background: #66ccff30; }
#callbook-empty { display: grid; place-content: center; min-height: 100%; color: #afc8d9; text-align: center; font-size: 13px; }
.callbook-footer { display: flex; align-items: center; gap: 8px; min-height: 31px; padding: 5px 10px; border-top: 1px solid #356781; }
#callbook-status { flex: 1; min-width: 0; font-size: 11px; color: #afc8d9; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
#callbook-shelf #callbook-retry { min-height: 25px; font-size: 11px; }
#callbook-shelf.is-wide { z-index: 10020; inset: max(12px, env(safe-area-inset-top)) max(12px, env(safe-area-inset-right)) max(12px, env(safe-area-inset-bottom)) max(12px, env(safe-area-inset-left)); width: auto; }
@media (max-width: 640px) {
  #callbook-shelf { left: 10px; top: max(82px, calc(env(safe-area-inset-top) + 76px)); width: calc(100vw - 20px); }
  .callbook-header { padding-inline: 8px; }
  .callbook-picker, .callbook-toolbar { padding-inline: 8px; }
  .callbook-toolbar { gap: 4px; }
  #callbook-shelf .callbook-toolbar button { padding-inline: 6px; }
}
@media (max-height: 560px) {
  #callbook-shelf { top: 8px; bottom: 8px; }
  .callbook-header { padding-block: 5px; }
  .callbook-picker, .callbook-toolbar { padding-bottom: 5px; }
}
