html.demos-shell{scroll-behavior:smooth}html.demos-shell,html.demos-shell body{margin:0;min-height:100%;background:#030712;color:#e2e8f0}.demo-page-root{min-height:100dvh;display:flex;flex-direction:column;font-family:Inter,system-ui,sans-serif}.demo-shell-chrome{flex-shrink:0;padding:12px max(16px,env(safe-area-inset-right)) 10px max(16px,env(safe-area-inset-left));padding-top:max(12px,env(safe-area-inset-top));background:linear-gradient(180deg,#0f172afa,#0f172aeb);border-bottom:1px solid rgba(148,163,184,.12);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);z-index:100}.demo-shell-chrome-row{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px 16px}.demo-shell-chrome-landing{display:inline-flex;align-items:center;gap:8px;padding:10px 18px;border-radius:10px;border:1px solid rgba(59,130,246,.45);background:#1e3a8a59;color:#f8fafc;font-size:14px;font-weight:600;font-family:var(--font-display, "Montserrat", system-ui, sans-serif);text-decoration:none;letter-spacing:-.02em;transition:background .18s ease,border-color .18s ease,box-shadow .18s ease;box-shadow:0 0 0 1px #3b82f61f}.demo-shell-chrome-landing:hover{background:#2563eb73;border-color:#60a5faa6;box-shadow:0 0 24px #3b82f633}.demo-shell-chrome-meta{display:flex;flex-wrap:wrap;align-items:center;gap:12px}.demo-shell-chrome-secondary{font-size:13px;font-weight:500;color:#94a3b8;text-decoration:none;padding:8px 4px;border-radius:6px;transition:color .15s ease}.demo-shell-chrome-secondary:hover{color:#e2e8f0}.demo-shell-chrome-hint{margin:10px 0 0;font-size:11px;line-height:1.45;color:#64748b;letter-spacing:.01em}.demo-shell-chrome .lang-switcher{border-color:#94a3b840;background:#0f172a99}.demo-shell-chrome .lang-btn{color:#94a3b8}.demo-shell-chrome .lang-btn:hover{color:#e2e8f0;background:#ffffff0f}.demo-shell-chrome .lang-btn-active{color:#f8fafc;background:#3b82f659}.demo-page-body{flex:1;min-height:0;display:flex;flex-direction:column;overflow:auto;-webkit-overflow-scrolling:touch;background:#030712}.demo-page-root--mobile .demo-page-body{background:radial-gradient(ellipse 120% 70% at 50% -10%,rgba(59,130,246,.14) 0%,transparent 55%),radial-gradient(ellipse 60% 50% at 100% 40%,rgba(34,211,238,.06) 0%,transparent 45%),radial-gradient(ellipse 50% 45% at 0% 70%,rgba(99,102,241,.07) 0%,transparent 40%),linear-gradient(165deg,#0a1020,#030712 38%,#020617);justify-content:center;align-items:center;padding:clamp(16px,4vw,40px) clamp(12px,3vw,28px)}html.demos-shell .demo-page-root--mobile .demo-shell-mobile{max-width:none;width:100%;margin:0;flex:0 1 auto;min-height:0;background:transparent;border:none;box-shadow:none}html.demos-shell .demo-page-root--mobile .demo-mobile-stage{flex:1;display:flex;align-items:center;justify-content:center;min-height:min(640px,calc(100dvh - 140px));padding:clamp(12px,3vw,32px) clamp(8px,2vw,20px);background:transparent;overflow:visible}html.demos-shell .demo-page-root--mobile .demo-phone{border-color:#94a3b838;box-shadow:0 0 0 1px #ffffff0d,0 32px 80px #0000008c,0 0 100px #3b82f61f,inset 0 1px #ffffff0a}html.demos-shell .demo-page-root--mobile .demo-phone-body{scrollbar-width:thin;scrollbar-color:rgba(100,116,139,.45) transparent}html.demos-shell .demo-page-root--mobile .demo-phone-body::-webkit-scrollbar{width:5px}html.demos-shell .demo-page-root--mobile .demo-phone-body::-webkit-scrollbar-thumb{background:#94a3b859;border-radius:100px}html.demos-shell .demo-page-root--mobile .demo-m-hscroll{scrollbar-width:none;-ms-overflow-style:none}html.demos-shell .demo-page-root--mobile .demo-m-hscroll::-webkit-scrollbar{display:none;height:0}html.demos-shell .demo-shell{--navy: #0f172a;--ivory: #f1f5f9;--navy2: #1e293b;--navy3: #334155;--muted: #94a3b8;--blue: #3b82f6;--blue2: #2563eb;--blue3: #60a5fa;--lime-brand: #64748b;--lime-fg: #22d3ee;--lime-ring: #22d3ee;--lime-surface: rgba(34, 211, 238, .12);--lime-surface-soft: rgba(34, 211, 238, .08);--lime-surface-mid: rgba(34, 211, 238, .1);--lime-surface-strong: rgba(34, 211, 238, .16);--lime-border: rgba(34, 211, 238, .35);--lime-border-medium: rgba(34, 211, 238, .25);--lime-glow: rgba(34, 211, 238, .06);--lime-line: rgba(34, 211, 238, .45);--ink: #f8fafc;--w-02: rgba(255, 255, 255, .04);--w-03: rgba(255, 255, 255, .06);--w-04: rgba(255, 255, 255, .07);--w-05: rgba(255, 255, 255, .08);--w-06: rgba(255, 255, 255, .1);--w-07: rgba(255, 255, 255, .12);--w-08: rgba(255, 255, 255, .14);--w-10: rgba(255, 255, 255, .16);--w-12: rgba(255, 255, 255, .2);--w-15: rgba(255, 255, 255, .22);--w-18: rgba(255, 255, 255, .26);--w-20: rgba(255, 255, 255, .3);--w-40: rgba(255, 255, 255, .45);--w-50: rgba(255, 255, 255, .55);--w-70: rgba(255, 255, 255, .72);--nav-glass: rgba(15, 23, 42, .92);--hero-stroke: rgba(241, 245, 249, .35);color-scheme:dark;max-width:none;width:100%;max-height:none;min-height:min(100%,100dvh);flex:1;margin:0;border-radius:0;border:none;box-shadow:none}html.demos-shell .demo-shell-mobile{max-width:560px;width:100%;margin:0 auto;max-height:none}html.demos-shell .tag.tag-lime{background:#64748b40;color:#e2e8f0;border-color:#94a3b866}html.demos-shell .tag.tag-blue{background:#3b82f633;color:#bfdbfe;border-color:#3b82f673}.demo-thumb-img{display:block;width:100%;height:100%;object-fit:cover}.demo-cart-thumb-img{width:44px;height:44px;border-radius:8px;object-fit:cover;flex-shrink:0}.demo-m-thumb-img{display:block;border-radius:inherit;width:100%;height:100%;object-fit:cover}.demo-m-hscroll .demo-m-card.compact .demo-m-thumb.demo-m-thumb-with-img{width:100%;aspect-ratio:1;height:auto;border-radius:10px;overflow:hidden}.demo-m-hero-img{width:100%;aspect-ratio:16 / 10;border-radius:12px;object-fit:cover;margin-bottom:12px}.demo-m-card .demo-m-thumb.demo-m-thumb-with-img:not(.compact){width:48px;height:48px;overflow:hidden;border-radius:10px;flex-shrink:0}.demo-m-thumb.sm.demo-m-thumb-with-img{overflow:hidden}