.board-content-zoom{--zoom-ink:rgba(255,255,255,.88);--zoom-surface:rgba(8,18,14,.16);--zoom-border:rgba(255,255,255,.16);--zoom-hover:rgba(255,255,255,.12);position:absolute;left:14px;bottom:14px;z-index:8;display:flex;gap:2px;align-items:center;padding:4px;border:1px solid var(--zoom-border);border-radius:12px;background:var(--zoom-surface);color:var(--zoom-ink);font-size:14px;box-shadow:none;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}
.board-content-zoom>span{padding:0 5px;font-size:12px}
.board-wrap[data-background="white"] .board-content-zoom{--zoom-ink:rgba(32,41,37,.88);--zoom-surface:rgba(255,255,255,.3);--zoom-border:rgba(32,41,37,.16);--zoom-hover:rgba(32,41,37,.08)}
/* Stay translucent even when the app's general button theme is dark. */
#boardWrap #boardContentZoom button{min-height:32px;min-width:32px;padding:4px 8px;border:0;border-radius:7px;background:transparent;color:inherit;box-shadow:none;font:inherit;font-variant-numeric:tabular-nums;cursor:pointer}
#boardWrap #boardContentZoom button:hover:not(:disabled),#boardWrap #boardContentZoom button:focus-visible{background:var(--zoom-hover)}
#boardWrap #boardContentZoom button:focus-visible{outline:2px solid currentColor;outline-offset:-2px}
#boardWrap #boardContentZoom button:disabled{opacity:.38;cursor:default}
.board-content-zoom[hidden],.document-crop[hidden],.capture-selection[hidden]{display:none}
.document-crop{position:absolute;inset:0;z-index:24;cursor:crosshair;touch-action:none;background:#00000018}
.crop-box{position:absolute;border:2px dashed #ffd457;background:#fff1;pointer-events:none;box-shadow:0 0 0 1px var(--green-dark)}
.crop-actions{position:absolute;top:10px;left:50%;transform:translateX(-50%);display:flex;gap:7px;align-items:center;white-space:nowrap;padding:7px 10px;border-radius:12px;background:var(--panel,#fff);color:var(--green-dark);font:14px Jua,system-ui,sans-serif;cursor:default}
.crop-actions button,.capture-actions button{border:0;border-radius:7px;padding:7px 10px;background:var(--green-soft);color:var(--green-dark);font:inherit;cursor:pointer;min-height:32px}
.crop-actions button:disabled{opacity:.45;cursor:default}.crop-actions #cropImport{background:var(--green);color:white}
.capture-selection{position:absolute;z-index:14;border:2px dashed #ffd457;outline:1px solid var(--green-dark);cursor:move;touch-action:none;box-sizing:border-box}
.capture-actions{position:absolute;left:0;top:4px;display:flex;gap:4px;padding:3px;background:var(--panel,#fff);border-radius:9px;font:13px Jua,system-ui,sans-serif;white-space:nowrap;cursor:default}
.capture-actions #captureDelete{background:#f9ddd6;color:#853728}.capture-resize{position:absolute;right:-12px;bottom:-12px;width:28px;height:28px;padding:0;border:2px solid white;border-radius:6px;background:var(--green);color:white;cursor:nwse-resize;touch-action:none}
@media print{.board-content-zoom,.document-crop,.capture-selection{display:none!important}}
/* Keep file/view controls alongside the page title, not in a separate toolbar row. */
body[data-page="board"]:not(.board-fullscreen) > .app > .site-header{width:calc(100% - 8px);grid-template-columns:auto minmax(0,1fr);column-gap:16px;row-gap:12px;margin-bottom:8px}
/* Match the other pages' centered navigation while keeping the board controls wide. */
body[data-page="board"] .site-header > .site-nav{width:min(1480px,100%);min-width:0;justify-self:center}
body[data-page="board"] .site-header > .site-heading{flex-direction:row;align-items:center;gap:12px}
body[data-page="board"] .site-header .save-state{margin:0;font-size:.75rem;max-width:150px}
body[data-page="board"] .site-header > .board-top-tools{grid-column:2;grid-row:2;justify-content:flex-end;align-self:center;min-width:0;width:auto;margin:0;padding:0;border:0}
body[data-page="board"] .board-top-tools .board-display-tools{margin-left:0}
body[data-page="board"] .board-top-tools .document-nav{order:2;flex-basis:100%;justify-content:flex-end;flex-wrap:wrap}
.eraser-text-toggle{white-space:nowrap;font-size:.875rem}.eraser-text-toggle[hidden]{display:none!important}
.eraser-text-toggle:focus-visible{outline:3px solid var(--yellow);outline-offset:2px}
@media(max-width:760px){body[data-page="board"]:not(.board-fullscreen) > .app > .site-header{grid-template-columns:minmax(0,1fr);row-gap:8px}body[data-page="board"] .site-header > .board-top-tools{grid-column:1;grid-row:3;justify-content:flex-end}body[data-page="board"] .site-header > .site-heading{width:auto;justify-content:flex-start}}