{{-- Scoped shop polish layer. Loaded after the main CSS, overrides shop-* visuals.
     No Vite rebuild needed. Uses the site's own design tokens. --}}
<style>
    :root{ --shop-grad: linear-gradient(135deg, #2563eb, #7c3aed); }

    /* Hero */
    .shop-hero{
        background:
            radial-gradient(900px 380px at 85% -120px, rgba(124,58,237,.14), transparent),
            radial-gradient(700px 320px at 0% 0%, rgba(37,99,235,.10), transparent),
            linear-gradient(180deg,#ffffff,#f6f7fb) !important;
        border-bottom:1px solid var(--border);
        padding:84px 0 56px !important;
    }
    .shop-kicker{
        display:inline-flex;align-items:center;gap:8px;background:var(--primary-soft);
        color:var(--primary-dark) !important;border:1px solid rgba(37,99,235,.18);
        border-radius:999px;padding:8px 16px;font-weight:700;letter-spacing:.01em;
    }
    .shop-hero-copy h1{ letter-spacing:-.025em;line-height:1.08; }
    .shop-hero-copy h1 span{
        background:var(--shop-grad);-webkit-background-clip:text;background-clip:text;color:transparent !important;
    }
    .shop-hero-panel{ border-radius:24px !important;box-shadow:0 18px 50px rgba(15,23,42,.10) !important; }
    .shop-stat-card{ border-radius:16px !important; }
    .shop-stat-card strong{ font-variant-numeric:tabular-nums; }

    /* Section rhythm */
    .shop-section{ padding-block:64px; }

    /* Filter pills */
    .shop-filter-pill{
        border-radius:999px !important;padding:9px 18px !important;font-weight:600;
        border:1px solid var(--border) !important;background:#fff !important;color:var(--text-muted) !important;
        transition:transform .15s ease, box-shadow .15s ease, color .15s ease, background .15s ease;
    }
    .shop-filter-pill:hover{ color:var(--primary) !important;border-color:rgba(37,99,235,.35) !important; }
    .shop-filter-pill.is-active{
        background:var(--shop-grad) !important;color:#fff !important;border-color:transparent !important;
        box-shadow:0 6px 16px rgba(37,99,235,.30);
    }

    /* Product cards */
    .shop-card{
        border-radius:22px !important;border:1px solid var(--border) !important;background:#fff !important;
        box-shadow:0 1px 2px rgba(15,23,42,.04), 0 8px 24px rgba(15,23,42,.06) !important;
        overflow:hidden;transition:transform .2s ease, box-shadow .2s ease, border-color .2s ease;
    }
    .shop-card:hover{
        transform:translateY(-6px) !important;border-color:rgba(37,99,235,.30) !important;
        box-shadow:0 16px 40px rgba(15,23,42,.12), 0 4px 12px rgba(15,23,42,.06) !important;
    }
    .shop-card-media{
        background:linear-gradient(135deg,#eef2ff,#f5f3ff) !important;overflow:hidden;
        display:flex;align-items:center;justify-content:center;padding:18px;aspect-ratio:4/3;
    }
    .shop-card-media img{
        width:100%;height:100%;object-fit:contain;transition:transform .35s ease;mix-blend-mode:multiply;
    }
    .shop-card:hover .shop-card-media img{ transform:scale(1.05); }
    .shop-card-title{ letter-spacing:-.01em;font-weight:800; }
    .shop-badge{
        background:var(--shop-grad) !important;color:#fff !important;border:0 !important;
        border-radius:999px;padding:5px 12px;font-size:.72rem;font-weight:800;letter-spacing:.03em;text-transform:uppercase;
    }
    .shop-price-current{ color:var(--text-dark) !important;font-variant-numeric:tabular-nums;letter-spacing:-.01em; }
    .shop-price-compare{ color:var(--text-muted);text-decoration:line-through; }

    /* Buttons */
    .shop-button{
        background:var(--shop-grad) !important;color:#fff !important;border:0 !important;border-radius:12px !important;
        font-weight:700;display:inline-flex;align-items:center;gap:8px;justify-content:center;
        box-shadow:0 6px 16px rgba(37,99,235,.25);
        transition:transform .15s ease, box-shadow .15s ease, filter .15s ease;
    }
    .shop-button:hover{ transform:translateY(-1px);filter:brightness(1.05);box-shadow:0 10px 24px rgba(37,99,235,.32); }
    .shop-button:active{ transform:translateY(0) scale(.99); }
    .shop-button-light, .shop-button-secondary{
        border-radius:12px !important;font-weight:700;border:1px solid var(--border) !important;
        background:#fff !important;color:var(--primary) !important;transition:transform .15s ease, background .15s ease, border-color .15s ease;
    }
    .shop-button-light:hover, .shop-button-secondary:hover{ background:var(--primary-soft) !important;border-color:rgba(37,99,235,.3) !important;transform:translateY(-1px); }
    .shop-button:disabled, .shop-button-secondary:disabled{ opacity:.45;filter:grayscale(.3);box-shadow:none;cursor:not-allowed;transform:none; }

    /* Surfaces */
    .shop-detail-card, .shop-summary-card, .shop-surface, .shop-cart-item, .shop-gallery-card{
        border-radius:20px !important;border:1px solid var(--border) !important;
        box-shadow:0 1px 2px rgba(15,23,42,.04), 0 10px 30px rgba(15,23,42,.06) !important;background:#fff !important;
    }
    .shop-summary-total{ border-top:2px solid var(--text-dark);margin-top:10px;padding-top:14px; }
    .shop-highlight-list li i{ color:var(--primary); }

    /* Accessibility: focus rings */
    .shop-section a:focus-visible, .shop-hero a:focus-visible, .shop-card a:focus-visible,
    .shop-button:focus-visible, .shop-button-light:focus-visible, .shop-button-secondary:focus-visible,
    .shop-filter-pill:focus-visible, .shop-input:focus-visible{
        outline:none !important;box-shadow:0 0 0 3px rgba(37,99,235,.35) !important;border-radius:12px;
    }

    /* Line-item thumbnails (summary / cart / order) */
    .shop-line-item{ display:flex;align-items:center;gap:10px;min-width:0; }
    .shop-line-item > span{ overflow:hidden;text-overflow:ellipsis; }
    .shop-thumb{
        width:46px;height:46px;border-radius:10px;object-fit:contain;flex:none;
        background:linear-gradient(135deg,#eef2ff,#f5f3ff);padding:5px;border:1px solid var(--border);
    }

    /* Featured card media */
    .shop-featured-media{
        aspect-ratio:16/10;border-radius:16px !important;display:flex;margin:0;overflow:hidden;
        background:linear-gradient(135deg,#eef2ff,#f5f3ff);
    }
    .shop-featured-media img{ width:100%;height:100%;object-fit:contain;mix-blend-mode:multiply;padding:14px;transition:transform .35s ease; }
    .shop-featured-media:hover img{ transform:scale(1.05); }

    /* Sold-out state */
    .shop-card-media{ position:relative; }
    .shop-soldout-tag{
        position:absolute;top:12px;left:12px;background:#0f172a;color:#fff;border-radius:999px;
        padding:5px 12px;font-size:.7rem;font-weight:800;text-transform:uppercase;letter-spacing:.04em;z-index:1;
    }
    .shop-card.is-soldout .shop-card-media img{ filter:grayscale(.55);opacity:.65; }

    /* Quantity stepper */
    .shop-stepper{ display:inline-flex;align-items:stretch;border:1px solid #dfe1ec;border-radius:12px;overflow:hidden;background:#fff; }
    .shop-stepper-btn{
        width:40px;border:0;background:#f8fafc;color:var(--primary);font-size:1.2rem;font-weight:800;line-height:1;cursor:pointer;
        transition:background .15s ease;
    }
    .shop-stepper-btn:hover{ background:var(--primary-soft); }
    .shop-stepper .shop-qty-input,
    .shop-stepper input[type=number]{
        width:56px;border:0 !important;border-left:1px solid #eef0f5 !important;border-right:1px solid #eef0f5 !important;
        text-align:center;font:inherit;font-weight:700;padding:10px 4px;-moz-appearance:textfield;
    }
    .shop-stepper input[type=number]::-webkit-outer-spin-button,
    .shop-stepper input[type=number]::-webkit-inner-spin-button{ -webkit-appearance:none;margin:0; }

    @media (max-width:640px){
        .shop-hero{ padding:56px 0 40px !important; }
        .shop-section{ padding-block:44px; }
    }
    @media (prefers-reduced-motion:reduce){
        .shop-card, .shop-button, .shop-button-light, .shop-button-secondary, .shop-filter-pill, .shop-card-media img{ transition:none !important; }
        .shop-card:hover{ transform:none !important; }
        .shop-card:hover .shop-card-media img{ transform:none !important; }
        .shop-featured-media:hover img{ transform:none !important; }
    }
</style>
<script>
    (function () {
        if (window.__shopStepperBound) return;
        window.__shopStepperBound = true;
        document.addEventListener('click', function (e) {
            var btn = e.target.closest('.shop-stepper-btn');
            if (!btn) return;
            var input = btn.parentElement.querySelector('input');
            if (!input) return;
            var step = parseInt(btn.dataset.step, 10) || 0;
            var min = input.min !== '' ? parseInt(input.min, 10) : 0;
            var max = input.max !== '' ? parseInt(input.max, 10) : Infinity;
            var val = (parseInt(input.value, 10) || 0) + step;
            input.value = Math.max(min, Math.min(max, val));
            input.dispatchEvent(new Event('change', { bubbles: true }));
        });
    })();
</script>