.ob-force-canvas{background:var(--card);border-radius:inherit;width:100%;height:100%;min-height:180px;position:relative;overflow:hidden}.ob-force-host{cursor:grab;touch-action:none;position:absolute;inset:0}.ob-force-host canvas{max-width:100%;display:block}.ob-force-controls{z-index:2;gap:6px;display:flex;position:absolute;top:12px;left:12px}.ob-force-controls button{border:1px solid var(--border);background:color-mix(in srgb,var(--popover) 91%,transparent);color:var(--foreground-secondary);cursor:pointer;border-radius:7px;padding:6px 10px;font-size:11px}.ob-force-controls button:hover,.ob-force-controls button:focus-visible{background:var(--accent);outline:2px solid var(--ring);outline-offset:2px}.ob-force-hint{background:linear-gradient(transparent,color-mix(in srgb,var(--background) 95%,transparent));color:var(--foreground-secondary);text-align:center;pointer-events:none;text-overflow:ellipsis;white-space:nowrap;padding:9px 12px;font-size:11px;position:absolute;bottom:0;left:0;right:0;overflow:hidden}.ob-force-status{color:var(--foreground-secondary);pointer-events:none;place-items:center;font-size:12px;display:grid;position:absolute;inset:0}.ob-force-fallback{background:var(--card);color:var(--foreground-secondary);padding:20px;font-size:12px;position:absolute;inset:0;overflow:auto}.ob-force-fallback>div{flex-wrap:wrap;gap:8px;display:flex}.ob-force-fallback button{border:1px solid var(--border);color:var(--foreground-secondary);background:var(--secondary);cursor:pointer;border-radius:6px;padding:8px}.ob-force-canvas.is-compact .ob-force-controls{top:8px;left:8px}.ob-force-canvas.is-compact .ob-force-controls button{padding:4px 7px;font-size:10px}.ob-force-canvas.is-compact .ob-force-hint{font-size:9px}