:root{--bg:#d9d9d6;--bar:#f3f3f1;--ink:#202020;--accent:#2f4a7a;--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light}*{box-sizing:border-box}html,body{height:100%;color:var(--ink);background:var(--bg);margin:0;font:14px/1.3 system-ui,-apple-system,Segoe UI,sans-serif;overflow:hidden}body{flex-direction:column;display:flex}#toolbar{background:var(--bar);-webkit-user-select:none;user-select:none;touch-action:manipulation;border-bottom:1px solid #bbb;flex-wrap:wrap;align-items:center;gap:6px 14px;padding:6px 10px;display:flex}.group{align-items:center;gap:4px;display:flex}body:not([data-storage=server]) .server-only,body:not([data-storage=local]) .local-only{display:none}button{font:inherit;color:var(--ink);cursor:pointer;background:#fff;border:1px solid #aaa;border-radius:6px;min-width:36px;padding:6px 10px}button:hover{background:#eee}select{font:inherit;background:#fff;border:1px solid #aaa;border-radius:6px;max-width:260px;padding:5px 6px}button:disabled{opacity:.4;cursor:default}button.tool.active{background:var(--accent);color:#fff;border-color:var(--accent)}#status{color:#555;white-space:nowrap;margin-left:auto;font-size:12px}#src-link{color:#555;border-bottom:1px dotted #999;font-size:12px;text-decoration:none}#src-link:hover{color:var(--accent);border-bottom-color:var(--accent)}#pages{touch-action:pan-x pan-y pinch-zoom;-webkit-overflow-scrolling:touch;outline:none;flex:1;padding:16px 0 60vh;overflow:auto}#pages.pen-active{touch-action:none}.page{background:#fff;margin:0 auto 16px;position:relative;box-shadow:0 1px 4px #00000059}.page canvas{display:block;position:absolute;top:0;left:0}.page canvas.ink{touch-action:inherit}.page.current{outline:2px solid #2f4a7a66}#pages.tool-pen .page canvas.ink{cursor:crosshair}#pages.tool-eraser .page canvas.ink{cursor:cell}#pages.tool-select .page canvas.ink{cursor:crosshair}.empty{text-align:center;color:#444;max-width:420px;margin:20vh auto}.empty p{margin:8px 0}.empty .error{color:#b00020}