/* Tufforge cart drawer + buy box. Uses the page's :root tokens. */
.tf-cart-btn{position:relative; display:inline-flex; align-items:center; justify-content:center; width:44px; height:44px; border:1px solid var(--line); border-radius:999px; background:transparent; color:var(--ink); cursor:pointer}
.tf-cart-btn:hover{border-color:var(--yellow); color:var(--yellow)}
.tf-cart-badge{position:absolute; top:-4px; right:-4px; min-width:20px; height:20px; padding:0 5px; border-radius:999px; background:var(--yellow); color:#0a0a0a; font:800 11px/20px system-ui,sans-serif; text-align:center}
.tf-cart-badge[hidden]{display:none}

.tf-cart-overlay{position:fixed; inset:0; background:rgba(0,0,0,.6); opacity:0; pointer-events:none; transition:opacity .2s; z-index:90}
.tf-cart-overlay.open{opacity:1; pointer-events:auto}
.tf-cart{position:fixed; top:0; right:0; height:100%; width:min(420px,100%); background:var(--bg-2); border-left:1px solid var(--line); color:var(--ink); display:flex; flex-direction:column; transform:translateX(100%); transition:transform .25s ease; z-index:100}
.tf-cart.open{transform:none}
html.tf-cart-lock{overflow:hidden}
.tf-cart-head{display:flex; align-items:center; justify-content:space-between; padding:20px 22px; border-bottom:1px solid var(--line)}
.tf-cart-head h2{margin:0; font-size:20px}
.tf-cart-x{background:none; border:0; color:var(--ink-2); font-size:30px; line-height:1; cursor:pointer; width:44px; height:44px}
.tf-cart-x:hover{color:var(--yellow)}
.tf-cart-list{flex:1; overflow:auto; padding:8px 22px}
.tf-cart-empty{color:var(--ink-3); padding:30px 0}
.tf-cart-item{display:grid; grid-template-columns:72px 1fr auto; gap:14px; padding:16px 0; border-bottom:1px solid var(--line)}
.tf-cart-item img{width:72px; height:72px; object-fit:cover; border-radius:10px; background:var(--bg-3)}
.tf-cart-info{display:flex; flex-direction:column; gap:4px; min-width:0}
.tf-cart-price{display:flex; flex-direction:column; align-items:flex-end; gap:8px}
.tf-cart-remove{background:none; border:0; color:var(--ink-3); font-size:12px; text-decoration:underline; cursor:pointer; padding:0}
.tf-cart-remove:hover{color:var(--red)}
.tf-cart-foot{padding:18px 22px 22px; border-top:1px solid var(--line); display:flex; flex-direction:column; gap:8px}
.tf-cart-row{display:flex; justify-content:space-between}
.tf-cart-muted{color:var(--ink-3)}
.tf-cart-small{font-size:12px; margin:0}
.tf-cart-checkout{width:100%; justify-content:center; margin-top:6px}
.tf-cart-checkout:disabled{opacity:.45; cursor:not-allowed; transform:none}
.tf-cart-note{color:var(--ink-2); text-align:center; min-height:1em}

.tf-qty{display:inline-flex; align-items:center; border:1px solid var(--line); border-radius:999px; width:max-content; margin-top:4px}
.tf-qty button{background:none; border:0; color:var(--ink); width:32px; height:32px; font-size:16px; cursor:pointer}
.tf-qty button:hover{color:var(--yellow)}
.tf-qty span,.tf-qty input{min-width:28px; text-align:center; font-weight:700}
.tf-qty input{width:40px; background:transparent; border:0; color:var(--ink); font:inherit; font-weight:700; -moz-appearance:textfield}
.tf-qty input::-webkit-outer-spin-button,.tf-qty input::-webkit-inner-spin-button{-webkit-appearance:none; margin:0}
.tf-qty.lg button{width:44px; height:48px; font-size:20px}

/* Buy box */
.tf-buybox{display:grid; grid-template-columns:1fr 1fr; gap:clamp(24px,4vw,56px); align-items:center; text-align:left; margin-top:36px; padding:clamp(20px,3vw,36px); border:1px solid var(--line); border-radius:20px; background:var(--bg-2)}
.tf-buybox img{width:100%; height:auto; border-radius:14px; background:var(--bg-3)}
.tf-buybox h3{margin:0 0 6px; font-size:clamp(22px,2.4vw,30px)}
.tf-buybox .tf-price{font-size:34px; font-weight:800; color:var(--yellow); margin:10px 0 4px}
.tf-buybox ul{margin:16px 0; padding-left:18px; color:var(--ink-2); line-height:1.7}
.tf-buy-actions{display:flex; gap:12px; flex-wrap:wrap; align-items:center; margin-top:18px}
.tf-buy-alt{display:block; margin-top:14px; font-size:13px; color:var(--ink-3)}
.tf-buy-alt a{color:var(--ink-2)}
@media (max-width:760px){ .tf-buybox{grid-template-columns:1fr} }
.tf-cart-pay{margin-top:6px; min-height:48px; position:relative; z-index:1}
.tf-cart-pay[hidden]{display:none}
.tf-cart-thanks{padding:30px 0}
.tf-cart-thanks h3{margin:0 0 8px; color:var(--yellow)}
.tf-cart-thanks p{margin:0 0 8px; color:var(--ink-2)}
.tf-cart-note a{color:var(--yellow); text-decoration:underline}