/* The pull is deliberately the only touch target; the rope never blocks the illustration. */
.light-cord{position:absolute;left:0;right:auto;top:0;width:calc(104px * var(--stage-scale,1));height:calc(240px * var(--stage-scale,1));--cord-handle-width:calc(29px * var(--stage-scale,1));--cord-handle-height:calc(40px * var(--stage-scale,1));z-index:7;pointer-events:none;isolation:isolate;filter:drop-shadow(5px 7px 3px #05060470)}
.light-cord:not(.is-anchored){visibility:hidden}
.light-cord-rope{position:absolute;inset:0;width:100%;height:auto;overflow:visible;pointer-events:none}
.light-cord-anchor-shadow{fill:#11100c;opacity:.5}.light-cord-anchor{fill:#ac8350;stroke:#342619;stroke-width:1.2}
.light-cord-rope path{fill:none;stroke-linecap:round}
.light-cord-shadow{stroke:#17140e;stroke-width:4.8;transform:translate(1.8px,1px);opacity:.5}
.light-cord-outline{stroke:#493722;stroke-width:3.8}.light-cord-fibre{stroke:url(#cord-fibre);stroke-width:2.8}
.light-cord-braid{stroke:#fff5d6;stroke-width:.8;stroke-dasharray:1.2 4.3;opacity:.8}
.light-cord-handle{position:absolute;width:max(44px,var(--cord-handle-width));height:max(44px,var(--cord-handle-height));padding:0;margin:0;background:none;border:0;border-radius:45%;pointer-events:auto;touch-action:none;cursor:grab;transform-origin:50% calc(3px * var(--stage-scale,1));user-select:none;-webkit-user-select:none;will-change:transform,left,top}
.light-cord-handle>svg{position:absolute;left:50%;top:0;transform:translateX(-50%);height:var(--cord-handle-height);width:var(--cord-handle-width);overflow:visible;display:block;transition:filter .25s}
.light-cord-handle:hover>svg,.light-cord-handle:focus-visible>svg{filter:brightness(1.18) drop-shadow(0 0 5px #e6ba6c66)}
.light-cord-handle:focus-visible{outline:none}.light-cord.is-dragging .light-cord-handle{cursor:grabbing}
.light-cord-tip{position:absolute;left:calc(50% + var(--cord-handle-width) / 2 + 7px);right:auto;top:calc(10px * var(--stage-scale,1));white-space:nowrap;font-family:var(--hand,cursive);font-size:20px;font-weight:400;letter-spacing:.5px;color:#ffdfa6;text-shadow:0 1px 4px #000,0 0 10px #130c03;background:#120f0b55;border-radius:50%;padding:3px 9px;opacity:0;transform:translateX(5px) rotate(-4deg);transition:opacity .2s,transform .25s;pointer-events:none}
.light-cord-handle:hover .light-cord-tip,.light-cord-handle:focus-visible .light-cord-tip,.light-cord.is-dragging .light-cord-tip{opacity:1;transform:translateX(0) rotate(-4deg)}
.light-cord.is-off .light-cord-tip{color:#f1e1c5}.light-cord.is-off .light-cord-handle>svg{filter:brightness(.96)}
@media(max-width:600px){.light-cord-tip{font-size:18px}}
@media(prefers-reduced-motion:reduce){.light-cord-handle,.light-cord-tip,.light-cord-handle>svg{transition:none}}