.yb4{border-bottom:1px solid var(--line);padding-block:clamp(48px,5.4vw,78px)}.yb4 .h2{max-width:14em}.ybt{--notch:14px;background:var(--surf);border-radius:22px;grid-template-columns:minmax(0,5fr) 0 minmax(0,7fr);margin-top:36px;display:grid;position:relative;box-shadow:inset 0 0 0 1px #8c756573,0 18px 40px #2b1a1214}.ybc{flex-direction:column;padding:clamp(22px,3vw,36px);display:flex}.ybc .ybl{flex-direction:column;flex:1;justify-content:space-between;display:flex}.ybc.you{background:#fbe7d2;border-radius:22px 0 0 22px}[dir=rtl] .ybc.you{border-radius:0 22px 22px 0}.ybh{align-items:center;gap:12px;margin-bottom:18px;display:flex}.ybh .tag{border-radius:999px;align-items:center;min-height:34px;padding:0 14px;font-size:16px;font-weight:800;display:inline-flex}.you .tag{background:var(--yolk);color:var(--cocoa)}.biss .tag{background:var(--cocoa);color:var(--cream)}.ybh span:last-child{color:var(--cocoa-2);font-size:15px}.ybl{gap:4px;margin:0;padding:0;list-style:none}.ybl li{border-bottom:1px solid #8c756540;grid-template-columns:44px minmax(0,1fr) 24px;align-items:center;gap:14px;min-height:60px;padding-block:8px;display:grid}.ybl li:last-child{border-bottom:0}.ybl .ic{background:var(--surf);width:44px;height:44px;color:var(--cocoa);border-radius:12px;place-items:center;display:grid}.biss .ybl .ic{background:var(--cream)}.ybl .ic .ico{width:22px;height:22px}.ybl span{font-size:16.5px;line-height:1.4}.ybl b.ok{background:var(--ok);color:#fff;border-radius:50%;place-items:center;width:24px;height:24px;display:grid}.ybl b.ok .ico{stroke-width:2.8px;width:14px;height:14px}.tear{z-index:2;position:relative}.tear:before{content:"";inset-block:18px;border-left:2px dashed var(--cocoa-3);position:absolute;left:-1px}.tear i{left:calc(-1 * var(--notch));width:calc(2 * var(--notch));height:calc(2 * var(--notch));background:var(--cream);border-radius:50%;position:absolute;box-shadow:inset 0 0 0 1px #8c756573}.tear i.t{top:calc(-1 * var(--notch))}.tear i.b{bottom:calc(-1 * var(--notch))}.tear .lbl{white-space:nowrap;background:var(--btn);color:#fff;border-radius:999px;padding:8px 14px;font-size:14.5px;font-weight:500;position:absolute;top:50%;left:0;translate:-50% -50%;box-shadow:0 6px 16px #e2431b40}.tear .run{background:var(--yolk);width:12px;height:12px;box-shadow:0 0 0 3px var(--surf);opacity:0;border-radius:50%;margin-left:-6px;position:absolute;top:18px;left:0}.ybt.on .tear .run{animation:3.6s cubic-bezier(.45,0,.55,1) 1.4s infinite run}@keyframes run{0%{opacity:0;top:18px}10%,85%{opacity:1}to{opacity:0;top:calc(100% - 30px)}}.ybr{font:800 clamp(20px, 2.2vw, 26px)/1.2 var(--f);text-align:center;justify-content:center;align-items:center;gap:12px;margin-top:26px;display:flex}.ybr .ico{width:26px;height:26px;color:var(--verm);flex:none}.ybt.arm .you li,.ybt.arm .biss li{opacity:0;transition:opacity .35s ease, transform .45s var(--ease);transition-delay:calc(var(--i) * 90ms + var(--d,0s));transform:translateY(10px)}.ybt.arm .biss li{--d:.7s}.ybt.arm.on li{opacity:1;transform:none}.ybt.arm .ok{transition:transform .3s cubic-bezier(.3,1.5,.5,1);transition-delay:calc(var(--i) * .11s + 1.1s);transform:scale(0)}.ybt.arm.on .ok{transform:none}.ybt.arm .tear:before{transform-origin:top;transition:transform .6s var(--ease-io) .35s;transform:scaleY(0)}.ybt.arm.on .tear:before{transform:none}.ybt.arm .tear .lbl{opacity:0;transition:opacity .25s ease .75s, scale .35s var(--ease) .75s;scale:.85}.ybt.arm.on .tear .lbl{opacity:1;scale:1}@media (max-width:860px){.ybc .ybl{justify-content:flex-start}.ybt{grid-template-rows:auto 0 auto;grid-template-columns:minmax(0,1fr)}.ybc.you,[dir=rtl] .ybc.you{border-radius:22px 22px 0 0}.tear:before{inset-block:auto;top:-1px;inset-inline:18px;border-left:0;border-top:2px dashed var(--cocoa-3);left:auto}.tear i{top:calc(-1 * var(--notch))!important;bottom:auto!important}.tear i.t{left:calc(-1 * var(--notch));right:auto}.tear i.b{left:auto;right:calc(-1 * var(--notch))}.tear .lbl{top:0;left:50%}.tear .run{margin-left:0;top:-6px;left:18px}.ybt.on .tear .run{animation-name:runx}@keyframes runx{0%{opacity:0;left:18px}10%,85%{opacity:1}to{opacity:0;left:calc(100% - 30px)}}.ybt.arm .tear:before{transform-origin:100%;transform:scaleX(0)}[dir=ltr] .ybt.arm .tear:before{transform-origin:0}.ybc.biss{padding-top:34px}}@media (prefers-reduced-motion:reduce){.ybt.arm li,.ybt.arm .ok,.ybt.arm .tear:before,.ybt.arm .tear .lbl{opacity:1;transition:none;transform:scale(1)}.ybt.on .tear .run{animation:none}}
