/* LootBox interactive checkout wizard */
.checkout{background:var(--panel);border:1px solid var(--line);border-radius:14px;padding:clamp(18px,3vw,28px);margin-top:26px;position:relative}
.co-steps{display:flex;gap:6px;margin-bottom:22px}
.co-step{flex:1;display:flex;align-items:center;gap:9px;font:800 10px "DM Mono",monospace;letter-spacing:.12em;text-transform:uppercase;color:#555;padding:10px 12px;border:1px solid var(--line);border-radius:9px;transition:.25s}
.co-step .n{width:22px;height:22px;border-radius:50%;background:#222;color:#888;display:flex;align-items:center;justify-content:center;font-size:11px;transition:.25s}
.co-step.active{border-color:var(--orange);color:#fff;background:#141414}
.co-step.active .n{background:var(--orange);color:#090909}
.co-step.done{border-color:#1f5138;color:#4ade80}
.co-step.done .n{background:#14532d;color:#4ade80}
.co-panel{display:none;animation:coIn .35s ease}
.co-panel.active{display:block}
@keyframes coIn{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
.f-wrap{margin-bottom:4px}
.f-inline{display:grid;grid-template-columns:1fr 1fr;gap:0 14px}
.f-err{color:#f87171;font-size:12px;min-height:16px;margin:4px 0 0}
.f-in.valid{border-color:#22c55e}
.f-in.invalid{border-color:#ef4444}
.size-guide-btn{background:none;border:0;color:var(--orange);font:700 10px "DM Mono",monospace;letter-spacing:.1em;text-transform:uppercase;cursor:pointer;margin-left:10px;text-decoration:underline;text-underline-offset:3px}
/* payment dynamic panels */
.pay-panel{overflow:hidden;max-height:0;opacity:0;transition:max-height .35s ease,opacity .3s ease,margin .3s ease}
.pay-panel.open{max-height:340px;opacity:1;margin-bottom:18px}
.bkash-box{background:#0d0d0d;border:1px dashed var(--orange);border-radius:10px;padding:14px 16px;font-size:13px}
.bkash-box .num-row{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.bkash-box b{color:var(--orange);font:700 17px "DM Mono",monospace}
.copy-btn{background:transparent;border:1px solid var(--orange);color:var(--orange);border-radius:7px;padding:6px 12px;font-size:11px;font-weight:800;letter-spacing:.08em;cursor:pointer;text-transform:uppercase}
.copy-btn.copied{background:var(--orange);color:#090909}
.bkash-steps{color:var(--muted);font-size:12px;line-height:1.7;margin:10px 0 2px}
.bkash-steps b{color:#ddd}
.cod-panel{background:#0d0d0d;border:1px solid var(--line);border-radius:10px;padding:14px 16px;color:var(--muted);font-size:13px;line-height:1.6}
.opt-row.disabled{opacity:.45;pointer-events:none}
.opt-row .note{color:var(--amber,#f59e0b);font-size:11px;margin-top:3px}
/* review */
.review-card{background:#0d0d0d;border:1px solid var(--line);border-radius:12px;padding:6px 16px;margin-bottom:16px}
.rev-row{display:flex;align-items:baseline;gap:10px;padding:11px 0;border-bottom:1px solid #1a1a1a;font-size:13px}
.rev-row:last-child{border-bottom:0}
.rev-row .k{color:var(--muted);font-size:11px;letter-spacing:.08em;text-transform:uppercase;min-width:84px}
.rev-row .v{flex:1;color:#eee;font-weight:600}
.rev-edit{background:none;border:0;color:var(--orange);font:800 10px "DM Mono",monospace;letter-spacing:.08em;text-transform:uppercase;cursor:pointer}
.breakdown{background:#0d0d0d;border:1px solid var(--line);border-radius:12px;padding:14px 16px;margin-bottom:16px}
.bd-row{display:flex;justify-content:space-between;color:var(--muted);font-size:13px;padding:5px 0}
.bd-row b{color:#fff}
.bd-row.total{border-top:1px solid var(--line);margin-top:7px;padding-top:11px;color:#fff;font:800 15px "DM Mono",monospace}
.bd-row.total .v{color:var(--orange);font-size:20px}
.total-pulse{animation:pulse .3s ease}
@keyframes pulse{0%{transform:scale(1.08)}100%{transform:scale(1)}}
/* related */
.related{margin-top:20px;border-top:1px solid var(--line);padding-top:16px}
.related h4{font:10px "DM Mono",monospace;letter-spacing:.14em;text-transform:uppercase;color:#999;margin:0 0 12px}
.related-card{display:flex;align-items:center;gap:14px;background:#0d0d0d;border:1px solid var(--line);border-radius:12px;padding:10px;text-decoration:none;color:inherit;transition:.2s}
.related-card:hover{border-color:var(--orange)}
.related-card img{width:64px;height:80px;object-fit:cover;border-radius:8px}
.related-card .t{font-family:"Barlow Condensed",sans-serif;font-weight:900;text-transform:uppercase;font-size:19px}
.related-card .s{color:var(--muted);font-size:12px}
.related-card .p{margin-left:auto;font:700 15px "DM Mono",monospace;color:var(--orange)}
/* size guide modal */
.modal-backdrop{position:fixed;inset:0;background:rgba(0,0,0,.7);backdrop-filter:blur(4px);z-index:1200;display:none;align-items:center;justify-content:center;padding:20px}
.modal-backdrop.open{display:flex}
.modal{background:var(--panel);border:1px solid var(--line);border-radius:16px;width:100%;max-width:430px;padding:26px;position:relative;animation:coIn .3s ease}
.modal h3{font-family:Anton,sans-serif;font-size:26px;text-transform:uppercase;margin:0 0 14px}
.modal-close{position:absolute;top:14px;right:16px;background:none;border:0;color:#888;font-size:20px;cursor:pointer}
.size-table{width:100%;border-collapse:collapse;font-size:13px}
.size-table th{font:10px "DM Mono",monospace;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);text-align:left;padding:8px 6px;border-bottom:1px solid var(--line)}
.size-table td{padding:9px 6px;border-bottom:1px solid #1c1c1c;color:#ccc}
.size-table tr:last-child td{border-bottom:0}
.modal .note{color:var(--muted);font-size:12px;margin-top:14px;line-height:1.6}
/* sticky bar (mobile) */
.co-bar{position:fixed;left:0;right:0;bottom:0;z-index:1100;display:flex;align-items:center;justify-content:space-between;gap:14px;background:rgba(8,8,8,.95);backdrop-filter:blur(14px);border-top:1px solid var(--line);padding:12px clamp(16px,4vw,28px);transform:translateY(110%);transition:transform .3s ease}
.co-bar.show{transform:none}
.co-bar .l{font:9px "DM Mono",monospace;letter-spacing:.13em;text-transform:uppercase;color:#999;display:block}
.co-bar .v{font:800 22px "DM Mono",monospace;color:var(--orange)}
.co-bar-btn{background:var(--orange);border:0;color:#090909;font:800 12px Outfit,sans-serif;letter-spacing:.12em;text-transform:uppercase;padding:15px 30px;border-radius:10px;cursor:pointer;flex-shrink:0}
.co-bar-btn:disabled{opacity:.5;cursor:wait}
@media(min-width:901px){.co-bar{display:none}}