/* Reserved controls and status stay inside the existing no-scroll table box. */
.pf-board-ink-host { position:relative !important; box-sizing:border-box; padding-bottom:60px !important; }
.pf-board-ink-canvas { position:absolute; inset:0 0 60px; width:100%; height:calc(100% - 60px); z-index:25; display:block; background:transparent; pointer-events:none; border-radius:inherit; }
.pf-board-ink-canvas.is-drawing { pointer-events:auto; touch-action:none; cursor:crosshair; user-select:none; -webkit-user-select:none; -webkit-touch-callout:none; }
.pf-board-ink-toolbar { position:absolute; bottom:2px; left:4px; right:4px; height:44px; display:flex; align-items:center; justify-content:space-between; gap:8px; z-index:26; font-family:inherit; }
.pf-board-ink-own,.pf-board-ink-commands { display:flex; align-items:center; gap:5px; }
.pf-board-ink-host .pf-board-ink-toolbar button,.pf-board-ink-color { display:inline-flex; align-items:center; justify-content:center; box-sizing:border-box; min-height:44px; min-width:44px; height:44px; width:auto; margin:0; padding:6px 10px; border:1px solid var(--border,#68717c); border-radius:10px; background:var(--surface-raised,#242b35); color:var(--text,#f5f6fa); font:700 12px/1.2 system-ui,sans-serif; letter-spacing:0; text-transform:none; box-shadow:none; touch-action:manipulation; }
.pf-board-ink-host .pf-board-ink-toolbar button:disabled { opacity:.45; cursor:default; }
.pf-board-ink-host .pf-board-ink-toolbar .pf-board-ink-toggle[aria-pressed="true"] { background:#f6cb71; border-color:#f6cb71; color:#1b2027; }
.pf-board-ink-color { padding:5px; cursor:pointer; }
.pf-board-ink-host .pf-board-ink-swatch { width:32px; min-width:32px; height:32px; min-height:32px; max-width:32px; margin:0; padding:0; border:0; background:transparent; border-radius:6px; cursor:pointer; }
.pf-board-ink-swatch::-webkit-color-swatch-wrapper { padding:2px; }
.pf-board-ink-swatch::-webkit-color-swatch { border:1px solid currentColor; border-radius:5px; }
.pf-board-ink-swatch::-moz-color-swatch { border:1px solid currentColor; border-radius:5px; }
.pf-board-ink-host .pf-board-ink-toolbar :is(button,input):focus-visible { outline:3px solid var(--accent,#77cfff); outline-offset:2px; }
.pf-board-ink-status { position:absolute; z-index:27; bottom:48px; left:4px; right:4px; height:11px; box-sizing:border-box; color:var(--muted,#b7c0cc); pointer-events:none; font:500 10px/11px system-ui,sans-serif; text-align:center; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.pf-board-ink-status.is-notice { color:var(--text,#f5f6fa); }
.pf-board-ink-sr { position:absolute; width:1px; height:1px; overflow:hidden; clip-path:inset(50%); white-space:nowrap; }
.pf-board-ink-host :is(.pf-board-ink-canvas,.pf-board-ink-toolbar,.pf-board-ink-status)[hidden] { display:none !important; }
@media (max-width:360px) { .pf-board-ink-toolbar { gap:4px; } .pf-board-ink-host .pf-board-ink-toolbar button { padding:6px 8px; } }

/* Reaction UI overlays the board, never adds document height. */
.pf-reaction-palette,.pf-reaction-editor {position:absolute;z-index:28;bottom:62px;left:4px;right:4px;display:flex;justify-content:center;gap:4px;flex-wrap:wrap;background:var(--surface-raised,#242b35);border:1px solid var(--border,#68717c);border-radius:10px;padding:4px;box-sizing:border-box;}
.pf-reaction-palette[hidden],.pf-reaction-editor[hidden] {display:none!important;}
.pf-board-ink-host :is(.pf-reaction-palette,.pf-reaction-editor) button {min-width:44px;min-height:44px;margin:0;padding:4px 8px;border-radius:8px;font:700 16px system-ui;color:var(--text,#fff);background:var(--surface,#18212c);touch-action:manipulation;}
.pf-board-ink-host :is(.pf-reaction-palette,.pf-reaction-editor) button:focus-visible {outline:3px solid #77cfff;outline-offset:1px;}
.pf-reaction-editor button:disabled {opacity:.45;}
@media(max-width:360px){.pf-board-ink-own,.pf-board-ink-commands{gap:2px}.pf-board-ink-host .pf-board-ink-toolbar button{padding:4px;}.pf-board-ink-toolbar{left:2px;right:2px;gap:2px}}
