/* Cột pallet xếp dần theo tiến độ cuộn (mép phải, chỉ màn lớn) */
.stackmeter { position: fixed; right: 18px; bottom: 28px; z-index: 40; display: flex; flex-direction: column; align-items: center; gap: 6px; opacity: 0; transform: translateY(12px); transition: opacity .3s ease, transform .3s ease; pointer-events: none; }
.stackmeter.is-show { opacity: 1; transform: none; }
.stackmeter__n { font: 600 13px var(--mono, ui-monospace, monospace); color: #14203F; background: #fff; border: 1px solid var(--line); padding: 2px 6px; font-variant-numeric: tabular-nums; }
.stackmeter__col { display: flex; flex-direction: column-reverse; gap: 3px; width: 34px; }
.stackmeter__col i { display: block; height: 7px; background: #D3D8E0; border-radius: 1px; position: relative; transition: background .25s ease, transform .35s cubic-bezier(.2, .9, .3, 1.2); transform: translateY(-14px) scaleX(.7); opacity: .55; }
.stackmeter__col i::before, .stackmeter__col i::after { content: ''; position: absolute; bottom: -3px; width: 5px; height: 3px; background: inherit; }
.stackmeter__col i::before { left: 3px; } .stackmeter__col i::after { right: 3px; }
.stackmeter__col i.is-on { background: #F68B1D; transform: none; opacity: 1; }
.stackmeter__f { width: 40px; height: 3px; background: #14203F; }
.kicker.draw::before { transform: scaleX(0); transform-origin: left; transition: transform .6s cubic-bezier(.2, .8, .2, 1) .1s; }
.kicker.draw.is-drawn::before { transform: none; }
[data-drift] { will-change: transform; }
@media (max-width: 1100px) { .stackmeter { display: none; } }
@media (prefers-reduced-motion: reduce) { .stackmeter { display: none; } .kicker.draw::before { transform: none; transition: none; } [data-drift] { transform: none !important; } }
@media print { .stackmeter { display: none; } }
