@import "https://fonts.googleapis.com/css2?family=IBM+Plex+Mono:wght@400;500&family=IBM+Plex+Sans:wght@300;400;500&display=swap";*,:before,:after{box-sizing:border-box;margin:0;padding:0}:root{--bg:#111113;--surface:#1a1a1f;--surface-2:#25252d;--border:#2e2e38;--border-light:#3d3d4a;--text:#e8e8f0;--text-muted:#8888a0;--accent:#6c8fff;--accent-dim:#2a3a6e;--danger:#ff6b6b;--toolbar-h:52px;--radius:6px;--font-ui:"IBM Plex Sans", sans-serif;--font-mono:"IBM Plex Mono", monospace}html,body{background:var(--bg);height:100%;color:var(--text);font-family:var(--font-ui);-webkit-font-smoothing:antialiased;overflow:hidden}.toolbar{block-size:var(--toolbar-h);background:var(--surface);border-block-end:1px solid var(--border);z-index:100;-webkit-user-select:none;user-select:none;align-items:center;gap:8px;padding-inline:16px;display:flex;position:fixed;inset-block-start:0;inset-inline:0}.toolbar__title{color:var(--text-muted);letter-spacing:.04em;text-transform:uppercase;white-space:nowrap;text-overflow:ellipsis;max-inline-size:340px;margin-inline-end:auto;font-size:13px;font-weight:500;overflow:hidden}.toolbar__title span{color:var(--text)}.toolbar__zoom{font-family:var(--font-mono);color:var(--text-muted);text-align:end;min-inline-size:52px;font-size:12px}.separator{background:var(--border);flex-shrink:0;block-size:20px;inline-size:1px}.btn{border-radius:var(--radius);border:1px solid var(--border);color:var(--text-muted);font-family:var(--font-ui);cursor:pointer;white-space:nowrap;background:0 0;align-items:center;gap:6px;padding:5px 10px;font-size:12px;font-weight:400;line-height:1;transition:background .1s,color .1s,border-color .1s;display:inline-flex}.btn svg{pointer-events:none}.btn:hover{background:var(--surface-2);border-color:var(--border-light);color:var(--text)}.btn:active{background:var(--accent-dim);border-color:var(--accent);color:var(--text)}.btn--primary{background:var(--accent-dim);border-color:var(--accent);color:var(--accent)}.btn--primary:hover{background:var(--accent);color:#fff}.btn svg{flex-shrink:0}.canvas{background:radial-gradient(ellipse at 30% 20%, #6c8fff0a 0%, transparent 60%), var(--bg);background-image:radial-gradient(ellipse at 30% 20%, #6c8fff0a 0%, transparent 60%), radial-gradient(circle, var(--border) 1px, transparent 1px);background-size:100% 100%,28px 28px;position:fixed;inset-block-start:var(--toolbar-h);inset-block-end:0;inset-inline:0;overflow:hidden}.canvas:focus{outline:none}.canvas[data-state=grab]{cursor:grab}.canvas[data-state=panning]{cursor:grabbing}.canvas[data-state=default]{cursor:default}.stage{transform-origin:0 0;position:absolute;inset-block-start:0;inset-inline-start:0}.stage img{image-rendering:auto;border-radius:2px;max-inline-size:none;display:block;box-shadow:0 0 0 1px #ffffff0f,0 8px 40px #000000b3,0 2px 8px #00000080}.drop-overlay{pointer-events:none;opacity:1;flex-direction:column;justify-content:center;align-items:center;gap:20px;transition:opacity .2s;display:flex;position:fixed;inset-block-start:var(--toolbar-h);inset-block-end:0;inset-inline:0}.drop-overlay.hidden{opacity:0}.drop-overlay__ring{border:1.5px dashed var(--border-light);border-radius:50%;justify-content:center;align-items:center;block-size:120px;inline-size:120px;display:flex}.drop-overlay__ring svg{color:var(--text-muted)}.drop-overlay__label{color:var(--text-muted);text-align:center;font-size:14px;line-height:1.6}.drop-overlay__label strong{color:var(--text);margin-block-end:4px;font-size:16px;font-weight:500;display:block}.drop-overlay__label kbd{font-family:var(--font-mono);color:var(--text);background:var(--surface-2);border:1px solid var(--border-light);border-radius:4px;padding:2px 6px;font-size:11px;display:inline-block}.canvas.drag-active .drop-overlay__ring{border-color:var(--accent);border-style:solid}.canvas.drag-active .drop-overlay__ring svg{color:var(--accent)}.shortcuts{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);color:var(--text-muted);z-index:100;pointer-events:none;padding:14px 16px;font-size:11px;line-height:2;position:fixed;inset-block-end:20px;inset-inline-end:20px}.shortcuts__row{justify-content:space-between;align-items:center;gap:8px;display:flex}.shortcuts__label{text-align:end}.shortcuts kbd{font-family:var(--font-mono);color:var(--text);background:var(--surface-2);border:1px solid var(--border-light);white-space:nowrap;border-radius:4px;padding:1px 5px;font-size:10px}.visually-hidden{clip-path:inset(50%);white-space:nowrap;block-size:1px;inline-size:1px;position:absolute;overflow:hidden}
