/* ═══ Крафт в Конструкторе: выбор подарков и итога, видео присылает бот ═══ */
.crs-stage{position:absolute;inset:0;z-index:5;display:none;flex-direction:row;align-items:center;justify-content:center;gap:10px;padding:14px;border-radius:inherit}
html.craft-on .crs-stage{display:flex}
html.craft-on .pv > :not(.crs-stage){visibility:hidden}
.crs-in{flex:0 0 auto;display:grid;grid-template-columns:repeat(2,1fr);gap:7px;width:min(42%,calc((var(--ph,200px) - 28px)));aspect-ratio:1}
.crs-out{flex:1;min-width:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px}
.cr-cd{position:relative;display:grid;place-items:center;aspect-ratio:1;border-radius:22%;overflow:hidden;background:var(--s2);box-shadow:0 6px 16px rgba(0,0,0,.18)}
.cr-cd img{position:relative;width:76%;height:76%;object-fit:contain;filter:drop-shadow(0 4px 8px rgba(0,0,0,.22))}
.cr-cd.hp img{width:62%;height:62%}
.cr-cd .pt1,.cr-cd .pt2{position:absolute;inset:0;background:var(--pc,#6c6868);pointer-events:none;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat}
.cr-cd .pt1{opacity:.24;-webkit-mask-size:15.6% 15.6%;mask-size:15.6% 15.6%;
  -webkit-mask-image:var(--u),var(--u),var(--u),var(--u),var(--u),var(--u);mask-image:var(--u),var(--u),var(--u),var(--u),var(--u),var(--u);
  -webkit-mask-position:50% 4.62%,89.3% 27.31%,89.3% 72.69%,50% 95.38%,10.7% 72.69%,10.7% 27.31%;mask-position:50% 4.62%,89.3% 27.31%,89.3% 72.69%,50% 95.38%,10.7% 72.69%,10.7% 27.31%}
.cr-cd .pt2{opacity:.11;-webkit-mask-size:11.5% 11.5%;mask-size:11.5% 11.5%;
  -webkit-mask-image:var(--u),var(--u),var(--u),var(--u),var(--u),var(--u);mask-image:var(--u),var(--u),var(--u),var(--u),var(--u),var(--u);
  -webkit-mask-position:105.37% 50%,77.68% 97.95%,22.32% 97.95%,-5.37% 50%,22.32% 2.05%,77.68% 2.05%;mask-position:105.37% 50%,77.68% 97.95%,22.32% 97.95%,-5.37% 50%,22.32% 2.05%,77.68% 2.05%}
html.perf-low .cr-cd .pt2{display:none}
.cr-cd.e{background:var(--s2);color:var(--ink3)}
.cr-cd.e .i{width:30%;height:30%;stroke-width:2}
.cr-cd.big{width:min(100%,calc(var(--ph,200px) - 86px));border-radius:24%;box-shadow:0 10px 30px rgba(0,0,0,.28)}
.cr-cd.fail{background:rgba(255,69,58,.14);color:#ff5a4f;font-size:44px;font-weight:300}
.crs-arr{width:22px;height:22px;color:var(--ink3);flex:none}
.crs-arr svg{width:100%;height:100%}
.crs-cap{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:2px 6px;max-width:100%;font-size:14px;line-height:19px;color:var(--ink2);text-align:center}
.crs-cap b{flex:0 0 100%;white-space:nowrap}
.crs-cap b{font-weight:700;font-size:15px;color:var(--ink);overflow:hidden;text-overflow:ellipsis}.crs-cap b.bad{color:#ff5a4f}
.crs-cap span{flex:none;font-weight:600}.crs-cap .cr-tier{margin:0}
.crs-ch{min-height:16px;font-size:12.5px;color:var(--ink3)}.crs-ch b{color:var(--ink);font-weight:700}
/* панель */
.cr-et b{cursor:pointer}
.cr-et b span{color:var(--ink3);font-weight:600}
.cr-et2{margin-top:14px}
.cr-tiles .tl,.cr-real .tl{position:relative}
.cr-tiles .tl .tx small,.cr-real .tl .tx small{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cr-th{overflow:hidden}
.cr-th img{width:80%;height:80%;object-fit:contain}
.cr-x{position:absolute;right:6px;top:6px;width:22px;height:22px;border-radius:11px;display:grid;place-items:center;background:var(--s2);color:var(--ink2)}
.cr-x .i{width:12px;height:12px;stroke-width:2.6}
.cr-seg{grid-template-columns:repeat(2,1fr)}
.cr-seg .seg-th{width:calc(50% - 2px);transform:translateX(calc(var(--i,0) * 100%))}
.cr-real{margin-top:8px;grid-template-columns:1fr}
.cr-real[hidden]{display:none}
.cr-tier{margin-left:auto;flex:none;padding:3px 8px;border-radius:8px;font-size:11.5px;font-weight:700;background:var(--s2);color:var(--ink2)}
.cr-tier.t-legendary{color:#f5b301;background:rgba(245,179,1,.14)}.cr-tier.t-epic{color:#b57bff;background:rgba(181,123,255,.14)}
.cr-tier.t-rare{color:#3aa0ff;background:rgba(58,160,255,.14)}.cr-tier.t-uncommon{color:#34c759;background:rgba(52,199,89,.14)}
.cr-hint{min-height:20px;margin:12px 4px 0;text-align:center}
.cr-hint b{color:var(--ink);font-weight:700}
.cr-dice:disabled{opacity:.4}
html.craft-on .pv::before,html.craft-on .pv::after{opacity:0}
html body .tiles.cr-real{grid-template-columns:1fr}
html body .editor-title.cr-et2{margin-top:16px}
.cr-num{display:flex;align-items:center;gap:4px;margin-top:8px;min-height:54px;padding:0 14px;border-radius:18px;background:var(--s1);font-size:15px}
.cr-num[hidden]{display:none}
.cr-num span{flex:1;min-width:0;color:var(--ink2);line-height:17px}
.cr-num span small{display:block;font-size:12px;color:var(--ink3);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cr-num b{color:var(--ink3);font-weight:600}
.cr-num input{width:96px;height:34px;border:0;border-radius:10px;background:var(--s2);color:var(--ink);font:inherit;font-weight:600;text-align:center;outline:none}

/* кнопка «Крафт» рядом с кубиком: пилюля как у кнопок конструктора, залитый значок крафта */
html body .craft-entry{flex:none;display:flex;align-items:center;gap:7px;height:50px;padding:0 17px 0 14px;border-radius:25px;
  background:var(--s1);color:var(--ink);font-size:16px;font-weight:600;letter-spacing:-.2px;transition:transform .16s var(--out),background-color .2s}
html body .craft-entry:active{transform:scale(.95)}
html body .craft-entry .i{width:22px;height:22px;color:var(--ac);overflow:visible}
