.visual-wrapper[data-astro-cid-ecxd5kht]{display:flex;justify-content:center;padding:calc(var(--spacing-unit) * 2)}.ui-card[data-astro-cid-ecxd5kht]{background:linear-gradient(135deg,var(--color-gray-900) 0%,var(--color-gray-800) 100%);border-radius:var(--radius-xl);overflow:hidden;width:100%;max-width:400px;box-shadow:0 25px 50px #3b82f626;transform:perspective(1000px) rotateY(5deg) rotateX(2deg);transition:transform .4s ease}.ui-card[data-astro-cid-ecxd5kht]:hover{transform:perspective(1000px) rotateY(0) rotateX(0)}.ui-header[data-astro-cid-ecxd5kht]{display:flex;align-items:center;gap:calc(var(--spacing-unit) * 1.5);padding:calc(var(--spacing-unit) * 2);background:#0003;border-bottom:1px solid rgba(255,255,255,.1)}.ui-icon[data-astro-cid-ecxd5kht]{width:36px;height:36px;background:linear-gradient(135deg,var(--color-light-blue),var(--color-primary-700));border-radius:var(--radius-md);display:flex;align-items:center;justify-content:center;color:#fff}.ui-title[data-astro-cid-ecxd5kht]{color:var(--color-gray-200);font-size:var(--font-size-sm);font-weight:600}.comp-badge[data-astro-cid-ecxd5kht]{margin-left:auto;padding:var(--space-1) var(--space-3);background:#3b82f626;color:var(--color-light-blue);border-radius:var(--radius-lg);font-size:var(--font-size-2xs);font-family:SF Mono,monospace}.component-showcase[data-astro-cid-ecxd5kht]{padding:calc(var(--spacing-unit) * 2)}.showcase-label[data-astro-cid-ecxd5kht]{color:var(--color-gray-400);font-size:var(--font-size-2xs);text-transform:uppercase;letter-spacing:.05em;margin-bottom:calc(var(--spacing-unit) * 1.5)}.variants-grid[data-astro-cid-ecxd5kht]{display:grid;grid-template-columns:repeat(2,1fr);gap:calc(var(--spacing-unit) * 1.5)}.variant-item[data-astro-cid-ecxd5kht]{display:flex;flex-direction:column;align-items:center;gap:var(--space-2)}.demo-btn[data-astro-cid-ecxd5kht]{padding:var(--space-2) var(--space-4);border-radius:var(--radius-sm);font-size:var(--font-size-xs);font-weight:500;cursor:pointer;border:none;transition:all var(--timing-fast);width:100%}.demo-btn[data-astro-cid-ecxd5kht].primary{background:var(--color-light-blue);color:#fff}.demo-btn[data-astro-cid-ecxd5kht].primary:hover{background:var(--color-primary-600, var(--color-primary-600))}.demo-btn[data-astro-cid-ecxd5kht].secondary{background:#ffffff1a;color:var(--color-gray-200)}.demo-btn[data-astro-cid-ecxd5kht].secondary:hover{background:#ffffff26}.demo-btn[data-astro-cid-ecxd5kht].outline{background:transparent;border:1px solid rgba(255,255,255,.2);color:var(--color-gray-400)}.demo-btn[data-astro-cid-ecxd5kht].outline:hover{border-color:#fff6;color:var(--color-gray-200)}.demo-btn[data-astro-cid-ecxd5kht].ghost{background:transparent;color:var(--color-gray-400)}.demo-btn[data-astro-cid-ecxd5kht].ghost:hover{background:#ffffff0d;color:var(--color-gray-400)}.variant-name[data-astro-cid-ecxd5kht]{color:var(--color-gray-400);font-size:var(--font-size-2xs)}.props-section[data-astro-cid-ecxd5kht]{padding:0 calc(var(--spacing-unit) * 2) calc(var(--spacing-unit) * 2)}.props-header[data-astro-cid-ecxd5kht]{display:flex;justify-content:space-between;align-items:center;margin-bottom:calc(var(--spacing-unit) * 1);padding-bottom:calc(var(--spacing-unit) * 1);border-bottom:1px solid rgba(255,255,255,.05)}.props-header[data-astro-cid-ecxd5kht] span[data-astro-cid-ecxd5kht]:first-child{color:var(--color-gray-400);font-size:var(--font-size-xs);font-weight:500}.props-count[data-astro-cid-ecxd5kht]{color:var(--color-gray-400);font-size:var(--font-size-2xs)}.props-list[data-astro-cid-ecxd5kht]{display:flex;flex-direction:column;gap:calc(var(--spacing-unit) * .5)}.prop-item[data-astro-cid-ecxd5kht]{display:flex;justify-content:space-between;align-items:center;padding:calc(var(--spacing-unit) * .5) 0}.prop-name[data-astro-cid-ecxd5kht]{color:var(--color-accent-300);font-size:var(--font-size-xs);font-family:SF Mono,monospace}.prop-type[data-astro-cid-ecxd5kht]{color:var(--color-gray-400);font-size:var(--font-size-2xs);font-family:SF Mono,monospace}.ui-footer[data-astro-cid-ecxd5kht]{display:flex;justify-content:center;gap:calc(var(--spacing-unit) * 1);padding:calc(var(--spacing-unit) * 1.5) calc(var(--spacing-unit) * 2);background:#0003;border-top:1px solid rgba(255,255,255,.1)}.framework-tag[data-astro-cid-ecxd5kht]{padding:var(--space-1) var(--space-3);background:#ffffff0d;color:var(--color-gray-400);font-size:var(--font-size-2xs);border-radius:var(--radius-sm)}@media(max-width:768px){.ui-card[data-astro-cid-ecxd5kht]{transform:none;max-width:100%}.ui-card[data-astro-cid-ecxd5kht]:hover{transform:none}}@media(prefers-reduced-motion:reduce){.ui-card[data-astro-cid-ecxd5kht],.demo-btn[data-astro-cid-ecxd5kht]{transform:none;transition:none}}.dark .ui-title[data-astro-cid-ecxd5kht]{color:var(--color-gray-100)}.dark .comp-badge[data-astro-cid-ecxd5kht]{color:var(--color-light-blue)}.dark .showcase-label[data-astro-cid-ecxd5kht]{color:var(--color-gray-400)}.dark .demo-btn[data-astro-cid-ecxd5kht].secondary{color:var(--color-gray-100)}.dark .demo-btn[data-astro-cid-ecxd5kht].outline{color:var(--color-gray-300)}.dark .demo-btn[data-astro-cid-ecxd5kht].ghost,.dark .variant-name[data-astro-cid-ecxd5kht]{color:var(--color-gray-400)}.dark .props-header[data-astro-cid-ecxd5kht] span[data-astro-cid-ecxd5kht]:first-child{color:var(--color-gray-300)}.dark .props-count[data-astro-cid-ecxd5kht]{color:var(--color-gray-400)}.dark .prop-name[data-astro-cid-ecxd5kht]{color:var(--color-pink-300)}.dark .prop-type[data-astro-cid-ecxd5kht],.dark .framework-tag[data-astro-cid-ecxd5kht]{color:var(--color-gray-400)}