/* The basket drawer, September 2026: every .bk- rule from C:\Users\jack\design\basket-2026.html.
   Built by scratchpad/design-2026/build-basket.py - do not edit by hand. */
:root{--bk-w:440px;--bk-pic:72px;--bk-h:24px;--bk-name:19px;--bk-price:18px;--bk-pay:30px;--bk-text:15.5px;--bk-pad:28px;--bk-gap:28px}
.bk-veil{position:fixed;inset:0;z-index:120;background:rgba(65,64,66,0);transition:background .38s var(--ease);pointer-events:none}
.bk-veil.on{background:rgba(65,64,66,.4);pointer-events:auto}
.bk{position:fixed;top:0;right:0;bottom:0;width:min(var(--bk-w),100%);background:var(--paper);color:var(--ink);z-index:121;
    display:flex;flex-direction:column;box-shadow:-30px 0 80px rgba(65,64,66,.22);transform:translateX(104%);transition:transform .42s var(--ease)}
.bk.open{transform:none}
body.bk-lock{overflow:hidden}
.bk-top{flex:0 0 auto;display:flex;align-items:center;justify-content:space-between;height:var(--bar);padding:0 calc(var(--bk-pad) - 16px) 0 var(--bk-pad)}
.bk-h{font:400 var(--bk-h)/1.05 var(--face);letter-spacing:-.005em;color:var(--ink)}
.bk-x{position:relative;width:56px;height:56px;display:grid;place-items:center;background:transparent;border:0;border-radius:0;color:var(--ink);cursor:pointer;transition:background .3s var(--ease)}
.bk-x i{display:block;width:20px;height:1.5px;background:currentColor;transform:rotate(45deg);position:relative}
.bk-x i::after{content:"";position:absolute;inset:0;background:currentColor;transform:rotate(90deg)}
.bk-x:hover{background:var(--stone)}
.bk-body{flex:1 1 auto;min-height:0;overflow:auto;padding:8px var(--bk-pad) 24px}
.bk-added{display:flex;align-items:baseline;gap:12px;margin:0 0 26px;font:400 var(--bk-text)/1.5 var(--serif);color:var(--ink-75);animation:bk-in .5s var(--ease) both}
.bk-tick{flex:0 0 13px;width:13px;height:7px;border-left:1.5px solid var(--forest);border-bottom:1.5px solid var(--forest);transform:translateY(-3px) rotate(-45deg)}
@keyframes bk-in{from{opacity:0}to{opacity:1}}
.bk-lines{display:flex;flex-direction:column;gap:var(--bk-gap)}
.bk-l{display:grid;grid-template-columns:var(--bk-pic) minmax(0,1fr) auto;gap:0 18px;align-items:start;transition:opacity .2s}
.bk-l.wait{opacity:.6}
.bk-pic,.bk-noimg{width:var(--bk-pic);aspect-ratio:4/5;object-fit:cover;background:var(--stone);display:block}
.bk-lb{min-width:0;padding-top:2px}
.bk-lb b{display:block;font:400 var(--bk-name)/1.15 var(--face);letter-spacing:-.005em;color:var(--ink)}
.bk-lb .k{display:block;margin-top:4px;font:italic 400 14px/1.4 var(--serif);color:var(--ink-55)}
.bk-row{display:flex;align-items:center;gap:18px;margin-top:14px}
.bk .qty{display:inline-flex;align-items:stretch;height:36px;border:1px solid var(--ink-35);border-radius:0}
.bk .qty button{width:36px;border:0;background:transparent;color:var(--ink);font:300 20px/1 var(--face);cursor:pointer;border-radius:0;transition:background .3s var(--ease)}
.bk .qty button:hover{background:var(--stone)}
.bk .qty span{display:grid;place-items:center;min-width:34px;font:400 14px/1 var(--sans);color:var(--ink)}
.bk .rm{font:400 13px/1 var(--sans);color:var(--ink-55);text-decoration:underline;text-underline-offset:4px;text-decoration-color:var(--ink-35);background:transparent;border:0;padding:0;cursor:pointer;transition:color .3s}
.bk .rm:hover{color:var(--ink);text-decoration-color:var(--ink)}
.bk-p{padding-top:3px;text-align:right;font:400 var(--bk-price)/1.1 var(--face);color:var(--ink)}
.bk-each{display:block;margin-top:5px;font:400 11px/1.3 var(--sans);letter-spacing:.04em;color:var(--ink-55);white-space:nowrap}
.bk-sum{margin-top:40px;display:grid;gap:12px}
.bk-sum div{display:flex;justify-content:space-between;align-items:baseline;gap:16px}
.bk-sum span{font:600 10.5px/1.4 var(--sans);letter-spacing:.2em;text-transform:uppercase;color:var(--ink-75)}
.bk-sum b{font:400 var(--bk-price)/1.1 var(--face);color:var(--ink)}
.bk-sum .pay{margin-top:10px}
.bk-sum .pay span{font:400 20px/1.1 var(--face);letter-spacing:-.005em;text-transform:none;color:var(--ink)}
.bk-sum .pay b{font-size:var(--bk-pay)}
.bk-note{margin-top:22px;font:400 14px/1.55 var(--serif);color:var(--ink-55)}
.bk-note a{color:var(--ink);text-decoration:underline;text-underline-offset:3px;text-decoration-color:var(--ink-35)}
.bk-note a:hover{text-decoration-color:var(--ink)}
.bk-foot{flex:0 0 auto;padding:12px var(--bk-pad) var(--bk-pad);display:flex;flex-direction:column;gap:10px;background:var(--paper)}
.bk-foot .btn{width:100%}
.bk .btn:not(.quiet){background:var(--tweed);color:var(--shell);border-color:var(--tweed);--hover-bg:var(--cask);--hover-color:var(--shell)}
.bk .btn.quiet{background:transparent;color:var(--tweed);border-color:currentColor;--hover-bg:var(--tweed);--hover-color:var(--shell)}
.bk-empty{padding-top:10px}
.bk-empty .bk-q{font:400 28px/1.08 var(--face);letter-spacing:-.005em;color:var(--ink);margin:0 0 12px}
.bk-empty p{font:400 var(--bk-text)/1.55 var(--serif);color:var(--ink-75)}
.bk-empty .btns{margin-top:22px;display:flex}
@media(prefers-reduced-motion:reduce){.bk,.bk-veil,.bk-added{transition:none;animation:none}}
@media(max-width:1100px){.bks-groups{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:640px){.bks-groups{grid-template-columns:1fr}}