.canvasWrapper{height:100vh;position:relative}.dev-toggle{z-index:10;cursor:pointer;background-color:#fff;padding:4px 8px;position:fixed;top:0;left:0}:root{--pn-primary:#3b82f6;--pn-primary-light:#eff6ff;--pn-primary-bg:#3b82f614;--pn-danger:#ef4444;--pn-danger-light:#fee2e2;--pn-border:#e5e7eb;--pn-border-light:#f3f4f6;--pn-bg:#fff;--pn-bg-hover:#f3f4f6;--pn-bg-subtle:#f9fafb;--pn-text:#374151;--pn-text-muted:#6b7280;--pn-text-faint:#9ca3af;--pn-shadow-sm:0 1px 4px #0000001f;--pn-shadow-md:0 2px 8px #0000001a;--pn-shadow-lg:0 8px 24px #0000001f}@media (prefers-color-scheme:dark){:root:not([data-theme=light]){--pn-bg:#1f2937;--pn-bg-hover:#374151;--pn-bg-subtle:#283548;--pn-border:#374151;--pn-border-light:#1f2937;--pn-text:#f9fafb;--pn-text-muted:#9ca3af;--pn-text-faint:#6b7280;--pn-primary-light:#1e3a5f}}[data-theme=dark]{--pn-bg:#1f2937;--pn-bg-hover:#374151;--pn-bg-subtle:#283548;--pn-border:#374151;--pn-border-light:#1f2937;--pn-text:#f9fafb;--pn-text-muted:#9ca3af;--pn-text-faint:#6b7280;--pn-primary-light:#1e3a5f}[data-theme=light]{--pn-bg:#fff;--pn-bg-hover:#f3f4f6;--pn-bg-subtle:#f9fafb;--pn-border:#e5e7eb;--pn-border-light:#f3f4f6;--pn-text:#374151;--pn-text-muted:#6b7280;--pn-text-faint:#9ca3af;--pn-primary-light:#eff6ff}.btn{border:1px solid var(--pn-border);background:var(--pn-bg);cursor:pointer;color:var(--pn-text);border-radius:6px;justify-content:center;align-items:center;padding:3px 7px;font-size:13px;line-height:1.2;transition:background .12s,border-color .12s,color .12s;display:inline-flex}.btn:hover:not(:disabled){background:var(--pn-bg-hover)}.btn:disabled{opacity:.35;cursor:default}.btn.btn-active{background:var(--pn-primary-light);border-color:var(--pn-primary);color:var(--pn-primary)}.btn.btn-active:hover:not(:disabled){background:var(--pn-primary-light)}.btn.btn-ghost{color:var(--pn-text-muted);background:0 0;border-color:#0000;font-weight:500}.btn.btn-ghost:hover:not(:disabled){background:var(--pn-bg-hover);color:var(--pn-text)}.btn.btn-ghost.btn-active{background:var(--pn-primary-light);color:var(--pn-primary);border-color:#0000}.btn.btn-danger:hover:not(:disabled){color:var(--pn-danger);background:var(--pn-danger-light);border-color:#0000}.btn.btn-sm{padding:2px 4px;font-size:11px}.btn.btn-lg{padding:6px 14px;font-size:15px}.note-canvas-wrapper{background-color:var(--pn-bg);border:1px solid #ccc;flex-direction:row;width:100%;height:100%;display:flex;position:relative;overflow:hidden}.note-canvas{touch-action:none;flex:1;min-width:0;height:100%;position:relative}.note-canvas.cursor-grab{cursor:grab}.note-canvas.cursor-grabbing{cursor:grabbing}.sidebar-wrapper{z-index:1100;border-left:1px solid var(--pn-border);width:220px;height:100%;transition:transform .25s;position:absolute;top:0;right:0;overflow:hidden;transform:translate(0);box-shadow:-4px 0 16px #0000001f}.sidebar-wrapper.closed{box-shadow:none;transform:translate(100%)}.sidebar-backdrop{z-index:1050;background:#00000047;position:absolute;inset:0}.menu-sep{background:var(--pn-border);height:1px;margin:6px 8px}.menu-export{flex-direction:column;display:flex}.menu-export-row{align-items:center;display:flex}.menu-export-item{flex:1;padding-left:24px}.menu-eye{width:36px;height:36px;color:var(--pn-text-faint);cursor:pointer;background:0 0;border:none;border-radius:8px;flex:none;justify-content:center;align-items:center;margin-right:6px;display:inline-flex}.menu-eye:hover{background:var(--pn-bg-hover)}.menu-eye.active{color:var(--pn-primary)}.menu-eye svg{width:16px;height:16px}.bg-modes{gap:6px;display:flex}.bg-mode-btn{border:1px solid var(--pn-border);background:var(--pn-bg);width:40px;height:36px;color:var(--pn-text-muted);cursor:pointer;border-radius:8px;justify-content:center;align-items:center;display:inline-flex}.bg-mode-btn:hover{background:var(--pn-bg-hover);border-color:#d1d5db}.bg-mode-btn.active{border-color:var(--pn-primary);background:var(--pn-primary-bg);color:var(--pn-primary)}.bg-mode-btn svg{width:20px;height:20px}.bg-sub{border-left:2px solid var(--pn-border);flex-direction:column;gap:6px;margin:4px 0 4px 4px;padding-left:12px;display:flex}.note-tools{background:var(--pn-bg);box-shadow:var(--pn-shadow-lg);z-index:1000;border-radius:12px;flex-direction:column;gap:4px;max-width:calc(100vw - 16px);padding:10px 10px 6px;display:flex;position:fixed;bottom:12px;left:50%;transform:translate(-50%)}.nt-row{flex-wrap:nowrap;align-items:center;gap:6px;display:flex;overflow:hidden}.nt-tools-divider{background:var(--pn-border);flex-shrink:0;width:1px;height:28px;margin:0 4px}.nt-tab{cursor:pointer;color:var(--pn-text-muted);background:0 0;border:1px solid #0000;border-radius:6px;align-items:center;gap:6px;padding:4px 8px;font-size:13px;font-weight:500;line-height:1.2;transition:background .12s,color .12s,border-color .12s;display:inline-flex}.nt-tab:hover{background:var(--pn-bg-hover);color:var(--pn-text)}.nt-tab.active{background:var(--pn-primary-light);color:var(--pn-primary)}.nt-tab svg{width:14px;height:14px}.nt-tab-label{display:inline}.nt-chip{border:1px solid var(--pn-border);background:var(--pn-bg);cursor:pointer;width:34px;height:34px;color:var(--pn-text-muted);border-radius:8px;flex-shrink:0;justify-content:center;align-items:center;padding:0;transition:background .12s,border-color .12s,color .12s;display:inline-flex}.nt-chip:hover{background:var(--pn-bg-hover);border-color:#d1d5db}.nt-chip svg{width:14px;height:14px}.nt-handle{cursor:ns-resize;touch-action:none;justify-content:center;align-items:center;height:10px;display:flex;position:absolute;top:0;left:0;right:0}.nt-handle-bar{background:0 0;border-radius:2px;width:32px;height:3px;transition:background .12s}.note-tools:hover .nt-handle-bar{background:var(--pn-border)}.nt-handle:hover .nt-handle-bar{background:var(--pn-text-muted)}.nt-width-inline{flex-shrink:0;align-items:center;gap:4px;display:inline-flex}.nt-width-inline .width-selector{flex-direction:row;gap:4px}.nt-width-inline .slider-row{display:none}.nt-width-caret{width:22px}.nt-width-caret svg{width:12px;height:12px}.nt-width-disabled{opacity:.4;pointer-events:none}.nt-row-secondary{justify-content:center}.nt-overflow{flex-direction:column;align-items:center;gap:10px;display:flex}.nt-shape-split{flex-shrink:0;align-items:center;display:inline-flex}.note-tools .tool-button,.note-tools .icon-wrapper,.note-tools .nt-chip,.note-tools .nt-tab{box-sizing:border-box;height:36px}.note-tools .tool-button{padding:0}.nt-shape-split .icon-wrapper{border-right:none;border-radius:8px 0 0 8px}.nt-shape-caret{border-radius:0 8px 8px 0;width:22px}.nt-shape-caret svg{width:12px;height:12px}.nt-shape-split.active .icon-wrapper{border-color:var(--pn-primary);background:var(--pn-primary-bg)}.nt-shape-split.active .nt-shape-caret{border-color:var(--pn-primary);background:var(--pn-primary-bg);color:var(--pn-primary)}.nt-shape-list{flex-direction:column;gap:2px;min-width:230px;display:flex}.nt-shape-row{align-items:center;gap:6px;display:flex}.nt-shape-pick{cursor:pointer;color:var(--pn-text);text-align:left;background:0 0;border:1px solid #0000;border-radius:8px;flex:1;align-items:center;gap:10px;padding:8px 10px;font-size:14px;display:inline-flex}.nt-shape-pick svg{width:18px;height:18px;color:var(--pn-text-muted);fill:currentColor}.nt-shape-pick:hover{background:var(--pn-bg-hover)}.nt-shape-pick.active{border-color:var(--pn-primary);background:var(--pn-primary-bg);color:var(--pn-primary)}.nt-shape-pick.active svg{color:var(--pn-primary);fill:var(--pn-primary)}.nt-shape-modes{flex-shrink:0;gap:2px;display:inline-flex}.nt-shape-mode{border:1px solid var(--pn-border);background:var(--pn-bg);cursor:pointer;width:34px;height:34px;color:var(--pn-text-muted);border-radius:8px;justify-content:center;align-items:center;display:inline-flex}.nt-shape-mode svg{fill:currentColor;width:16px;height:16px}.nt-shape-mode:hover{background:var(--pn-bg-hover);border-color:#d1d5db}.nt-shape-mode.active{border-color:var(--pn-primary);background:var(--pn-primary-bg);color:var(--pn-primary)}.nt-shape-mode.active svg{color:var(--pn-primary);fill:var(--pn-primary)}.nt-chip:disabled{opacity:.4;cursor:default}.nt-chip:disabled:hover{background:var(--pn-bg);border-color:var(--pn-border)}.zoom-panel{flex-direction:column;gap:12px;display:flex}.zoom-slider-row{align-items:center;gap:8px;display:flex}.zoom-slider{flex:1;min-width:0}.zoom-value{text-align:right;font-variant-numeric:tabular-nums;min-width:44px;color:var(--pn-text);font-size:13px}.zoom-actions-row{gap:8px;display:flex}.zoom-actions-row .btn{flex:1;justify-content:center;align-items:center;gap:6px;display:inline-flex}@media (width<=600px){.nt-tab-label{display:none}.nt-tab svg{width:18px;height:18px}.nt-tab{padding:6px 10px}.note-tools .tool-button,.note-tools .icon-wrapper,.note-tools .nt-chip,.note-tools .nt-tab{height:40px}.note-tools .icon-wrapper,.note-tools .nt-chip{border-radius:10px;width:40px}.nt-shape-caret{width:26px}.nt-chip svg{width:16px;height:16px}.note-tools .tool-button svg{width:18px;height:18px}.nt-tools-divider{height:32px}.note-tools{bottom:8px}}.nh-root{z-index:1000;background:var(--pn-bg);border:1px solid var(--pn-border);-webkit-user-select:none;user-select:none;border-radius:10px;min-width:180px;font-size:13px;position:fixed;top:12px;right:12px;box-shadow:0 4px 16px #0000001a}.nh-root.closed{width:fit-content;min-width:0}.nh-header{justify-content:space-between;align-items:center;gap:6px;padding:8px 10px;display:flex}.nh-title{color:var(--pn-text);flex:1;font-weight:600}.nh-actions{gap:4px;display:flex}.nh-body{grid-template-rows:0fr;width:0;transition:grid-template-rows .25s;display:grid}.nh-body.open{grid-template-rows:1fr;width:auto}.nh-body-inner{max-height:400px;overflow:hidden auto}.nh-empty{color:var(--pn-text-faint);padding:10px 12px;font-style:italic}.nh-row{cursor:pointer;border-top:1px solid var(--pn-border-light);align-items:center;gap:8px;padding:6px 10px;transition:background .12s;display:flex}.nh-row:hover{background:var(--pn-bg-subtle)}.nh-row.selected{background:var(--pn-primary-light)}.nh-row.active{border-left:3px solid var(--pn-primary);padding-left:7px}.nh-color{border:1px solid #0000001a;border-radius:3px;flex-shrink:0;width:12px;height:12px}.nh-tool{color:var(--pn-text);flex:1}.nh-tool.hidden{opacity:.35;text-decoration:line-through}.nh-icon-btn{cursor:pointer;opacity:.5;background:0 0;border:none;border-radius:4px;padding:2px 4px;font-size:13px;transition:opacity .12s}.nh-icon-btn:hover{opacity:1}.nh-delete{cursor:pointer;opacity:.4;background:0 0;border:none;border-radius:4px;padding:2px 4px;font-size:13px;transition:opacity .12s,background .12s}.nh-delete:hover{opacity:1;background:var(--pn-danger-light)}.preview-wrapper{background:var(--pn-bg);width:100%;height:100%;position:relative;overflow:hidden}.preview-wrapper .preview-canvas{cursor:grab;touch-action:none;width:100%;height:100%;position:relative}.preview-wrapper .preview-canvas:active{cursor:grabbing}.sidebar{background:var(--pn-bg);-webkit-user-select:none;user-select:none;flex-direction:column;width:220px;height:100%;font-size:13px;display:flex;overflow:hidden}.sidebar-topbar-panel{justify-content:space-between;align-items:center;display:flex}.sidebar-topbar{border-bottom:1px solid var(--pn-border);flex-shrink:0;justify-content:space-between;align-items:center;padding:7px 8px 7px 12px;display:flex}.sidebar-title{color:var(--pn-text-faint);text-transform:uppercase;letter-spacing:.06em;font-size:12px;font-weight:600}.close-btn{border:1px solid var(--pn-border);background:var(--pn-bg);cursor:pointer;color:var(--pn-text-faint);border-radius:6px;padding:2px 8px;font-size:17px;line-height:1;transition:all .12s}.close-btn:hover{background:var(--pn-bg-hover);color:var(--pn-text)}.sec{border-bottom:1px solid var(--pn-border-light);flex-shrink:0}.sec-history{flex-direction:column;min-height:0;max-height:33vh;display:flex}.sec-zoom{border-top:1px solid var(--pn-border-light);flex-shrink:0;padding:6px 12px 8px}.sec-header{cursor:pointer;text-align:left;background:0 0;border:none;flex-shrink:0;justify-content:space-between;align-items:center;width:100%;padding:8px 12px;display:flex}.sec-header:hover{background:var(--pn-bg-subtle)}.sec-header-row{flex-shrink:0;justify-content:space-between;align-items:center;padding:4px 8px 4px 0;display:flex}.sec-header-btn{cursor:pointer;text-align:left;background:0 0;border:none;flex:1;justify-content:space-between;align-items:center;padding:4px 4px 4px 12px;display:flex}.sec-header-btn:hover{background:var(--pn-bg-subtle)}.sec-title{color:var(--pn-text);font-size:13px;font-weight:600}.chevron{color:var(--pn-text-faint);font-size:16px;line-height:1;transition:transform .2s}.chevron.open{transform:rotate(90deg)}.undo-redo{gap:4px;padding-right:4px;display:flex}.sec-row{align-items:center;gap:8px;padding:6px 12px 8px;display:flex}.sec-label{color:var(--pn-text-faint);text-transform:uppercase;letter-spacing:.04em;flex-shrink:0;min-width:36px;font-size:11px}.history-body{min-height:0;overflow-y:auto}.msg-empty{color:var(--pn-text-faint);padding:8px 12px;font-size:12px;font-style:italic}.h-row{cursor:pointer;border-top:1px solid var(--pn-border-light);align-items:center;gap:6px;padding:5px 10px;transition:background .12s;display:flex}.h-row:hover{background:var(--pn-bg-subtle)}.h-row.active{background:var(--pn-primary-light);border-left:3px solid var(--pn-primary);padding-left:7px}.h-color{border:1px solid #0000001a;border-radius:2px;flex-shrink:0;width:10px;height:10px}.h-label{color:var(--pn-text);text-overflow:ellipsis;white-space:nowrap;flex:1;font-size:12px;overflow:hidden}.h-label.hidden{opacity:.35;text-decoration:line-through}.nav-row{gap:4px}.nav-group .h-label{flex:0 auto}.nav-group .nav-toggle{margin-right:auto}.nav-toggle{opacity:.7;flex-shrink:0}.nav-group-icon{opacity:.8;flex-shrink:0;width:13px;height:13px}.nav-child{padding-left:28px}.nav-child .h-label{color:var(--pn-text-muted);font-size:11.5px}.nav-child.active{padding-left:25px}.nav-grip{cursor:grab;opacity:.45;touch-action:none;flex-shrink:0}.nav-grip:hover{opacity:.9}.nav-row.dragging{opacity:.5}.nav-drop-before{box-shadow:inset 0 2px 0 0 var(--pn-primary)}.nav-drop-after{box-shadow:inset 0 -2px 0 0 var(--pn-primary)}.btn svg,.btn-icon svg,.close-btn svg,.sec-header svg,.sec-header-btn svg,.nh-icon-btn svg,.nh-delete svg{vertical-align:-.125em;width:1em;height:1em}.btn-icon{cursor:pointer;opacity:.5;background:0 0;border:none;border-radius:4px;padding:2px 3px;font-size:12px;transition:opacity .12s}.btn-icon:hover{opacity:1}.btn-icon.del:hover{background:var(--pn-danger-light)}.canvas-body{flex-direction:column;gap:8px;padding:4px 12px 10px;display:flex}.canvas-field{align-items:center;gap:8px;display:flex}.title-input{border:1px solid var(--pn-border);color:var(--pn-text);background:var(--pn-bg);border-radius:6px;outline:none;flex:1;padding:4px 8px;font-size:12px}.title-input:focus{border-color:var(--pn-primary)}.bg-grid{flex:1;grid-template-columns:1fr 1fr;gap:4px;display:grid}.btn-opt{color:var(--pn-text-muted)}.opt-slider{accent-color:var(--pn-primary);flex:1;min-width:0}.opt-val{color:var(--pn-text-muted);text-align:right;min-width:34px;font-size:11px}.origin-row{flex:1;gap:4px;display:flex}.color-row{flex:1;align-items:center;gap:5px;display:flex}.color-swatch{cursor:pointer;border:2px solid #0000;border-radius:4px;flex-shrink:0;width:20px;height:20px;padding:0;transition:border-color .12s}.color-swatch.active{border-color:var(--pn-primary)}.color-pick{border:1px solid var(--pn-border);cursor:pointer;background:var(--pn-bg);border-radius:4px;width:28px;height:22px;padding:1px}.snap-toggle{flex:1}.linked-label{color:var(--pn-primary);opacity:.8;flex-shrink:0;font-size:10px}.linked-size{color:var(--pn-primary);opacity:.8;font-size:11px}.zoom-row{gap:4px;width:100%;display:flex}.zoom-row .btn{flex:1;padding:4px 2px;font-size:14px}.btn-toggle{color:var(--pn-text-muted);padding:3px 10px}.btn-toggle:hover:not(:disabled){border-color:#d1d5db}.tool-hint{z-index:200;color:#f3f4f6;white-space:nowrap;pointer-events:none;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);background:#1e1e1ed1;border-radius:8px;padding:6px 14px;font-size:12px;line-height:1.4;position:absolute;top:12px;left:50%;transform:translate(-50%);box-shadow:0 2px 8px #0000002e}.tool-selector{gap:4px;display:flex}.tool-button{cursor:pointer;background:0 0;border:none;padding:2px}.icon-wrapper{border:1px solid var(--pn-border);background:var(--pn-bg);border-radius:8px;justify-content:center;align-items:center;width:34px;height:34px;transition:all .15s;display:flex}.tool-button svg{color:#555;fill:currentColor;width:16px;height:16px;transition:all .15s}.tool-button:hover .icon-wrapper{background:var(--pn-bg-subtle);border-color:#d1d5db}.tool-button.active .icon-wrapper{border-color:var(--pn-primary);background:var(--pn-primary-bg)}.tool-button.active svg{color:var(--pn-primary);fill:var(--pn-primary)}.color-selector{flex-direction:column;gap:12px;display:flex}.color-top-row{justify-content:space-between;align-items:center;gap:16px;display:flex}.color-base-row{align-items:center;gap:10px;display:flex}.color-preview{border:1px solid var(--pn-border);border-radius:8px;flex-shrink:0;width:44px;height:44px}.color-preview.empty{background:repeating-linear-gradient(45deg,#0000000f 0 6px,#0000 6px 12px)}.color-gradient{border:1px solid var(--pn-border);cursor:crosshair;touch-action:none;-webkit-user-select:none;user-select:none;background:linear-gradient(#fff 0%,#fff0 50%,#0000 50%,#000 100%),linear-gradient(90deg,red,#ff0,#0f0,#0ff,#00f,#f0f,red);border-radius:8px;width:100%;height:120px;position:relative;overflow:hidden}.color-gradient.disabled{opacity:.2;pointer-events:none}.color-gradient-marker{pointer-events:none;border:2px solid #fff;border-radius:50%;width:14px;height:14px;position:absolute;transform:translate(-50%,-50%);box-shadow:0 0 0 1px #00000080}.color-button{cursor:pointer;border:2px solid #0000;border-radius:50%;width:22px;height:22px;transition:all .15s}.color-button:hover{transform:scale(1.1)}.color-button.active{border-color:#111}.color-button.disabled{opacity:.2;pointer-events:none}.color-button-custom.empty{opacity:.5;background:conic-gradient(red,#ff0,#0f0,#0ff,#00f,#f0f,red)}.layer-selector{background:var(--pn-bg);box-shadow:var(--pn-shadow-md);border-radius:8px;gap:8px;padding:6px;font-family:sans-serif;display:flex}.layer-btn{border:1px solid var(--pn-border);background:var(--pn-bg-subtle);cursor:pointer;border-radius:6px;padding:4px 12px;font-weight:700;transition:all .2s}.layer-btn:hover{background:var(--pn-bg-hover)}.layer-btn.active{border-color:var(--pn-primary);background:var(--pn-primary-light);color:var(--pn-primary)}.width-selector{flex-direction:column;gap:6px;display:flex}.width-gauge{align-items:stretch;height:30px;display:inline-flex}.wg-cell{border:1px solid var(--pn-border);background:var(--pn-bg);cursor:pointer;border-left-width:0;width:10px;padding:0;transition:background .12s,border-color .12s}.wg-cell:first-child{border-left-width:1px;border-radius:6px 0 0 6px}.wg-cell:last-child{border-radius:0 6px 6px 0}.wg-cell:hover{background:var(--pn-bg-hover)}.wg-cell.on{background:var(--pn-text);border-color:var(--pn-text)}.slider-row{align-items:center;gap:8px;display:flex}.slider{accent-color:var(--pn-primary);cursor:pointer;flex:1;height:4px}.number-input{border:1px solid var(--pn-border);text-align:center;width:44px;color:var(--pn-text);background:var(--pn-bg);border-radius:6px;padding:2px 4px;font-size:12px}.number-input:focus{border-color:var(--pn-primary);outline:none}.zoom-controls{z-index:10;flex-direction:column;gap:4px;display:flex;position:absolute;bottom:16px;right:16px}.pages-list{flex-direction:column;gap:2px;margin-bottom:4px;display:flex}.pages-list .h-row{cursor:pointer;border-left:3px solid #0000;border-radius:4px;align-items:center;gap:6px;padding:4px 6px;display:flex}.pages-list .h-row.active{background:var(--pn-primary-light);border-left-color:var(--pn-primary)}.pages-list .h-label{text-overflow:ellipsis;white-space:nowrap;min-width:0;color:var(--pn-text);flex:1;font-size:12px;overflow:hidden}.page-name-input{border:1px solid var(--pn-primary);background:var(--pn-bg);color:var(--pn-text);border-radius:3px;outline:none;flex:1;min-width:0;padding:1px 4px;font-size:12px}.expiry-warning{color:#92400e;background:#fffbeb;border:1px solid #fde68a;border-radius:4px;margin-bottom:4px;padding:6px 8px;font-size:11px}.expiry-actions{gap:4px;margin-top:6px;display:flex}.pn-pages-dialog{overscroll-behavior:contain;background:var(--pn-bg);width:90vw;max-width:90vw;height:90vh;max-height:90vh;color:var(--pn-text);border:none;border-radius:12px;padding:0;position:fixed;inset:5vh 5vw;overflow:hidden;box-shadow:0 20px 60px #0000004d}.pn-pages-dialog::backdrop{background:#00000080}.pn-pages-container{flex-direction:column;height:100%;display:flex}.pn-pages-header{border-bottom:1px solid var(--pn-border);flex-shrink:0;justify-content:space-between;align-items:center;padding:10px 16px;display:flex}.pn-pages-title{color:var(--pn-text);font-size:15px;font-weight:600}.pn-pages-body{flex:1;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));align-content:start;gap:16px;padding:16px;display:grid;overflow-y:auto}.pn-page-card{border:1px solid var(--pn-border);cursor:pointer;background:var(--pn-bg);border-radius:8px;transition:box-shadow .15s,border-color .15s;overflow:hidden;box-shadow:0 2px 6px #00000014}.pn-page-card:hover{border-color:var(--pn-primary);box-shadow:0 4px 14px #00000024}.pn-page-card.active{border-color:var(--pn-primary);box-shadow:0 0 0 2px #3b82f640,0 2px 6px #00000014}.pn-card-header{background:var(--pn-bg-subtle);border-bottom:1px solid var(--pn-border-light);justify-content:space-between;align-items:center;padding:3px 8px;display:flex}.pn-card-num{color:var(--pn-text-muted);font-size:11px;font-weight:600}.pn-card-actions{gap:2px;min-height:18px;display:flex}.pn-card-preview{aspect-ratio:4/3;background:#f8f9fa;overflow:hidden}.pn-card-preview canvas{width:100%;height:100%;display:block}.pn-card-name{color:var(--pn-text);text-overflow:ellipsis;white-space:nowrap;border-top:1px solid var(--pn-border-light);padding:4px 8px;font-size:12px;overflow:hidden}.pn-wd-dialog{background:var(--pn-bg);border:none;border-radius:12px;width:92vw;max-width:min(92vw,960px);padding:0;box-shadow:0 8px 32px #0000002e}.pn-wd-dialog::backdrop{background:#00000059}.pn-wd-container{flex-direction:column;height:min(85vh,680px);display:flex}.pn-wd-body{flex:1;display:flex;overflow:hidden}.pn-wd-footer{border-top:1px solid var(--pn-border);justify-content:space-between;align-items:center;gap:8px;padding:10px 16px;display:flex}.pn-wd-hint{color:var(--pn-text-muted);font-size:11px}.pn-wd-footer-actions{gap:8px;display:flex}.pn-ted-dialog{background:var(--pn-bg);border:none;border-radius:12px;width:92vw;max-width:min(92vw,900px);padding:0;box-shadow:0 8px 32px #0000002e}.pn-ted-dialog::backdrop{background:#00000059}.pn-ted-container{flex-direction:column;height:min(80vh,600px);display:flex}.pn-ted-body{flex:1;gap:0;display:flex;overflow:hidden}.pn-ted-input{border-right:1px solid var(--pn-border);flex-direction:column;flex:1;display:flex}.pn-ted-textarea{resize:none;color:var(--pn-text);background:var(--pn-bg-subtle);border:none;border-radius:12px 0 0;outline:none;flex:1;padding:16px;font-family:Courier New,monospace;font-size:14px;line-height:1.6}.pn-ted-preview{background:var(--pn-bg);border-radius:0 12px 0 0;flex-shrink:0;padding:16px;overflow-y:auto}.pn-ted-preview-inner{min-height:2em;font-family:serif;line-height:1.6}.pn-ted-para{margin:0 0 4px;padding:0}.pn-ted-math{vertical-align:middle;align-items:baseline;display:inline-flex}.pn-ted-display{text-align:center;margin:8px 0}.pn-ted-display svg,.pn-ted-math svg{vertical-align:middle}.pn-ted-footer{border-top:1px solid var(--pn-border);justify-content:space-between;align-items:center;gap:8px;padding:10px 16px;display:flex}.pn-ted-hint{color:var(--pn-text-muted);font-size:11px}.pn-ted-footer-actions{gap:8px;display:flex}.pn-ted-mode-btn{z-index:1;align-items:center;gap:4px;padding:4px 8px;font-size:12px;display:flex;position:absolute;top:8px;right:8px}.pn-ted-canvas{max-width:100%;display:block}.pn-ted-preview-inner svg{max-width:100%;overflow:hidden}@media (width<=600px){.pn-ted-body{flex-direction:column}.pn-ted-input{border-right:none;border-bottom:1px solid var(--pn-border);flex:0 0 40%}.pn-ted-preview{border-radius:0;flex:1;width:auto!important}}.pn-gp-panel{flex-direction:column;flex:1;gap:4px;padding:12px 16px;display:flex;overflow-y:auto}.pn-gp-section{border-bottom:1px solid var(--pn-border-light);margin-bottom:4px;padding-bottom:10px}.pn-gp-title{text-transform:uppercase;letter-spacing:.05em;color:var(--pn-text-muted);margin:0 0 6px;font-size:11px;font-weight:600}.pn-gp-row{flex-wrap:wrap;align-items:center;gap:6px;display:flex}.pn-gp-disabled{opacity:.4;pointer-events:none}.pn-gp-label{color:var(--pn-text);white-space:nowrap;font-size:12px}.pn-gp-input{border:1px solid var(--pn-border);background:var(--pn-bg-subtle);width:64px;color:var(--pn-text);border-radius:6px;padding:3px 6px;font-size:12px}.pn-gp-checkbox-row{cursor:pointer;align-items:center;gap:6px;margin-bottom:6px;font-size:12px;display:flex}.pn-gp-label-mode{flex-wrap:wrap;align-items:center;gap:10px;margin-top:4px;display:flex}.pn-gp-radio-row{cursor:pointer;align-items:center;gap:4px;font-size:12px;display:flex}.pn-gp-functions-header{justify-content:space-between;align-items:center;margin-bottom:6px;display:flex}.pn-gp-add-btn{align-items:center;gap:4px;padding:3px 8px;font-size:11px;display:flex}.pn-gp-fn-row{align-items:center;gap:6px;margin-bottom:6px;display:flex}.pn-gp-fn-label{color:var(--pn-text-muted);white-space:nowrap;font-size:12px}.pn-gp-fn-expr{flex:1;width:auto}.pn-gp-color{cursor:pointer;background:0 0;border:none;border-radius:4px;width:28px;height:28px;padding:0}.pn-gp-remove-btn{padding:3px 6px}.pn-gp-empty{color:var(--pn-text-muted);font-size:12px;font-style:italic}.pn-ged-left{border-right:1px solid var(--pn-border);flex-direction:column;flex-shrink:0;width:260px;display:flex;overflow-y:auto}.pn-ged-right{flex-direction:column;flex:1;gap:8px;padding:12px 16px;display:flex;overflow:hidden}.pn-ged-preview-label{text-transform:uppercase;letter-spacing:.05em;color:var(--pn-text-muted);font-size:11px;font-weight:600}.pn-ged-preview-wrap{flex:1;justify-content:flex-start;align-items:flex-start;display:flex;overflow:auto}.pn-ged-canvas{border:1px solid var(--pn-border);border-radius:4px;max-width:100%;max-height:100%;display:block}@media (width<=600px){.pn-ged-left{border-right:none;border-bottom:1px solid var(--pn-border);width:100%;max-height:40%}.pn-wd-body{flex-direction:column}}.pointer-status{z-index:50;background:var(--pn-bg);border:1px solid var(--pn-border);box-shadow:var(--pn-shadow-sm);-webkit-user-select:none;user-select:none;border-radius:8px;align-items:center;gap:6px;padding:4px;font-size:13px;display:flex;position:fixed;top:12px;left:12px}.pointer-status-indicator{width:32px;height:32px;color:var(--pn-text-faint);background:var(--pn-bg-subtle);border-radius:6px;justify-content:center;align-items:center;gap:4px;transition:color .12s,background .12s;display:flex}.pointer-status-indicator svg{width:18px;height:18px}.pointer-status-indicator.is-active{color:var(--pn-text);background:var(--pn-bg-hover)}.pointer-status-indicator.kind-pen.is-active{color:var(--pn-primary)}.pointer-status-indicator.kind-finger.is-active{color:#10b981}.pointer-status-indicator.kind-palm.is-active{color:var(--pn-danger)}.pointer-status-count{font-size:11px;font-weight:600;line-height:1}.pointer-status-total{color:var(--pn-text-faint);margin-left:1px;font-size:10px;font-weight:500;line-height:1}.pointer-status-dims{color:var(--pn-text-muted);text-align:center;white-space:nowrap;min-width:56px;padding:0 4px;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:11px}.pointer-status-toggle{border:1px solid var(--pn-border);background:var(--pn-bg);width:32px;height:32px;color:var(--pn-text-faint);cursor:pointer;border-radius:6px;justify-content:center;align-items:center;transition:color .12s,background .12s,border-color .12s;display:flex}.pointer-status-toggle svg{width:16px;height:16px}.pointer-status-toggle:hover{background:var(--pn-bg-hover)}.pointer-status-toggle.is-on{color:var(--pn-primary);border-color:var(--pn-primary);background:var(--pn-primary-bg)}.pn-popover-root{z-index:1100;pointer-events:none;justify-content:center;align-items:flex-end;display:flex;position:fixed;inset:0}.pn-popover-backdrop{pointer-events:auto;background:#00000059;position:absolute;inset:0}.pn-popover-sheet{pointer-events:auto;background:var(--pn-bg);border:1px solid var(--pn-border);width:100%;min-width:280px;max-width:min(92vw,480px);color:var(--pn-text);border-radius:14px 14px 0 0;margin-bottom:0;padding:8px 16px 16px;position:relative;box-shadow:0 -8px 24px #0000002e}.pn-popover-handle{background:var(--pn-border);border-radius:999px;width:40px;height:4px;margin:4px auto 8px}.pn-popover-title{text-transform:uppercase;letter-spacing:.05em;color:var(--pn-text-faint);margin-bottom:10px;font-size:12px;font-weight:600}.pn-popover-body{flex-direction:column;gap:8px;display:flex}.pn-menu-item{width:100%;color:var(--pn-text);text-align:left;cursor:pointer;background:0 0;border:none;border-radius:8px;align-items:center;gap:10px;padding:10px 12px;font-size:14px;transition:background .12s;display:flex}.pn-menu-item:hover:not(:disabled){background:var(--pn-bg-hover)}.pn-menu-item:disabled{opacity:.45;cursor:default}.pn-menu-item svg{flex-shrink:0;width:16px;height:16px}.pn-menu-item em{color:var(--pn-text-faint);font-style:italic}@media (width<=600px){.pn-popover-sheet{max-width:100%;padding-bottom:calc(16px + env(safe-area-inset-bottom,0px));border-radius:14px 14px 0 0}}.pn-pop-enter-active,.pn-pop-leave-active{transition:opacity .18s}.pn-pop-enter-active .pn-popover-sheet,.pn-pop-leave-active .pn-popover-sheet{transition:transform .22s cubic-bezier(.2,.8,.2,1)}.pn-pop-enter-from,.pn-pop-leave-to{opacity:0}.pn-pop-enter-from .pn-popover-sheet,.pn-pop-leave-to .pn-popover-sheet{transform:translateY(24px)}.selection-toolbar{z-index:50;background:var(--pn-bg);border:1px solid var(--pn-border);pointer-events:auto;border-radius:8px;gap:4px;padding:4px;display:flex;position:absolute;transform:translate(-50%,calc(-100% - 8px));box-shadow:0 2px 8px #0000002e}.selection-toolbar-sep{background:var(--pn-border);align-self:stretch;width:1px;margin:2px}.selection-toolbar .btn.btn-active{background:var(--pn-primary);color:#fff}.pn-sel-header{justify-content:space-between;align-items:center;gap:12px;padding:2px 2px 8px;display:flex}.pn-sel-title{color:var(--pn-text);font-weight:600}.pn-sel-header-actions{gap:4px;display:flex}.pn-sel-arrange{justify-content:space-between;align-items:center;gap:12px;padding:6px 2px;display:flex}.pn-sel-arrange-row{gap:6px;display:flex}.pn-sel-arrange-row .btn-icon{border-radius:8px;padding:6px;font-size:20px}.pn-sel-arrange-row .btn-icon:hover{background:var(--pn-bg-hover)}.pn-sel-sep{background:var(--pn-border);height:1px;margin:8px 0}.pn-sel-props{flex-direction:column;gap:4px;display:flex}.color-ribbon{align-items:stretch;gap:3px;height:18px;display:flex}.cr-seg{cursor:pointer;border:none;border-radius:4px;flex:1;min-width:0;padding:0;transition:transform .12s,box-shadow .12s}.cr-seg.active{z-index:1;position:relative;transform:translateY(-22%);box-shadow:0 2px 5px #00000047}.cr-custom-empty{background:conic-gradient(#ef4444,#eab308,#22c55e,#3b82f6,#a855f7,#ef4444)}.cr-more{border:1px solid var(--pn-border);background:var(--pn-bg);cursor:pointer;min-width:0;color:var(--pn-text-muted);border-radius:4px;flex:.5;padding:0;font-size:13px;line-height:1}.cr-more:hover{background:var(--pn-bg-hover)}.color-palette{flex-direction:column;gap:12px;display:flex}.cp-recents{flex-wrap:wrap;gap:6px;display:flex}.cp-recent{cursor:pointer;border:1px solid #00000026;border-radius:6px;width:24px;height:24px;padding:0}.tool-settings{border-bottom:1px solid var(--pn-border);flex-direction:column;gap:10px;margin-bottom:2px;padding-bottom:8px;display:flex}.ts-section{flex-direction:column;gap:6px;display:flex}.ts-label{color:var(--pn-text-muted);font-size:12px;font-weight:600}.to-row{flex-wrap:wrap;gap:6px;display:flex}.to-switch-row{align-items:center;gap:8px;display:flex}.to-sub{border-left:2px solid var(--pn-border);flex-direction:column;gap:6px;padding-left:12px;display:flex}.to-opacity-row{align-items:center;gap:8px;display:flex}.to-slider{accent-color:var(--pn-primary);flex:1}.to-opacity-val{color:var(--pn-text-muted);text-align:right;min-width:30px;font-size:11px}.to-switch{background:var(--pn-border);cursor:pointer;border:none;border-radius:999px;flex:none;width:30px;height:16px;padding:0;transition:background .15s;position:relative}.to-switch:after{content:"";background:#fff;border-radius:50%;width:12px;height:12px;transition:transform .15s;position:absolute;top:2px;left:2px;box-shadow:0 1px 2px #00000040}.to-switch.on{background:var(--pn-primary)}.to-switch.on:after{transform:translate(14px)}