/* Simple clean UI + flipbook preview */
.sfs-container{ border:1px solid #e5e7eb; border-radius:16px; padding:16px; background:#fff; box-shadow:0 2px 8px rgba(0,0,0,.04); font-family:system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, sans-serif; }
.sfs-grid{ display:grid; grid-template-columns:1fr 1fr; gap:12px; }
.sfs-grid label{ display:flex; flex-direction:column; gap:6px; font-size:14px; }
.sfs-grid input[type="text"]{ padding:8px; border:1px solid #d1d5db; border-radius:8px; }
.sfs-btn{ background:#111827; color:#fff; border:none; padding:10px 14px; border-radius:10px; cursor:pointer; }
.sfs-results{ margin-top:16px; }
.sfs-pageview{ border:1px solid #f1f5f9; border-radius:12px; padding:12px; margin-bottom:8px; background:#fafafa; }
.sfs-output{ margin-top:16px; }

/* Flipbook */
.sfs-flipbook{ margin-top:12px; border:1px solid #e5e7eb; border-radius:12px; padding:12px; background:#fff; }
.sfs-book{ --page:1; display:grid; grid-template-columns:1fr; }
.sfs-page{ display:none; }
.sfs-book .p1{ display:block; }
.sfs-book[style*="--page: 2"] .p1{ display:none; } .sfs-book[style*="--page: 2"] .p2{ display:block; }
.sfs-book[style*="--page: 3"] .p1,.sfs-book[style*="--page: 3"] .p2{ display:none; } .sfs-book[style*="--page: 3"] .p3{ display:block; }
.sfs-book[style*="--page: 4"] .p1,.sfs-book[style*="--page: 4"] .p2,.sfs-book[style*="--page: 4"] .p3{ display:none; } .sfs-book[style*="--page: 4"] .p4{ display:block; }
.sfs-page-inner{ min-height:200px; border:1px dashed #e5e7eb; border-radius:10px; padding:12px; background:#fafafa; }
.sfs-controls{ display:flex; align-items:center; justify-content:center; gap:8px; margin-top:8px; }
.sfs-prev,.sfs-next{ background:#111827; color:#fff; border:none; padding:6px 10px; border-radius:8px; cursor:pointer; }

/* Illustrations grid */
.sfs-arts{ margin-top:16px; padding-top:12px; border-top:1px solid #e5e7eb; }
.sfs-refbox{ margin:8px 0; font-size:14px; }
.sfs-artgrid{ display:grid; grid-template-columns:repeat(2,1fr); gap:12px; margin-top:8px; }
.sfs-artcard{ border:1px solid #f1f5f9; border-radius:12px; padding:10px; background:#fafafa; }
.sfs-arthead{ font-weight:600; margin-bottom:6px; }
.sfs-artimg{ width:100%; height:auto; border-radius:8px; border:1px solid #e5e7eb; background:#fff; }
.sfs-artprompt{ font-size:12px; margin-top:6px; color:#334155; }