/* Frame around the Real3D viewer on flipbook pages (matches the site's design A). */
@font-face { font-family: 'Prompt'; font-weight: 500; font-display: swap; src: url('/vendor/real3d/prompt-500.woff2') format('woff2'); }

html, body { margin: 0; height: 100%; background: #0a0a0a; color: #fff; }
body {
  font-family: 'Prompt', system-ui, sans-serif;
  background:
    radial-gradient(ellipse 60% 70% at 50% 55%, rgba(255, 255, 255, .06), transparent 70%),
    radial-gradient(circle, rgba(255, 255, 255, .06) 1px, transparent 1.6px) 0 0 / 14px 14px,
    #0a0a0a;
  overflow: hidden;
}
a { color: inherit; text-decoration: none; }

.fb-bar {
  position: fixed; inset: 0 0 auto 0; z-index: 10; height: 64px; padding: 0 24px;
  display: flex; align-items: center; gap: 18px;
  background: rgba(10, 10, 10, .92); border-bottom: 3px solid #e31e24;
}
.fb-logo img { display: block; height: 22px; width: auto; }
.fb-sep { width: 1px; height: 24px; background: #333; }
.fb-title { flex: 1 1 auto; margin: 0; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; font-size: 14px; font-weight: 500; letter-spacing: .14em; text-transform: uppercase; color: #d6d6d6; }
.fb-actions { display: flex; gap: 10px; }
.fb-btn { display: inline-flex; align-items: center; min-height: 40px; padding: 0 18px; font-size: 13px; font-weight: 500; letter-spacing: .1em; text-transform: uppercase; border: 1px solid transparent; transition: background-color 200ms, color 200ms; }
.fb-red { background: #e31e24; }
.fb-red:hover { background: #c4161c; }
.fb-line { border-color: rgba(255, 255, 255, .6); }
.fb-line:hover { background: #fff; color: #0a0a0a; }
.fb-btn:focus-visible, .fb-logo:focus-visible { outline: 2px solid #e31e24; outline-offset: 3px; }

/* The viewer sets the container's height from the book's aspect ratio; pin it to the space
   under the bar so the book and its toolbar always fit on screen. */
.fb-book { position: fixed !important; top: 67px !important; left: 0; right: 0; bottom: 0; height: auto !important; min-height: 0 !important; }
.fb-noscript { height: 100%; overflow: auto; padding: 24px; display: grid; gap: 16px; justify-items: center; }
.fb-noscript img { max-width: 100%; height: auto; }

.fb-btn { white-space: nowrap; }
@media (max-width: 640px) {
  .fb-bar { padding: 0 14px; gap: 12px; }
  .fb-logo img { height: 17px; }
  .fb-sep, .fb-title, .fb-line { display: none; }
  .fb-actions { margin-left: auto; }
  .fb-btn { min-height: 36px; padding: 0 12px; font-size: 12px; letter-spacing: .06em; }
}