.dk-demo-shell.svelte-12bz7ax{place-items:center;min-height:560px;padding:clamp(1rem,4vw,2.5rem);display:grid}.constraint-lab.svelte-12bz7ax{--lab-text:#f8fafc;--lab-bg:linear-gradient(135deg, #020617f0, #0f172ae6), radial-gradient(circle at 18% 18%, color-mix(in oklab, var(--color-brand-400,#34d399) 28%, transparent), transparent 22rem);--lab-border:color-mix(in oklab, var(--color-brand-300,#6ee7b7) 34%, #334155);--lab-shadow:0 24px 80px #00000047;--lab-muted:#e2e8f0ad;--lab-accent:var(--color-brand-300,#6ee7b7);--lab-chip-bg:#0f172a9e;--lab-chip-border:#94a3b847;--stage-border:#94a3b833;--stage-grid:#94a3b80f;--constraint-border:#e2e8f052;--constraint-bg:linear-gradient(135deg, #0f172ab8, #1e293b75), radial-gradient(circle at center, color-mix(in oklab, var(--color-brand-400,#34d399) 16%, transparent), transparent 70%);--axis-label:#e2e8f06b;--drag-card-text:#042f2e;--drag-card-frame:#042f2e2e;--drag-card-corner:#042f2e24;--drag-card-bg:linear-gradient(135deg, #ffffff29, transparent 38%), linear-gradient(135deg, var(--color-brand-300,#6ee7b7), #22d3ee 54%, #38bdf8);--drag-card-border:1px solid color-mix(in oklab, var(--color-brand-100,#d1fae5) 76%, #fff 12%);--drag-card-shadow:0 18px 42px color-mix(in oklab, var(--color-brand-500,#10b981) 28%, transparent), 0 1px 0 #ffffff2e, inset 0 1px 0 #ffffff85, inset 0 -18px 28px #0206171f;width:min(100%,760px);color:var(--lab-text);background:var(--lab-bg);border:1px solid var(--lab-border);box-shadow:var(--lab-shadow);border-radius:8px;gap:1rem;padding:clamp(1rem,3vw,1.4rem);display:grid}html:not(.dark) .constraint-lab.svelte-12bz7ax{--lab-text:#0f172a;--lab-bg:linear-gradient(135deg, #f8fafcf5, #ecfdf5d6), radial-gradient(circle at 16% 16%, color-mix(in oklab, var(--color-brand-300,#6ee7b7) 36%, transparent), transparent 22rem);--lab-border:color-mix(in oklab, var(--color-brand-500,#10b981) 24%, #cbd5e1);--lab-shadow:0 24px 70px #0f172a1f;--lab-muted:#0f172aa3;--lab-accent:var(--color-brand-700,#047857);--lab-chip-bg:#ffffffbd;--lab-chip-border:#0f172a24;--stage-border:#0f172a24;--stage-grid:#0f172a12;--constraint-border:#0f172a38;--constraint-bg:linear-gradient(135deg, #ffffffdb, #f0fdfab3), radial-gradient(circle at center, color-mix(in oklab, var(--color-brand-300,#6ee7b7) 22%, transparent), transparent 72%);--axis-label:#0f172a6b;--drag-card-text:#ecfeff;--drag-card-frame:#ecfdf547;--drag-card-corner:#ecfdf538;--drag-card-bg:linear-gradient(135deg, #ffffff2e, transparent 38%), linear-gradient(135deg, #0f766e, var(--color-brand-600,#059669) 52%, #0284c7);--drag-card-border:1px solid #0f766e6b;--drag-card-shadow:0 18px 42px #0f766e38, 0 1px 0 #ffffff6b, inset 0 1px 0 #ffffff3d, inset 0 -18px 28px #02061738}.lab-header.svelte-12bz7ax,.lab-footer.svelte-12bz7ax{text-transform:uppercase;color:var(--lab-muted);justify-content:space-between;align-items:center;gap:.75rem;font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;font-size:.72rem;display:flex}.lab-header.svelte-12bz7ax strong:where(.svelte-12bz7ax){color:var(--lab-accent);font-weight:700}.lab-footer.svelte-12bz7ax{flex-wrap:wrap;justify-content:flex-start}.lab-footer.svelte-12bz7ax span:where(.svelte-12bz7ax){border:1px solid var(--lab-chip-border);background:var(--lab-chip-bg);border-radius:4px;align-items:center;min-height:1.5rem;padding:.18rem .45rem;display:inline-flex}.stage-wrap.svelte-12bz7ax{border:1px dashed var(--stage-border);background-image:linear-gradient(var(--stage-grid) 1px, transparent 1px), linear-gradient(90deg, var(--stage-grid) 1px, transparent 1px);background-size:28px 28px;place-items:center;min-height:clamp(320px,58vw,480px);display:grid;position:relative}.constraint-stage.svelte-12bz7ax{aspect-ratio:1;border:1px solid var(--constraint-border);background:var(--constraint-bg);border-radius:8px;place-items:center;width:min(62vw,380px);display:grid}.axis-label.svelte-12bz7ax{text-transform:uppercase;color:var(--axis-label);pointer-events:none;font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;font-size:.68rem;position:absolute}.axis-label-top.svelte-12bz7ax{top:.65rem}.axis-label-right.svelte-12bz7ax{writing-mode:vertical-rl;right:.65rem}.axis-label-bottom.svelte-12bz7ax{bottom:.65rem}.axis-label-left.svelte-12bz7ax{writing-mode:vertical-rl;left:.65rem;transform:rotate(180deg)}.constraint-stage [aria-label="Draggable constrained card"]{text-transform:uppercase;color:var(--drag-card-text);letter-spacing:.08em;-webkit-user-select:none;user-select:none;grid-template-rows:auto 1fr auto;align-items:center;font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;font-size:.72rem;font-weight:800;display:grid;position:relative;overflow:hidden}.constraint-stage [aria-label="Draggable constrained card"]:before{content:"";border:1px solid var(--drag-card-frame);pointer-events:none;border-radius:5px;position:absolute;inset:9px}.constraint-stage [aria-label="Draggable constrained card"]:after{content:"";aspect-ratio:1;border:1px solid var(--drag-card-corner);pointer-events:none;width:64px;position:absolute;bottom:-22px;right:-22px;transform:rotate(45deg)}.tile-mark.svelte-12bz7ax,.tile-label.svelte-12bz7ax{z-index:1;padding-inline:.75rem;position:relative}.tile-mark.svelte-12bz7ax{opacity:.74;align-self:start;padding-top:.7rem;font-size:.66rem}.tile-label.svelte-12bz7ax{place-self:end;padding-bottom:.72rem}.tile-grip.svelte-12bz7ax{z-index:1;opacity:.52;grid-template-columns:repeat(2,5px);justify-self:center;gap:6px;display:grid;position:relative}.tile-grip.svelte-12bz7ax i:where(.svelte-12bz7ax){aspect-ratio:1;background:currentColor;border-radius:999px;width:5px}@media (width<=640px){.stage-wrap.svelte-12bz7ax{min-height:360px}.constraint-stage.svelte-12bz7ax{width:min(72vw,320px)}}