:root {
  --sf-ink: #1b2838;
  --sf-muted: #4b5b6d;
  --sf-line: #d5dde6;
  --sf-bg: #f3f5f8;
  --sf-card: #ffffff;
  --sf-accent: #b82040;
  --sf-accent-ink: #ffffff;
  --sf-blue: #2f5aa8;
  --sf-focus: #1d4ed8;
  --sf-ok: #1e6b3a;
  --sf-err: #a11c2c;
  --sf-radius: 10px;
}
* { box-sizing: border-box; }
[hidden] { display: none !important; }
html, body { margin: 0; height: 100%; }
body {
  font: 16px/1.5 system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  color: var(--sf-ink);
  background: var(--sf-bg);
  display: flex;
  flex-direction: column;
  min-height: 100vh;
}
button, input, select, textarea { font: inherit; color: inherit; }
.sf-field label, .sf-form label { min-width: 0; }
.sf-field input, .sf-field select, .sf-field textarea, .sf-form input { min-width: 0; max-width: 100%; }
.sf-field input[type="file"] { width: 100%; }
:focus-visible { outline: 3px solid var(--sf-focus); outline-offset: 2px; }
.sf-skip { position: absolute; left: -999px; top: 8px; background: #fff; padding: .5rem 1rem; z-index: 100; }
.sf-skip:focus { left: 8px; }
code { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: .92em; background: #e8edf4; padding: 0 .3em; border-radius: 4px; }

/* Barra superiore */
.sf-top {
  display: flex; align-items: center; gap: 1rem; flex-wrap: wrap;
  padding: .6rem 1rem; background: #fff; border-bottom: 1px solid var(--sf-line);
  position: sticky; top: 0; z-index: 20;
}
.sf-brand { display: flex; align-items: center; gap: .6rem; text-decoration: none; color: inherit; }
.sf-brand small { display: block; font-size: .72rem; text-transform: uppercase; letter-spacing: .06em; color: var(--sf-muted); }
.sf-brand h1 { margin: 0; display: block; font-size: 1.05rem; line-height: 1.1; }
.sf-brand-mark { display: inline-grid; place-items: center; width: 40px; height: 40px; border-radius: 10px; background: var(--sf-accent); color: #fff; font-weight: 700; }
.sf-top-actions { display: flex; align-items: center; gap: .5rem; flex-wrap: wrap; margin-left: auto; }
.sf-status { font-size: .85rem; color: var(--sf-muted); margin-right: .4rem; }

.sf-btn {
  min-height: 48px; padding: .45rem .95rem; border-radius: 8px; border: 1px solid var(--sf-line);
  background: #fff; cursor: pointer; font-weight: 600; font-size: .93rem;
}
.sf-btn:hover:not(:disabled) { border-color: var(--sf-ink); }
.sf-btn:disabled { opacity: .5; cursor: not-allowed; }
.sf-btn-primary { background: var(--sf-accent); color: var(--sf-accent-ink); border-color: var(--sf-accent); }
.sf-btn-primary:hover:not(:disabled) { background: #961a34; border-color: #961a34; }
.sf-btn-ghost { background: transparent; }
.sf-btn-small { min-height: 48px; padding: .3rem .7rem; font-size: .85rem; }
.sf-btn-danger { color: var(--sf-err); border-color: #e3b9bf; }

main { flex: 1; display: flex; flex-direction: column; }

/* Pagina iniziale */
.sf-welcome { max-width: 1120px; width: 100%; margin: 0 auto; padding: 1.5rem 1rem 3rem; }
.sf-welcome-grid { display: grid; grid-template-columns: minmax(260px, 1fr) 1.3fr; gap: 1.5rem; align-items: start; }
.sf-drop {
  border: 2px dashed #9fb0c3; border-radius: 16px; background: #fff; min-height: 240px;
  display: flex; flex-direction: column; justify-content: center; align-items: center; text-align: center;
  padding: 1.5rem; gap: .5rem; cursor: pointer;
}
.sf-drop strong { font-size: 1.25rem; }
.sf-drop span { color: var(--sf-muted); font-size: .92rem; }
.sf-drop.sf-drop-over { border-color: var(--sf-accent); background: #fff6f8; }
.sf-eyebrow { text-transform: uppercase; letter-spacing: .08em; font-size: .78rem; color: var(--sf-muted); margin: 0 0 .4rem; }
.sf-steps { margin: 0; padding-left: 1.3rem; display: grid; gap: .6rem; }
.sf-steps strong { display: block; }
.sf-small { font-size: .88rem; color: var(--sf-muted); }
.sf-published { margin-top: 2rem; }
.sf-row-between { display: flex; align-items: center; justify-content: space-between; gap: 1rem; flex-wrap: wrap; }
.sf-published h2 { font-size: 1.15rem; margin: .5rem 0; }
.sf-published-list { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 1rem; }
.sf-book {
  display: grid; grid-template-columns: 84px minmax(0, 1fr); gap: .8rem; background: #fff; border: 1px solid var(--sf-line);
  border-radius: var(--sf-radius); padding: .8rem;
}
.sf-book img { width: 84px; height: 112px; object-fit: cover; border-radius: 6px; background: #e8edf4; }
.sf-book h3 { overflow-wrap: anywhere; margin: 0 0 .2rem; font-size: 1rem; }
.sf-book p { margin: 0 0 .5rem; font-size: .85rem; color: var(--sf-muted); }
.sf-book-actions { display: flex; gap: .4rem; flex-wrap: wrap; }
.sf-book-actions a { font-size: .88rem; }

/* Area di lavoro */
.sf-work {
  flex: 1; display: grid; grid-template-columns: 170px minmax(0, 1fr) 340px; gap: 0;
  min-height: calc(100vh - 66px);
}
.sf-pages { border-right: 1px solid var(--sf-line); background: #fff; padding: .8rem .6rem; overflow: auto; }
.sf-pages h2, .sf-stage h2 { font-size: .95rem; margin: 0 0 .6rem; }
.sf-pages-list { list-style: none; margin: 0; padding: 0; display: grid; gap: .5rem; }
.sf-pages-list button {
  width: 100%; border: 2px solid transparent; background: #f3f5f8; border-radius: 8px; padding: .35rem; cursor: pointer;
  display: grid; gap: .2rem; justify-items: center;
}
.sf-pages-list button[aria-current="true"] { border-color: var(--sf-accent); background: #fff; }
.sf-pages-list img { width: 100%; max-height: 120px; object-fit: contain; display: block; border-radius: 4px; background: #fff; }
.sf-pages-list span { font-size: .78rem; color: var(--sf-muted); }
.sf-pages-list .sf-page-badge { font-size: .7rem; color: var(--sf-blue); }

.sf-stage { display: flex; flex-direction: column; padding: .8rem 1rem; min-width: 0; }
.sf-stage-head { display: flex; align-items: center; gap: 1rem; flex-wrap: wrap; margin-bottom: .6rem; }
.sf-tools { display: flex; gap: .35rem; flex-wrap: wrap; }
.sf-tool { display: inline-flex; align-items: center; justify-content: center; gap: .35rem; min-height: 56px; min-width: 56px; padding: .3rem .7rem; border-radius: 999px; border: 1px solid var(--sf-line); background: #fff; cursor: pointer; font-size: .85rem; font-weight: 600; }
.sf-tool > svg { width: 20px; height: 20px; flex: 0 0 20px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.sf-tool:hover { border-color: var(--sf-ink); }
.sf-tool[aria-pressed="true"] { background: var(--sf-ink); color: #fff; border-color: var(--sf-ink); }
.sf-canvas-wrap { flex: 1; display: flex; align-items: center; justify-content: center; min-height: 360px; background: #e4e9f0; border-radius: var(--sf-radius); padding: 1rem; overflow: auto; }
.sf-canvas-reader { padding: 0; background: transparent !important; width: 100%; display: flex; justify-content: center; }
.sf-paper { position: relative; box-shadow: 0 6px 24px #0b142130; }
.sf-sheet { position: absolute; inset: 0; }
.sf-canvas-help { margin: .5rem 0 0; }
.sf-draw-layer { touch-action: none; position: absolute; inset: 0; width: 100%; height: 100%; pointer-events: none; z-index: 3; }
.sf-canvas-reader.sf-drawing .sf-draw-layer { pointer-events: auto; cursor: crosshair; }
.sf-canvas-reader.sf-drawing .fb-overlays { pointer-events: none; }
.sf-draw-layer polyline { fill: none; stroke-linecap: round; stroke-linejoin: round; }

/* Oggetti in modifica */
.sf-overlays-edit .fb-object { cursor: move; }
.sf-overlays-edit .fb-object.sf-selected { outline: 2px solid var(--sf-focus); outline-offset: 2px; }
.sf-overlays-edit .fb-object.sf-selected::after {
  content: ""; position: absolute; right: -7px; bottom: -7px; width: 14px; height: 14px;
  background: #fff; border: 2px solid var(--sf-focus); border-radius: 3px; cursor: nwse-resize;
}
.sf-overlays-edit .fb-object .fb-object-content, .sf-overlays-edit .fb-object [data-animation] { animation: none !important; opacity: 1 !important; transform: none !important; }

/* Pannello proprietà */
.sf-panel { min-width: 0; border-left: 1px solid var(--sf-line); background: #fff; display: flex; flex-direction: column; min-height: 0; }
.sf-tabs { display: flex; border-bottom: 1px solid var(--sf-line); }
.sf-tabs [role="tab"] { flex: 1; min-height: 48px; border: 0; background: transparent; border-bottom: 3px solid transparent; cursor: pointer; font-weight: 600; }
.sf-tabs [role="tab"][aria-selected="true"] { border-bottom-color: var(--sf-accent); color: var(--sf-accent); }
.sf-pane { min-width: 0; padding: .9rem; overflow: auto; flex: 1; }
.sf-pane[hidden] { display: none; }
.sf-field { min-width: 0; display: grid; gap: .25rem; margin-bottom: .75rem; }
.sf-field > span, .sf-field > label > span { font-size: .85rem; font-weight: 600; }
.sf-field input[type="text"], .sf-field input[type="url"], .sf-field input[type="email"], .sf-field input[type="tel"], .sf-field input[type="number"], .sf-field select, .sf-field textarea, .sf-form input[type="text"], .sf-form input[type="password"] {
  width: 100%; min-height: 40px; padding: .4rem .55rem; border: 1px solid #aeb9c6; border-radius: 6px; background: #fff;
}
.sf-field textarea { min-height: 110px; resize: vertical; }
.sf-field input[type="color"] { width: 54px; height: 36px; padding: 0; border: 1px solid #aeb9c6; border-radius: 6px; background: #fff; }
.sf-field input[type="range"] { width: 100%; }
.sf-field-row { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .6rem; }
.sf-field-row-4 { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: .4rem; }
.sf-check { display: flex; align-items: center; gap: .5rem; margin-bottom: .5rem; font-size: .92rem; }
.sf-check input { width: 20px; height: 20px; }
.sf-pane h3 { font-size: .95rem; margin: 1rem 0 .5rem; padding-top: .8rem; border-top: 1px solid var(--sf-line); }
.sf-pane h3:first-child { border-top: 0; padding-top: 0; margin-top: 0; }
.sf-hint { overflow-wrap: anywhere; font-size: .8rem; color: var(--sf-muted); margin: -.3rem 0 .6rem; }
.sf-obj-list { list-style: none; margin: 0 0 .8rem; padding: 0; display: grid; gap: .3rem; }
.sf-obj-list button { width: 100%; text-align: left; border: 1px solid var(--sf-line); background: #fff; border-radius: 6px; padding: .4rem .6rem; cursor: pointer; font-size: .88rem; }
.sf-obj-list button[aria-current="true"] { border-color: var(--sf-focus); background: #eef3ff; }
.sf-inline-actions { display: flex; gap: .4rem; flex-wrap: wrap; margin-top: .6rem; }
.sf-asset-info { font-size: .82rem; color: var(--sf-muted); word-break: break-all; }

/* Dialoghi */
.sf-dialog { border: 0; border-radius: 14px; padding: 0; max-width: min(560px, 94vw); width: 100%; box-shadow: 0 20px 60px #0008; }
.sf-dialog::backdrop { background: #0b1421aa; }
.sf-dialog-full { max-width: 100vw; width: 100vw; height: 100vh; max-height: 100vh; border-radius: 0; flex-direction: column; }
.sf-dialog-full[open] { display: flex; }
.sf-dialog-bar { display: flex; justify-content: space-between; align-items: center; padding: .5rem 1rem; border-bottom: 1px solid var(--sf-line); background: #fff; }
.sf-dialog-bar h2 { font-size: 1rem; margin: 0; }
.sf-preview-root { flex: 1; overflow: auto; }
.sf-preview-root .fb-reader { min-height: 100%; }
.sf-form { padding: 1.2rem 1.3rem; display: grid; gap: .8rem; }
.sf-form h2 { margin: 0; font-size: 1.2rem; }
.sf-form label { display: grid; gap: .3rem; font-weight: 600; font-size: .9rem; }
.sf-dialog-actions { display: flex; justify-content: flex-end; gap: .5rem; margin-top: .4rem; }
.sf-errore { color: var(--sf-err); font-size: .9rem; margin: 0; min-height: 1.2em; }
.sf-progress { height: 10px; background: #e4e9f0; border-radius: 999px; overflow: hidden; }
.sf-progress > div { height: 100%; width: 0; background: var(--sf-blue); transition: width .2s; }
#pubblica-esito { background: #eef7f0; border: 1px solid #bfe0c8; border-radius: 8px; padding: .8rem; font-size: .92rem; }
#pubblica-esito a { word-break: break-all; }
#apri-lista { display: grid; gap: .4rem; max-height: 40vh; overflow: auto; }
#apri-lista button { text-align: left; border: 1px solid var(--sf-line); background: #fff; border-radius: 8px; padding: .5rem .7rem; cursor: pointer; }
#apri-lista button[aria-pressed="true"] { border-color: var(--sf-focus); background: #eef3ff; }

.sf-toast {
  position: fixed; left: 50%; bottom: 1.2rem; transform: translateX(-50%) translateY(20px);
  background: var(--sf-ink); color: #fff; padding: .6rem 1rem; border-radius: 8px; font-size: .9rem;
  opacity: 0; pointer-events: none; transition: opacity .2s, transform .2s; max-width: 90vw; z-index: 50;
}
.sf-toast.sf-show { opacity: 1; transform: translateX(-50%) translateY(0); }
.sf-toast.sf-toast-err { background: var(--sf-err); }

@media (max-width: 1100px) {
  .sf-work { grid-template-columns: 130px minmax(0, 1fr) 300px; }
}
@media (max-width: 860px) {
  .sf-work { grid-template-columns: minmax(0, 1fr); min-height: 0; }
  .sf-pages { border-right: 0; border-bottom: 1px solid var(--sf-line); }
  .sf-pages-list { grid-template-columns: repeat(auto-fill, minmax(90px, 1fr)); }
  .sf-panel { min-width: 0; border-left: 0; border-top: 1px solid var(--sf-line); }
  .sf-welcome-grid { grid-template-columns: minmax(0, 1fr); }
  .sf-top-actions { margin-left: 0; }
}
@media (max-width: 420px) {
  .sf-field-row-4 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .sf-tools, .sf-top-actions, .sf-brand, .sf-brand > span { min-width: 0; max-width: 100%; }
  .sf-brand-mark { flex-shrink: 0; }
  .sf-status { flex-basis: 100%; }
  .sf-dialog-actions { flex-wrap: wrap; }
}
@media (prefers-reduced-motion: reduce) {
  .sf-toast, .sf-progress > div { transition: none; }
}

/* Controlli di revisione e operazioni sul libro */
.sf-history-actions { display: flex; gap: .35rem; padding-right: .5rem; border-right: 1px solid var(--sf-line); }
.sf-page-order { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .5rem; align-items: end; margin: .6rem 0; }
.sf-page-order .sf-field { margin: 0; }
.sf-page-order .sf-btn { min-width: 0; padding-inline: .45rem; }
.sf-original-note { padding: .8rem; border: 1px solid var(--sf-line); border-radius: 6px; background: #f3f5f8; font-size: .88rem; }
.sf-ocr-tools { margin-top: 1rem; }
.sf-dialog-review { max-width: min(940px, 96vw); }
.sf-ocr-comparison { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; }
.sf-ocr-comparison textarea { width: 100%; min-width: 0; max-width: 100%; padding: .65rem; border: 1px solid #aeb9c6; border-radius: 6px; font: inherit; line-height: 1.5; resize: vertical; }
.sf-ocr-comparison textarea[readonly] { background: #f3f5f8; }
.sf-ocr-source { display: block; max-width: 100%; max-height: 55vh; margin: .6rem auto; object-fit: contain; }
#sf-operation-progress { width: 100%; height: 16px; accent-color: var(--sf-blue); }
.sf-pages-list { counter-reset: none; }
@media (max-width: 860px) {
  .sf-top { position: static; }
  .sf-pages-list { display: flex; overflow-x: auto; gap: .5rem; padding-bottom: .4rem; scroll-snap-type: x proximity; }
  .sf-pages-list > li { flex: 0 0 88px; min-width: 0; scroll-snap-align: start; }
  .sf-pages-list button { height: 100%; }
  .sf-pages-list img { height: 90px; }
  .sf-canvas-wrap { min-height: 340px; }
}
@media (max-width: 540px) {
  .sf-ocr-comparison { grid-template-columns: minmax(0, 1fr); }
  .sf-dialog-review .sf-form { padding: 1rem; }
  .sf-ocr-comparison textarea { min-height: 180px; }
}

/* Laboratorio scolastico: controlli essenziali, pagina sempre nel suo spazio. */
body { font-family: 'Titillium Web', system-ui, sans-serif; }
::selection { background: #f3c6d1; color: #481021; }
input, textarea { caret-color: var(--sf-accent); }
.sf-top { gap: .6rem; padding: .6rem .9rem; position: relative; }
.sf-top-actions { gap: .4rem; }
.sf-top-actions .sf-btn { padding-inline: .7rem; }
.sf-school-tools { display: inline-flex; align-items: center; gap: .4rem; flex-wrap: wrap; }
.sf-mode-label, .sf-zoom-label { display: flex; align-items: center; gap: .45rem; font-size: .88rem; font-weight: 600; }
.sf-mode-label select, .sf-zoom-label select { min-height: 48px; min-width: 0; max-width: 100%; border: 1px solid #aeb9c6; border-radius: 6px; padding: .35rem .5rem; background: #fff; }
.sf-status { max-width: 34ch; font-size: .8rem; }
.sf-intro-title { font-size: 1.3rem; margin: 0 0 1rem; }
.sf-current-draft { display: grid; grid-template-columns: 72px minmax(0,1fr) auto; gap: 1rem; align-items: center; padding: 1rem; margin: 0 0 1.5rem; border: 1px solid var(--sf-line); border-radius: 8px; background: #fff; }
.sf-current-draft h2 { margin: 0 0 .25rem; font-size: 1.3rem; overflow-wrap: anywhere; }
.sf-current-draft p { margin: .25rem 0; }
.sf-current-draft img { width: 72px; height: 96px; object-fit: contain; background: var(--sf-bg); }
.sf-more-tools { margin: 0; }
.sf-more-tools summary, .sf-advanced > summary { min-height: 48px; padding: .55rem .7rem; cursor: pointer; font-weight: 600; font-size: .93rem; }
.sf-more-tools .sf-tools { padding-block: .4rem; }
.sf-advanced { margin: 1rem 0; border: 1px solid var(--sf-line); border-radius: 6px; }
.sf-advanced > summary:hover { color: var(--sf-accent); }
.sf-advanced-content { padding: .7rem; border-top: 1px solid var(--sf-line); }
.sf-object-adjust { display: grid; grid-template-columns: repeat(4, minmax(0,1fr)); gap: .4rem; margin-bottom: .5rem; }
.sf-object-adjust .sf-btn { display: inline-grid; place-items: center; padding-inline: .4rem; }
.sf-object-size { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: .4rem; }
.sf-object-size [data-adjust="center"] { grid-column: 1 / -1; }
.sf-page-target-thumb { display: block; width: 84px; height: 112px; object-fit: contain; margin: 0 0 .8rem; border: 1px solid var(--sf-line); background: var(--sf-bg); }
.sf-canvas-wrap { display: block; min-height: 180px; flex: 1 1 0; overflow: auto; scrollbar-color: #8c9bab #e4e9f0; }
.sf-canvas-reader { width: max-content; min-width: 100%; min-height: 100%; display: flex; align-items: center; justify-content: center; }
.sf-paper { flex: none; }
.sf-stage { min-height: 0; }
.sf-stage-head { flex: none; gap: .6rem; align-items: start; }
.sf-stage-head > h2 { flex: 0 0 100%; margin: 0; }
.sf-stage-head > .sf-tools { flex: 1 1 100%; }
.sf-zoom-label { margin-left: auto; }
.sf-canvas-help { font-size: .78rem; line-height: 1.4; max-width: 75ch; }
.sf-pages, .sf-panel { scrollbar-color: #8c9bab #fff; }
@media (min-width: 861px) {
  .sf-work { height: var(--sf-editor-space, 610px); min-height: 390px; flex: none; }
  .sf-pages { min-height: 0; }
  .sf-panel { overflow: auto; }
  .sf-pane { overflow: auto; }
}
@media (max-width: 860px) {
  .sf-work { height: auto; }
  .sf-canvas-wrap { flex: none; height: clamp(340px, 60dvh, 620px); }
  .sf-panel, .sf-pane { overflow: visible; }
  .sf-status { max-width: 100%; }
}
@media (max-width: 540px) {
  .sf-current-draft { grid-template-columns: 64px minmax(0,1fr); gap: .75rem; }
  .sf-current-draft img { width: 64px; height: 84px; }
  .sf-current-draft .sf-btn { grid-column: 1 / -1; }
  .sf-top { padding-inline: .75rem; }
  .sf-top-actions { width: 100%; }
  .sf-top-actions .sf-mode-label { flex-basis: 100%; }
  .sf-status { flex-basis: 100%; }
  .sf-canvas-wrap { height: 400px; }
}

.sf-file-menu { position: relative; }
.sf-file-menu > summary { list-style: none; display: inline-flex; align-items: center; gap: .4rem; }
.sf-file-menu > summary::-webkit-details-marker { display: none; }
.sf-file-menu > summary::after { content: ''; width: 6px; height: 6px; border-right: 1.5px solid currentColor; border-bottom: 1.5px solid currentColor; transform: rotate(45deg); margin-top: -3px; }
.sf-file-panel { position: fixed; z-index: 45; width: min(300px, calc(100vw - 24px)); max-height: calc(100dvh - 24px); overflow-y: auto; padding: .65rem; border: 1px solid var(--sf-line); border-radius: 8px; background: #fff; box-shadow: 0 8px 26px #1b283826; }
.sf-file-panel .sf-btn { display: block; width: 100%; text-align: left; margin: 0 0 .35rem; }
.sf-file-hint { color: var(--sf-muted); font-size: .82rem; line-height: 1.4; margin: .65rem .25rem .15rem; }
.sf-stage-head .sf-mode-label { margin-right: auto; }
@media (max-width: 540px) { .sf-stage-head .sf-mode-label { flex-basis: auto; } }

.sf-field input[type="file"]::file-selector-button {
  min-height: 48px; padding: .55rem .75rem; margin-right: .6rem;
  border: 1px solid #aeb9c6; border-radius: 6px; background: #fff;
  font: inherit; color: inherit; cursor: pointer;
}
.sf-keyboard-help { margin: .5rem 0; max-width: 70ch; font-size: .8rem; line-height: 1.4; }

/* Biblioteca operativa: copertine vere, bozza locale separata e amministrazione esplicita. */
.sf-btn-library, .sf-admin-button, .sf-btn-library-primary { display: inline-flex; align-items: center; justify-content: center; gap: .5rem; text-decoration: none; }
.sf-btn-library svg, .sf-admin-button svg, .sf-btn-library-primary svg { width: 21px; height: 21px; flex: none; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.sf-btn-library { color: #17374b; border-color: #8ca2af; background: #edf3f5; }
.sf-btn-library-primary { color: #fff; background: #17374b; border-color: #17374b; }
.sf-btn-library-primary:hover:not(:disabled) { color: #fff; background: #245268; border-color: #245268; }
.sf-admin-button { font-size: .85rem; }
.sf-welcome { max-width: 1240px; padding-top: 2rem; }
.sf-library-heading { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 1.2rem; margin-bottom: 1.4rem; }
.sf-library-heading > div { min-width: 0; }
.sf-library-heading h2 { font-size: clamp(1.7rem, 2.6vw, 2.3rem); line-height: 1.18; color: #17374b; margin: 0; letter-spacing: -.02em; }
.sf-library-heading p { color: #405465; max-width: 70ch; margin: .65rem 0 0; }
.sf-admin-bar { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 1rem; border-block: 1px solid #c5d1d9; padding: .8rem 0; margin-bottom: 1.5rem; }
.sf-admin-bar p { margin: 0; color: #405465; max-width: 75ch; font-size: .92rem; }
.sf-admin-bar > div { display: flex; gap: .5rem; flex-wrap: wrap; }
.sf-current-draft { grid-template-columns: 90px minmax(0, 1fr) auto; padding: 1.2rem; gap: 1.2rem; margin-bottom: 2rem; border-color: #a8bdc9; background: #edf3f5; }
.sf-current-draft img { width: 90px; height: 120px; background: #dfe8ed; border-radius: 3px; }
.sf-current-draft h2 { margin-top: .5rem; color: #17374b; }
.sf-draft-actions { display: grid; gap: .6rem; }
.sf-published { margin-top: 0; }
.sf-published h2 { font-size: 1.4rem; color: #17374b; margin: 0; }
.sf-library-publication-note { margin: .65rem 0 1.2rem; max-width: 75ch; }
.sf-library-filters { display: grid; grid-template-columns: minmax(0, 1.8fr) minmax(0, 1fr) minmax(0, 1fr); gap: 1rem; align-items: end; }
.sf-library-filters label { display: grid; gap: .4rem; color: #17374b; font-size: .9rem; font-weight: 600; min-width: 0; }
.sf-library-filters input, .sf-library-filters select { width: 100%; min-width: 0; min-height: 48px; background: #fff; border: 1px solid #8c9eaa; border-radius: 7px; padding: .65rem .75rem; font-weight: 400; }
.sf-library-filters input::placeholder { color: #526676; opacity: 1; }
.sf-library-results { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: .75rem; min-height: 70px; padding-block: .6rem; }
.sf-library-results p { margin: 0; color: #405465; font-size: .9rem; }
.sf-published-list { grid-template-columns: repeat(auto-fill, minmax(min(100%, 250px), 1fr)); gap: 1.5rem; }
.sf-book { position: relative; display: flex; flex-direction: column; padding: 0; gap: 0; border-radius: 10px; overflow: hidden; min-width: 0; box-shadow: 0 5px 18px #17374b0a; }
.sf-book-cover { display: flex; align-items: center; justify-content: center; min-height: 292px; height: 292px; padding: 1.2rem 1.4rem; background: #e7edf1; color: #405465; border-bottom: 1px solid #d5dde6; text-decoration: none; }
.sf-book-cover:hover { background: #dce7ed; }
.sf-book .sf-book-cover img { width: 100%; height: 100%; max-width: 206px; max-height: 252px; object-fit: contain; object-position: center; border-radius: 2px; background: transparent; filter: drop-shadow(0 4px 5px #17374b25); }
.sf-book-body { display: flex; flex-direction: column; flex: 1; padding: 1.1rem; min-width: 0; }
.sf-book-state { align-self: flex-start; display: inline-block; padding: .2rem .55rem; border: 1px solid #98b6ab; border-radius: 5px; background: #eef6f1; color: #245b3d; font-size: .78rem; font-weight: 600; }
.sf-book-state-draft { border-color: #9db4c2; background: #fff; color: #17374b; }
.sf-book h3 { color: #17374b; font-size: 1.18rem; line-height: 1.35; margin: .7rem 0 .5rem; overflow-wrap: anywhere; }
.sf-book .sf-book-meta { line-height: 1.5; color: #405465; margin-bottom: .6rem; overflow-wrap: anywhere; }
.sf-book .sf-book-date { font-size: .8rem; color: #526676; margin-bottom: 1.1rem; overflow-wrap: anywhere; }
.sf-book-actions { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: .6rem; margin-top: auto; }
.sf-book-actions .sf-btn { display: inline-flex; justify-content: center; align-items: center; text-decoration: none; min-width: 0; }
.sf-book-delete { position: absolute; right: .65rem; top: .65rem; z-index: 1; display: inline-grid; place-items: center; width: 48px; height: 48px; border: 1px solid #ad6571; border-radius: 8px; color: #8e1931; background: #fff; cursor: pointer; box-shadow: 0 3px 8px #17374b1a; }
.sf-book-delete svg { width: 22px; height: 22px; stroke: currentColor; fill: none; stroke-width: 2; stroke-linecap: round; }
.sf-book-delete:hover:not(:disabled) { color: #fff; background: #8e1931; }
.sf-book-delete:disabled { opacity: .6; cursor: wait; }
.sf-book-busy .sf-book-cover { pointer-events: none; }
.sf-library-empty { grid-column: 1 / -1; margin: 0; padding: 1.3rem 0; color: #405465; max-width: 75ch; }
.sf-library-pagination { display: flex; align-items: center; justify-content: center; flex-wrap: wrap; gap: 1rem; margin: 1.5rem 0 0; font-variant-numeric: tabular-nums; }
.sf-library-help { margin-top: 2.2rem; border-top: 1px solid #c5d1d9; padding-top: .6rem; }
.sf-library-help > summary { min-height: 48px; padding: .6rem 0; color: #17374b; cursor: pointer; font-weight: 600; }
.sf-library-help .sf-welcome-grid { padding-top: 1rem; }
.sf-delete-warning { padding: .85rem; margin: 0; background: #fbecef; border: 1px solid #d2a0aa; color: #80172d; border-radius: 6px; }
.sf-btn-delete { color: #fff; border-color: #8e1931; background: #8e1931; }
.sf-btn-delete:hover:not(:disabled) { background: #711427; }
#elimina-testo { overflow-wrap: anywhere; }
.sf-welcome ::selection { background: #c6dee8; color: #17374b; }
.sf-welcome input { caret-color: #17374b; }
@media (max-width: 860px) {
  .sf-library-filters { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .sf-library-search { grid-column: 1 / -1; }
  .sf-current-draft { grid-template-columns: 80px minmax(0, 1fr); }
  .sf-draft-actions { grid-column: 1 / -1; grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .sf-current-draft img { width: 80px; height: 108px; }
  .sf-draft-actions .sf-btn { grid-column: auto; }
}
@media (max-width: 540px) {
  .sf-welcome { padding-top: 1.4rem; }
  .sf-library-heading > .sf-btn { width: 100%; }
  .sf-library-filters { grid-template-columns: minmax(0, 1fr); gap: .8rem; }
  .sf-library-search { grid-column: auto; }
  .sf-current-draft { padding: .9rem; gap: .8rem; }
  .sf-draft-actions { grid-template-columns: minmax(0, 1fr); }
  .sf-published-list { grid-template-columns: minmax(0, 1fr); }
  .sf-book-cover { height: 310px; }
  .sf-book .sf-book-cover img { max-height: 270px; }
  .sf-library-pagination { gap: .6rem; }
  .sf-library-pagination > span { flex-basis: 100%; text-align: center; order: -1; }
}
@media (forced-colors: active) { .sf-book-delete, .sf-book-state, .sf-delete-warning { border: 1px solid CanvasText; } }

/* La Biblioteca conserva solo i comandi di navigazione e accesso.
   Il rientro nell’editor ripristina gli strumenti senza cambiare il lavoro. */
body[data-editor-view="library"] .sf-history-actions,
body[data-editor-view="library"] #btn-anteprima,
body[data-editor-view="library"] #btn-pubblica,
body[data-editor-view="library"] #sf-school-tools,
body[data-editor-view="library"] #sf-school-panel { display: none !important; }

/* Biblioteca su tablet: due colonne leggibili e comandi comodi al tocco. */
@media (max-width: 1100px) {
  body[data-editor-view="library"] .sf-welcome,
  body[data-editor-view="library"] .sf-library-heading,
  body[data-editor-view="library"] .sf-library-filters,
  body[data-editor-view="library"] .sf-published,
  body[data-editor-view="library"] .sf-published-list,
  body[data-editor-view="library"] .sf-current-draft,
  body[data-editor-view="library"] .sf-draft-actions,
  body[data-editor-view="library"] .sf-admin-bar,
  body[data-editor-view="library"] .sf-row-between { min-width: 0; }
  body[data-editor-view="library"] .sf-top { align-items: flex-start; gap: 16px; padding: 16px 24px; }
  body[data-editor-view="library"] .sf-brand { flex: 1 1 280px; min-width: 0; max-width: 100%; }
  body[data-editor-view="library"] .sf-top-actions { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); flex: 1 1 100%; width: 100%; min-width: 0; margin-left: 0; gap: 8px; }
  body[data-editor-view="library"] .sf-top-actions > .sf-status { grid-column: 1 / -1; min-width: 0; max-width: 100%; margin: 0; }
  body[data-editor-view="library"] .sf-top-actions > .sf-status:empty { display: none; }
  body[data-editor-view="library"] .sf-top-actions > .sf-btn,
  body[data-editor-view="library"] .sf-file-menu > summary { width: 100%; min-width: 0; min-height: 48px; white-space: normal; overflow-wrap: anywhere; }
  body[data-editor-view="library"] .sf-file-menu { min-width: 0; }
  body[data-editor-view="library"] .sf-file-menu > summary { justify-content: center; }
  body[data-editor-view="library"] .sf-library-heading > div,
  body[data-editor-view="library"] .sf-current-draft > div,
  body[data-editor-view="library"] .sf-admin-bar > div,
  body[data-editor-view="library"] .sf-book-body,
  body[data-editor-view="library"] .sf-book-actions { min-width: 0; }
  body[data-editor-view="library"] .sf-book h3,
  body[data-editor-view="library"] .sf-current-draft h2 { overflow-wrap: anywhere; }
  body[data-editor-view="library"] .sf-welcome .sf-btn,
  body[data-editor-view="library"] .sf-library-filters input,
  body[data-editor-view="library"] .sf-library-filters select,
  body[data-editor-view="library"] .sf-form input[type="text"],
  body[data-editor-view="library"] .sf-form input[type="password"] { min-height: 48px; }
  body[data-editor-view="library"] .sf-library-filters input,
  body[data-editor-view="library"] .sf-library-filters select,
  body[data-editor-view="library"] .sf-form input[type="text"],
  body[data-editor-view="library"] .sf-form input[type="password"] { font-size: 1rem; }
}
@media (min-width: 601px) and (max-width: 1100px) {
  body[data-editor-view="library"] .sf-welcome { padding: 28px 24px; }
  body[data-editor-view="library"] .sf-published-list { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; }
  body[data-editor-view="library"] .sf-library-filters { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
  body[data-editor-view="library"] .sf-library-search { grid-column: 1 / -1; }
  body[data-editor-view="library"] .sf-book-cover { min-height: 220px; height: 260px; padding: 18px; }
  body[data-editor-view="library"] .sf-book .sf-book-cover img { max-width: 100%; max-height: 100%; object-fit: contain; }
}
@media (max-width: 600px) {
  body[data-editor-view="library"] .sf-top { padding: 16px; }
  body[data-editor-view="library"] .sf-top-actions { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  body[data-editor-view="library"] .sf-file-menu { grid-column: 1 / -1; }
  body[data-editor-view="library"] .sf-welcome { padding: 24px 16px; }
  body[data-editor-view="library"] .sf-published-list,
  body[data-editor-view="library"] .sf-library-filters { grid-template-columns: minmax(0, 1fr); gap: 20px; }
  body[data-editor-view="library"] .sf-library-search { grid-column: auto; }
  body[data-editor-view="library"] .sf-library-heading > .sf-btn { width: 100%; }
  body[data-editor-view="library"] .sf-current-draft { grid-template-columns: 80px minmax(0, 1fr); }
  body[data-editor-view="library"] .sf-draft-actions { grid-column: 1 / -1; grid-template-columns: minmax(0, 1fr); width: 100%; }
  body[data-editor-view="library"] .sf-draft-actions .sf-btn { width: 100%; }
  body[data-editor-view="library"] .sf-book-cover { min-height: 220px; height: 280px; padding: 20px; }
  body[data-editor-view="library"] .sf-book .sf-book-cover img { max-width: 100%; max-height: 100%; object-fit: contain; }
}