/* Blank paper and movable sticky notes. Tools float above the sheet without
   changing its logical geometry or the source PDF's annotation data. */
.workspace-panel:not(.hidden) { position:relative; display:flex; flex-direction:column; min-width:0; min-height:0; overflow:hidden; background:var(--paper); border-left:1px solid var(--line); }
.workspace-panel button, .workspace-panel select, .workspace-panel summary { min-height:44px; min-width:44px; }
.workspace-close { position:absolute; z-index:5; top:12px; right:17px; padding:0; border:1px solid var(--line); border-radius:50%; background:var(--surface); color:var(--muted); font:16px var(--sans); box-shadow:0 2px 10px #00000008; }
.workspace-tools { position:absolute; z-index:6; top:70px; right:12px; padding:4px; border:1px solid var(--line); border-radius:16px; background:color-mix(in srgb,var(--surface) 95%,transparent); box-shadow:0 5px 20px #0000000c; }
.workspace-tool-row { display:flex; flex-direction:column; gap:3px; }
.workspace-tools button, .workspace-tools select, .workspace-tools summary { border:1px solid transparent; border-radius:10px; background:transparent; color:var(--ink); font:650 13px var(--sans); padding:6px 10px; }
.workspace-tool-row > button { display:grid; place-items:center; width:44px; padding:0; font-size:21px; }
.workspace-tool-row > button svg { width:22px; height:22px; }
.workspace-tool-row > :is(.workspace-undo,.workspace-labelled) { display:flex; flex-direction:column; justify-content:center; align-items:center; gap:0; }
.workspace-tool-row > :is(.workspace-undo,.workspace-labelled) svg { width:18px; height:18px; }
:is(.workspace-undo,.workspace-labelled) span { font:600 9px/1.1 var(--sans); }
.workspace-tools button[aria-pressed="true"] { border-color:var(--accent); background:var(--accent-soft); }
.workspace-tools button:disabled { opacity:.35; }
.workspace-tools button:focus-visible, .workspace-panel summary:focus-visible, .workspace-close:focus-visible { outline:2px solid var(--accent); outline-offset:2px; }
.workspace-pen-options { position:absolute; top:0; right:calc(100% + 9px); width:200px; max-width:calc(100vw - 86px); padding:9px; border:1px solid var(--line); border-radius:13px; background:var(--surface); box-shadow:var(--shadow); }
.workspace-color-row { display:grid; grid-template-columns:repeat(4,44px); gap:3px; }
.workspace-color-row button { position:relative; width:44px; padding:0; }
.workspace-color-row button::after { content:""; display:block; width:22px; height:22px; border:1px solid #ffffff60; border-radius:50%; background:var(--workspace-color); margin:auto; }
.workspace-size-label { display:flex; align-items:center; justify-content:space-between; gap:8px; padding:6px 4px 0; font:12px var(--sans); color:var(--muted); }
.workspace-more > summary { display:grid; place-items:center; width:44px; padding:0; list-style:none; cursor:pointer; font-size:21px; }
.workspace-panel summary::-webkit-details-marker { display:none; }
.workspace-more[open] > summary { background:var(--accent-soft); color:var(--accent); }
.workspace-more-panel { position:absolute; top:0; right:calc(100% + 9px); display:grid; width:190px; padding:6px; border:1px solid var(--line); border-radius:13px; background:var(--surface); box-shadow:var(--shadow); }
.workspace-more-panel button { text-align:left; font-size:13px; }
.workspace-more-panel button:hover { background:var(--surface-2); }
.workspace-zoom-controls { display:grid; grid-template-columns:repeat(3,minmax(44px,1fr)); gap:2px; padding:4px 0; border-top:1px solid var(--line); }
.workspace-zoom-controls button { min-width:44px; min-height:44px; padding:0 3px; text-align:center; font-size:17px; }
.workspace-zoom-controls #workspaceZoomReset { font-size:12px; }
.workspace-status { position:absolute; z-index:5; left:12px; bottom:12px; max-width:calc(100% - 90px); margin:0; padding:9px 12px; border:1px solid var(--line); border-radius:9px; color:var(--ink); background:var(--surface); font:12px/1.4 var(--sans); box-shadow:0 3px 14px #0000000a; pointer-events:none; }
.workspace-status:empty { display:none; }
.workspace-scroll { flex:1; min-height:0; overflow:auto; overscroll-behavior:contain; overflow-anchor:none; background:var(--paper); padding:0; touch-action:pan-x pan-y; }
.workspace-stage { position:relative; min-width:100%; min-height:100%; background:var(--paper); }
.workspace-board { position:absolute; top:0; left:0; width:100%; min-height:600px; background:var(--paper); touch-action:pan-x pan-y; isolation:isolate; transform-origin:0 0; }
.workspace-cards, .workspace-ink { position:absolute; inset:0; width:100%; height:100%; pointer-events:none; }
/* Do not trap menus below the shared ink layer in a card-layer stacking context. */
.workspace-cards { z-index:auto; }
.workspace-ink { z-index:2; overflow:visible; }
.workspace-lasso-layer { position:absolute; inset:0; width:100%; height:100%; z-index:3; pointer-events:none; overflow:visible; }
.workspace-lasso-preview { fill:color-mix(in srgb,var(--accent) 7%,transparent); stroke:var(--accent); stroke-width:1.5; stroke-dasharray:5 4; vector-effect:non-scaling-stroke; }
.workspace-selection-box { position:absolute; z-index:4; box-sizing:border-box; border:1.5px dashed var(--accent); outline:3px solid color-mix(in srgb,var(--accent) 8%,transparent); border-radius:4px; cursor:grab; touch-action:none; }
.workspace-selection-box[hidden] { display:none; }
.workspace-selection-handle { position:absolute; width:14px; height:14px; box-sizing:border-box; border:2px solid var(--accent); border-radius:50%; background:var(--paper); box-shadow:0 1px 3px rgba(0,0,0,.18); touch-action:none; }
/* Visible dots stay small; the touch target is a 44px square centred on each corner. */
.workspace-selection-handle::before { content:''; position:absolute; left:50%; top:50%; width:44px; height:44px; transform:translate(-50%,-50%); }
.workspace-selection-handle[data-corner="nw"] { left:-8px; top:-8px; cursor:nwse-resize; }
.workspace-selection-handle[data-corner="ne"] { right:-8px; top:-8px; cursor:nesw-resize; }
.workspace-selection-handle[data-corner="sw"] { left:-8px; bottom:-8px; cursor:nesw-resize; }
.workspace-selection-handle[data-corner="se"] { right:-8px; bottom:-8px; cursor:nwse-resize; }
.workspace-selection-box:active { cursor:grabbing; }
/* Duplicate / Delete over a lasso selection, clear of the corner handles' 44px targets. */
.workspace-selection-actions { --s:var(--selection-ui-scale,1); position:absolute; right:var(--selection-actions-shift,0px); bottom:calc(100% + 28px * var(--s)); transform:scale(var(--s)); transform-origin:right bottom; display:flex; gap:2px; padding:3px; border:1px solid var(--line); border-radius:12px; background:var(--surface); box-shadow:var(--shadow); cursor:default; white-space:nowrap; }
.workspace-selection-near-top .workspace-selection-actions { bottom:auto; top:calc(100% + 28px * var(--s)); transform-origin:right top; }
.workspace-selection-near-left .workspace-selection-actions { right:auto; left:0; transform-origin:left bottom; }
.workspace-selection-near-left.workspace-selection-near-top .workspace-selection-actions { transform-origin:left top; }
.workspace-selection-actions button { min-width:44px; min-height:40px; padding:0 14px; border:0; border-radius:9px; background:transparent; color:var(--ink); font:650 13px var(--sans); touch-action:manipulation; }
.workspace-selection-actions button:hover, .workspace-selection-actions button:focus-visible { background:color-mix(in srgb,var(--accent) 12%,transparent); }
.workspace-selection-box:focus-visible { outline:3px solid color-mix(in srgb,var(--accent) 30%,transparent); }
.workspace-card.workspace-selected { outline:1px solid var(--accent); outline-offset:2px; }
.workspace-ink .workspace-selected { filter:drop-shadow(0 0 1px var(--accent)); }
.workspace-board.workspace-selecting, .workspace-selecting * { user-select:none; -webkit-user-select:none; -webkit-touch-callout:none; }
.workspace-selecting { cursor:crosshair; }
/* The library wall's pastel paper and blue ink. No individual
   note rotation: the shared sheet transform keeps Pencil ink aligned. */
.workspace-card { --note-paper:#e5df73; --note-ink:#234f91; position:absolute; display:flex; flex-direction:column; box-sizing:border-box; min-width:0; min-height:120px; padding:0 14px 14px; border:1px solid color-mix(in srgb,var(--note-ink) 14%,transparent); border-radius:2px 3px 7px 4px; background:linear-gradient(165deg,rgba(255,255,255,.15),transparent 58%),color-mix(in srgb,var(--note-paper) 62%,#fffbed); color:var(--note-ink); box-shadow:0 7px 15px rgba(42,38,30,.13),inset 0 1px rgba(255,255,255,.24); pointer-events:auto; touch-action:auto; font:14px/1.5 var(--sans); overflow-wrap:anywhere; }
/* Plain sticky notes: no tape or pin. A faint top strip marks where to grab the note. */
.workspace-card::after { content:""; position:absolute; top:0; left:0; right:0; height:44px; border-radius:2px 3px 0 0; background:color-mix(in srgb,var(--note-ink) 5%,transparent); pointer-events:none; }
html[data-theme="dark"] .workspace-card::after { background:rgba(255,255,255,.04); }
/* A short grabber bar, the standard iPadOS sheet cue, marks the strip as the place to grab. */
.workspace-card::before { content:""; position:absolute; top:9px; left:50%; width:34px; height:4px; border-radius:2px; background:color-mix(in srgb,var(--note-ink) 32%,transparent); transform:translateX(-50%); pointer-events:none; }
.workspace-card:focus-visible { outline:2px solid var(--accent); outline-offset:2px; }
.workspace-card.workspace-resizing { outline:2px solid var(--accent); outline-offset:2px; }
.workspace-card-head { display:flex; align-items:center; justify-content:space-between; margin:0 -8px; }
.workspace-card-body { flex:1; min-width:0; touch-action:none; }
.workspace-card-handle { flex:1; width:auto; cursor:grab; touch-action:none; padding:0 8px; border:0; border-radius:0; background:transparent; color:color-mix(in srgb,var(--note-ink) 60%,transparent); font:18px var(--sans); text-align:left; user-select:none; -webkit-user-select:none; }
.workspace-card-handle:active { cursor:grabbing; }
.workspace-note-menu { position:relative; }
.workspace-note-menu > summary { display:grid; place-items:center; padding:0; list-style:none; cursor:pointer; color:var(--note-ink); font:18px var(--sans); }
.workspace-note-menu[open] { z-index:5; }
.workspace-note-menu .workspace-card-actions { position:absolute; top:100%; right:0; z-index:5; display:grid; width:164px; padding:5px; border:1px solid var(--line); border-radius:10px; background:var(--surface); box-shadow:var(--shadow); }
.workspace-card-actions button { padding:7px 10px; border:0; border-radius:6px; background:transparent; color:var(--ink); font:12px var(--sans); text-align:left; }
.workspace-card-actions button:hover { background:var(--surface-2); }
.workspace-card blockquote { margin:0; padding:0; border:0; color:var(--note-ink); font:500 15px/1.5 var(--sans); white-space:pre-wrap; max-height:230px; overflow:auto; touch-action:none; }
.workspace-note-preview { margin:8px 0 0; white-space:pre-wrap; max-height:240px; overflow:auto; touch-action:none; color:var(--note-ink); font:14px/1.5 var(--sans); }
.workspace-note-preview:empty { display:none; }
.workspace-card label { display:block; margin-top:6px; font-size:12px; }
.workspace-card label[hidden], .workspace-card textarea[hidden], .workspace-note-preview[hidden] { display:none; }
.workspace-card textarea { display:block; box-sizing:border-box; width:100%; min-height:80px; resize:vertical; background:rgba(255,251,237,.5); color:var(--note-ink); border:1px solid color-mix(in srgb,var(--note-ink) 25%,transparent); border-radius:5px; padding:6px; font:16px/1.45 var(--sans); }
.workspace-card textarea::placeholder { color:color-mix(in srgb,var(--note-ink) 75%,transparent); opacity:1; }
.workspace-card-status { color:var(--note-ink); font-size:12px; margin:4px 0 0; }
.workspace-card-status:empty, .workspace-card-status.workspace-status-saved { display:none; }
.workspace-card.workspace-draft { border-color:var(--accent); }
.workspace-board.workspace-drop-target, .workspace-board.drop-target { outline:2px solid var(--accent); outline-offset:-2px; }
.workspace-dragging { cursor:grabbing; }
.workspace-highlight-ghost { position:fixed; z-index:100; max-width:230px; padding:8px 11px; border:1px solid var(--accent); border-radius:8px; background:var(--surface); color:var(--ink); box-shadow:var(--shadow); font:12px/1.35 var(--sans); pointer-events:none; opacity:.96; transform:translate(14px,14px); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
body.workspace-highlight-dragging { cursor:grabbing; user-select:none; -webkit-user-select:none; }
.workspace-highlight-source, .workspace-highlight-source * { user-select:none; -webkit-user-select:none; -webkit-touch-callout:none; }
.selection-card #selectionToWorkspace { min-height:44px; touch-action:none; }
.workspace-divider { display:none; }
body.workspace-open { --workspace-paper-width:50%; }
body.workspace-open #notebook, body.workspace-open :is(#notebookResizer,#notebookTuck,#notebookReopen) { display:none !important; }
body.workspace-open .reader-layout { --notebook-width:calc(100% - var(--workspace-paper-width)) !important; display:grid; grid-template-columns:minmax(0,var(--workspace-paper-width)) minmax(0,1fr); }
body.workspace-open #workspacePanel { grid-column:2; grid-row:1; }
body.workspace-open #documentPane { grid-column:1; grid-row:1; min-width:0; }
body.workspace-open .workspace-divider { position:absolute; z-index:15; top:0; bottom:0; left:var(--workspace-paper-width); display:block; box-sizing:border-box; width:44px; transform:translateX(-50%); cursor:col-resize; touch-action:none; user-select:none; -webkit-user-select:none; }
body.workspace-open .workspace-divider::before { content:""; position:absolute; top:0; bottom:0; left:20px; width:4px; background:color-mix(in srgb,var(--accent) 42%,var(--line)); box-shadow:0 0 0 1px var(--surface); }
body.workspace-open .workspace-divider::after { content:"⋮"; position:absolute; top:50%; left:50%; display:grid; place-items:center; width:18px; height:52px; border:1px solid var(--line); border-radius:11px; background:var(--surface); color:var(--accent); box-shadow:var(--shadow); font:700 20px var(--sans); transform:translate(-50%,-50%); }
/* While Apple Pencil is in use, only the grip in the middle grabs the divider; strokes
   that start beside the line go to the paper or Workspace underneath. */
.workspace-divider-grip { position:absolute; top:50%; left:0; width:44px; height:96px; transform:translateY(-50%); }
body.workspace-open .workspace-divider.workspace-pen-active { pointer-events:none; }
body.workspace-open .workspace-divider.workspace-pen-active .workspace-divider-grip { pointer-events:auto; }
body.workspace-open .workspace-divider:focus-visible { outline:2px solid var(--accent); outline-offset:-5px; }
body.workspace-open.resizing-workspace .workspace-divider { cursor:col-resize; }
body.workspace-open .pane-spotlight, body.workspace-open .recall-shield { right:calc(100% - var(--workspace-paper-width)); }
body.workspace-open #sheetScrim { display:none !important; }
body.workspace-open #workspaceReturn.hidden { display:none; }
body.workspace-open #touchDock { right:calc(100% - var(--workspace-paper-width) + 10px); left:auto; top:max(180px,25dvh); transform:none; }
body.workspace-open.zen #zenDock { right:calc(100% - var(--workspace-paper-width) + 12px); }
.zen-workspace-marker { display:none !important; }
body.workspace-open.zen .zen-workspace-marker { display:flex !important; }
/* Paper highlight and handwriting shelves center on the paper, never over the workspace. */
@media (min-width:900px) and (orientation:landscape) {
  body.workspace-open :is(.highlight-toolbar,.pdf-ink-toolbar) { left:calc(var(--workspace-paper-width) / 2); max-width:calc(var(--workspace-paper-width) - 24px); }
  /* The paper's dock moves onto the paper's own edge here, so the page fits beside it
     instead of under it: the ends of lines stay visible and a highlight can start on
     the last word. pageScale() reads the same gutter. Touch dock: 64px wide, 10px in;
     Zen rail: 44px circles, 12px in. */
  body.touch-tablet-reader.workspace-open:not(.zen) { --paper-dock-gutter:84px; }
  body.workspace-open.zen { --paper-dock-gutter:66px; --zen-find-rail-width:44px; }
  body.workspace-open .pdf-frame:not(.paged-pdf-flow) { padding-right:var(--paper-dock-gutter,0px); }
  /* The layout pill would reach back over the text; beside Workspace it is one circle. */
  body.workspace-open.zen #zenLayout { width:44px; flex-basis:44px; padding:0; border-radius:50%; }
  body.workspace-open.zen #zenLayout :is(#zenLayoutLabel,.zen-layout-chevron) { display:none; }
  body.workspace-open.zen #zenLayoutIcon { display:flex; }
}
/* Match the short-height rail's extra 44px columns and 4px gaps. Both the
   paper fit and Find need to clear the whole rail beside Workspace. */
@media (min-width:900px) and (orientation:landscape) and (max-height:440px) {
  body.workspace-open.zen { --paper-dock-gutter:114px; --zen-find-rail-width:92px; }
}
@media (min-width:900px) and (orientation:landscape) and (max-height:325px) {
  body.workspace-open.zen { --paper-dock-gutter:162px; --zen-find-rail-width:140px; }
}
#zenLayoutIcon { display:none; }
#zenLayoutIcon svg { width:20px; height:20px; }
body.workspace-open #excerptReturnChip { left:calc(var(--workspace-paper-width) / 2); bottom:26px; }
body.workspace-open #workspaceOpen { color:var(--accent); }
@media (max-width:899px), (orientation:portrait) {
  body.workspace-open .reader-layout { display:block; --notebook-width:0px !important; }
  body.workspace-open .workspace-divider { display:none; }
  body.workspace-open #workspacePanel { position:absolute; inset:0; z-index:45; border-left:0; }
  body.workspace-open :is(#touchDock,#paneSpotlight,#recallShield,#excerptReturnChip,#zenDock) { visibility:hidden; }
  body.workspace-open #documentPane { visibility:hidden; }
}
@media (max-width:420px) {
  .workspace-close { right:12px; }
  .workspace-tools { right:7px; }
  .workspace-pen-options { width:194px; right:calc(100% + 5px); }
  .workspace-more-panel { width:175px; right:calc(100% + 5px); }
}
#workspaceNewNote { touch-action:none; }
.workspace-note-ghost { position:fixed; top:0; left:0; z-index:60; box-sizing:border-box; border:1.5px dashed color-mix(in srgb,#234f91 45%,transparent); border-radius:4px; background:color-mix(in srgb,#e5df73 55%,transparent); box-shadow:0 10px 22px rgba(42,38,30,.18); pointer-events:none; }
.workspace-note-ghost-away { opacity:.35; }
