:root{--color-primary-50:#eff6ff;--color-primary-100:#dbeafe;--color-primary-200:#bfdbfe;--color-primary-300:#93c5fd;--color-primary-400:#60a5fa;--color-primary-500:#3b82f6;--color-primary-600:#2563eb;--color-primary-700:#1d4ed8;--color-primary-800:#1e40af;--color-primary-900:#1e3a8a;--color-primary-950:#172554;--color-success-50:#f0fdf4;--color-success-100:#dcfce7;--color-success-200:#bbf7d0;--color-success-300:#86efac;--color-success-400:#4ade80;--color-success-500:#22c55e;--color-success-600:#16a34a;--color-success-700:#15803d;--color-success-800:#166534;--color-success-900:#14532d;--color-success-950:#052e16;--color-warning-50:#fffbeb;--color-warning-100:#fef3c7;--color-warning-200:#fde68a;--color-warning-300:#fcd34d;--color-warning-400:#fbbf24;--color-warning-500:#f59e0b;--color-warning-600:#d97706;--color-warning-700:#b45309;--color-warning-800:#92400e;--color-warning-900:#78350f;--color-warning-950:#451a03;--color-error-50:#fef2f2;--color-error-100:#fee2e2;--color-error-200:#fecaca;--color-error-300:#fca5a5;--color-error-400:#f87171;--color-error-500:#ef4444;--color-error-600:#dc2626;--color-error-700:#b91c1c;--color-error-800:#991b1b;--color-error-900:#7f1d1d;--color-error-950:#450a0a;--color-info-50:#ecfeff;--color-info-100:#cffafe;--color-info-200:#a5f3fc;--color-info-300:#67e8f9;--color-info-400:#22d3ee;--color-info-500:#06b6d4;--color-info-600:#0891b2;--color-info-700:#0e7490;--color-info-800:#155e75;--color-info-900:#164e63;--color-info-950:#083344;--color-neutral-0:#fff;--color-neutral-50:#f9fafb;--color-neutral-100:#f3f4f6;--color-neutral-200:#e5e7eb;--color-neutral-300:#d1d5db;--color-neutral-400:#9ca3af;--color-neutral-500:#6b7280;--color-neutral-600:#4b5563;--color-neutral-700:#374151;--color-neutral-800:#1f2937;--color-neutral-900:#111827;--color-neutral-950:#030712;--text-primary:var(--color-neutral-900);--text-secondary:var(--color-neutral-700);--text-tertiary:var(--color-neutral-500);--text-disabled:var(--color-neutral-400);--text-inverse:var(--color-neutral-0);--text-link:var(--color-primary-600);--text-link-hover:var(--color-primary-700);--text-success:var(--color-success-700);--text-warning:var(--color-warning-700);--text-error:var(--color-error-700);--text-info:var(--color-info-700);--bg-primary:var(--color-neutral-0);--bg-secondary:var(--color-neutral-50);--bg-tertiary:var(--color-neutral-100);--bg-elevated:var(--color-neutral-0);--bg-overlay:#00000080;--bg-primary-solid:var(--color-primary-600);--bg-primary-hover:var(--color-primary-700);--bg-primary-subtle:var(--color-primary-50);--bg-success-solid:var(--color-success-600);--bg-success-hover:var(--color-success-700);--bg-success-subtle:var(--color-success-50);--bg-warning-solid:var(--color-warning-600);--bg-warning-hover:var(--color-warning-700);--bg-warning-subtle:var(--color-warning-50);--bg-error-solid:var(--color-error-600);--bg-error-hover:var(--color-error-700);--bg-error-subtle:var(--color-error-50);--border-primary:var(--color-neutral-200);--border-secondary:var(--color-neutral-300);--border-focus:var(--color-primary-600);--border-error:var(--color-error-300);--border-success:var(--color-success-300);--shadow-sm:0 1px 2px 0 #0000000d;--shadow-md:0 4px 6px -1px #0000001a, 0 2px 4px -1px #0000000f;--shadow-lg:0 10px 15px -3px #0000001a, 0 4px 6px -2px #0000000d;--shadow-xl:0 20px 25px -5px #0000001a, 0 10px 10px -5px #0000000a;--shadow-focus:0 0 0 3px #2563eb1a}.text-primary{color:var(--text-primary)}.text-secondary{color:var(--text-secondary)}.text-tertiary{color:var(--text-tertiary)}.text-disabled{color:var(--text-disabled)}.text-inverse{color:var(--text-inverse)}.text-link{color:var(--text-link)}.text-link:hover{color:var(--text-link-hover)}.text-success{color:var(--text-success)}.text-warning{color:var(--text-warning)}.text-error{color:var(--text-error)}.text-info{color:var(--text-info)}.bg-primary{background-color:var(--bg-primary)}.bg-secondary{background-color:var(--bg-secondary)}.bg-tertiary{background-color:var(--bg-tertiary)}.bg-elevated{background-color:var(--bg-elevated)}.bg-primary-solid{background-color:var(--bg-primary-solid);color:var(--text-inverse)}.bg-primary-solid:hover{background-color:var(--bg-primary-hover)}.bg-primary-subtle{background-color:var(--bg-primary-subtle)}.bg-success-solid{background-color:var(--bg-success-solid);color:var(--text-inverse)}.bg-success-solid:hover{background-color:var(--bg-success-hover)}.bg-success-subtle{background-color:var(--bg-success-subtle)}.bg-warning-solid{background-color:var(--bg-warning-solid);color:var(--text-inverse)}.bg-warning-solid:hover{background-color:var(--bg-warning-hover)}.bg-warning-subtle{background-color:var(--bg-warning-subtle)}.bg-error-solid{background-color:var(--bg-error-solid);color:var(--text-inverse)}.bg-error-solid:hover{background-color:var(--bg-error-hover)}.bg-error-subtle{background-color:var(--bg-error-subtle)}.border-primary{border-color:var(--border-primary)}.border-secondary{border-color:var(--border-secondary)}.border-focus{border-color:var(--border-focus)}.border-error{border-color:var(--border-error)}.border-success{border-color:var(--border-success)}.shadow-sm{box-shadow:var(--shadow-sm)}.shadow-md{box-shadow:var(--shadow-md)}.shadow-lg{box-shadow:var(--shadow-lg)}.shadow-xl{box-shadow:var(--shadow-xl)}.shadow-focus{box-shadow:var(--shadow-focus)}.btn{border:1px solid #0000;border-radius:6px;outline:none;padding:8px 16px;font-weight:500;transition:all .15s ease-in-out}.btn:focus-visible{outline:3px solid var(--border-focus);outline-offset:2px}.btn-primary{background-color:var(--bg-primary-solid);color:var(--text-inverse);border-color:var(--bg-primary-solid)}.btn-primary:hover:not(:disabled){background-color:var(--bg-primary-hover);border-color:var(--bg-primary-hover)}.btn-success{background-color:var(--bg-success-solid);color:var(--text-inverse);border-color:var(--bg-success-solid)}.btn-success:hover:not(:disabled){background-color:var(--bg-success-hover);border-color:var(--bg-success-hover)}.btn-warning{background-color:var(--bg-warning-solid);color:var(--text-inverse);border-color:var(--bg-warning-solid)}.btn-warning:hover:not(:disabled){background-color:var(--bg-warning-hover);border-color:var(--bg-warning-hover)}.btn-error{background-color:var(--bg-error-solid);color:var(--text-inverse);border-color:var(--bg-error-solid)}.btn-error:hover:not(:disabled){background-color:var(--bg-error-hover);border-color:var(--bg-error-hover)}.btn-secondary{background-color:var(--bg-primary);color:var(--text-primary);border-color:var(--border-secondary)}.btn-secondary:hover:not(:disabled){background-color:var(--bg-secondary);border-color:var(--border-focus)}.btn:disabled{opacity:.6;cursor:not-allowed}.input{border:1px solid var(--border-primary);background-color:var(--bg-primary);color:var(--text-primary);border-radius:6px;outline:none;padding:8px 12px;font-size:16px;transition:all .15s ease-in-out}.input:focus{border-color:var(--border-focus);box-shadow:var(--shadow-focus)}.input.error{border-color:var(--border-error)}.input.error:focus{border-color:var(--text-error);box-shadow:0 0 0 3px #ef44441a}.status-success{background-color:var(--bg-success-subtle);color:var(--text-success);border:1px solid var(--border-success);border-radius:6px;padding:12px}.status-warning{background-color:var(--bg-warning-subtle);color:var(--text-warning);border:1px solid var(--color-warning-300);border-radius:6px;padding:12px}.status-error{background-color:var(--bg-error-subtle);color:var(--text-error);border:1px solid var(--border-error);border-radius:6px;padding:12px}.status-info{background-color:var(--bg-primary-subtle);color:var(--text-link);border:1px solid var(--color-primary-200);border-radius:6px;padding:12px}
:root{--product-card-padding-sm:12px;--product-card-padding-md:16px;--product-card-padding-lg:20px;--product-card-gap-sm:8px;--product-card-gap-md:12px;--product-card-gap-lg:16px;--touch-target-min:44px;--touch-target-comfortable:48px;--product-card-radius-sm:8px;--product-card-radius-md:12px;--product-card-radius-lg:16px;--product-card-shadow-sm:0 1px 3px 0 #0000001a, 0 1px 2px 0 #0000000f;--product-card-shadow-md:0 4px 6px -1px #0000001a, 0 2px 4px -1px #0000000f;--product-card-shadow-lg:0 10px 15px -3px #0000001a, 0 4px 6px -2px #0000000d;--product-card-shadow-hover:0 20px 25px -5px #0000001a, 0 10px 10px -5px #0000000a;--product-card-transition:all .2s cubic-bezier(.4, 0, .2, 1);--product-card-transform-hover:translateY(-2px);--product-image-aspect-ratio:16 / 9;--product-image-aspect-ratio-square:1 / 1;--product-image-aspect-ratio-portrait:3 / 4;--badge-chip-padding-x:8px;--badge-chip-padding-y:4px;--badge-chip-gap:6px;--badge-chip-radius:12px;--badge-chip-font-size:.75rem;--badge-chip-font-weight:500;--price-pill-padding-x:12px;--price-pill-padding-y:6px;--price-pill-radius:8px;--price-pill-font-size:.875rem;--price-pill-font-size-md:1rem;--price-pill-font-weight:600;--price-pill-bg:var(--bg-primary);--price-pill-border:1px solid var(--border-primary);--review-star-size:14px;--review-star-size-md:16px;--review-star-gap:2px;--review-star-color:var(--color-warning-500);--review-star-color-empty:var(--color-neutral-300);--product-title-size-mobile:1rem;--product-title-size-tablet:1.125rem;--product-title-size-desktop:1.25rem;--product-description-size-mobile:.875rem;--product-description-size-tablet:.9375rem}.product-card{padding:var(--product-card-padding-md);border-radius:var(--product-card-radius-md);box-shadow:var(--product-card-shadow-sm);transition:var(--product-card-transition);min-height:var(--touch-target-min)}@media (hover:hover) and (pointer:fine){.product-card:hover{box-shadow:var(--product-card-shadow-hover);transform:var(--product-card-transform-hover)}}@media (hover:none) and (pointer:coarse){.product-card:active{box-shadow:var(--product-card-shadow-md);transform:scale(.98)}}.product-card-elevated{box-shadow:var(--product-card-shadow-md)}.product-card-elevated:hover{box-shadow:var(--product-card-shadow-lg)}.badge-chip{padding:var(--badge-chip-padding-y) var(--badge-chip-padding-x);border-radius:var(--badge-chip-radius);font-size:var(--badge-chip-font-size);font-weight:var(--badge-chip-font-weight);align-items:center;gap:var(--badge-chip-gap);display:inline-flex}.price-pill{padding:var(--price-pill-padding-y) var(--price-pill-padding-x);border-radius:var(--price-pill-radius);font-size:var(--price-pill-font-size);font-weight:var(--price-pill-font-weight);background-color:var(--price-pill-bg);border:var(--price-pill-border);align-items:center;gap:4px;display:inline-flex}@media (min-width:768px){.price-pill{font-size:var(--price-pill-font-size-md)}}
:focus{outline:none!important}:focus-visible{outline-offset:2px!important;border-radius:4px!important;outline:3px solid #2563eb!important;transition:outline .15s ease-in-out,box-shadow .15s ease-in-out!important;box-shadow:0 0 0 1px #2563eb1a!important}@media (prefers-contrast:high){:focus-visible{outline-offset:2px!important;color:highlight!important;background-color:highlighttext!important;outline:4px solid!important}}@media (prefers-reduced-motion:reduce){:focus-visible{transition:none!important}}button:focus-visible,[role=button]:focus-visible{outline-offset:2px!important;outline:3px solid #2563eb!important;box-shadow:0 0 0 1px #2563eb1a,0 0 0 4px #2563eb26!important}button.btn-primary:focus-visible,.bg-blue-600:focus-visible,.bg-blue-500:focus-visible{outline-offset:2px!important;outline:3px solid #fbbf24!important;box-shadow:0 0 0 1px #fbbf2433,0 0 0 4px #fbbf2440!important}.bg-green-600:focus-visible,.bg-green-500:focus-visible{outline-offset:2px!important;outline:3px solid #f59e0b!important;box-shadow:0 0 0 1px #f59e0b33,0 0 0 4px #f59e0b40!important}.bg-red-600:focus-visible,.bg-red-500:focus-visible{outline-offset:2px!important;outline:3px solid #06b6d4!important;box-shadow:0 0 0 1px #06b6d433,0 0 0 4px #06b6d440!important}input:focus-visible,textarea:focus-visible,select:focus-visible{outline-offset:1px!important;border-color:#2563eb!important;outline:3px solid #2563eb!important;box-shadow:0 0 0 1px #2563eb,0 0 0 4px #2563eb26!important}input.error:focus-visible,input[aria-invalid=true]:focus-visible,.border-red-300:focus-visible{outline-offset:1px!important;border-color:#dc2626!important;outline:3px solid #dc2626!important;box-shadow:0 0 0 1px #dc2626,0 0 0 4px #dc262626!important}input[type=checkbox]:focus-visible,input[type=radio]:focus-visible{outline-offset:2px!important;outline:3px solid #2563eb!important;box-shadow:0 0 0 1px #2563eb1a,0 0 0 4px #2563eb26!important}a:focus-visible{outline-offset:2px!important;background-color:#2563eb1a!important;border-radius:2px!important;outline:3px solid #2563eb!important;box-shadow:0 0 0 1px #2563eb1a!important}.skip-link{z-index:9999!important;color:#fff!important;background:#1f2937!important;border:2px solid #0000!important;border-radius:6px!important;padding:12px 20px!important;font-size:16px!important;font-weight:600!important;line-height:1.5!important;text-decoration:none!important;transition:top .2s ease-in-out!important;position:absolute!important;top:-100px!important;left:16px!important}.skip-link:focus,.skip-link:focus-visible{outline-offset:2px!important;border-color:#fbbf24!important;outline:3px solid #fbbf24!important;top:16px!important;box-shadow:0 0 0 1px #fbbf2433,0 4px 12px #00000026!important}.skip-link+.skip-link{left:auto!important;right:16px!important}.skip-link+.skip-link:focus,.skip-link+.skip-link:focus-visible{right:16px!important}[role=dialog]:focus-visible,[aria-modal=true]:focus-visible{outline:none!important}[role=dialog] button[aria-label*=close]:focus-visible,[role=dialog] button[aria-label*=Close]:focus-visible,.modal-close:focus-visible{outline-offset:2px!important;border-radius:50%!important;outline:3px solid #dc2626!important;box-shadow:0 0 0 1px #dc26261a,0 0 0 4px #dc262626!important}.card:focus-within,.border:focus-within{border-color:#2563eb4d!important;box-shadow:0 0 0 1px #2563eb1a!important}form:focus-within{position:relative}form:focus-within:before{content:"";pointer-events:none;z-index:-1;border:2px solid #2563eb33;border-radius:8px;position:absolute;inset:-4px}li:focus-visible,[role=listitem]:focus-visible{outline-offset:1px!important;background-color:#2563eb0d!important;border-radius:4px!important;outline:2px solid #2563eb!important}[role=gridcell]:focus-visible,[role=cell]:focus-visible{outline-offset:-1px!important;z-index:1!important;background-color:#2563eb1a!important;outline:2px solid #2563eb!important}[role=tab]:focus-visible{outline-offset:-2px!important;z-index:10!important;outline:3px solid #2563eb!important}[role=tab][aria-selected=true]:focus-visible{outline-color:#059669!important}[aria-busy=true]:focus-visible{outline-offset:1px!important;outline:2px solid #6b728080!important}:disabled:focus-visible,[aria-disabled=true]:focus-visible{outline-offset:1px!important;outline:2px dashed #6b728080!important}@keyframes focus-pulse{0%{box-shadow:0 0 #2563eb66}70%{box-shadow:0 0 0 8px #2563eb00}to{box-shadow:0 0 #2563eb00}}.btn-critical:focus-visible,[data-focus-pulse]:focus-visible{animation:1.5s ease-in-out focus-pulse}@media (prefers-reduced-motion:reduce){.btn-critical:focus-visible,[data-focus-pulse]:focus-visible{animation:none!important}}.sr-focus-indicator{clip:rect(0, 0, 0, 0);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.sr-focus-indicator:focus{clip:auto;white-space:normal;color:#fff;z-index:9999;background:#1f2937;border:2px solid #fbbf24;border-radius:4px;width:auto;height:auto;margin:0;padding:8px 12px;font-weight:600;position:static;overflow:visible}.focus-trap-boundary:focus-within{position:relative}.focus-trap-boundary:focus-within:after{content:"";pointer-events:none;z-index:-1;border:2px dashed #2563eb4d;border-radius:8px;position:absolute;inset:-2px}@media (pointer:coarse){button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline-offset:3px!important;outline-width:4px!important}.skip-link:focus,.skip-link:focus-visible{padding:16px 24px!important;font-size:18px!important}}@media (max-width:640px){.skip-link:focus,.skip-link:focus-visible{text-align:center!important;width:calc(100% - 16px)!important;left:8px!important;right:8px!important}}@media print{:focus-visible{outline-offset:1px!important;box-shadow:none!important;outline:2px solid #000!important}.skip-link,.sr-focus-indicator{display:none!important}}.focus-hidden:focus,.focus-hidden:focus-visible{box-shadow:none!important;outline:none!important}.focus-enhanced:focus-visible{outline-offset:3px!important;outline-width:4px!important;box-shadow:0 0 0 2px #2563eb33,0 0 0 6px #2563eb1a!important}.focus-offset-0:focus-visible{outline-offset:0!important}.focus-offset-1:focus-visible{outline-offset:1px!important}.focus-offset-2:focus-visible{outline-offset:2px!important}.focus-offset-4:focus-visible{outline-offset:4px!important}