/* === Linkrix Flipbook editor + viewer styles === */
.fb-layout { max-width: 920px; margin: 24px auto; padding: 0 16px; display: flex; flex-direction: column; gap: 24px; }
.fb-head h1 { margin: 0 0 4px; font-size: 28px; }
.fb-head .muted { margin: 0; }
.fb-upload .row.between { align-items: baseline; }

.fb-field { display: flex; flex-direction: column; gap: 6px; margin: 14px 0; }
.fb-label { font-weight: 600; font-size: 13.5px; color: #1e293b; }
.fb-field input[type="text"], .fb-field input[type="file"] {
  height: 40px; padding: 0 12px; border: 1px solid #cbd5e1; border-radius: 8px; font-size: 14px; background: #fff;
}
.fb-field input[type="file"] { padding: 8px 12px; height: auto; }
.fb-field input:focus { outline: 2px solid #6366f1; outline-offset: 1px; }
.fb-help { display: block; }
.fb-check { display: flex; align-items: center; gap: 8px; margin: 8px 0; font-size: 14px; }
.fb-advanced { margin-top: 10px; padding: 8px 0 0; border-top: 1px solid #f1f5f9; }
.fb-advanced > summary { cursor: pointer; padding: 6px 0; color: #475569; font-weight: 600; font-size: 13.5px; user-select: none; }
.fb-actions { margin-top: 16px; }
.fb-actions button.primary { padding: 0 18px; height: 42px; font-weight: 600; }
.fb-search { height: 32px; padding: 0 10px; border: 1px solid #cbd5e1; border-radius: 6px; font-size: 13px; min-width: 180px; }

.fb-list { list-style: none; padding: 0; margin: 12px 0 0; display: flex; flex-direction: column; gap: 10px; }
.fb-list li.fb-item { display: flex; align-items: center; gap: 14px; padding: 12px; border: 1px solid #e2e8f0; border-radius: 10px; background: #fff; }
.fb-list .fb-thumb { width: 60px; height: 80px; flex: 0 0 60px; object-fit: cover; border-radius: 6px; border: 1px solid #e2e8f0; background: #f8fafc; }
.fb-list .fb-info { flex: 1 1 auto; min-width: 0; }
.fb-list .fb-title { font-weight: 600; color: #0f172a; word-break: break-word; }
.fb-list .fb-meta { color: #64748b; font-size: 12.5px; display: flex; flex-wrap: wrap; gap: 8px; margin-top: 4px; }
.fb-list .fb-meta a { color: var(--brand, #6366f1); }
.fb-list .fb-actions-cell { display: flex; gap: 6px; flex: 0 0 auto; }
.fb-list .fb-actions-cell button { font-size: 12.5px; padding: 6px 10px; }
.fb-list .fb-empty { padding: 18px; color: #94a3b8; text-align: center; }

/* Public viewer */
html.fb-viewer-html, body.fb-viewer-body { margin: 0; height: 100%; background: #0f172a; color: #f1f5f9; overflow: hidden; font-family: system-ui, -apple-system, "Segoe UI", Roboto, sans-serif; }
.fb-stage { position: fixed; inset: 0; display: flex; flex-direction: column; }
.fb-toolbar { display: flex; align-items: center; gap: 10px; padding: 8px 14px; background: #1e293b; border-bottom: 1px solid #334155; flex: 0 0 auto; }
.fb-toolbar .fb-title { font-weight: 600; flex: 1 1 auto; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 14px; }
.fb-toolbar button, .fb-toolbar a.btn { background: #334155; border: 1px solid #475569; color: #f1f5f9; padding: 6px 10px; border-radius: 6px; font-size: 13px; cursor: pointer; text-decoration: none; }
.fb-toolbar button:hover, .fb-toolbar a.btn:hover { background: #475569; }
.fb-toolbar button[disabled] { opacity: 0.4; cursor: not-allowed; }
.fb-toolbar .fb-page-counter { font-variant-numeric: tabular-nums; color: #cbd5e1; font-size: 13px; min-width: 64px; text-align: center; }
.fb-book-wrap { flex: 1 1 auto; display: flex; align-items: center; justify-content: center; padding: 24px; overflow: hidden; }
#fb-book { box-shadow: 0 25px 50px -12px rgba(0,0,0,0.55); border-radius: 4px; }
.fb-watermark { position: fixed; bottom: 8px; right: 12px; font-size: 12px; color: #94a3b8; text-decoration: none; background: rgba(15,23,42,0.7); padding: 4px 8px; border-radius: 4px; }
.fb-loading, .fb-error, .fb-locked { color: #cbd5e1; text-align: center; padding: 40px 20px; max-width: 420px; margin: 0 auto; }
.fb-locked input { display: block; margin: 12px auto; padding: 8px 12px; border-radius: 6px; border: 1px solid #475569; background: #1e293b; color: #f1f5f9; font-size: 14px; min-width: 220px; }
.fb-locked button { background: #6366f1; color: white; border: none; padding: 8px 18px; border-radius: 6px; font-weight: 600; cursor: pointer; }


/* Embed modal */
.fb-embed-modal { display:none; position:fixed; inset:0; background:rgba(15,23,42,0.7); z-index:9000; align-items:flex-start; justify-content:center; padding:48px 12px; overflow:auto; }
.fb-embed-modal.show { display:flex; }
.fb-embed-dialog { background:#1e293b; color:#f1f5f9; border:1px solid #475569; border-radius:10px; width:100%; max-width:560px; box-shadow:0 25px 60px rgba(0,0,0,0.5); }
.fb-embed-head { display:flex; justify-content:space-between; align-items:center; padding:12px 16px; border-bottom:1px solid #475569; font-weight:600; }
.fb-embed-body { padding:16px; display:flex; flex-direction:column; gap:14px; }
.fb-embed-row { display:flex; align-items:center; gap:10px; font-size:14px; }
.fb-embed-row.col { flex-direction:column; align-items:stretch; gap:6px; }
.fb-embed-row > span:first-child { min-width:110px; color:#cbd5e1; }
.fb-embed-row input[type="number"], .fb-embed-row select { background:#0f172a; color:#f1f5f9; border:1px solid #475569; border-radius:6px; padding:6px 8px; font-size:13px; }
.fb-embed-row input[type="checkbox"] { accent-color:#6366f1; }
.fb-embed-snippet { border-top:1px solid #334155; padding-top:14px; display:flex; flex-direction:column; gap:10px; }
.fb-embed-snippet textarea { background:#0f172a; color:#f1f5f9; border:1px solid #475569; border-radius:6px; padding:8px; font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace; font-size:12px; resize:vertical; }
.fb-embed-snippet button.primary { align-self:flex-start; }

/* Embed mode for the viewer (when ?embed=1) */
body.fb-embed .fb-toolbar { display:none !important; }
body.fb-embed .fb-watermark { display:none !important; }
body.fb-embed .fb-stage { padding:0; }
body.fb-embed .fb-book-wrap { padding:8px; }


/* Settings modal */
.fb-set-row { display:flex; justify-content:space-between; align-items:center; padding:8px 0; border-bottom:1px solid #eef0f6; font-size:14px; }
.fb-set-row:last-of-type { border-bottom:0; }
.fb-set-row > span { color:#374151; }
.fb-set-row select, .fb-set-row input[type="text"] { padding:6px 10px; border:1px solid #d4d8e6; border-radius:6px; min-width:180px; }
.fb-set-footer { display:flex; justify-content:space-between; align-items:center; margin-top:16px; padding-top:12px; border-top:1px solid #eef0f6; }
.fb-set-status { font-size:13px; color:#6366f1; }
#fb-settings-save { background:#6366f1; color:#fff; border:0; padding:8px 18px; border-radius:8px; cursor:pointer; font-weight:600; }
#fb-settings-save:hover { background:#4f46e5; }


/* Hotspots */
.stf__parent { position: relative; }
.fb-hs-layer { position:absolute; inset:0; pointer-events:none; }
.fb-hs { position:absolute; pointer-events:auto; background: rgba(99,102,241,0.0); border: 2px solid transparent; border-radius:4px; cursor:pointer; transition: background 120ms, border-color 120ms; }
.fb-hs:hover { background: rgba(99,102,241,0.18); border-color: rgba(99,102,241,0.55); }
body.fb-edit-mode .fb-hs { background: rgba(99,102,241,0.12); border:2px solid rgba(99,102,241,0.5); }
body.fb-edit-mode .fb-hs:hover { background: rgba(220,38,38,0.16); border-color: rgba(220,38,38,0.6); }
.fb-hs-draft { position:absolute; background: rgba(99,102,241,0.18); border: 2px dashed #6366f1; border-radius:4px; pointer-events:none; }
.fb-edit-banner { position:fixed; top:0; left:0; right:0; z-index:9999; background:#0f172a; color:#fff; padding:8px 16px; text-align:center; font-size:13px; }
body.fb-edit-mode .fb-stage { padding-top: 36px; }
/* one_page / slider effect adjustments */
body[data-fb-effect="one_page"] .stf__block { box-shadow:none; }

/* hotspot stacking: must overlay the StPageFlip canvas */
.fb-hs-layer { z-index: 50; }

/* === TOC modal === */
.fb-toc-list { display:flex; flex-direction:column; gap:8px; max-height: 380px; overflow-y:auto; }
.fb-toc-row { display:flex; gap:8px; align-items:center; }
.fb-toc-row .fb-toc-pg { width: 70px; padding:6px 8px; border:1px solid #334155; background:#0f172a; color:#e5e7eb; border-radius:6px; }
.fb-toc-row .fb-toc-lb { flex:1; padding:6px 8px; border:1px solid #334155; background:#0f172a; color:#e5e7eb; border-radius:6px; }
.fb-toc-row .fb-toc-rm { padding:4px 10px; }

/* === Title rename affordance === */
.fb-title[data-rename-id] { cursor: text; }
.fb-title[data-rename-id]:hover { text-decoration: underline dotted; }

/* === TOC dropdown in viewer toolbar === */
.fb-toc-sel { margin: 0 8px; padding: 6px 10px; border-radius: 8px; background: rgba(255,255,255,0.08); border: 1px solid rgba(255,255,255,0.18); color: #f8fafc; font-size: 13px; max-width: 220px; }
.fb-toc-sel:hover { background: rgba(255,255,255,0.14); }
.fb-toc-sel option { background:#0f172a; color:#f8fafc; }

/* === Branding (logo overlay) === */
.fb-logo-overlay { position: fixed; top: 60px; left: 16px; max-width: 140px; max-height: 60px; z-index: 50; pointer-events: none; filter: drop-shadow(0 2px 6px rgba(0,0,0,0.4)); }
@media (max-width: 600px) { .fb-logo-overlay { max-width: 90px; max-height: 40px; top: 56px; left: 8px; } }

/* === Media modal (lightbox / video / audio / iframe) === */
.fb-media-modal { display:none; position:fixed; inset:0; background:rgba(0,0,0,0.85); z-index:9100; align-items:center; justify-content:center; padding:24px; }
.fb-media-modal.show { display:flex; }
.fb-media-dialog { position:relative; width:100%; max-width:1100px; max-height:90vh; background:#0f172a; border-radius:8px; overflow:hidden; display:flex; align-items:center; justify-content:center; }
.fb-media-close { position:absolute; top:8px; right:12px; z-index:2; background:rgba(0,0,0,0.5); color:#fff; border:none; width:36px; height:36px; border-radius:50%; font-size:22px; line-height:1; cursor:pointer; }
.fb-media-close:hover { background:rgba(0,0,0,0.8); }
.fb-media-body { width:100%; height:100%; display:flex; align-items:center; justify-content:center; min-height:200px; }
.fb-media-img { max-width:100%; max-height:86vh; object-fit:contain; display:block; }
.fb-media-video { max-width:100%; max-height:86vh; outline:none; background:#000; }
.fb-media-iframe { width:100%; height:80vh; max-height:86vh; border:0; background:#000; }
.fb-media-audio-wrap { display:flex; flex-direction:column; align-items:center; gap:14px; padding:40px 24px; color:#f1f5f9; }
.fb-media-audio-label { font-size:18px; opacity:0.85; }
.fb-media-audio { width:min(420px, 86vw); }

/* === Hotspot create dialog === */
.fb-hs-create-modal { display:none; position:fixed; inset:0; background:rgba(0,0,0,0.7); z-index:9200; align-items:flex-start; justify-content:center; padding:80px 16px 16px; }
.fb-hs-create-modal.show { display:flex; }
.fb-hs-create-dialog { background:#1e293b; color:#f1f5f9; border:1px solid #475569; border-radius:10px; padding:20px; width:100%; max-width:440px; box-shadow:0 12px 32px rgba(0,0,0,0.5); }
.fb-hs-create-title { margin:0 0 12px; font-size:16px; font-weight:600; }
.fb-hs-create-row { display:flex; flex-direction:column; gap:6px; margin:10px 0; font-size:13px; }
.fb-hs-create-row span { color:#cbd5e1; }
.fb-hs-create-row select, .fb-hs-create-row input { background:#0f172a; color:#f1f5f9; border:1px solid #475569; border-radius:6px; padding:8px 10px; font-size:14px; }
.fb-hs-create-footer { display:flex; justify-content:flex-end; gap:8px; margin-top:14px; }
.fb-hs-create-footer button { border:0; padding:8px 16px; border-radius:6px; font-weight:600; cursor:pointer; font-size:14px; }
.fb-hs-create-footer .ghost { background:#334155; color:#f1f5f9; }
.fb-hs-create-footer .primary { background:#6366f1; color:#fff; }
.fb-hs-create-footer .primary:hover { background:#4f46e5; }

/* === Non-link hotspot affordance (small icon hint in edit mode) === */
body.fb-edit-mode .fb-hs-image::after,
body.fb-edit-mode .fb-hs-video::after,
body.fb-edit-mode .fb-hs-audio::after,
body.fb-edit-mode .fb-hs-web::after {
  position:absolute; top:2px; right:4px; font-size:11px; padding:1px 6px; border-radius:4px; background:rgba(99,102,241,0.9); color:#fff; pointer-events:none;
}
body.fb-edit-mode .fb-hs-image::after { content:'IMG'; }
body.fb-edit-mode .fb-hs-video::after { content:'VID'; }
body.fb-edit-mode .fb-hs-audio::after { content:'AUD'; }
body.fb-edit-mode .fb-hs-web::after { content:'WEB'; }

/* === Background audio toggle button === */
.fb-bg-audio-btn{
  position:fixed; top:14px; right:14px; z-index:9999;
  width:42px; height:42px; border-radius:50%;
  border:1px solid rgba(255,255,255,0.4);
  background:rgba(0,0,0,0.55); color:#fff;
  font-size:18px; line-height:1; cursor:pointer;
  display:inline-flex; align-items:center; justify-content:center;
  box-shadow:0 2px 8px rgba(0,0,0,0.3);
  transition:background 0.15s,transform 0.1s;
}
.fb-bg-audio-btn:hover{ background:rgba(0,0,0,0.75); transform:scale(1.05); }
.fb-bg-audio-btn.fb-bg-audio-muted{ opacity:0.7; }
@media (max-width:600px){
  .fb-bg-audio-btn{ width:36px; height:36px; font-size:15px; top:10px; right:10px; }
}

/* === Lead capture (viewer gate modal) === */
.fb-lead-modal{
  position:fixed; inset:0; z-index:10000;
  background:rgba(0,0,0,0.7); backdrop-filter:blur(4px);
  display:flex; align-items:center; justify-content:center; padding:20px;
}
.fb-lead-dialog{
  background:#fff; color:#222; border-radius:12px; max-width:420px; width:100%;
  padding:28px 26px; box-shadow:0 10px 40px rgba(0,0,0,0.4);
  font-family:system-ui,-apple-system,Segoe UI,Roboto,sans-serif;
}
.fb-lead-title{ margin:0 0 8px; font-size:20px; }
.fb-lead-subtitle{ margin:0 0 18px; color:#555; font-size:14px; line-height:1.5; }
.fb-lead-form{ display:flex; flex-direction:column; gap:12px; }
.fb-lead-row{ display:flex; flex-direction:column; gap:4px; }
.fb-lead-row span{ font-size:13px; color:#444; }
.fb-lead-row em{ color:#888; font-style:normal; font-size:12px; }
.fb-lead-row input{
  padding:10px 12px; font-size:14px;
  border:1px solid #d4d8de; border-radius:6px; background:#fff; color:#222;
  font-family:inherit;
}
.fb-lead-row input:focus{ outline:2px solid #4f6df5; outline-offset:-1px; border-color:#4f6df5; }
.fb-lead-submit{
  margin-top:6px; padding:11px 18px; font-size:14px; font-weight:600;
  background:#4f6df5; color:#fff; border:none; border-radius:6px; cursor:pointer;
}
.fb-lead-submit:hover{ background:#3f5cd9; }
.fb-lead-submit:disabled{ opacity:0.6; cursor:not-allowed; }

/* === Captured leads list (dashboard modal) === */
.fb-leads-list{ max-height:360px; overflow-y:auto; border:1px solid rgba(255,255,255,0.06); border-radius:8px; }
.fb-leads-row{
  display:grid; grid-template-columns: 1.6fr 1fr 1.3fr; gap:12px;
  padding:10px 14px; border-bottom:1px solid rgba(255,255,255,0.04);
  font-size:13px; align-items:center;
}
.fb-leads-row:last-child{ border-bottom:none; }
.fb-leads-cell-email{ font-weight:500; word-break:break-all; }
.fb-leads-cell-name{ color:#cbd5e1; }
.fb-leads-cell-meta{ color:#94a3b8; font-size:12px; text-align:right; }
#fb-leads-modal{ display:none; }
#fb-leads-modal.open{ display:flex; }
.fb-lead-del{margin-left:8px;background:transparent;border:1px solid rgba(220,38,38,.35);color:#dc2626;width:24px;height:24px;border-radius:50%;cursor:pointer;font-size:14px;line-height:1;padding:0;display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;transition:all .15s}
.fb-lead-del:hover{background:#dc2626;color:#fff;border-color:#dc2626}
.fb-lead-del:disabled{opacity:.5;cursor:wait}
.fb-leads-row{display:flex;align-items:center;gap:8px}


/* === REDESIGN 2026-05-16 === */
/* Modal: dark card with rounded corners + icon header */
.fb-embed-modal { background: rgba(8,12,24,0.78) !important; backdrop-filter: blur(6px); padding: 32px 16px !important; }
.fb-embed-dialog { background: #0f1729 !important; border: 1px solid #1f2a44 !important; border-radius: 16px !important; max-width: 720px !important; box-shadow: 0 30px 80px rgba(0,0,0,0.6) !important; padding: 0 !important; }
.fb-embed-header { display:flex; align-items:center; gap:14px; padding:22px 22px 4px 22px; border:0 !important; }
.fb-embed-header h3 { margin:0; font-size:20px; font-weight:700; color:#f1f5f9; letter-spacing:-0.01em; }
.fb-embed-header::before {
  content:""; display:inline-block; width:44px; height:44px; border-radius:12px;
  background:rgba(99,102,241,0.14) center/22px 22px no-repeat;
  flex:0 0 auto;
}
#fb-leads-modal .fb-embed-header::before { background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='22' height='22' viewBox='0 0 24 24' fill='none' stroke='%23a5b4fc' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><path d='M17 21v-2a4 4 0 0 0-4-4H5a4 4 0 0 0-4 4v2'/><circle cx='9' cy='7' r='4'/><path d='M23 21v-2a4 4 0 0 0-3-3.87'/><path d='M16 3.13a4 4 0 0 1 0 7.75'/></svg>"); }
#fb-toc-modal .fb-embed-header::before { background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='22' height='22' viewBox='0 0 24 24' fill='none' stroke='%23a5b4fc' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><rect x='3' y='4' width='18' height='16' rx='2'/><line x1='7' y1='9' x2='17' y2='9'/><line x1='7' y1='13' x2='17' y2='13'/><line x1='7' y1='17' x2='13' y2='17'/></svg>"); }
#fb-settings-modal .fb-embed-header::before { background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='22' height='22' viewBox='0 0 24 24' fill='none' stroke='%23a5b4fc' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><circle cx='12' cy='12' r='3'/><path d='M19.4 15a1.65 1.65 0 0 0 .33 1.82l.06.06a2 2 0 0 1-2.83 2.83l-.06-.06a1.65 1.65 0 0 0-1.82-.33 1.65 1.65 0 0 0-1 1.51V21a2 2 0 0 1-4 0v-.09A1.65 1.65 0 0 0 9 19.4a1.65 1.65 0 0 0-1.82.33l-.06.06a2 2 0 0 1-2.83-2.83l.06-.06a1.65 1.65 0 0 0 .33-1.82 1.65 1.65 0 0 0-1.51-1H3a2 2 0 0 1 0-4h.09A1.65 1.65 0 0 0 4.6 9a1.65 1.65 0 0 0-.33-1.82l-.06-.06a2 2 0 0 1 2.83-2.83l.06.06a1.65 1.65 0 0 0 1.82.33H9a1.65 1.65 0 0 0 1-1.51V3a2 2 0 0 1 4 0v.09a1.65 1.65 0 0 0 1 1.51 1.65 1.65 0 0 0 1.82-.33l.06-.06a2 2 0 0 1 2.83 2.83l-.06.06a1.65 1.65 0 0 0-.33 1.82V9c0 .35.07.69.21 1H21a2 2 0 0 1 0 4h-.09a1.65 1.65 0 0 0-1.51 1z'/></svg>"); }
#fb-embed-modal .fb-embed-header::before { background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='22' height='22' viewBox='0 0 24 24' fill='none' stroke='%23a5b4fc' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><polyline points='16 18 22 12 16 6'/><polyline points='8 6 2 12 8 18'/></svg>"); }
.fb-embed-header button.ghost, .fb-embed-header #fb-leads-close, .fb-embed-header #fb-toc-close, .fb-embed-header #fb-settings-close, .fb-embed-header #fb-embed-close { margin-left:auto; background:transparent !important; border:1px solid #2a3a5e !important; color:#cbd5e1 !important; width:36px; height:36px; padding:0 !important; font-size:18px; border-radius:10px; display:inline-flex; align-items:center; justify-content:center; }
.fb-embed-header button.ghost:hover { background:#1a2440 !important; }
.fb-embed-body { padding: 18px 22px 22px 22px !important; gap: 14px; }
.fb-embed-body > p { color:#94a3b8 !important; font-size:14px !important; margin:0 0 6px 0 !important; }
.fb-embed-row span:first-child { color:#cbd5e1; }
.fb-embed-row input[type=text], .fb-embed-row input[type=url], .fb-embed-row input[type=number], .fb-embed-row textarea, .fb-embed-row select { background:#0b1224 !important; border:1px solid #1f2a44 !important; border-radius:10px !important; color:#e2e8f0 !important; padding:10px 12px !important; }
.fb-embed-row input:focus, .fb-embed-row select:focus, .fb-embed-row textarea:focus { outline:none; border-color:#6366f1 !important; box-shadow:0 0 0 3px rgba(99,102,241,0.18); }

/* Primary/Save button indigo accent */
.fb-embed-dialog button.primary, .fb-embed-dialog .primary, .fb-embed-dialog button#fb-toc-save, .fb-embed-dialog button#fb-settings-save, .fb-embed-dialog button#fb-embed-copy { background:#6366f1 !important; color:#fff !important; border:0 !important; padding:10px 18px !important; border-radius:10px !important; font-weight:600 !important; }
.fb-embed-dialog button.primary:hover { background:#4f46e5 !important; }

/* Empty-state for ToC + Leads */
.fb-toc-list:empty::before, .fb-leads-list:empty::before {
  content:""; display:block; width:80px; height:80px; margin:24px auto 12px;
  border-radius:50%; background:rgba(99,102,241,0.10) center/40px 40px no-repeat;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='40' height='40' viewBox='0 0 24 24' fill='none' stroke='%23818cf8' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'><path d='M21 8v13H3V8'/><path d='M1 3h22v5H1z'/><path d='M10 12h4'/></svg>");
}
.fb-toc-list:empty::after, .fb-leads-list:empty::after {
  content:"No entries yet"; display:block; text-align:center; color:#e2e8f0; font-size:16px; font-weight:600; margin:4px 0 6px;
}
.fb-leads-list:empty::after { content:"No leads yet"; }
.fb-toc-list:empty, .fb-leads-list:empty { padding:18px 12px 28px !important; border:1.5px dashed #243057 !important; border-radius:14px !important; background:transparent !important; }

/* Leads list rows: pill with avatar */
.fb-leads-list { background:transparent !important; border:0 !important; max-height:420px !important; }
.fb-leads-list .lead-row { display:flex; align-items:center; gap:12px; padding:12px 14px; border-radius:12px; background:#0b1224; border:1px solid #1f2a44; margin-bottom:8px; }
.fb-leads-list .lead-avatar { width:38px; height:38px; border-radius:50%; background:#6366f1; color:#fff; font-weight:700; font-size:13px; display:inline-flex; align-items:center; justify-content:center; }
.fb-leads-list .lead-email { color:#e2e8f0; font-weight:600; }
.fb-leads-list .lead-name { background:rgba(99,102,241,0.14); color:#a5b4fc; padding:3px 10px; border-radius:999px; font-size:12px; }
.fb-leads-list .lead-meta { color:#94a3b8; font-size:13px; margin-left:auto; }

/* Embed code block: monospace, syntax-highlighted feel */
#fb-embed-code { background:#0b1224 !important; color:#a5f3fc !important; border:1px solid #1f2a44 !important; border-radius:12px !important; padding:14px !important; font-family:ui-monospace,SFMono-Regular,Menlo,monospace !important; font-size:12.5px !important; line-height:1.5; }

/* === VIEWER: sidebar + bottom toolbar === */
.fb-viewer-body { background:#0a0f1f; }
.fb-toolbar { background:transparent !important; border:0 !important; padding:10px 16px !important; }
.fb-toolbar #fb-prev, .fb-toolbar #fb-next, .fb-toolbar #fb-fullscreen, .fb-toolbar #fb-download { background:#1e293b !important; border:1px solid #334155 !important; color:#e2e8f0 !important; border-radius:8px !important; }
.fb-toolbar #fb-next { background:#6366f1 !important; border-color:#6366f1 !important; }
.fb-toolbar #fb-next:hover { background:#4f46e5 !important; }
/* Hide old zoom buttons created by previous patch - keep the new floatbar */
.fb-toolbar .fb-zoom-btn, .fb-toolbar #fb-zoom-out, .fb-toolbar #fb-zoom-in, .fb-toolbar #fb-zoom-reset, .fb-toolbar #fb-zoom-lab { display:none !important; }

.fb-main-row { display:flex; flex:1 1 auto; min-height:0; }
.fb-side { width:160px; flex:0 0 160px; background:#0b1224; border-right:1px solid #1f2a44; display:flex; flex-direction:column; overflow:hidden; transition:width .25s ease, flex-basis .25s ease; }
.fb-side.collapsed { width:0; flex-basis:0; border-right:0; }
.fb-side-head { display:flex; align-items:center; gap:8px; padding:12px 14px; color:#e2e8f0; font-size:14px; font-weight:600; border-bottom:1px solid #1f2a44; }
.fb-side-collapse { margin-left:auto; background:transparent; border:0; color:#94a3b8; cursor:pointer; font-size:16px; }
.fb-side-list { flex:1 1 auto; overflow-y:auto; padding:10px; display:flex; flex-direction:column; gap:10px; }
.fb-side-thumb { position:relative; background:#0a0f1f; border:1px solid #1f2a44; border-radius:8px; overflow:hidden; cursor:pointer; aspect-ratio: 3/4; }
.fb-side-thumb img { width:100%; height:100%; object-fit:contain; display:block; }
.fb-side-thumb .num { position:absolute; left:-22px; top:50%; transform:translateY(-50%); color:#94a3b8; font-size:12px; font-weight:600; }
.fb-side-thumb.active { border-color:#6366f1; box-shadow:0 0 0 2px rgba(99,102,241,0.35); }
.fb-side-thumb-wrap { position:relative; padding-left:22px; }

.fb-book-wrap { position:relative; }
.fb-floatbar { position:absolute; left:50%; bottom:18px; transform:translateX(-50%); display:inline-flex; align-items:center; gap:6px; background:rgba(11,18,36,0.85); border:1px solid #1f2a44; border-radius:14px; padding:6px 8px; backdrop-filter:blur(8px); z-index:5; }
.fb-fb-btn { background:transparent; border:0; color:#e2e8f0; padding:8px 12px; border-radius:10px; font-size:13px; cursor:pointer; display:inline-flex; align-items:center; justify-content:center; min-width:36px; height:34px; }
.fb-fb-btn:hover { background:#1e293b; }
.fb-fb-lab { color:#e2e8f0; font-size:13px; min-width:48px; text-align:center; }
.fb-fb-btn svg { display:block; }

@media (max-width: 720px) {
  .fb-side { display:none; }
  .fb-floatbar { bottom:10px; }
}

/* Lead row styling on existing markup */
.fb-leads-list .fb-leads-row { display:flex !important; align-items:center; gap:12px; padding:12px 14px; border-radius:12px; background:#0b1224; border:1px solid #1f2a44; margin-bottom:8px; }
.fb-leads-list .fb-leads-cell-email { color:#e2e8f0; font-weight:600; display:flex; align-items:center; gap:10px; }
.fb-leads-list .fb-leads-cell-email::before { content: attr(data-initials); width:38px; height:38px; border-radius:50%; background:#6366f1; color:#fff; font-weight:700; font-size:13px; display:inline-flex; align-items:center; justify-content:center; }
.fb-leads-list .fb-leads-cell-name { background:rgba(99,102,241,0.14); color:#a5b4fc; padding:3px 10px; border-radius:999px; font-size:12px; }
.fb-leads-list .fb-leads-cell-meta { color:#94a3b8; font-size:13px; margin-left:auto; }
.fb-leads-list .fb-lead-del { background:transparent !important; border:1px solid #2a3a5e !important; color:#94a3b8 !important; border-radius:8px !important; width:32px; height:32px; padding:0 !important; }
.fb-leads-list .fb-lead-del:hover { background:#1a2440 !important; color:#fda4af !important; }
/* Hide "No leads captured yet" paragraph to let the empty-state CSS show through */
.fb-leads-list > p[style*="No leads"], .fb-leads-list > p[style*="Failed to load"] { display:none; }

/* ToC entry rows */
.fb-toc-list > .fb-toc-row { display:flex; gap:8px; align-items:center; padding:10px; border-radius:10px; background:#0b1224; border:1px solid #1f2a44; margin-bottom:6px; }
.fb-toc-list > .fb-toc-row input[type=text], .fb-toc-list > .fb-toc-row input[type=number] { background:#0a0f1f !important; }

/* Settings modal: bigger and two-column friendly */
#fb-settings-modal .fb-embed-dialog { max-width: 760px !important; }
#fb-settings-modal .fb-embed-body { gap:12px; }

/* Embed modal width */
#fb-embed-modal .fb-embed-dialog { max-width: 780px !important; }




/* === REDESIGN_SETTINGS_V3 === */
#fb-settings-modal .fb-embed-header::before { display:none !important; }
#fb-settings-modal .fb-embed-header { padding: 22px 22px 16px 22px !important; border-bottom: 1px solid #1f2a44 !important; }
#fb-settings-modal .fb-embed-dialog { max-width: 820px !important; padding:0 !important; display:flex; flex-direction:column; max-height: calc(100vh - 64px); }
#fb-settings-modal .fb-embed-body { padding: 18px 22px 22px 22px !important; gap: 14px !important; overflow-y:auto; display:flex; flex-direction:column; }
#fb-settings-modal .fb-set-top { display:flex; gap:24px; padding: 4px 0 14px 0; align-items:center; flex-wrap:wrap; }
#fb-settings-modal .fb-set-top .fb-set-row { flex:1 1 280px; display:flex !important; align-items:center; gap:12px; margin:0 !important; padding:0 !important; background:transparent !important; border:0 !important; }
#fb-settings-modal .fb-set-top .fb-set-row span:first-child { color:#cbd5e1 !important; min-width:120px; font-size:14px; font-weight:600; }
#fb-settings-modal .fb-set-top .fb-set-row select { background:#0b1224 !important; border:1px solid #1f2a44 !important; color:#e2e8f0 !important; border-radius:10px !important; padding:9px 12px !important; flex:1 1 auto; }
#fb-settings-modal .fb-set-top .fb-set-row input[type=checkbox] { accent-color:#6366f1; width:18px; height:18px; margin-left:auto; }
#fb-settings-modal .fb-set-card { background:#0b1224; border:1px solid #1f2a44; border-radius:14px; overflow:hidden; margin:0; }
#fb-settings-modal .fb-set-card-title { padding:14px 18px 6px 18px; font-size:16px; font-weight:700; color:#f1f5f9; letter-spacing:-0.01em; }
#fb-settings-modal .fb-set-card .fb-set-row { display:flex !important; align-items:center; gap:12px; padding:12px 18px !important; margin:0 !important; background:transparent !important; border-top:1px solid #1a2440 !important; }
#fb-settings-modal .fb-set-card .fb-set-row:first-of-type { border-top:1px solid #1f2a44 !important; }
#fb-settings-modal .fb-set-card .fb-set-row span:first-child { color:#94a3b8 !important; font-size:14px; min-width:170px; }
#fb-settings-modal .fb-set-card .fb-set-row input[type=text], #fb-settings-modal .fb-set-card .fb-set-row input[type=url], #fb-settings-modal .fb-set-card .fb-set-row input[type=number] { background:#0a0f1f !important; border:1px solid #1f2a44 !important; color:#e2e8f0 !important; border-radius:10px !important; padding:9px 12px !important; flex:1 1 auto; max-width:none; }
#fb-settings-modal .fb-set-card .fb-set-row input[type=checkbox] { accent-color:#6366f1; width:18px; height:18px; margin-left:auto; }
#fb-settings-modal .fb-set-card .fb-set-row select { background:#0a0f1f !important; border:1px solid #1f2a44 !important; color:#e2e8f0 !important; border-radius:10px !important; padding:9px 12px !important; }
#fb-settings-modal .fb-set-footer { display:flex !important; align-items:center; gap:10px; padding: 16px 22px !important; border-top:1px solid #1f2a44 !important; background:transparent; }
#fb-settings-modal #fb-set-status { color:#94a3b8; font-size:13px; }
#fb-settings-modal #fb-settings-cancel { margin-left:auto !important; background:transparent !important; border:1px solid #2a3a5e !important; color:#cbd5e1 !important; padding:10px 18px !important; border-radius:10px !important; font-weight:600 !important; }
#fb-settings-modal #fb-settings-cancel:hover { background:#1a2440 !important; }
#fb-settings-modal #fb-settings-save { background:#6366f1 !important; color:#fff !important; border:0 !important; padding:10px 22px !important; border-radius:10px !important; font-weight:600 !important; }
#fb-settings-modal #fb-settings-save:hover { background:#4f46e5 !important; }
.fb-x-btn { background:transparent !important; border:1px solid #2a3a5e !important; color:#cbd5e1 !important; width:36px !important; height:36px !important; padding:0 !important; font-size:14px !important; line-height:1 !important; border-radius:10px !important; cursor:pointer; display:inline-flex !important; align-items:center !important; justify-content:center !important; margin-left:auto !important; }
.fb-x-btn:hover { background:#1a2440 !important; color:#fff !important; }
/* === END REDESIGN_SETTINGS_V3 === */

/* Fix: prevent cards from being flex-shrunk inside the flex body */
#fb-settings-modal .fb-set-card { flex: 0 0 auto !important; overflow: visible !important; }
#fb-settings-modal .fb-set-top { flex: 0 0 auto !important; }

/* __HQ_IMG_RENDERING__ */
.fb-stage img, #fb-content img, .fb-side-thumb img { image-rendering: -webkit-optimize-contrast; image-rendering: crisp-edges; }
@supports (image-rendering: high-quality) { .fb-stage img, #fb-content img { image-rendering: high-quality; } }

/* __VEC_CSS__ */
.stf__parent img, .stf__parent canvas { image-rendering: auto !important; }

/* === PATCH_V33_MOBILE_FIX ============================================ */
/* Fix: on mobile, the toolbar wraps to 2 rows and book-wrap padding eats   */
/* viewport. Tighten everything below 600px and keep page on one row.      */
@media (max-width: 600px) {
  .fb-toolbar {
    padding: 6px 8px !important;
    gap: 4px !important;
    flex-wrap: nowrap !important;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
  }
  .fb-toolbar::-webkit-scrollbar { display: none; }
  .fb-toolbar button,
  .fb-toolbar a.btn {
    padding: 5px 8px !important;
    font-size: 12px !important;
    border-radius: 6px !important;
    flex: 0 0 auto;
    min-height: 32px;
    line-height: 1;
    white-space: nowrap;
  }
  .fb-toolbar .fb-title { display: none; }
  .fb-toolbar #fb-counter,
  .fb-toolbar .fb-page-counter {
    font-size: 11.5px !important;
    padding: 4px 6px !important;
    min-width: 44px !important;
  }
  .fb-book-wrap { padding: 4px !important; }
  .fb-stage { padding: 0 !important; }
  /* Float zoom-bar: shrink to half size and move it slightly inward */
  .fb-floatbar {
    bottom: 8px !important;
    padding: 4px 6px !important;
    gap: 2px !important;
    border-radius: 10px !important;
  }
  .fb-floatbar .fb-fb-btn {
    padding: 4px 8px !important;
    min-width: 28px !important;
    height: 28px !important;
    font-size: 12px !important;
  }
  .fb-floatbar .fb-fb-lab { font-size: 11px !important; min-width: 36px !important; }
  /* Hide the watermark on mobile so it doesn't cover the page */
  .fb-watermark { font-size: 10px !important; padding: 2px 6px !important; }
}
/* extra-narrow: phones below 380px (small Androids) */
@media (max-width: 380px) {
  .fb-toolbar button,
  .fb-toolbar a.btn { padding: 4px 6px !important; font-size: 11.5px !important; }
  .fb-toolbar .fb-page-counter { min-width: 36px !important; }
}
/* === /PATCH_V33_MOBILE_FIX =========================================== */

/* === PATCH_V34_MOBILE_WATERMARK_GUARD ============================= */
/* The fb-watermark is a real <a target="_blank"> link sitting at the   */
/* bottom-right corner. On mobile this overlaps the float zoom bar,    */
/* so accidental taps open shortnshare.com in a new tab and the user feels */
/* the flipbook has "closed". Block pointer events on mobile, keep     */
/* the visual badge but make taps fall through to the page underneath. */
@media (max-width: 600px) {
  .fb-watermark {
    pointer-events: none !important;
    bottom: 4px !important;
    right: 4px !important;
    left: auto !important;
    font-size: 9.5px !important;
    padding: 1px 4px !important;
    opacity: 0.6;
  }
}
/* === /PATCH_V34_MOBILE_WATERMARK_GUARD ============================ */

/* === MOBILE VERTICAL VIEWER (Option 3) ============================ */
body.fb-mobile-vertical { overflow-y: auto !important; overflow-x: hidden !important; }
body.fb-mobile-vertical .fb-stage { display: block !important; padding: 8px 0 !important; height: auto !important; min-height: 100vh !important; overflow: visible !important; background: #0f1115; }
body.fb-mobile-vertical #fb-side, body.fb-mobile-vertical #fb-floatbar { display: none !important; }
body.fb-mobile-vertical .fb-main-row { display: block !important; }
body.fb-mobile-vertical .fb-book-wrap { display: block !important; width: 100% !important; height: auto !important; max-width: 100vw !important; padding: 0 !important; margin: 0 !important; transform: none !important; }
body.fb-mobile-vertical #fb-content.fb-mobile-list { display: block !important; width: 100% !important; height: auto !important; min-width: 0 !important; min-height: 0 !important; padding: 0 8px 24px 8px !important; box-sizing: border-box !important; transform: none !important; background: transparent !important; overflow: visible !important; }
body.fb-mobile-vertical .fb-m-page { width: 100%; max-width: 100vw; margin: 0 0 12px 0; background: #fff; border-radius: 6px; box-shadow: 0 2px 8px rgba(0,0,0,0.4); overflow: hidden; position: relative; }
body.fb-mobile-vertical .fb-m-page img { display: block; width: 100% !important; height: auto !important; max-width: 100% !important; }
body.fb-mobile-vertical .fb-m-num { position: absolute; bottom: 6px; right: 8px; padding: 2px 8px; background: rgba(0,0,0,0.55); color: #fff; font-size: 11px; border-radius: 10px; pointer-events: none; }

/* === MOBILE SINGLE-PAGE VIEWER (Option 3b) ============================ */
body.fb-mobile-single { overflow-y: auto !important; overflow-x: hidden !important; }
body.fb-mobile-single .fb-stage { display: block !important; padding: 8px 0 !important; height: auto !important; min-height: 100vh !important; overflow: visible !important; background: #0f1115; }
body.fb-mobile-single #fb-side, body.fb-mobile-single #fb-floatbar { display: none !important; }
body.fb-mobile-single .fb-main-row { display: block !important; }
body.fb-mobile-single .fb-book-wrap { display: block !important; width: 100% !important; height: auto !important; max-width: 100vw !important; padding: 0 !important; margin: 0 !important; transform: none !important; }
body.fb-mobile-single #fb-content.fb-mobile-single-wrap { display: block !important; width: 100% !important; height: auto !important; min-width: 0 !important; min-height: 0 !important; padding: 6px 8px 16px 8px !important; box-sizing: border-box !important; transform: none !important; background: transparent !important; overflow: visible !important; position: relative; }
body.fb-mobile-single .fb-m-single-img { display: block; width: 100% !important; height: auto !important; max-width: 100% !important; background: #fff; border-radius: 6px; box-shadow: 0 2px 8px rgba(0,0,0,0.4); margin: 0 auto; touch-action: pan-y; }

/* === MOBILE SINGLE-PAGE ZOOM (Option 3c) ============================ */
body.fb-mobile-single .fb-m-stage { display: block; position: relative; width: 100%; transform-origin: center center; will-change: transform; touch-action: none; user-select: none; -webkit-user-select: none; -webkit-user-drag: none; }
body.fb-mobile-single .fb-m-stage .fb-m-single-img { pointer-events: none; }
.fb-m-zoombar { position: fixed; left: 50%; bottom: 14px; transform: translateX(-50%); z-index: 9999; display: flex; align-items: center; gap: 6px; padding: 6px 10px; background: rgba(20,22,28,0.85); color: #fff; border-radius: 999px; box-shadow: 0 4px 14px rgba(0,0,0,0.5); backdrop-filter: blur(6px); -webkit-backdrop-filter: blur(6px); font-family: inherit; }
.fb-m-zoombar .fb-m-zb { appearance: none; -webkit-appearance: none; border: 0; background: rgba(255,255,255,0.12); color: #fff; width: 34px; height: 34px; border-radius: 50%; font-size: 18px; line-height: 1; display: inline-flex; align-items: center; justify-content: center; cursor: pointer; padding: 0; }
.fb-m-zoombar .fb-m-zb.fb-m-zb-fit { width: auto; padding: 0 12px; border-radius: 17px; font-size: 13px; }
.fb-m-zoombar .fb-m-zb:active { background: rgba(255,255,255,0.22); }
.fb-m-zoombar .fb-m-zlab { min-width: 44px; text-align: center; font-size: 12px; opacity: 0.9; }

/* === MOBILE HI-RES CANVAS (v45) ============================ */
body.fb-mobile-single .fb-m-single-canvas { display: block; width: 100% !important; height: auto !important; max-width: 100% !important; background: #fff; border-radius: 6px; box-shadow: 0 2px 8px rgba(0,0,0,0.4); margin: 0 auto; }
body.fb-mobile-single .fb-m-single-img, body.fb-mobile-single .fb-m-single-canvas { image-rendering: -webkit-optimize-contrast; image-rendering: crisp-edges; }