/* ============================================================
   STAY SOLID — cart drawer + toast (self-contained)
   Used by pages that inject the drawer via store.js but don't
   load the full store.css (e.g. the landing page).
   Vars have fallbacks so this works standalone.
   ============================================================ */
.cart-overlay{position:fixed;inset:0;background:rgba(0,0,0,.6);backdrop-filter:blur(3px);
  z-index:9500;opacity:0;visibility:hidden;transition:.45s cubic-bezier(.7,0,.2,1)}
.cart-overlay.open{opacity:1;visibility:visible}

.drawer{position:fixed;top:0;right:0;height:100%;width:min(440px,92vw);
  background:var(--bg-2,#111110);z-index:9600;display:flex;flex-direction:column;
  transform:translateX(100%);transition:transform .5s cubic-bezier(.7,0,.2,1);
  border-left:1px solid var(--line,rgba(236,231,221,.14))}
.drawer.open{transform:translateX(0)}
.drawer__head{display:flex;justify-content:space-between;align-items:center;padding:24px 26px;
  border-bottom:1px solid var(--line,rgba(236,231,221,.14))}
.drawer__head h3{font-family:var(--f-display,'Anton',sans-serif);font-size:24px;text-transform:uppercase;letter-spacing:.02em}
.drawer__head h3 b{color:var(--acid,#F9A826)}
.drawer__close{font-family:var(--f-mono,'JetBrains Mono',monospace);font-size:12px;letter-spacing:.1em;
  background:none;border:none;color:inherit;cursor:pointer}
.drawer__close:hover{color:var(--acid,#F9A826)}
.drawer__items{flex:1;overflow-y:auto;padding:8px 26px}
.drawer__empty{height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;
  gap:18px;text-align:center;color:var(--ink-dim,#7d7870)}
.drawer__empty p{font-family:var(--f-mono,'JetBrains Mono',monospace);font-size:12px;letter-spacing:.12em;text-transform:uppercase}
.ci{display:grid;grid-template-columns:72px 1fr auto;gap:14px;padding:18px 0;
  border-bottom:1px solid var(--line-soft,rgba(236,231,221,.07))}
.ci__img{width:72px;height:96px;object-fit:cover;background:var(--bg-3,#161614);filter:grayscale(.4)}
.ci__name{font-weight:700;font-size:14px;text-transform:uppercase;letter-spacing:.01em}
.ci__sub{font-family:var(--f-mono,'JetBrains Mono',monospace);font-size:11px;color:var(--ink-dim,#7d7870);margin-top:5px;letter-spacing:.05em}
.ci__qty{display:inline-flex;align-items:center;gap:10px;margin-top:10px;font-family:var(--f-mono,'JetBrains Mono',monospace);font-size:12px}
.ci__qty button{width:22px;height:22px;border:1px solid var(--line,rgba(236,231,221,.14));background:none;
  color:var(--ink,#ECE7DD);font-size:13px;line-height:1;cursor:pointer}
.ci__qty button:hover{border-color:var(--acid,#F9A826);color:var(--acid,#F9A826)}
.ci__right{display:flex;flex-direction:column;align-items:flex-end;justify-content:space-between}
.ci__price{font-family:var(--f-mono,'JetBrains Mono',monospace);font-size:13px;color:var(--acid,#F9A826)}
.ci__rm{font-family:var(--f-mono,'JetBrains Mono',monospace);font-size:10px;letter-spacing:.08em;text-transform:uppercase;
  color:var(--ink-dim,#7d7870);background:none;border:none;cursor:pointer}
.ci__rm:hover{color:var(--acid,#F9A826)}
.drawer__foot{padding:22px 26px;border-top:1px solid var(--line,rgba(236,231,221,.14))}
.drawer__row{display:flex;justify-content:space-between;font-family:var(--f-mono,'JetBrains Mono',monospace);font-size:13px;margin-bottom:8px}
.drawer__row .muted{color:var(--ink-dim,#7d7870)}
.drawer__note{font-family:var(--f-mono,'JetBrains Mono',monospace);font-size:10px;letter-spacing:.06em;
  text-transform:uppercase;color:var(--ink-dim,#7d7870);text-align:center;margin-top:12px}

/* buttons used inside the drawer */
.drawer .btn{display:inline-flex;align-items:center;justify-content:center;gap:12px;
  font-family:var(--f-mono,'JetBrains Mono',monospace);font-size:13px;letter-spacing:.08em;text-transform:uppercase;
  padding:18px 32px;border-radius:100px;transition:background .3s,color .3s;cursor:pointer;text-decoration:none}
.drawer .btn--solid{background:var(--acid,#F9A826);color:#0b0b0b;font-weight:700}
.drawer .btn--solid:hover{background:var(--ink,#ECE7DD)}
.drawer .btn--ghost{border:1px solid var(--line,rgba(236,231,221,.14));color:var(--ink,#ECE7DD)}
.drawer .btn--ghost:hover{border-color:var(--acid,#F9A826);color:var(--acid,#F9A826)}
.drawer .btn--block{width:100%}

/* toast */
.toast{position:fixed;bottom:26px;left:50%;transform:translateX(-50%) translateY(140%);z-index:9700;
  background:var(--acid,#F9A826);color:#0b0b0b;font-family:var(--f-mono,'JetBrains Mono',monospace);
  font-size:12px;letter-spacing:.08em;text-transform:uppercase;padding:14px 22px;border-radius:100px;
  transition:transform .5s cubic-bezier(.7,0,.2,1);font-weight:700}
.toast.show{transform:translateX(-50%) translateY(0)}