.playground-container[data-v-71655cca]{background:#f7fafc;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;min-height:100vh;transition:background-color .3s ease,color .3s ease}.playground-container.dark-mode[data-v-71655cca]{background:#1a202c;color:#e2e8f0}.playground-header[data-v-71655cca]{background:#fff;border-bottom:1px solid #e2e8f0;box-shadow:0 1px 3px #0000000d;padding:1.5rem 2rem;position:sticky;top:0;transition:background-color .3s ease,border-color .3s ease;z-index:100}.dark-mode .playground-header[data-v-71655cca]{background:#2d3748;border-bottom-color:#4a5568}.header-content[data-v-71655cca]{justify-content:space-between;margin:0 auto;max-width:1400px}.header-brand[data-v-71655cca],.header-content[data-v-71655cca],.logo-link[data-v-71655cca]{align-items:center;display:flex}.logo-link[data-v-71655cca]{color:inherit;gap:.75rem;text-decoration:none;transition:opacity .2s}.logo-link[data-v-71655cca]:hover{opacity:.8}.logo-img[data-v-71655cca]{flex-shrink:0;height:36px;-o-object-fit:contain;object-fit:contain;width:36px}.playground-title[data-v-71655cca]{color:#1a202c;font-size:1.875rem;font-weight:700;margin:0 0 .25rem;transition:color .3s ease}.dark-mode .playground-title[data-v-71655cca]{color:#f7fafc}.playground-subtitle[data-v-71655cca]{color:#718096;font-size:.875rem;margin:0;transition:color .3s ease}.dark-mode .playground-subtitle[data-v-71655cca]{color:#a0aec0}.header-actions[data-v-71655cca]{gap:1rem}.header-actions[data-v-71655cca],.theme-toggle[data-v-71655cca]{align-items:center;display:flex}.theme-toggle[data-v-71655cca]{background:#edf2f7;border:none;border-radius:.375rem;color:#2d3748;cursor:pointer;justify-content:center;padding:.5rem;transition:all .2s}.theme-toggle[data-v-71655cca]:hover{background:#e2e8f0}.dark-mode .theme-toggle[data-v-71655cca]{background:#4a5568;color:#e2e8f0}.dark-mode .theme-toggle[data-v-71655cca]:hover{background:#718096}.btn-secondary[data-v-71655cca]{background:#edf2f7;border-radius:.375rem;color:#2d3748;font-size:.875rem;font-weight:500;padding:.5rem 1rem;text-decoration:none;transition:all .2s}.btn-secondary[data-v-71655cca]:hover{background:#e2e8f0}.dark-mode .btn-secondary[data-v-71655cca]{background:#4a5568;color:#e2e8f0}.dark-mode .btn-secondary[data-v-71655cca]:hover{background:#718096}.playground-main[data-v-71655cca]{display:grid;gap:2rem;grid-template-columns:280px 1fr;margin:0 auto;max-width:1400px;padding:2rem}.playground-sidebar[data-v-71655cca]{background:#fff;border-radius:.5rem;box-shadow:0 1px 3px #0000000d;height:-moz-fit-content;height:fit-content;padding:1.5rem;position:sticky;top:100px;transition:background-color .3s ease}.dark-mode .playground-sidebar[data-v-71655cca]{background:#2d3748}.sidebar-section[data-v-71655cca]{margin-bottom:2rem}.sidebar-section[data-v-71655cca]:last-child{margin-bottom:0}.sidebar-title[data-v-71655cca]{color:#718096;font-size:.75rem;font-weight:600;letter-spacing:.05em;margin:0 0 .75rem;text-transform:uppercase;transition:color .3s ease}.dark-mode .sidebar-title[data-v-71655cca]{color:#a0aec0}.color-input[data-v-71655cca],.search-input[data-v-71655cca],.select-input[data-v-71655cca]{background:#fff;border:1px solid #e2e8f0;border-radius:.375rem;color:#1a202c;font-size:.875rem;padding:.5rem;transition:all .2s;width:100%}.dark-mode .color-input[data-v-71655cca],.dark-mode .search-input[data-v-71655cca],.dark-mode .select-input[data-v-71655cca]{background:#4a5568;border-color:#718096;color:#e2e8f0}.color-input[data-v-71655cca]:focus,.search-input[data-v-71655cca]:focus,.select-input[data-v-71655cca]:focus{border-color:#4299e1;box-shadow:0 0 0 3px #4299e11a;outline:none}.dark-mode .color-input[data-v-71655cca]:focus,.dark-mode .search-input[data-v-71655cca]:focus,.dark-mode .select-input[data-v-71655cca]:focus{border-color:#4299e1;box-shadow:0 0 0 3px #4299e133}.control-group[data-v-71655cca]{align-items:center;display:flex;gap:1rem}.slider[data-v-71655cca]{flex:1}.control-value[data-v-71655cca]{color:#4a5568;font-size:.875rem;font-weight:500;min-width:50px;text-align:right;transition:color .3s ease}.dark-mode .control-value[data-v-71655cca]{color:#e2e8f0}.color-grid[data-v-71655cca]{display:grid;gap:.5rem;grid-template-columns:repeat(4,1fr);margin-bottom:.75rem}.color-btn[data-v-71655cca]{aspect-ratio:1;border:2px solid transparent;border-radius:.375rem;cursor:pointer;transition:all .2s;width:100%}.color-btn.active[data-v-71655cca]{border-color:#4299e1;box-shadow:0 0 0 3px #4299e133}.category-list[data-v-71655cca]{display:flex;flex-direction:column;gap:.5rem}.category-btn[data-v-71655cca]{background:transparent;border:1px solid #e2e8f0;border-radius:.375rem;color:#4a5568;cursor:pointer;font-size:.875rem;padding:.5rem;text-align:left;transition:all .2s}.dark-mode .category-btn[data-v-71655cca]{border-color:#4a5568;color:#a0aec0}.category-btn[data-v-71655cca]:hover{background:#f7fafc}.dark-mode .category-btn[data-v-71655cca]:hover{background:#4a5568}.category-btn.active[data-v-71655cca]{background:#4299e1;border-color:#4299e1;color:#fff}.playground-content[data-v-71655cca]{display:flex;flex-direction:column;gap:2rem}.preview-card[data-v-71655cca]{background:#fff;border-radius:.5rem;box-shadow:0 1px 3px #0000000d;padding:1.5rem;transition:background-color .3s ease}.dark-mode .preview-card[data-v-71655cca]{background:#2d3748}.preview-header[data-v-71655cca]{align-items:center;display:flex;justify-content:space-between;margin-bottom:1.5rem}.preview-title[data-v-71655cca]{color:#1a202c;font-size:1.5rem;font-weight:600;margin:0;transition:color .3s ease}.dark-mode .preview-title[data-v-71655cca]{color:#f7fafc}.btn-copy[data-v-71655cca]{align-items:center;background:transparent;border:1px solid #e2e8f0;border-radius:.375rem;color:#4a5568;cursor:pointer;display:flex;height:36px;justify-content:center;padding:.5rem;transition:all .2s;width:36px}.btn-copy[data-v-71655cca]:hover{background:#f7fafc;border-color:#4299e1;color:#4299e1}.dark-mode .btn-copy[data-v-71655cca]{border-color:#4a5568;color:#a0aec0}.dark-mode .btn-copy[data-v-71655cca]:hover{background:#4a5568;border-color:#4299e1;color:#4299e1}.preview-display[data-v-71655cca]{align-items:center;background:#f7fafc;border-radius:.5rem;display:flex;justify-content:center;margin-bottom:1.5rem;min-height:200px;padding:3rem;transition:background-color .3s ease}.dark-mode .preview-display[data-v-71655cca]{background:#1a202c}.preview-icon-wrapper[data-v-71655cca]{align-items:center;display:flex;justify-content:center}.preview-icon[data-v-71655cca]{transition:transform .2s}.preview-icon-wrapper[data-v-71655cca] .hovue-animation-slide{animation:slidePreview-71655cca 2s ease infinite!important}.preview-icon-wrapper[data-v-71655cca] .hovue-animation-bounce{animation:bouncePreview-71655cca 1s ease infinite!important}.preview-icon-wrapper[data-v-71655cca] .hovue-animation-rotate{animation:rotatePreview-71655cca 2s linear infinite!important}.preview-icon-wrapper[data-v-71655cca] .hovue-animation-pulse{animation:pulsePreview-71655cca 1.5s ease infinite!important}.preview-icon-wrapper[data-v-71655cca] .hovue-animation-fade{animation:fadePreview-71655cca 2s ease infinite!important}@keyframes slidePreview-71655cca{0%,to{transform:translate(0)}50%{transform:translate(8px)}}@keyframes bouncePreview-71655cca{0%,to{transform:translateY(0)}50%{transform:translateY(-8px)}}@keyframes rotatePreview-71655cca{0%{transform:rotate(0)}to{transform:rotate(1turn)}}@keyframes pulsePreview-71655cca{0%,to{transform:scale(1)}50%{transform:scale(1.1)}}@keyframes fadePreview-71655cca{0%,to{opacity:1}50%{opacity:.5}}.preview-code[data-v-71655cca]{background:#1a202c;border-radius:.375rem;overflow:hidden}.code-header[data-v-71655cca]{align-items:center;background:#2d3748;border-bottom:1px solid #4a5568;display:flex;justify-content:space-between;padding:.75rem 1rem}.code-label[data-v-71655cca]{color:#a0aec0;font-size:.75rem;font-weight:600;letter-spacing:.05em;text-transform:uppercase}.code-copy-btn[data-v-71655cca]{align-items:center;background:transparent;border:1px solid #4a5568;border-radius:.375rem;color:#a0aec0;cursor:pointer;display:flex;height:28px;justify-content:center;padding:.375rem;transition:all .2s;width:28px}.code-copy-btn[data-v-71655cca]:hover{background:#4a5568;border-color:#4299e1;color:#4299e1}.preview-code pre[data-v-71655cca]{color:#e2e8f0;font-family:Monaco,Menlo,monospace;font-size:.875rem;margin:0;overflow-x:auto;padding:1rem}.icons-section[data-v-71655cca]{background:#fff;border-radius:.5rem;box-shadow:0 1px 3px #0000000d;padding:1.5rem;transition:background-color .3s ease}.dark-mode .icons-section[data-v-71655cca]{background:#2d3748}.section-title[data-v-71655cca]{color:#1a202c;font-size:1.25rem;font-weight:600;margin:0 0 1.5rem;transition:color .3s ease}.dark-mode .section-title[data-v-71655cca]{color:#f7fafc}.icons-grid[data-v-71655cca]{display:grid;gap:1rem;grid-template-columns:repeat(auto-fill,minmax(120px,1fr))}.icon-card[data-v-71655cca]{align-items:center;background:#fff;border:2px solid #e2e8f0;border-radius:.5rem;cursor:pointer;display:flex;flex-direction:column;gap:.75rem;padding:1.5rem 1rem;transition:all .2s}.dark-mode .icon-card[data-v-71655cca]{background:#2d3748;border-color:#4a5568}.icon-card[data-v-71655cca]:hover{background:#f0f9ff;border-color:#4299e1;box-shadow:0 4px 6px #0000001a;transform:translateY(-2px)}.dark-mode .icon-card[data-v-71655cca]:hover{background:#4a5568}.icon-card.active[data-v-71655cca]{background:#ebf8ff;border-color:#4299e1;box-shadow:0 0 0 3px #4299e133}.dark-mode .icon-card.active[data-v-71655cca]{background:#2c5282}.icon-display[data-v-71655cca]{align-items:center;display:flex;justify-content:center;min-height:32px}.icon-name[data-v-71655cca]{color:#4a5568;font-size:.75rem;font-weight:500;text-align:center;transition:color .3s ease}.dark-mode .icon-name[data-v-71655cca]{color:#a0aec0}.desktop-only[data-v-71655cca]{display:flex}.mobile-only[data-v-71655cca]{display:none!important}.sidebar-header[data-v-71655cca],.sidebar-overlay[data-v-71655cca]{display:none}.sidebar-content[data-v-71655cca]{display:contents}@media(max-width:1024px){.playground-main[data-v-71655cca]{grid-template-columns:1fr}.playground-sidebar[data-v-71655cca]{position:static}}@media(max-width:768px){.desktop-only[data-v-71655cca]{display:none!important}.mobile-only[data-v-71655cca]{display:flex!important}.playground-header[data-v-71655cca]{padding:1rem}.header-content[data-v-71655cca]{gap:.5rem}.logo-img[data-v-71655cca]{height:32px;width:32px}.playground-title[data-v-71655cca]{font-size:1.25rem;margin:0}.playground-subtitle[data-v-71655cca]{display:none}.header-actions[data-v-71655cca]{gap:.5rem}.mobile-menu-btn[data-v-71655cca]{align-items:center;background:transparent;border:1px solid #e2e8f0;border-radius:.375rem;color:#2d3748;cursor:pointer;display:flex;justify-content:center;padding:.5rem;transition:all .2s}.dark-mode .mobile-menu-btn[data-v-71655cca]{border-color:#4a5568;color:#e2e8f0}.mobile-menu-btn[data-v-71655cca]:hover{background:#f7fafc;border-color:#4299e1}.dark-mode .mobile-menu-btn[data-v-71655cca]:hover{background:#4a5568}.sidebar-overlay[data-v-71655cca]{-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);background:#00000080;display:block;inset:0;position:fixed;z-index:150}.playground-main[data-v-71655cca]{gap:1rem;padding:1rem}.playground-sidebar[data-v-71655cca]{border-radius:0;display:flex;flex-direction:column;height:100vh;left:0;max-width:85vw;overflow:hidden;padding:0;position:fixed;top:0;transform:translate(-100%);transition:transform .3s ease;width:300px;z-index:200}.playground-sidebar.mobile-open[data-v-71655cca]{transform:translate(0)}.sidebar-header[data-v-71655cca]{align-items:center;border-bottom:1px solid #e2e8f0;display:flex;flex-shrink:0;justify-content:space-between;padding:1rem 1.25rem}.dark-mode .sidebar-header[data-v-71655cca]{border-bottom-color:#4a5568}.sidebar-header-title[data-v-71655cca]{color:#1a202c;font-size:1.125rem;font-weight:600;margin:0}.dark-mode .sidebar-header-title[data-v-71655cca]{color:#f7fafc}.sidebar-close-btn[data-v-71655cca]{align-items:center;background:transparent;border:1px solid #e2e8f0;border-radius:.375rem;color:#4a5568;cursor:pointer;display:flex;justify-content:center;padding:.5rem;transition:all .2s}.dark-mode .sidebar-close-btn[data-v-71655cca]{border-color:#4a5568;color:#a0aec0}.sidebar-close-btn[data-v-71655cca]:hover{border-color:#4299e1;color:#4299e1}.sidebar-content[data-v-71655cca]{display:block;flex:1;overflow-y:auto;padding:1.25rem}.category-list[data-v-71655cca]{display:none}.preview-card[data-v-71655cca]{padding:1rem}.preview-display[data-v-71655cca]{min-height:150px;padding:2rem 1rem}.preview-title[data-v-71655cca]{font-size:1.25rem}.preview-code pre[data-v-71655cca]{font-size:.75rem}.icons-section[data-v-71655cca]{padding:1rem}.section-title[data-v-71655cca]{font-size:1rem;margin-bottom:1rem}.icons-grid[data-v-71655cca]{gap:.75rem;grid-template-columns:repeat(auto-fill,minmax(90px,1fr))}.icon-card[data-v-71655cca]{gap:.5rem;padding:1rem .5rem}.icon-name[data-v-71655cca]{font-size:.625rem;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}}@media(max-width:480px){.playground-header[data-v-71655cca]{padding:.75rem}.brand-text[data-v-71655cca]{display:none}.icons-grid[data-v-71655cca]{gap:.5rem;grid-template-columns:repeat(auto-fill,minmax(75px,1fr))}.icon-card[data-v-71655cca]{padding:.75rem .25rem}.icon-display[data-v-71655cca]{min-height:28px}.icon-display[data-v-71655cca]>*{transform:scale(.85)}}