.gif-tools.svelte-x4brqi{display:flex;align-items:center;gap:8px;flex-wrap:wrap;padding:12px;border-bottom:1px solid var(--ui-line)}.gif-history.svelte-x4brqi{display:flex;gap:6px;margin-left:auto}.gif-color.svelte-x4brqi input:where(.svelte-x4brqi){width:44px;height:44px;padding:4px;background:#fff;border:1px solid var(--ui-line);border-radius:8px}.gif-layout.svelte-x4brqi{display:grid;grid-template-columns:minmax(0,1fr) 240px}.gif-canvas-area.svelte-x4brqi{height:min(55dvh,570px);background:#eef0f4;padding:20px}.gif-canvas-wrap.svelte-x4brqi{position:relative;flex-shrink:0;margin:auto;background-color:#fff;background-image:conic-gradient(#e5e7eb 25%,transparent 0 50%,#e5e7eb 0 75%,transparent 0);background-size:16px 16px}.drawing-canvas.svelte-x4brqi{position:relative;z-index:2;display:block;max-width:none;image-rendering:pixelated;touch-action:none;cursor:crosshair}.onion-canvas.svelte-x4brqi{position:absolute;inset:0;opacity:.25;image-rendering:pixelated;pointer-events:none}.gif-grid.svelte-x4brqi{position:absolute;inset:0;pointer-events:none;z-index:3;background-image:linear-gradient(to right,#69738340 1px,transparent 1px),linear-gradient(to bottom,#69738340 1px,transparent 1px)}.gif-inspector.svelte-x4brqi{padding:18px;border-left:1px solid var(--ui-line)}.gif-inspector.svelte-x4brqi summary:where(.svelte-x4brqi){font-size:16px;font-weight:650;padding:12px 0;min-height:44px}.gif-preview.svelte-x4brqi{aspect-ratio:1;background:#eef0f4;border:1px solid var(--ui-line);border-radius:8px}.gif-preview.svelte-x4brqi canvas:where(.svelte-x4brqi){width:100%;height:100%;image-rendering:pixelated}.gif-timeline.svelte-x4brqi{border-top:1px solid var(--ui-line);padding:14px}.timeline-heading.svelte-x4brqi{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap}.timeline-heading.svelte-x4brqi h2:where(.svelte-x4brqi){font-size:16px;font-weight:650}.gif-frames.svelte-x4brqi{display:flex;gap:12px;overflow-x:auto;padding:14px 2px 2px}.gif-frames.svelte-x4brqi button:where(.svelte-x4brqi){width:76px;flex-shrink:0;padding:4px;border:2px solid var(--ui-line);border-radius:9px}.gif-frames.svelte-x4brqi button[aria-pressed=true]:where(.svelte-x4brqi){border-color:var(--ui-accent);background:var(--ui-tint)}.gif-frames.svelte-x4brqi canvas:where(.svelte-x4brqi){width:64px;height:64px;image-rendering:pixelated;background:#eef0f4}.gif-frames.svelte-x4brqi span:where(.svelte-x4brqi){font-size:14px}.gif-palette.svelte-x4brqi{display:grid;grid-template-columns:repeat(5,1fr);gap:12px;margin-top:18px}@media (max-width: 1023px){.gif-layout.svelte-x4brqi{grid-template-columns:minmax(0,1fr)}.gif-inspector.svelte-x4brqi{border-left:0;border-top:1px solid var(--ui-line);padding:0 16px}.gif-preview.svelte-x4brqi{max-width:180px}.gif-canvas-area.svelte-x4brqi{height:44dvh;min-height:250px}.gif-tools.svelte-x4brqi{gap:6px;padding:8px}.gif-tools.svelte-x4brqi>.ui-button:where(.svelte-x4brqi){padding:8px;flex-direction:column;gap:4px;font-size:14px}.gif-history.svelte-x4brqi{margin-left:auto}.timeline-heading.svelte-x4brqi>.wb-row:where(.svelte-x4brqi){gap:6px}.timeline-heading.svelte-x4brqi button:where(.svelte-x4brqi){padding:8px 10px}.gif-inspector.svelte-x4brqi .wb-controls:where(.svelte-x4brqi){border:0}.gif-frames.svelte-x4brqi button:where(.svelte-x4brqi){width:64px}.gif-frames.svelte-x4brqi canvas:where(.svelte-x4brqi){width:52px;height:52px}}