.video-step1-wrapper{padding:20px}.video-step1-grid{grid-template-columns:repeat(3,1fr);gap:25px;max-width:1200px;margin:0 auto;padding:5px;display:grid}.video-step1-style-card{cursor:pointer;text-align:center;background:linear-gradient(155deg,#2a2e45 0%,#1e1f2b 100%);border:1px solid #00aaff1a;border-radius:16px;flex-direction:column;align-items:center;min-width:0;padding:5px;transition:transform .25s,box-shadow .25s,border-color .25s;display:flex;box-shadow:0 20px 40px #00000040}.video-step1-style-card:hover{border-color:#00aaff4d;transform:translateY(-4px)}.video-step1-style-card.is-selected{border:1px solid #0af9;transform:translateY(-6px);box-shadow:0 20px 50px #00aaff59}.video-step1-thumbnail{object-fit:cover;border-radius:12px;width:100%;max-width:100%;height:auto;max-height:200px;margin-bottom:16px;margin-left:auto;margin-right:auto;display:block}.video-step1-thumbnail-video{border-radius:12px;margin-bottom:16px;margin-left:auto;margin-right:auto;display:block;object-fit:contain!important;box-sizing:border-box!important;flex-shrink:0!important;width:300px!important;min-width:300px!important;max-width:300px!important;height:169px!important;min-height:169px!important;max-height:169px!important}.video-step1-thumbnail.video-step1-thumbnail-video{object-fit:contain!important;width:300px!important;min-width:300px!important;max-width:300px!important;height:169px!important;min-height:169px!important;max-height:169px!important}@media (max-width:1024px) and (min-width:600px) and (orientation:portrait){.video-step1-grid{grid-template-columns:repeat(2,1fr)!important}.video-step1-thumbnail-video,.video-step1-thumbnail.video-step1-thumbnail-video{width:100%!important;min-width:0!important;max-width:100%!important;height:auto!important;min-height:0!important;max-height:200px!important}}@media (max-width:1024px) and (min-width:769px) and (orientation:landscape){.video-step1-grid{grid-template-columns:repeat(2,1fr)!important}.video-step1-thumbnail-video,.video-step1-thumbnail.video-step1-thumbnail-video{width:240px!important;min-width:240px!important;max-width:240px!important;height:136px!important;min-height:136px!important;max-height:136px!important}}@media (max-width:599px) and (orientation:portrait){.video-step1-grid{grid-template-columns:1fr!important}.video-step1-thumbnail-video,.video-step1-thumbnail.video-step1-thumbnail-video{object-fit:contain!important;width:220px!important;min-width:220px!important;max-width:220px!important;height:124px!important;min-height:124px!important;max-height:124px!important}}@media (max-width:599px) and (orientation:landscape){.video-step1-grid{grid-template-columns:1fr!important}.video-step1-thumbnail-video{width:100%!important;max-width:100%!important;height:auto!important;max-height:200px!important}}.video-step1-style-name{color:#f5f7ff;letter-spacing:.02em;margin-top:12px;margin-bottom:12px;font-size:18px;font-weight:600}.video-step1-style-description{color:#b8bdd4;letter-spacing:.01em;padding:0 10px;font-size:14px}.video-step1-pagination{color:#cfd3ff;flex-wrap:wrap;justify-content:center;align-items:center;gap:12px;margin-top:28px;font-size:14px;display:flex}.video-step1-pagebutton{color:#dfe4ff;cursor:pointer;letter-spacing:.05em;text-transform:uppercase;-webkit-tap-highlight-color:transparent;touch-action:manipulation;background:#ffffff14;border:1px solid #ffffff29;border-radius:999px;min-width:120px;min-height:44px;padding:8px 18px;font-weight:600;transition:background .2s,transform .2s,border-color .2s}.video-step1-pagebutton:hover{background:#ffffff29;border-color:#ffffff47;transform:translateY(-2px)}.video-step1-pagebutton:active{transform:translateY(0)}@media (max-width:768px){.video-step1-pagination{flex-wrap:wrap;justify-content:center;gap:8px;padding:0 12px;font-size:12px}.video-step1-pagebutton{letter-spacing:.03em;min-width:auto;min-height:44px;padding:6px 14px;font-size:11px}}@media (max-width:480px){.video-step1-pagination{flex-wrap:wrap;justify-content:center;gap:8px;padding:0 8px;font-size:11px}.video-step1-pagination span{font-size:11px}.video-step1-pagebutton{min-width:auto;padding:6px 12px;font-size:10px}}
.video-step2-customize-container{color:#fff;padding:20px}@media (min-width:1024px){.video-step2-customize-container{justify-content:flex-start;align-items:flex-start;gap:20px;max-width:900px;margin:0 auto;display:flex}}.video-step2-options-area{flex-direction:column;gap:20px;max-width:600px;margin:0 auto;display:flex}@media (min-width:1024px){.video-step2-options-area{flex:none;max-width:400px;margin:0}}.video-step2-option-group{background:#232638b3;border:1px solid #ffffff0d;border-radius:16px;padding:18px 20px;box-shadow:0 10px 25px #00000040}.video-step2-option-group label{letter-spacing:.03em;color:#d2d8ff;margin-bottom:12px;font-size:15px;font-weight:600;display:block}.video-step2-option-group select{color:#f5f7ff;letter-spacing:.02em;cursor:pointer;background-color:#1b1d2df2;border:1px solid #ffffff0f;border-radius:12px;width:100%;padding:12px 14px;font-size:14px;transition:border-color .3s,box-shadow .3s}.video-step2-option-group select:hover{border-color:#00aaff4d}.video-step2-option-group select:focus{border-color:#0af9;outline:none;box-shadow:0 0 0 3px #00aaff1a}.video-step2-preview-area{text-align:center;background:#23263880;border:1px solid #ffffff0d;border-radius:16px;margin-top:30px;padding:20px}@media (min-width:1024px){.video-step2-preview-area{flex:none;align-self:flex-start;width:320px;position:sticky;top:0;margin-top:0!important}}.video-step2-preview-video{border:1px solid #ffffff1a;border-radius:12px;width:100%;max-width:240px;height:auto;max-height:136px}.video-step2-generate-preview-button{color:#0af;letter-spacing:.05em;cursor:pointer;text-transform:uppercase;background:#00aaff1a;border:1px solid #00aaff4d;border-radius:8px;margin-top:15px;padding:8px 16px;font-size:13px;font-weight:600;transition:all .3s}.video-step2-generate-preview-button:hover:not(:disabled){background:#0af3;border-color:#00aaff80;transform:translateY(-1px)}.video-step2-generate-preview-button:disabled{opacity:.5;cursor:not-allowed}.video-step2-preview-spinner{z-index:10;background-color:#00000080;border-radius:12px;justify-content:center;align-items:center;display:flex;position:absolute;inset:0}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.video-step2-preview-error{color:#ff6b6b;margin-top:10px;font-size:13px}
.video-loop-modal-wrapper{flex-direction:column;width:100%;height:100%;display:flex}.video-loop-modal-header{flex-shrink:0}.video-loop-modal-body{flex:1;min-height:0;overflow-y:auto}.video-loop-modal-footer{flex-shrink:0}.video-loop-nav-button{transition:all .2s}.video-loop-nav-button--primary:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 24px 48px #0080ff66}.video-loop-nav-button--secondary:hover{background:#ffffff1f;transform:translateY(-2px)}.video-loop-download-btn:hover{transform:translateY(-2px);box-shadow:0 6px 20px #0080ff66}.video-loop-progress-bar-fill{animation:2s ease-in-out infinite progressShimmer}@keyframes progressShimmer{0%{background-position:200% 0}to{background-position:-200% 0}}@keyframes fadeIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}
.video-monogram-modal-container{padding:var(--space-xl)var(--space-lg);gap:var(--space-xl);flex-direction:column;justify-content:center;align-items:center;width:100%;min-height:450px;display:flex}.video-monogram-modal-title{font-family:var(--font-family-header);font-size:var(--font-size-2xl);color:var(--text-primary);text-align:center;margin-bottom:var(--space-xs);background:var(--color-accent-vib);-webkit-text-fill-color:transparent;text-shadow:0 4px 12px #00f2ff4d;-webkit-background-clip:text;background-clip:text;font-weight:700}.video-monogram-modal-subtitle{font-size:var(--font-size-lg);color:var(--text-secondary);text-align:center;max-width:600px;line-height:1.6}.video-monogram-modal-options{gap:var(--space-xl);width:100%;max-width:800px;margin-top:var(--space-md);grid-template-columns:repeat(auto-fit,minmax(280px,1fr));display:grid}.video-monogram-modal-option-card{border-radius:var(--radius-xl);padding:var(--space-xl);cursor:pointer;text-align:center;background:var(--bg-glass-light);-webkit-backdrop-filter:blur(12px);border:1px solid var(--border-glass);box-shadow:var(--shadow-lg);align-items:center;gap:var(--space-md);transition:all var(--transition-normal);flex-direction:column;display:flex;position:relative;overflow:hidden}.video-monogram-modal-option-card:before{content:"";background:linear-gradient(90deg,transparent,var(--color-neon-blue),var(--color-neon-pink),transparent);opacity:0;height:2px;transition:opacity var(--transition-normal);position:absolute;top:0;left:0;right:0}.video-monogram-modal-option-card:hover{background:var(--bg-glass-strong);box-shadow:0 20px 40px #0006,var(--shadow-neon-glow);border-color:#fff3;transform:translateY(-8px)}.video-monogram-modal-option-card:hover:before{opacity:1}.video-monogram-modal-option-card:active{transform:translateY(-4px)}.video-monogram-option-icon{margin-bottom:var(--space-sm);filter:drop-shadow(0 0 15px #00f2ff66);transition:transform var(--transition-normal);font-size:3.5rem}.video-monogram-modal-option-card:hover .video-monogram-option-icon{transform:scale(1.1)rotate(5deg)}.video-monogram-option-title{color:var(--text-primary);font-size:var(--font-size-xl);margin-bottom:var(--space-xs);letter-spacing:.5px;font-weight:600}.video-monogram-option-description{color:var(--text-tertiary);font-size:var(--font-size-md);line-height:1.5}@media (max-width:768px){.video-monogram-modal-container{padding:var(--space-md)}.video-monogram-modal-title{font-size:var(--font-size-xl)}.video-monogram-modal-options{gap:var(--space-md);grid-template-columns:1fr}}