.showcase-wrapper[data-v-c9cb7deb]{gap:1.5rem;padding:2rem 0}.controls[data-v-c9cb7deb],.showcase-wrapper[data-v-c9cb7deb]{align-items:center;display:flex;flex-direction:column;width:100%}.controls[data-v-c9cb7deb]{gap:.75rem;padding:0 1rem}.controls-top[data-v-c9cb7deb]{align-items:center;flex-direction:row;gap:1rem}.control-group[data-v-c9cb7deb],.controls-top[data-v-c9cb7deb]{display:flex;flex-wrap:wrap;justify-content:center}.control-group[data-v-c9cb7deb]{gap:.5rem}.slider-group[data-v-c9cb7deb]{align-items:center;background:#f8fafc;border:1px solid #e2e8f0;border-radius:999px;display:flex;gap:.75rem;padding:.5rem 1.25rem}.slider-label[data-v-c9cb7deb]{color:#64748b;font-weight:600}.slider-label[data-v-c9cb7deb],.slider-value[data-v-c9cb7deb]{font-size:.8rem;white-space:nowrap}.slider-value[data-v-c9cb7deb]{color:#3b82f6;font-weight:700;min-width:60px}.width-slider[data-v-c9cb7deb]{-webkit-appearance:none;-moz-appearance:none;appearance:none;background:#e2e8f0;border-radius:999px;cursor:pointer;height:4px;outline:none;width:220px}.width-slider[data-v-c9cb7deb]::-webkit-slider-thumb{-webkit-appearance:none;-moz-appearance:none;appearance:none;background:#3b82f6;border-radius:50%;box-shadow:0 2px 6px #3b82f666;cursor:pointer;height:18px;-webkit-transition:transform .15s ease;transition:transform .15s ease;width:18px}.width-slider[data-v-c9cb7deb]::-webkit-slider-thumb:hover{transform:scale(1.2)}.width-slider[data-v-c9cb7deb]::-moz-range-thumb{background:#3b82f6;border:none;border-radius:50%;box-shadow:0 2px 6px #3b82f666;cursor:pointer;height:18px;width:18px}.control-btn[data-v-c9cb7deb]{align-items:center;background:#fff;border:2px solid #e5e7eb;border-radius:999px;color:#6b7280;cursor:pointer;display:inline-flex;font-size:.85rem;font-weight:600;gap:.35rem;padding:.45rem 1rem;transition:all .2s ease}.control-btn[data-v-c9cb7deb]:hover{border-color:#3b82f6;color:#3b82f6;transform:translateY(-1px)}.control-btn.active[data-v-c9cb7deb]{background:#3b82f6;border-color:#3b82f6;box-shadow:0 4px 12px #3b82f64d;color:#fff}.theme-btn[data-v-c9cb7deb]{align-items:center;border:2px solid transparent;border-radius:999px;color:#fff;cursor:pointer;display:inline-flex;font-size:.75rem;font-weight:600;opacity:.7;padding:.35rem .85rem;text-shadow:0 1px 3px rgba(0,0,0,.5);transition:all .2s ease}.theme-btn[data-v-c9cb7deb]:hover{opacity:1;transform:translateY(-1px)}.theme-btn.active[data-v-c9cb7deb]{border-color:#3b82f6;box-shadow:0 0 0 2px #3b82f659;opacity:1}.frame-outer[data-v-c9cb7deb]{background:#fff;box-shadow:0 4px 30px #0000001a;overflow:hidden;transition:width .1s ease}.frame-outer.mobile-screen[data-v-c9cb7deb]{box-shadow:none;width:100%!important}.frame-inner[data-v-c9cb7deb]{background:#fff;min-height:450px;position:relative}.loading-overlay[data-v-c9cb7deb]{align-items:center;background:#fff;display:flex;flex-direction:column;top:0;right:0;bottom:0;left:0;justify-content:center;position:absolute;z-index:10}.spinner[data-v-c9cb7deb]{animation:spin-c9cb7deb 1s linear infinite;border:4px solid #f3f4f6;border-radius:50%;border-top-color:#3b82f6;height:36px;margin-bottom:12px;width:36px}.loading-text[data-v-c9cb7deb]{color:#9ca3af;font-size:14px}@keyframes spin-c9cb7deb{to{transform:rotate(1turn)}}@media (max-width:640px){.control-btn[data-v-c9cb7deb]{font-size:.75rem;padding:.35rem .75rem}.theme-btn[data-v-c9cb7deb]{font-size:.7rem;padding:.3rem .65rem}}
