/* drawer */
.dw{position:fixed;inset:0;z-index:70;overscroll-behavior:contain}
.dw-bd{position:absolute;inset:0;background:rgba(42,33,28,.42);opacity:0;transition:opacity .42s ease}
.dw.on .dw-bd{opacity:1}
.dw-p{position:absolute;top:0;right:0;bottom:0;width:min(420px,100%);max-width:100%;background:var(--paper);display:grid;grid-template-rows:auto 1fr auto;transform:translateX(100%);transition:transform .46s cubic-bezier(.22,.8,.26,1);padding-top:env(safe-area-inset-top)}
@media(prefers-reduced-motion:reduce){.dw-p,.dw-bd{transition-duration:.001ms}}
.dw.on .dw-p{transform:none}
.dw-h{display:flex;align-items:center;justify-content:space-between;padding:18px 20px;border-bottom:1px solid var(--line)}
.dw-h .x{width:40px;height:40px;border-radius:999px;border:0;background:var(--paper2);font-size:20px;cursor:pointer;color:var(--ink);line-height:1}
.dw-b{overflow-y:auto;-webkit-overflow-scrolling:touch;overscroll-behavior:contain;padding:18px 20px;display:grid;gap:18px;align-content:start}
.dw-f{border-top:1px solid var(--line);padding:16px 20px calc(20px + env(safe-area-inset-bottom));display:grid;gap:10px;background:var(--paper2)}
.dw-empty{display:grid;gap:12px;justify-items:start;padding-top:20px}
.dw-empty .ser{font-size:24px}
.prog{display:grid;gap:8px}
.prog-t{font-size:12.5px;letter-spacing:.06em;color:var(--deep)}
.prog-r{height:5px;border-radius:999px;background:var(--line);overflow:hidden}
.prog-r span{display:block;height:100%;background:var(--deep);border-radius:999px;transition:width .6s ease}
.ll{list-style:none;margin:0;padding:0;display:grid;gap:14px}
.li{display:grid;grid-template-columns:72px 1fr auto;gap:12px;align-items:start;padding-bottom:14px;border-bottom:1px solid var(--line)}
.li:last-child{border-bottom:0;padding-bottom:0}
.li img{width:72px;height:72px;object-fit:cover;border-radius:12px;background:var(--paper2)}
.li-m{display:grid;gap:5px;min-width:0}
.li-n{font-family:"Fraunces",Georgia,serif;font-size:16px;line-height:1.2}
.li-r{display:grid;gap:6px;justify-items:end;text-align:right}
.li-p{font-variant-numeric:tabular-nums;font-size:15px}
.stp{display:inline-flex;align-items:center;border:1px solid var(--line);border-radius:999px;height:36px;background:var(--paper);width:fit-content}
.stp button{width:34px;height:34px;border:0;background:0;cursor:pointer;font-size:16px;color:var(--ink)}
.stp span{min-width:22px;text-align:center;font-size:14px;font-variant-numeric:tabular-nums}
.dw .row{display:flex;justify-content:space-between;gap:14px;align-items:baseline;font-size:14.5px}
.dw .row b{font-variant-numeric:tabular-nums;font-weight:400}
.dw .mut{color:var(--soft)}.dw .sm{font-size:12.5px}
.dw .eb{font-size:10.5px;letter-spacing:.24em;text-transform:uppercase;color:var(--deep)}

@media(pointer:coarse){
.stp{height:44px}
.stp button{width:44px;height:44px;font-size:18px}
.stp span{min-width:26px;font-size:15px}
.lnk{padding:15px 4px;margin:-15px -4px}
.dw-h .x{width:44px;height:44px}
}
