/* Shared drawing: Copy and Live, for each stack page's section on keeping the stack current */
.sd-cl{box-sizing:border-box;width:100%;max-width:620px;min-width:0;margin:0}
.sd-cl-row{display:grid;grid-template-columns:minmax(0,1fr) 88px minmax(0,1fr);align-items:start;max-width:620px}
.v9 .sd-cl-tag{margin:0 0 14px;font-weight:700;font-size:17px;line-height:1.2;color:#232834}
.sd-cl-page{position:relative;display:grid;gap:14px;padding:18px 18px 22px;border:1.5px solid #232834;border-radius:12px;background:#fff;box-shadow:6px 6px 0 #E4DFD9}
.v9 .sd-cl-up{position:absolute;top:-15px;right:-12px;padding:7px 12px;border:1.5px solid #232834;border-radius:16px;background:#fff;font-weight:700;font-size:16px;line-height:1;color:#232834}
.sd-cl-hd{display:flex;align-items:center;gap:8px;padding-bottom:12px;border-bottom:1.5px solid #E4DFD9}
.sd-cl-hd i{display:block;height:8px;border-radius:4px;background:#C2C5CC}
.sd-cl-hd i:first-child{flex:none;width:14px;height:14px;border-radius:50%;background:#232834}
.sd-cl-hd i + i{width:44%}
.sd-cl-b{display:flex;align-items:center;gap:10px;min-height:18px}
.sd-cl-b > i,.sd-cl-b > span{display:block;flex:1;min-width:0}
.sd-cl-b .t{height:12px;max-width:78%;border-radius:6px;background:#232834}
.sd-cl-b .p{height:56px;border-radius:8px;background:#E4DFD9}
.sd-cl-b span i{display:block;height:8px;border-radius:4px;background:#C2C5CC}
.sd-cl-b span i + i{width:70%;margin-top:8px}
.sd-cl-b b{position:relative;flex:none;display:block;width:18px;height:18px}
.sd-cl-b b::after{content:"";position:absolute;left:6px;top:2px;width:5px;height:10px;border:solid #232834;border-width:0 2.5px 2.5px 0;transform:rotate(45deg)}
.sd-cl-live .sd-cl-b{padding-right:28px}
.sd-cl-track{position:relative;height:6px;margin:150px 14px 0;overflow:hidden;background:repeating-linear-gradient(90deg,#C2C5CC 0 6px,transparent 6px 12px) 0 2px/100% 2px no-repeat}
.sd-cl-flow{position:absolute;top:1px;left:0;display:block;width:45%;height:4px;border-radius:2px;background:linear-gradient(90deg,rgba(250,84,120,0),#FA5478 70%);opacity:0}
@keyframes sdClFlow{0%{transform:translateX(-100%);opacity:0}20%{opacity:1}80%{opacity:1}100%{transform:translateX(222%);opacity:0}}
@media (prefers-reduced-motion:no-preference){
.sd-cl .sd-cl-up,.sd-cl .sd-cl-copy .sd-cl-b b{transition:opacity .45s cubic-bezier(.2,.7,.2,1),transform .55s cubic-bezier(.2,.7,.2,1)}
.sd-cl:not(.in) .sd-cl-up{opacity:0;transform:translateY(-10px)}
.sd-cl:not(.in) .sd-cl-copy .sd-cl-b b{opacity:0;transform:scale(.6)}
.sd-cl .sd-cl-copy .sd-cl-up{transition-delay:.5s}
.sd-cl .sd-cl-copy .sd-cl-b1 b{transition-delay:1.1s}
.sd-cl .sd-cl-copy .sd-cl-b2 b{transition-delay:1.5s}
.sd-cl .sd-cl-copy .sd-cl-b3 b{transition-delay:1.9s}
.sd-cl.in .sd-cl-flow{animation:sdClFlow .9s cubic-bezier(.45,0,.35,1) 2.4s 1 both}
.sd-cl .sd-cl-live .sd-cl-up{transition-delay:3.25s}
}
@media (max-width:560px){
.sd-cl-row{grid-template-columns:minmax(0,1fr) 40px minmax(0,1fr)}
.v9 .sd-cl-tag{font-size:16px;margin-bottom:12px}
.sd-cl-page{gap:11px;padding:13px 12px 16px;box-shadow:5px 5px 0 #E4DFD9}
.v9 .sd-cl-up{top:-13px;right:-9px;padding:5px 9px}
.sd-cl-b{gap:6px}
.sd-cl-b .p{height:40px}
.sd-cl-live .sd-cl-b{padding-right:24px}
.sd-cl-track{margin:118px 6px 0}
}