/* mempad-list.css v2 (22.10.2026: стопка .lc-stack, см. ниже)
/* mempad-list.css v1 (22.10.2026, Влад: «все списки в едином стиле, как на главной»).
   Единая карточка списка (.lc) — копия карточки монеты витрины app.html: картинка вписана в левый край карточки без поля
   (68px на компе, 58px на телефоне), слева имя + подстрока, справа крупное число + подпись; свёрнутая карточка = шапка,
   тело (.lc-bd) открывается по клику (.open) или всегда видно у «сообщений» (.msg — Burn Journal).
   Панель над списком (.lbar) — как на витрине: [сортировка ▾ (янтарная)] [фильтр/период ▾] … [большое «всего» справа].
   Используют: копилки (mempad-piggy.js), лидерборд (users.html), стена (mempad-wall.js), страница монеты (вкладки). */
.lc{background:var(--card);border:1px solid var(--line);border-radius:14px;margin-bottom:10px;overflow:hidden;position:relative}
.lc-hd{display:flex;align-items:center;gap:12px;padding:0 14px 0 0;min-height:68px;cursor:pointer;position:relative;color:inherit;text-decoration:none;-webkit-user-select:none;user-select:none}
.lc-img{width:68px;height:68px;border-radius:0;background:var(--card2);object-fit:cover;flex:none;align-self:stretch;display:flex;align-items:center;justify-content:center;overflow:hidden;color:var(--acc);font:700 24px/1 var(--disp,'Oswald',sans-serif);text-decoration:none;position:relative}
.lc-img img{width:100%;height:100%;object-fit:cover;display:block}
.lc-img .ic{width:26px;height:26px}
.lc-nm{flex:1;min-width:0;position:relative;line-height:1.3}
.lc-nm b{font-size:16px}
.lc-nm .ttl{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;line-height:1.25} /* имя + бейдж — одной строкой с «…» */
.lc-nm a{text-decoration:none;color:inherit}
.lc-nm .sub{color:var(--mut);font-size:13px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.lc-nm .sub .ic{width:12px;height:12px;vertical-align:-2px}
.lc-val{text-align:right;flex:none;position:relative;max-width:48%;line-height:1.3;font-variant-numeric:tabular-nums}
.lc-val b{font-size:15px;display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.lc-val b span{color:var(--mut);font-weight:400;font-size:12px}
.lc-val .sub{font-size:12px;color:var(--mut);white-space:nowrap}
.lc-val .sub .ic{width:11px;height:11px;vertical-align:-1px}
.lc-val .sub.up{color:var(--up);font-weight:600}
.lc-val .sub.acc{color:var(--acc);font-weight:600}
/* копилка: сколько набрано — полупрозрачная зелёная заливка всей свёрнутой карточки слева направо (вместо отдельной полоски) */
.lc-fill{position:absolute;left:0;top:0;bottom:0;width:0;background:rgba(14,159,110,.16);pointer-events:none;transition:width .4s}
.lc-fill.full{background:rgba(14,159,110,.24)}
:root[data-theme=dark] .lc-fill{background:rgba(49,196,141,.16)}:root[data-theme=dark] .lc-fill.full{background:rgba(49,196,141,.26)}
.lc-bd{display:none;border-top:1px solid var(--line);padding:12px 14px;font-size:14px}
.lc.open .lc-bd,.lc.msg .lc-bd{display:block}
.lc.msg .lc-hd{cursor:default}
.lc.is-mine{background:linear-gradient(rgba(14,159,110,.12),rgba(14,159,110,.12)) var(--card);border-color:rgba(14,159,110,.40)}
.lc.is-new{background:linear-gradient(rgba(240,185,11,.14),rgba(240,185,11,.14)) var(--card);border-color:rgba(240,185,11,.35)}
.lc.dim{opacity:.55}
.lc-badge{font-size:10px;border-radius:6px;padding:2px 6px;vertical-align:2px;background:rgba(240,185,11,.18);color:var(--acc);font-weight:800;white-space:nowrap}
.lc-badge.grey{background:var(--card2);color:var(--mut)}
.lc-badge.up{background:rgba(49,196,141,.18);color:var(--up)}
.lc-list{display:block}
/* панель списка — как .bar на витрине */
.lbar{display:flex;gap:6px;align-items:center;min-width:0;margin:0 0 8px;position:relative;z-index:40}
/* v2 22.10.2026 (Влад: «все карточки складываются как токены на витрине»): страница с MempadList.stack() получает .lc-stack на корне списка —
   панель липнет под шапкой/вкладками (--lbt), карточки .lc складываются под ней стопкой (stack.js, как #list .card на /app).
   Накрытая карточка — содержимое тает по --hid (stack.js v3.8), контур остаётся; панель на всю ширину (−14px = padding .wrap), фон страницы. */
.lc-stack .lbar{position:sticky;top:var(--lbt,0px);margin:0 -14px 8px;padding:10px 14px 6px;background:var(--bg)}
.lc-stack .lc{will-change:transform}
.lc-stack .lc.stk{box-shadow:0 -3px 10px rgba(0,0,0,.14)}:root[data-theme=light] .lc-stack .lc.stk{box-shadow:0 -3px 10px rgba(0,0,0,.06)}
.lc-stack .lc.stk .lc-hd,.lc-stack .lc.stk .lc-bd{opacity:max(0,calc(1 - var(--hid,0)*1.25))}
.lc-stack .lc.stk-fc{position:relative}
.lbar .sq{background:var(--card);border:1px solid var(--line);color:var(--mut);display:inline-flex;align-items:center;justify-content:center;gap:6px;border-radius:10px;height:34px;min-width:34px;padding:0 10px;font-size:13px;line-height:1;white-space:nowrap;flex:none;cursor:pointer;font-family:inherit}
.lbar .sq svg,.lbar .sq .ic{width:16px;height:16px;flex:none}
.lbar .sq .chev{width:12px;height:12px;opacity:.7;margin-left:-2px}
.lbar .sq b{color:var(--tx);font-weight:700;display:inline-flex;align-items:center;gap:5px}
.lbar .dd{position:relative;flex:none;display:flex}
.lbar .dd.open>.sq{border-color:var(--acc);color:var(--tx)}
.lbar .dd.on>.sq{border-color:var(--acc);background:color-mix(in srgb,var(--acc) 12%,var(--card));color:var(--acc)}.lbar .dd.on>.sq b{color:var(--acc)}
.lbar .dd.sort>.sq{background:var(--btn);border-color:var(--btn);color:var(--btnTx)}.lbar .dd.sort>.sq b{color:var(--btnTx)}.lbar .dd.sort>.sq .chev{opacity:.85}
.lbar .dd.sort.open>.sq{filter:brightness(1.08)}
.lbar .seg{display:inline-flex;border:1px solid var(--line);border-radius:10px;overflow:hidden;flex:none}
.lbar .seg .sq{border:0;border-radius:0;height:32px}.lbar .seg .sq+.sq{border-left:1px solid var(--line)}
.lbar .seg .sq.act{background:var(--btn);color:var(--btnTx);font-weight:700}
.lbar .dd-menu{position:absolute;top:calc(100% + 6px);left:0;z-index:60;display:none;min-width:190px;background:var(--card);border:1px solid var(--line);border-radius:12px;padding:5px;box-shadow:0 14px 44px rgba(0,0,0,.45)}
:root[data-theme=light] .lbar .dd-menu{box-shadow:0 14px 44px rgba(0,0,0,.14)}
.lbar .dd.open .dd-menu{display:block}.lbar .dd-menu.r{left:auto;right:0}
.lbar .dd-h{color:var(--mut);font-size:10px;letter-spacing:.08em;text-transform:uppercase;font-weight:700;padding:7px 9px 3px}
.lbar .dd-it{display:flex;align-items:center;gap:8px;width:100%;border:0;background:none;color:var(--tx);font:inherit;font-size:13px;padding:8px 9px;border-radius:9px;cursor:pointer;text-align:left;white-space:nowrap}
.lbar .dd-it:hover{background:var(--card2)}.lbar .dd-it.act{font-weight:700}.lbar .dd-it.off{color:var(--mut)}
.lbar .dd-it .sp{flex:1;min-width:14px}.lbar .dd-it .mk{color:var(--acc);font-weight:700;font-size:12px;min-width:12px;text-align:right}
.lbar .dd-sep{height:1px;background:var(--line);margin:4px 6px}
.lbar .tot{flex:1;min-width:0;text-align:right;line-height:1;padding-left:4px;overflow:hidden;white-space:nowrap}
.lbar .tot b{font-size:20px;font-weight:800;letter-spacing:-.01em;display:block;overflow:hidden;text-overflow:ellipsis}
.lbar .tot small{display:block;color:var(--mut);font-size:10px;margin-top:3px;overflow:hidden;text-overflow:ellipsis}
@media(max-width:640px){
 .lc{margin-bottom:5px;border-radius:11px}
 .lc-hd{padding:0 10px 0 0;gap:9px;min-height:58px}
 .lc-img{width:58px;height:58px;font-size:20px}
 .lc-nm b{font-size:15px}.lc-nm .sub{font-size:12.5px;line-height:1.15}
 .lc-val b{font-size:15px}.lc-val .sub{font-size:11px;line-height:1.15}.lc-val{max-width:50%}
 .lc-bd{padding:8px 10px 10px;font-size:13px}
}
@media(max-width:400px){.lbar .sq{padding:0 8px;font-size:12px}.lbar{gap:5px}}