.cp{aspect-ratio:1;width:min(340px,70%);position:relative}.cp-ghost,.cp-el,.cp-pts{position:absolute;inset:0}.cp-ghost{outline:1px dashed var(--ink-3);background:repeating-linear-gradient(45deg,#1c1b1812 0 6px,#0000 6px 12px)}.cp-el{background:linear-gradient(135deg, var(--accent), #f2b84b 60%, #2b6f77)}.cp-pt{border:2px solid var(--ink);background:var(--paper);cursor:grab;touch-action:none;border-radius:50%;width:14px;height:14px;margin:-7px 0 0 -7px;padding:0;position:absolute}.cp-pt:hover,.cp-pt:active{background:var(--accent);border-color:var(--accent)}
.ez{flex-direction:column;align-items:center;gap:4px;max-height:100%;display:flex}.ez-svg{touch-action:none;width:min(300px,100%);max-height:62vh;overflow:visible}.ez-box{fill:var(--paper);stroke:var(--ink);stroke-width:1.5px}.ez-diag{stroke:var(--line-2);stroke-dasharray:3 4}.ez-arm{stroke:var(--ink-2);stroke-width:1.5px}.ez-curve{fill:none;stroke:var(--accent);stroke-width:3px;stroke-linecap:round}.ez-pt{fill:var(--paper);stroke:var(--ink);stroke-width:2.5px;cursor:grab}.ez-pt:hover,.ez-pt:active{fill:var(--accent);stroke:var(--accent)}.ez-track{border-bottom:1px solid var(--ink);width:270px;height:26px;position:relative}.ez-ball{background:var(--ink);border-radius:50%;width:20px;height:20px;position:absolute;top:3px;left:0}
.tf-wrap{width:200px;height:200px;position:relative}.tf-ghost,.tf-el{position:absolute;inset:0}.tf-ghost{border:1px dashed var(--ink-3)}.tf-el{background:var(--accent);color:#fff;font:400 120px/1 var(--font-display);place-items:center;display:grid}
.gl-back{background:#f4efe4;position:absolute;inset:0}.gl-back i{border-radius:50%;position:absolute}.gl-back i:first-child{background:#e2492a;width:260px;height:260px;top:14%;left:12%}.gl-back i:nth-child(2){background:#2b6f77;width:220px;height:220px;bottom:10%;right:14%}.gl-back i:nth-child(3){background:#f2b84b;width:140px;height:140px;top:8%;right:30%}.gl-back[data-v=dusk]{background:#1b1630}.gl-back[data-v=dusk] i:first-child{background:#7a3b8f}.gl-back[data-v=dusk] i:nth-child(2){background:#d9577a}.gl-back[data-v=dusk] i:nth-child(3){background:#f0a25c}.gl-back[data-v=mono]{background:#fff}.gl-back[data-v=mono] i{background:#111}.gl-back[data-v=mono] i:nth-child(2){background:#666}.gl-back[data-v=mono] i:nth-child(3){background:#bbb}.sample.glass-card{color:#fff;text-shadow:0 1px 12px #00000040;align-content:center;gap:4px;width:300px;height:190px}.glass-card b{font:400 38px/1 var(--font-display)}.glass-card span{opacity:.85;font-size:13px}
.lay{border:1px dashed var(--ink-3);background:var(--paper);width:min(100% - 64px,640px);height:min(100% - 64px,380px);padding:12px;overflow:auto}.lay-grid{height:auto;max-height:calc(100% - 64px)}.lay-item{border:1.5px solid var(--ink);background:var(--paper-2);min-width:56px;font:500 13px var(--font-mono);place-items:center;padding:6px 12px;display:grid}.lay-item:nth-child(3n+1){background:var(--accent);border-color:var(--ink);color:#fff}.lay-item:nth-child(3n+2){background:#f2b84b}