/* Craft 01.10: all assembly geometry shares one size, fitted to both viewport axes. */
.craft-game{--cf-color:157,111,230;--cf-active:#4a3475;--cf-size:280px;--cf-width:320px;display:flex;flex-direction:column;min-height:220px;max-width:500px;margin:auto;isolation:isolate;color:var(--text,#f4f8fd)}
.craft-game[data-risk=safe]{--cf-color:73,193,164;--cf-active:#24594f}.craft-game[data-risk=risky]{--cf-color:242,109,75;--cf-active:#813d37}
.craft-game button{touch-action:manipulation;font:inherit;cursor:pointer;color:inherit}.craft-game button:disabled{cursor:default;opacity:1}.craft-game button:focus-visible{outline:2px solid #b8cfff;outline-offset:3px}.craft-game [hidden]{display:none!important}
.cf-stage{position:relative;display:flex;flex:1;min-height:0;flex-direction:column;align-items:center;justify-content:flex-start;padding:6px 8px 24px;gap:4px;isolation:isolate}.cf-target-details{min-height:59px;flex:none;text-align:center;max-width:100%;display:flex;flex-direction:column;align-items:center;justify-content:center}.cf-caption{font-size:11px;color:#a9a0c5;margin:0 0 3px;line-height:16px}.cf-target-name{font-size:16px;font-weight:800;line-height:22px;margin:0 0 3px;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.cf-target-value{font-size:12px;line-height:17px;color:#d3bfe8;font-weight:600;min-height:17px}.cf-assembly{position:relative;flex:none;width:var(--cf-width);height:var(--cf-size);margin:auto 0;--slot-size:calc(var(--cf-size)*.20)}
.cf-ring{position:absolute;width:78.4%;height:78.4%;left:10.8%;top:10.8%;border:1px solid #70628f30;border-radius:50%}.cf-ring.second{width:63%;height:63%;left:18.5%;top:18.5%;border-style:dashed}.cf-energy{position:absolute;inset:13%;border-radius:50%;background:radial-gradient(circle,rgba(var(--cf-color),.28),transparent 66%);transition:background 300ms,opacity 300ms,transform 450ms}.cf-target{position:absolute;width:calc(var(--cf-size)*.39);height:calc(var(--cf-size)*.39);left:calc(50% - var(--cf-size)*.195);top:30.5%;display:grid;place-items:center;border-radius:50%;z-index:2;background:radial-gradient(circle,rgba(var(--cf-color),.08),transparent 75%)}.cf-target img{width:100%;height:100%;object-fit:contain;filter:drop-shadow(0 8px 14px #10062088);animation:cf-hover 4s ease-in-out infinite}.cf-target svg{width:62%;height:62%;color:#7a699c;opacity:.7}.cf-slots{position:absolute;inset:0}.cf-slot{position:absolute;left:calc(50% + var(--sx) - var(--slot-size)/2);top:calc(50% + var(--sy) - var(--slot-size)/2);width:var(--slot-size);height:var(--slot-size);border-radius:calc(var(--slot-size)*.28);background:#111a29;border:1px dashed #344359;color:#61718c!important;font-size:calc(var(--slot-size)*.48)!important;display:grid;place-items:center;padding:0;z-index:3;transition:border-color 200ms,background 200ms}.cf-slot.filled{border:1px solid #675487;background:linear-gradient(145deg,#30263d,#182032);box-shadow:0 4px 13px #0004}.cf-slot img,.cf-slot svg{display:block;width:84%;height:84%;object-fit:contain;object-position:center}.cf-slot.filled:after{content:'−';position:absolute;right:-1px;top:-1px;background:#29354b;border:1px solid #465578;width:clamp(9px,calc(var(--slot-size)*.3),16px);height:clamp(9px,calc(var(--slot-size)*.3),16px);font-size:clamp(8px,calc(var(--slot-size)*.2),11px);border-radius:50%;display:grid;place-items:center;color:#d3c0e4;line-height:1}
.cf-controls{flex:none;padding:10px;border:1px solid var(--border,#293a50);border-radius:19px;background:var(--surface,#152031);margin-top:20px}.cf-risk{position:relative;display:flex;gap:6px;isolation:isolate}.cf-risk:before{content:'';position:absolute;inset:0 auto 0 0;width:calc((100% - 12px)/3);border-radius:12px;background:var(--cf-active);z-index:-1;transition:transform 240ms ease,background 300ms,box-shadow 300ms}.craft-game[data-risk=normal] .cf-risk:before{transform:translateX(calc(100% + 6px))}.craft-game[data-risk=risky] .cf-risk:before{transform:translateX(calc(200% + 12px));box-shadow:inset 0 1px #ffb48a33,0 0 14px #ef6a3b26}.cf-risk button{flex:1;min-width:0;height:35px;background:transparent;border:0;font-size:11px;font-weight:800;border-radius:12px;padding:0 3px;display:flex;align-items:center;justify-content:center;gap:5px}.cf-risk svg{width:15px;height:15px;flex:none}.cf-quote-reveal{display:grid;grid-template-rows:0fr;opacity:0;transition:grid-template-rows 320ms cubic-bezier(.22,.75,.25,1),opacity 180ms ease;pointer-events:none}.cf-metrics{display:flex;justify-content:center;gap:36px;text-align:center;min-height:0;overflow:hidden;transform:translateY(-6px);transition:transform 320ms cubic-bezier(.22,.75,.25,1)}.cf-metrics>div{min-width:90px;display:flex;flex-direction:column;align-items:center;padding:8px 0;gap:3px}.cf-metrics span{font-size:10px;color:#879ab9;line-height:14px}.cf-metrics b{font-size:16px;line-height:22px;font-variant-numeric:tabular-nums}.cf-chance{color:#d4bdff}.cf-controls[data-quote=true] .cf-quote-reveal{grid-template-rows:1fr;opacity:1;pointer-events:auto}.cf-controls[data-quote=true] .cf-metrics{transform:translateY(0)}.cf-primary{width:100%;height:46px;margin-top:8px;border-radius:14px;border:0;background:#7450d9;color:white;font-size:14px!important;font-weight:800!important}.cf-error{font-size:11px;line-height:16px;color:#ffbdac;text-align:center;margin:8px 3px 0}.cf-text{background:none;border:0;color:#bd9bf6!important;font-size:12px!important;font-weight:700!important;padding:8px;border-radius:10px}.cf-skip{position:absolute;bottom:0;font-size:10px!important;color:#91a1bb!important;padding:5px 8px;z-index:6}
.cf-orbit{position:absolute;inset:22%;border-radius:50%;border:2px solid transparent;border-top-color:rgba(var(--cf-color),.9);border-right-color:rgba(var(--cf-color),.3);opacity:0}.craft-game[data-state=pending] .cf-orbit{opacity:1;animation:cf-orbit 1.15s linear infinite}.craft-game[data-state=pending] .cf-energy{animation:cf-breathe .65s ease-in-out infinite alternate}.craft-game[data-state=pending] .cf-target{opacity:0}.craft-game[data-state=pending] .cf-target img{animation:none}.craft-game[data-state=pending] .cf-slot:not(.filled){opacity:.12}.craft-game[data-state=pending] .cf-slot:after{display:none}.craft-game[data-state=pending] .cf-target-name{color:#dbc5ff}.craft-game[data-motion=brewing] .cf-slot.filled,.craft-game[data-motion=compress] .cf-slot.filled,.craft-game[data-motion=reveal] .cf-slot.filled,.craft-game[data-motion=fade] .cf-slot.filled{visibility:hidden}
.cf-core{position:absolute;left:32%;top:32%;width:36%;height:36%;opacity:0;pointer-events:none;z-index:4;transition:opacity 400ms,transform 450ms;border-radius:50%;background:radial-gradient(circle,#ece2ff 0%,rgba(var(--cf-color),.8) 8%,rgba(var(--cf-color),.53) 29%,rgba(var(--cf-color),.17) 52%,transparent 72%);filter:drop-shadow(0 0 16px rgba(var(--cf-color),.5))}.cf-core i{position:absolute;inset:4px;border:1px solid rgba(var(--cf-color),.55);border-left-color:transparent;border-right-color:rgba(var(--cf-color),.15);border-radius:50%;animation:cf-brew-orbit 1.7s linear infinite}.cf-core i:nth-child(2){inset:12px;animation-duration:2.3s;animation-direction:reverse}.cf-core i:nth-child(3){inset:20px;animation-duration:1.1s}.cf-core b{position:absolute;inset:0;display:grid;place-items:center;font-size:calc(var(--cf-size)*.14);font-weight:400;color:#f1e8ff;text-shadow:0 0 18px rgba(var(--cf-color),.8);animation:cf-heart 850ms ease-in-out infinite alternate}.craft-game[data-motion=brewing] .cf-core,.craft-game[data-motion=compress] .cf-core,.craft-game[data-motion=reveal] .cf-core{opacity:1}.craft-game[data-motion=brewing] .cf-energy{transform:scale(1.25)}.craft-game[data-motion=compress] .cf-core{transform:scale(.55)}.craft-game[data-motion=compress] .cf-energy{opacity:.35}.cf-sparks{position:absolute;left:50%;top:50%;width:0;height:0;z-index:4;pointer-events:none;opacity:0;transition:opacity 400ms}.cf-sparks i{position:absolute;left:-2px;top:-2px;width:4px;height:4px;background:rgb(var(--cf-color));border-radius:50%;box-shadow:0 0 9px rgba(var(--cf-color),.8);animation:cf-particle 2s linear infinite;animation-delay:calc(var(--i)*-166ms)}.craft-game[data-motion=brewing] .cf-sparks{opacity:1}.cf-flash{position:absolute;inset:-5%;border-radius:50%;pointer-events:none;background:radial-gradient(circle,#fff5d8cc,#edc47955 24%,#b080ef28 48%,transparent 70%);opacity:0;z-index:5}.craft-game[data-motion=reveal] .cf-core{transform:scale(1.9);opacity:0;filter:drop-shadow(0 0 28px #ffd991)}.craft-game[data-motion=reveal] .cf-flash{animation:cf-reveal 500ms ease-out both}.craft-game[data-motion=fade] .cf-core{opacity:0;transform:scale(.6)}.craft-game[data-motion=fade] .cf-energy{opacity:0;animation:none}.craft-game[data-motion=fade] .cf-orbit{opacity:0;transition:opacity 400ms}
.cf-loss{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;flex-direction:column;text-align:center;background:radial-gradient(ellipse at 50% 40%,#64324424,transparent 65%);padding:20px}.cf-loss-mark{width:106px;height:106px;display:grid;place-items:center;font-size:48px;line-height:1;color:#b07d91;border:1px solid #9e647652;border-radius:50%;box-shadow:0 0 0 12px #c9698610,0 0 50px #8c3b5520;margin-bottom:25px;font-weight:300}.cf-loss h2{font-size:22px;margin:0 0 10px}.cf-loss p{font-size:12px;color:#97a7bf;line-height:1.7;margin:0 0 12px}.craft-game[data-state=loss] .cf-assembly,.craft-game[data-state=loss] .cf-target-details{visibility:hidden}.craft-game[data-state=loss] .cf-risk,.craft-game[data-state=loss] .cf-quote-reveal{display:none}.craft-game[data-state=loss] .cf-controls{background:transparent;border:0;padding:0}.craft-game[data-state=loss] .cf-primary{margin-top:0}.craft-game[data-state=loss] .cf-loss{animation:cf-arrive 450ms ease-out}
.craft-game:not([data-state=pending]) .cf-core *,.craft-game:not([data-state=pending]) .cf-sparks *{animation:none}.craft-game.cf-paused *,.craft-game.cf-paused *:before{animation-play-state:paused!important}.craft-game.cf-stopped *{animation:none!important;transition:none!important}
@keyframes cf-hover{0%,100%{transform:translateY(1px) rotate(-1deg)}50%{transform:translateY(-3px) rotate(1deg)}}@keyframes cf-orbit{to{transform:rotate(360deg)}}@keyframes cf-breathe{to{transform:scale(1.1);opacity:.75}}@keyframes cf-brew-orbit{from{transform:rotateX(54deg) rotateZ(0)}to{transform:rotateX(54deg) rotateZ(360deg)}}@keyframes cf-heart{to{transform:scale(1.22);opacity:.6}}@keyframes cf-particle{0%{transform:rotate(calc(var(--i)*30deg)) translateX(calc(var(--cf-size)*.24)) scale(.4);opacity:0}20%{opacity:.9}100%{transform:rotate(calc(var(--i)*30deg + 170deg)) translateX(calc(var(--cf-size)*.065)) scale(.2);opacity:0}}@keyframes cf-reveal{0%{opacity:0;transform:scale(.45)}35%{opacity:1}100%{opacity:0;transform:scale(1.3)}}@keyframes cf-arrive{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}
@media(max-height:650px){.cf-stage{padding-top:3px}.cf-target-details{min-height:48px}.cf-target-name{font-size:14px;line-height:19px;margin-bottom:2px}.cf-target-value{font-size:11px;line-height:14px;min-height:14px}.cf-caption{font-size:9px;line-height:13px;margin-bottom:2px}.cf-controls{padding:8px;margin-top:12px}.cf-risk button{height:31px;font-size:10px}.cf-primary{height:43px}.cf-metrics>div{padding:5px 0;gap:1px}.cf-metrics b{font-size:15px;line-height:20px}.cf-loss-mark{width:76px;height:76px;margin-bottom:16px}.cf-loss h2{font-size:19px}}
:where(html[data-motion="reduced"]) .craft-game *,:where(html[data-motion="reduced"]) .craft-game *:before{animation:none!important;transition:none!important}:where(html[data-motion="reduced"]) .cf-core,:where(html[data-motion="reduced"]) .cf-sparks,:where(html[data-motion="reduced"]) .cf-flash{display:none}
