/* Every visible fibre is directly pickable; the five original spirits stay beside it. */
.journey-playing{max-width:1100px}
.yarn-playspace{display:grid;grid-template-columns:minmax(0,1fr) 230px;gap:20px;align-items:center;margin:14px auto 12px;width:100%}
.yarn-object.yarn-solid-object{max-width:none;width:100%;margin:0;perspective:none;transform:none;overflow:visible;background:none;min-width:0}
.yarn-solid-title{display:flex;justify-content:space-between;align-items:center;margin:0 2px 11px;font-size:11px;color:#927251;gap:12px}
.yarn-solid-title b{font:20px var(--serif);color:#785434}.yarn-solid-title span{font-size:10px;letter-spacing:.6px;white-space:nowrap}
.yarn-3d-stage{width:100%;height:500px;position:relative;overflow:hidden;border-radius:18px;background:radial-gradient(ellipse at 50% 54%,#fffdf7 0,#f3eadb 65%,#ebe0cb 100%);border:1px solid #e4d3b9;touch-action:none;isolation:isolate}
.yarn-3d-stage canvas{position:absolute;inset:0;width:100%;height:100%;display:block;touch-action:none;cursor:grab}.yarn-3d-stage canvas:focus-visible{outline:2px solid #a73e2d;outline-offset:-5px;border-radius:18px}
.yarn-stage-label{position:absolute;left:19px;top:17px;z-index:4;color:#a88963;letter-spacing:2px;font-size:10px;pointer-events:none}.yarn-stage-label:before{content:'●';color:#bd9a57;margin-right:8px}
.yarn-loading{position:absolute;left:0;right:0;top:43%;text-align:center;color:#a38861;font-size:12px}
.yarn-hover-note{position:absolute;left:12px;right:12px;bottom:13px;z-index:4;color:var(--wool,#96794e);font-size:11px;line-height:1.5;text-align:center;pointer-events:none;background:#fffaf2c9;border:1px solid #e5d8c480;border-radius:30px;padding:8px 11px;margin:auto;width:max-content;max-width:calc(100% - 24px);backdrop-filter:blur(4px)}
.yarn-touch-cue{position:absolute;width:19px;height:19px;border:1.5px solid #fff1cb;border-radius:50%;box-shadow:0 0 0 4px #e4c47070,0 0 21px var(--wool);transform:translate(-50%,-50%);opacity:0;z-index:5;pointer-events:none}.yarn-touch-cue.visible{opacity:1;animation:yarn-fibre-light .7s ease-in-out infinite alternate}
@keyframes yarn-fibre-light{to{box-shadow:0 0 0 8px #e4c47030,0 0 30px var(--wool);transform:translate(-50%,-50%) scale(1.1)}}
.yarn-view-tools{display:flex;align-items:center;justify-content:space-between;gap:8px;margin:10px 3px}.yarn-view-tools button{border:0;border-bottom:1px solid #d9c7a8;background:transparent;color:#99754c;font-size:10px;padding:5px 0;cursor:pointer}.yarn-view-tools small{font-size:10px;color:#a48760}
.yarn-solid-help{font-size:10px;text-align:center;color:#a4865d;line-height:1.8;margin:8px 0 0}
.yarn-playspace>.yarn-energy{display:grid;grid-template-columns:1fr;gap:3px;width:100%;max-width:none;margin:0;padding:13px 12px 9px;border:1px solid #e3d2b9;border-radius:16px;background:#f7efe1aa;align-self:stretch;align-content:center}
.yarn-companions-heading{padding:2px 6px 8px;border-bottom:1px solid #e5d5bb;margin-bottom:3px}.yarn-companions-heading>span{display:block;font:17px var(--serif);color:#7d5f3e}.yarn-companions-heading>small{display:block;margin-top:5px;font-size:9px;color:#a08560}
.yarn-playspace .yarn-spirit{display:grid;grid-template-columns:88px minmax(0,1fr);align-items:center;min-width:0;padding:0 3px;border-radius:12px;transition:background .3s,box-shadow .3s;position:relative}
.yarn-spirit-model{width:88px;height:97px;min-width:0;position:relative}.yarn-spirit-model canvas{display:block;width:100%;height:100%;touch-action:pan-y;pointer-events:none}
.yarn-spirit-info{min-width:0;padding-top:8px}.yarn-playspace .yarn-spirit-info>span{font:13px var(--serif);color:#785d3e;display:block}.yarn-playspace .yarn-spirit-info>b{display:block;color:var(--wool);font:10px Georgia;margin-top:4px}
.yarn-spirit-info .energy-track{width:100%;height:4px;margin:8px 0 5px}.yarn-spirit-reply{font-size:8px;color:#a58c68;display:block;line-height:1.7;white-space:nowrap}
.yarn-playspace .yarn-spirit.absorbing{background:#fff9e8;box-shadow:inset 0 0 0 1px #dcc699,0 0 18px #d4b16b22}.yarn-spirit.absorbing .yarn-spirit-reply{color:var(--wool);font-weight:600}.yarn-spirit.absorbing .yarn-spirit-model:after{content:'';position:absolute;left:33%;top:58%;width:30%;height:22%;border-radius:50%;box-shadow:0 0 18px 8px var(--wool);opacity:.35;pointer-events:none;animation:yarn-absorb-glow 1.1s ease-out both}
@keyframes yarn-absorb-glow{0%{transform:scale(.25);opacity:.7}100%{transform:scale(1.4);opacity:0}}
.yarn-solid-object #yarn-flight{display:none}
.yarn-fibre-flight{position:fixed;width:10px;height:10px;z-index:2000;border-radius:50%;background:var(--wool);box-shadow:0 0 3px 1px #fff9,0 0 14px 3px var(--wool);pointer-events:none}.yarn-fibre-flight:after{content:'';position:absolute;left:-15px;top:3px;width:21px;height:3px;border-radius:100%;background:linear-gradient(90deg,transparent,var(--wool));opacity:.65;transform:rotate(-27deg)}
.yarn-accessible-fallback[hidden]{display:none}.yarn-accessible-fallback{margin-top:12px;border:1px solid #decab0;border-radius:10px;padding:15px}.yarn-accessible-fallback p{font-size:11px;color:#9a784f}.yarn-accessible-fallback>div{display:flex;flex-wrap:wrap;gap:7px}.yarn-accessible-fallback button{border:1px solid #fff8;color:#fff;font-size:10px;border-radius:20px;background:var(--wool);padding:6px 10px}.yarn-accessible-fallback button.covered{opacity:.45}
.yarn-object-preview{filter:drop-shadow(0 6px 6px #593b2420)}.journey-playing .yarn-tools{gap:16px;margin-top:12px}.journey-playing .yarn-tools .btn{background:transparent;border:0;border-bottom:1px solid #d8c7ad;border-radius:0;padding:6px 0;color:#9d7955;font-size:11px}.journey-playing .yarn-collectors{margin:14px 0 10px}.journey-playing .yarn-box{padding:6px 13px;min-width:132px;border-width:2px;box-shadow:none}.journey-playing .yarn-box>div{margin-top:6px}.journey-playing .yarn-buffer{margin-top:12px}
@media(max-width:1020px){.yarn-playspace{grid-template-columns:minmax(0,1fr) 190px;gap:12px}.yarn-playspace>.yarn-energy{padding:12px 8px}.yarn-playspace .yarn-spirit{grid-template-columns:73px minmax(0,1fr)}.yarn-spirit-model{width:73px;height:99px}.yarn-solid-title b{font-size:18px}.yarn-solid-title span{font-size:9px}.yarn-3d-stage{height:500px}.yarn-spirit-reply{font-size:7px}}
@media(max-width:760px){.yarn-playspace{grid-template-columns:minmax(0,1fr);gap:13px}.yarn-playspace>.yarn-energy{grid-template-columns:repeat(5,minmax(0,1fr));gap:4px;padding:10px 5px 12px;align-items:end}.yarn-companions-heading{grid-column:1/-1;text-align:center;border:0;margin:0;padding:0 0 4px}.yarn-companions-heading>span{font-size:14px}.yarn-companions-heading>small{font-size:8px;margin-top:4px}.yarn-playspace .yarn-spirit{display:flex;flex-direction:column;align-items:center;padding:0 1px;width:100%;min-width:0}.yarn-spirit-model{width:100%;height:118px}.yarn-spirit-info{width:100%;text-align:center;padding:1px 2px 0}.yarn-playspace .yarn-spirit-info>span{font-size:11px}.yarn-playspace .yarn-spirit-info>b{font-size:9px}.yarn-spirit-info .energy-track{width:80%;margin:7px auto 4px}.yarn-spirit-reply{font-size:7px;white-space:normal;height:22px}.yarn-3d-stage{height:410px}.yarn-spirit.absorbing .yarn-spirit-model:after{top:64%}}
@media(max-width:600px){.yarn-3d-stage{height:330px;border-radius:12px}.yarn-solid-title b{font-size:17px}.yarn-solid-title span{font-size:8px}.yarn-stage-label{font-size:9px;left:12px;top:13px;letter-spacing:1px}.yarn-hover-note{font-size:9px;padding:7px 9px;bottom:10px}.yarn-view-tools{gap:6px}.yarn-view-tools small{font-size:9px}.yarn-view-tools button{font-size:9px}.yarn-solid-help{font-size:9px;margin:5px 8px 0}.yarn-spirit-model{height:82px}.yarn-playspace>.yarn-energy{gap:2px;order:-1;position:sticky;top:12px;z-index:6;align-self:start;background:#f7efe1f2;padding:7px 5px 8px;box-shadow:0 3px 12px #70472412}.journey-playing .yarn-collectors{gap:14px}.journey-playing .yarn-box{min-width:115px;padding:6px 11px}.journey-playing .yarn-tools{gap:13px}.journey-playing .yarn-tools .btn{font-size:10px}.yarn-spirit-info .energy-track{height:3px;margin-top:5px}.yarn-spirit-reply{font-size:7px;height:18px}.yarn-companions-heading>small{margin-top:3px}.yarn-companions-heading{padding-bottom:2px}}
@media(prefers-reduced-motion:reduce){.yarn-touch-cue.visible,.yarn-spirit.absorbing .yarn-spirit-model:after{animation:none}.yarn-fibre-flight:after{display:none}}

/* Clearer fibres and readable feedback without adding a button board. */
.yarn-solid-title{align-items:baseline;flex-wrap:wrap;margin-bottom:12px;font-size:15px}
.yarn-solid-title b{font-size:25px}.yarn-solid-title span{font-size:14px;letter-spacing:0}
.yarn-stage-label{font-size:15px;letter-spacing:0;left:17px;top:17px;line-height:1.5}
.yarn-stage-label:before{margin-right:6px}
.yarn-hover-note{font-size:15px;line-height:1.5;padding:9px 14px;bottom:14px;color:var(--wool,#785d3f);background:#fffaf2e8;border-color:#d8c7a9}
.yarn-touch-cue{width:22px;height:22px}
.yarn-view-tools{margin:11px 3px;gap:12px;flex-wrap:wrap}.yarn-view-tools small,.yarn-view-tools button{font-size:15px;line-height:1.5}.yarn-view-tools button{padding:8px 2px}
.yarn-solid-help{font-size:14px;color:#886a48;line-height:1.7;margin-top:2px}
.yarn-companions-heading>span{font-size:21px}.yarn-companions-heading>small{font-size:14px;line-height:1.6}
.yarn-playspace{grid-template-columns:minmax(0,1fr) 250px;gap:18px}
.yarn-playspace .yarn-spirit{grid-template-columns:95px minmax(0,1fr);padding:2px 3px}
.yarn-spirit-model{width:95px;height:102px;cursor:pointer}
.yarn-playspace .yarn-spirit-info>span{font-size:18px;line-height:1.45;overflow-wrap:anywhere}
.yarn-playspace .yarn-spirit-info>b{font-size:15px;line-height:1.4}
.yarn-spirit-reply{font-size:13px;line-height:1.55;white-space:normal;min-height:20px;color:#886f4e}
.yarn-fibre-flight{width:8px;height:8px}.yarn-fibre-flight.energy-core{width:20px;height:20px;box-shadow:0 0 0 3px #fff9,0 0 15px 5px var(--wool);border:1px solid #fff8}
.yarn-fibre-flight.energy-core:before{content:'';position:absolute;inset:3px;border:2px solid #fff9;border-radius:45% 55% 40% 60%;transform:rotate(-25deg)}
.yarn-fibre-flight.energy-core:after{width:34px;height:5px;left:-24px;top:7px;opacity:.8}
.journey-playing .yarn-tools .btn,.journey-playing #yarn-counter{font-size:15px;line-height:1.5}
.journey-playing .yarn-box{min-width:150px;font-size:15px;padding:8px 15px}
.yarn-accessible-fallback p,.yarn-accessible-fallback button{font-size:15px;line-height:1.5}
@media(max-width:1020px){
 .yarn-playspace{grid-template-columns:minmax(0,1fr) 220px;gap:12px}.yarn-playspace .yarn-spirit{grid-template-columns:82px minmax(0,1fr)}.yarn-spirit-model{width:82px;height:102px}
 .yarn-playspace .yarn-spirit-info>span{font-size:17px}.yarn-spirit-reply{font-size:13px}
}
@media(max-width:760px){
 .yarn-playspace{grid-template-columns:minmax(0,1fr);gap:12px}.yarn-playspace>.yarn-energy{grid-template-columns:repeat(5,minmax(0,1fr));gap:4px;padding:10px 5px 11px}
 .yarn-companions-heading>span{font-size:18px}.yarn-companions-heading>small{font-size:13px;margin-top:3px}.yarn-companions-heading{padding-bottom:3px}
 .yarn-playspace .yarn-spirit{display:flex;flex-direction:column;padding:0 1px}.yarn-spirit-model{width:100%;height:105px}
 .yarn-playspace .yarn-spirit-info>span{font-size:15px}.yarn-playspace .yarn-spirit-info>b{font-size:13px}.yarn-spirit-reply{font-size:12px;height:34px;min-height:34px;overflow-wrap:anywhere}
}
@media(max-width:600px){
 .yarn-3d-stage{height:320px}.yarn-solid-title{gap:5px 9px;margin-bottom:10px}.yarn-solid-title b{font-size:21px}.yarn-solid-title span{font-size:14px}
 .yarn-stage-label{font-size:14px;left:12px;top:12px}.yarn-hover-note{font-size:14px;padding:7px 10px;bottom:11px}
 .yarn-view-tools small,.yarn-view-tools button{font-size:14px}.yarn-view-tools{margin:7px 2px;gap:9px}.yarn-solid-help{font-size:13px;margin:0 3px}
 .yarn-spirit-model{height:77px}.yarn-playspace>.yarn-energy{padding:8px 5px;gap:2px;top:10px}
 .yarn-companions-heading>span{font-size:17px}.yarn-companions-heading>small{font-size:12px}
 .yarn-playspace .yarn-spirit-info>span{font-size:14px}.yarn-playspace .yarn-spirit-info>b{font-size:13px;margin-top:3px}.yarn-spirit-reply{font-size:12px;line-height:1.45;height:34px}
 .journey-playing .yarn-box{font-size:14px;min-width:120px;padding:8px 11px}.journey-playing .yarn-tools{gap:15px}.journey-playing .yarn-tools .btn,.journey-playing #yarn-counter{font-size:14px}
 .journey-playing .yarn-buffer>span,.journey-playing .yarn-buffer>small{font-size:14px}
}

/* Recovery lives on the playing surface, beside the object it affects. */
.yarn-stage-recovery[hidden]{display:none}
.yarn-stage-recovery{position:absolute;z-index:8;inset:0;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:14px;padding:25px;background:#f8efdfed;backdrop-filter:blur(5px);text-align:center;touch-action:manipulation}
.yarn-stage-recovery h3{font:26px/1.45 var(--serif);color:#8c4832;margin:0}
.yarn-stage-recovery p{font-size:17px;color:#795f42;line-height:1.7;max-width:340px;margin:0}
.yarn-stage-recovery>div{display:flex;flex-wrap:wrap;justify-content:center;gap:12px}
.yarn-stage-recovery .btn{font-size:16px;padding:12px 20px;min-height:46px}
.yarn-stage-recovery[data-state=complete]{background:#fff6e7de}
.yarn-stage-recovery[data-state=complete] h3{color:#986e30}
@media(max-width:600px){.yarn-stage-recovery{padding:18px;gap:12px}.yarn-stage-recovery h3{font-size:22px}.yarn-stage-recovery p{font-size:15px}.yarn-stage-recovery .btn{font-size:15px;padding:11px 15px}.yarn-stage-recovery>div{gap:9px}}