.playground-page.svelte-rqn88j{height:100vh;overflow:hidden;cursor:grab;-webkit-user-select:none;user-select:none;position:relative}.playground-page.panning.svelte-rqn88j{cursor:grabbing}.canvas.svelte-rqn88j{position:absolute;top:0;left:0;width:100%;height:100%;transform-origin:center center;transition:transform .1s ease-out}.canvas-grid.svelte-rqn88j{position:fixed;inset:0;background-image:radial-gradient(circle,#ddd 1px,transparent 1px);background-size:24px 24px;pointer-events:none;z-index:0}.dark .canvas-grid.svelte-rqn88j{background-image:radial-gradient(circle,#333 1px,transparent 1px)}.canvas-heading.svelte-rqn88j{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);text-align:center;z-index:1;pointer-events:none;display:flex;flex-direction:column;align-items:center;padding:40px}.playground-title.svelte-rqn88j{font-size:1.6rem;font-weight:700;letter-spacing:-.02em;margin:0 0 8px}.playground-desc.svelte-rqn88j{font-size:.85rem;color:#777;margin:0;max-width:380px}.dark .playground-desc.svelte-rqn88j{color:#888}.shuffle-btn.svelte-rqn88j{pointer-events:auto;margin-top:16px;display:inline-flex;align-items:center;gap:6px;padding:8px 18px;border-radius:20px;border:1px solid #ddd;background:#fff;color:#555;font-size:.75rem;font-weight:500;font-family:inherit;cursor:pointer;transition:background .2s,transform .2s}.dark .shuffle-btn.svelte-rqn88j{background:#2a2a2a;border-color:#444;color:#aaa}.shuffle-btn.svelte-rqn88j:hover{background:#f0f0f0;border-color:#bbb;transform:scale(1.05)}.dark .shuffle-btn.svelte-rqn88j:hover{background:#333;border-color:#555}.shuffle-btn.svelte-rqn88j:active{transform:scale(.95)}.project-card.svelte-rqn88j{position:absolute;border-radius:12px;overflow:hidden;box-shadow:0 4px 12px #00000026;cursor:grab;background:#fff;transition:top .5s cubic-bezier(.22,1,.36,1),left .5s cubic-bezier(.22,1,.36,1),transform .5s cubic-bezier(.22,1,.36,1),box-shadow .2s,scale .25s cubic-bezier(.22,1,.36,1)}.project-card.svelte-rqn88j:hover{scale:1.06;box-shadow:0 8px 24px #0003}.dark .project-card.svelte-rqn88j:hover{box-shadow:0 8px 24px #00000080}.dark .project-card.svelte-rqn88j{background:#222;box-shadow:0 4px 12px #0006}.project-card.is-dragging.svelte-rqn88j{cursor:grabbing;box-shadow:0 16px 40px #0000004d;opacity:.9;transition:box-shadow .2s}.dark .project-card.is-dragging.svelte-rqn88j{box-shadow:0 16px 40px #0009}.project-card.svelte-rqn88j img:where(.svelte-rqn88j){width:100%;height:100%;object-fit:cover;display:block;pointer-events:none}.card-overlay.svelte-rqn88j{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:space-between;padding:10px;opacity:0;transition:opacity .2s;background:linear-gradient(to bottom,rgba(0,0,0,.3) 0%,transparent 40%,rgba(0,0,0,.6) 100%)}.project-card.svelte-rqn88j:hover .card-overlay:where(.svelte-rqn88j){opacity:1}.project-card.is-dragging.svelte-rqn88j .card-overlay:where(.svelte-rqn88j){opacity:0}.card-top.svelte-rqn88j{display:flex;justify-content:flex-end}.card-title.svelte-rqn88j{font-size:.95rem;font-weight:600;color:#fff;line-height:1.3;transition:font-size .3s ease}.project-card.svelte-rqn88j:hover .card-title:where(.svelte-rqn88j){font-size:1.1rem}.card-arrow.svelte-rqn88j{width:32px;height:32px;border-radius:50%;background:#00000080;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);display:flex;align-items:center;justify-content:center;color:#fff;flex-shrink:0;transition:background .2s,transform .2s;text-decoration:none}.card-arrow.svelte-rqn88j:hover{background:#000000b3;transform:scale(1.1)}.reset-btn.svelte-rqn88j{position:fixed;bottom:22px;right:20px;z-index:101;width:40px;height:40px;border-radius:50%;border:1px solid #e0e0e0;background:#ffffffd9;backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);color:#888;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:color .15s,background .15s,transform .2s;font-family:inherit;padding:0}.dark .reset-btn.svelte-rqn88j{background:#1e1e1ed9;border-color:#444;color:#777}.reset-btn.svelte-rqn88j:hover{color:#111;background:#f0f0f0;transform:scale(1.15)}.dark .reset-btn.svelte-rqn88j:hover{color:#eee;background:#3a3a3a}.reset-btn.svelte-rqn88j:active{transform:scale(.95)}
