@font-face{font-family:Anton;src:url(/api/fonts/Anton-Regular.ttf) format("truetype");font-weight:400;font-style:normal}@font-face{font-family:Bebas Neue;src:url(/api/fonts/BebasNeue-Regular.ttf) format("truetype");font-weight:400;font-style:normal}@font-face{font-family:"DejaVu Serif";src:url(/api/fonts/DejaVuSerif.ttf) format("truetype");font-weight:400;font-style:normal}@font-face{font-family:DejaVu Sans;src:url(/api/fonts/DejaVuSans.ttf) format("truetype");font-weight:400;font-style:normal}@font-face{font-family:DejaVu Sans Mono;src:url(/api/fonts/DejaVuSansMono.ttf) format("truetype");font-weight:400;font-style:normal}@font-face{font-family:"Liberation Serif";src:url(/api/fonts/LiberationSerif-Regular.ttf) format("truetype");font-weight:400;font-style:normal}@font-face{font-family:Liberation Sans;src:url(/api/fonts/LiberationSans-Regular.ttf) format("truetype");font-weight:400;font-style:normal}@font-face{font-family:Liberation Mono;src:url(/api/fonts/LiberationMono-Regular.ttf) format("truetype");font-weight:400;font-style:normal}html,body{height:auto;min-height:auto}body{font-family:Roboto,sans-serif;background-color:#f5f6f5;color:#333;line-height:1.6}.App{text-align:center!important;padding:20px;max-width:900px;margin:0 auto;background:#fff;border-radius:12px;box-shadow:0 4px 12px #0000000d;height:auto;display:flex;flex-direction:column}h1{font-size:2rem;font-weight:500;color:#1a2b49;margin-bottom:30px}h3{font-size:1.25rem;font-weight:500;color:#1a2b49;margin:20px 0}.form{display:flex;flex-direction:column;gap:4px;margin:5px auto;max-width:450px;align-items:center;padding:10px;border:1px solid #ddd;border-radius:8px;background-color:#fafafa;box-shadow:0 2px 6px #0000000d}.form-row{background-color:#fafafa;padding:2px 10px;border-radius:6px;width:100%;box-shadow:0 1px 3px #00000008;display:flex;align-items:center;margin-bottom:3px}label{display:flex;align-items:center;font-size:1rem;font-weight:500;color:#444;margin-right:6px;white-space:nowrap;min-width:80px;width:100%;justify-content:space-between}input,select{padding:5px 8px;border:1px solid #ddd;border-radius:6px;font-size:1rem;transition:border-color .3s ease,box-shadow .3s ease;flex:1;max-width:200px;width:100%}input:hover,select:hover{border-color:#bbb;box-shadow:0 0 4px #0000001a}input:focus,select:focus{border-color:#0073b1;outline:none;box-shadow:0 0 4px #0073b133}input[type=range]{max-width:150px;-webkit-appearance:none;background:#ddd;border-radius:5px;height:8px;outline:none;margin:0 10px}input[type=range]::-webkit-slider-thumb,input[type=range]::-moz-range-thumb{width:16px;height:16px;background:#0073b1;border-radius:50%;cursor:pointer;box-shadow:0 1px 3px #0003}input[type=file]{max-width:100%}button{padding:8px 16px;border:none;border-radius:6px;background-color:#0073b1;color:#fff;font-size:1rem;font-weight:500;cursor:pointer;transition:background-color .3s ease;margin-top:0}button:hover{background-color:#005f91}span{font-weight:500;color:#333;margin:0 10px}.error{color:#d32f2f;font-size:.9rem;margin-top:10px}img{max-width:100%;height:auto;margin-top:10px;border-radius:8px;box-shadow:0 2px 8px #0000001a}.preview{border:1px solid #ddd;border-radius:8px;padding:10px;background-color:#fafafa;margin:0 auto 10px;max-width:600px;position:relative;box-shadow:0 2px 6px #0000000d}.preview-content{position:relative;display:inline-block}.preview-btn{position:absolute;background-color:#0073b1;color:#fff;border:none;padding:3px 8px;border-radius:4px;cursor:pointer;font-size:.85rem;-webkit-user-select:none;user-select:none}.preview-btn.top{top:0;left:50%;transform:translate(-50%,-50%)}.preview-btn.bottom{bottom:15px;left:50%;transform:translate(-50%)}.preview-btn.left{left:0;top:50%;transform:translate(-50%,-50%)}.preview-btn.right{right:0;top:50%;transform:translate(50%,-50%)}.warning{background-color:#ffebee;color:#c62828;padding:12px;border-radius:6px;font-weight:500;margin:20px auto;max-width:500px}.button-group{display:flex;flex-direction:column;justify-content:center;align-items:center;gap:5px;margin:10px auto 0;max-width:500px;padding:7px;border:1px solid #ddd;border-radius:8px;background-color:#fafafa}.custom-upload{display:flex;align-items:center;margin-left:10px}.upload-btn{background-color:#0a66c2;color:#fff;border:none;padding:5px 10px;border-radius:4px;cursor:pointer}.upload-btn:hover{background-color:#004182}.file-selected{color:green;margin-left:10px;font-weight:700}.content-wrapper{display:flex;flex-direction:column;transition:all .3s ease;margin-top:-15px;height:auto;min-height:auto}.content-wrapper.keyboard-visible{flex-direction:column-reverse}@media screen and (max-width: 768px){.preview,.form,.button-group{padding:10px;margin:10px auto}.content-wrapper.keyboard-visible{height:auto!important;overflow-y:auto}.content-wrapper.keyboard-visible .preview{position:sticky;top:0;z-index:10;background:white;box-shadow:0 2px 4px #0000001a;transition:none}.content-wrapper.keyboard-visible .preview img{max-height:30vh;object-fit:contain}.content-wrapper.keyboard-visible .form-row{padding:2px 10px;margin-bottom:3px}html.is-scrolling *{transition-duration:0ms!important}}.app-header{width:100%;margin-bottom:0;padding:0}.header-container{display:flex;flex-direction:column;align-items:center;max-width:850px;margin:0 auto;padding:15px;text-align:center}.logo-title-container{display:flex;flex-direction:column;align-items:center;gap:5px;margin-bottom:5px}.header-logo{width:60px;height:auto}.title-container{display:flex;flex-direction:column;align-items:center}.title-container h1{margin:0;font-size:1.6rem;color:#1a2b49;line-height:1.1;white-space:nowrap}.subtitle{font-size:.9rem;color:#666;font-weight:500;margin-top:-2px}.header-buttons{display:flex;flex-direction:row;justify-content:center;align-items:center;gap:10px;margin-top:5px;flex-wrap:nowrap}.examples-button{padding:6px 12px;background-color:#0073b1;color:#fff;border:none;border-radius:4px;font-size:.85rem;font-weight:500;cursor:pointer;white-space:nowrap;width:auto;min-width:initial;flex:none}.examples-button:hover{background-color:#005f91}@media screen and (max-width: 600px){.app-header h1{font-size:1.3rem}.subtitle{font-size:.9rem}}@media screen and (max-width: 400px){.header-buttons{flex-direction:column;gap:8px}.examples-button{width:80%}}.disclaimer-text{white-space:nowrap;display:inline}.terms-disclaimer,.payment-warning{font-size:.85rem;line-height:1.3;white-space:normal}.terms-disclaimer{margin:0 auto 8px;max-width:95%}.footer-links{margin-top:20px;position:static}.copyright,footer p{position:static;margin-top:10px;padding-bottom:10px}footer,.footer,div[style*="margin-top: 15px"]{position:static!important;bottom:auto!important;margin-top:20px!important}.pp-9HBQC4325MZNJ{text-align:center;border:none;border-radius:.25rem;min-width:11.625rem;padding:0 2rem;height:2.625rem;font-weight:700;background-color:#ffd140;color:#000;font-family:Helvetica Neue,Arial,sans-serif;font-size:1rem;line-height:1.25rem;cursor:pointer}.back-button{display:flex;align-items:center;background-color:#f5f5f5;border:1px solid #e0e0e0;transition:background-color .2s ease}.back-button:hover{background-color:#e8e8e8}.back-button:before{content:"?";margin-right:5px}@media (max-width: 768px){.header-buttons{flex-wrap:wrap;justify-content:center}.examples-button{margin:4px;font-size:.9rem;padding:6px 12px}.back-button{width:auto;margin-right:4px}}.back-button:before{content:"←";margin-right:5px}.landing-page-new{min-height:100vh}:root{--primary: #9370db;--primary-dark: #7b5cc0;--secondary: #00ffff;--secondary-dark: #00cccc;--text-primary: #ffffff;--text-secondary: #cccccc;--text-muted: #999999;--bg-primary: #1a1a1a;--bg-secondary: #242424;--bg-tertiary: #2d2d2d;--border: #333333;--success: #4caf50;--gradient-main: linear-gradient(135deg, #9370db 0%, #00ffff 100%);--gradient-secondary: linear-gradient(135deg, #1a1a1a 0%, #2d2d2d 100%)}*{margin:0;padding:0;box-sizing:border-box}.landing-page-new{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;background:var(--bg-primary);color:var(--text-primary);line-height:1.6;overflow-x:hidden}.bg-animation{position:fixed;top:0;left:0;width:100%;height:100%;z-index:-1;background:var(--bg-primary)}.bg-animation:before{content:"";position:absolute;top:0;left:0;width:100%;height:100%;background:radial-gradient(circle at 20% 30%,rgba(147,112,219,.1) 0%,transparent 50%),radial-gradient(circle at 80% 70%,rgba(0,255,255,.08) 0%,transparent 50%),radial-gradient(circle at 60% 20%,rgba(147,112,219,.06) 0%,transparent 50%);animation:float 20s ease-in-out infinite}.header{background:rgba(36,36,36,.95);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-bottom:1px solid var(--border);position:sticky;top:0;z-index:100}.header-content{max-width:1200px;margin:0 auto;padding:20px;display:flex;justify-content:space-between;align-items:center}.logo-section{display:flex;align-items:center;gap:15px}.logo{width:40px;height:40px;border-radius:8px;background:var(--gradient-main);display:flex;align-items:center;justify-content:center;font-weight:700;color:var(--bg-primary)}.logo-text h1{font-size:1.5rem;font-weight:600;background:var(--gradient-main);-webkit-background-clip:text;background-clip:text;color:transparent;letter-spacing:-.5px}.logo-text p{font-size:.85rem;color:var(--text-secondary);margin-top:-2px}.nav-buttons{display:flex;gap:15px;align-items:center}.nav-btn{background:transparent;border:1px solid transparent;color:var(--text-primary);padding:8px 16px;border-radius:6px;text-decoration:none;font-size:1rem;font-weight:500;transition:all .2s;cursor:pointer}.nav-btn:hover{color:var(--text-primary);border-color:var(--border)}.nav-btn.primary{background:var(--primary);color:#fff;border-color:var(--primary)}.nav-btn.primary:hover{background:var(--primary-dark);transform:translateY(-1px)}.nav-btn.accent{background:var(--secondary);color:var(--bg-primary);border-color:var(--secondary)}.nav-btn.accent:hover{background:var(--secondary-dark);transform:translateY(-1px)}.auth-buttons{display:flex;gap:10px}.hero{max-width:1200px;margin:0 auto;padding:100px 20px;text-align:center}.hero-badge{display:inline-block;background:rgba(147,112,219,.2);color:var(--primary);padding:8px 24px;border-radius:30px;font-size:.9rem;font-weight:600;margin-bottom:30px;text-transform:uppercase;letter-spacing:2px;border:1px solid var(--primary);animation:pulse 2s infinite}@keyframes pulse{0%,to{transform:scale(1)}50%{transform:scale(1.05)}}.hero h2{font-size:3.5rem;font-weight:700;letter-spacing:-1px;margin-bottom:30px;line-height:1.1}.hero .accent{background:var(--gradient-main);-webkit-background-clip:text;background-clip:text;color:transparent}.hero .highlight{color:var(--secondary)}.hero p{font-size:1.3rem;color:var(--text-secondary);max-width:700px;margin:0 auto 50px;line-height:1.5}.hero-buttons{display:flex;gap:20px;justify-content:center;margin-bottom:60px}.hero-btn{padding:16px 32px;border-radius:12px;text-decoration:none;font-weight:600;font-size:1.1rem;transition:all .3s ease;display:inline-flex;align-items:center;gap:8px}.hero-btn.primary{background:var(--gradient-main);color:var(--bg-primary);border:none}.hero-btn.primary:hover{transform:translateY(-3px);box-shadow:0 15px 35px #9370db66}.hero-btn.secondary{background:var(--gradient-main);color:var(--bg-primary);border:none}.hero-btn.secondary:hover{transform:translateY(-3px);box-shadow:0 15px 35px #9370db66}.featured-studios{max-width:1200px;margin:0 auto;padding:80px 20px}.section-header{text-align:center;margin-bottom:60px}.section-header h3{font-size:2.5rem;font-weight:700;margin-bottom:20px;background:var(--gradient-main);-webkit-background-clip:text;background-clip:text;color:transparent}.section-header p{font-size:1.2rem;color:var(--text-secondary);max-width:800px;margin:0 auto;white-space:nowrap}.studios-grid{display:grid;grid-template-columns:1fr 1fr;gap:40px;margin-bottom:60px}.studio-card{background:var(--bg-secondary);border:2px solid var(--border);border-radius:20px;padding:40px;position:relative;overflow:hidden;transition:all .4s ease}.studio-card:before{content:"";position:absolute;top:0;left:0;right:0;height:4px;background:var(--gradient-main);transform:translate(-100%);transition:transform .4s ease}.studio-card:hover{transform:translateY(-8px);border-color:var(--primary);box-shadow:0 20px 40px #9370db33}.studio-card:hover:before{transform:translate(0)}.studio-card.primary{border-color:var(--primary);background:linear-gradient(135deg,var(--bg-secondary) 0%,rgba(147,112,219,.05) 100%)}.studio-card.secondary{border-color:var(--secondary);background:linear-gradient(135deg,var(--bg-secondary) 0%,rgba(0,255,255,.05) 100%)}.studio-badge{display:inline-block;padding:6px 16px;border-radius:20px;font-size:.75rem;font-weight:600;text-transform:uppercase;letter-spacing:1px;margin-bottom:20px}.studio-card.primary .studio-badge{background:var(--primary);color:#fff}.studio-card.secondary .studio-badge{background:var(--secondary);color:var(--bg-primary)}.studio-title{font-size:2rem;margin-bottom:20px;font-weight:700;color:var(--text-primary)}.studio-desc{font-size:1.1rem;color:var(--text-secondary);margin-bottom:30px;line-height:1.6}.feature-list{list-style:none;padding:0;margin:0 0 30px}.feature-list li{padding:8px 0;color:var(--text-secondary);font-size:.95rem;display:flex;align-items:center;gap:8px}.feature-list li:before{content:"✓";color:var(--success);font-weight:700}.studio-btn{display:inline-flex;align-items:center;gap:8px;padding:14px 28px;border-radius:10px;text-decoration:none;font-weight:600;transition:all .3s ease}.studio-card.primary .studio-btn{background:var(--primary);color:#fff}.studio-card.primary .studio-btn:hover{background:var(--primary-dark);transform:translate(5px)}.studio-card.secondary .studio-btn{background:var(--secondary);color:var(--bg-primary)}.studio-card.secondary .studio-btn:hover{background:var(--secondary-dark);transform:translate(5px)}.use-cases-section{max-width:1200px;margin:0 auto;padding:80px 20px}.use-cases-content{text-align:center}.use-cases-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:30px;margin:50px 0}.use-case-card{background:var(--bg-secondary);border:1px solid var(--border);border-radius:16px;padding:30px 20px;text-align:center;transition:all .3s ease;position:relative;overflow:hidden}.use-case-card:before{content:"";position:absolute;top:0;left:0;right:0;height:3px;background:var(--gradient-main);transform:translate(-100%);transition:transform .3s ease}.use-case-card:hover{transform:translateY(-5px);border-color:var(--primary);box-shadow:0 10px 30px #9370db33}.use-case-card:hover:before{transform:translate(0)}.use-case-icon{font-size:2.5rem;margin-bottom:20px;display:block}.use-case-card h4{font-size:1.3rem;font-weight:600;margin-bottom:15px;color:var(--text-primary)}.use-case-card p{color:var(--text-secondary);line-height:1.6;font-size:.95rem}.use-cases-cta{margin-top:50px;padding:40px;background:rgba(147,112,219,.1);border:1px solid var(--primary);border-radius:16px}.use-cases-cta p{font-size:1.2rem;color:var(--text-secondary);margin-bottom:20px;font-style:italic}.use-cases-btn{background:var(--gradient-main);color:var(--bg-primary);padding:14px 28px;border-radius:10px;text-decoration:none;font-weight:600;font-size:1.1rem;transition:all .3s ease;display:inline-block}.use-cases-btn:hover{transform:translateY(-2px);box-shadow:0 10px 25px #9370db4d}.quick-start-section{background:var(--bg-secondary);padding:60px 20px;border-top:1px solid var(--border);border-bottom:1px solid var(--border)}.quick-start-content{max-width:1200px;margin:0 auto}.quick-start-card{display:grid;grid-template-columns:1fr auto 1fr;gap:40px;margin-top:40px;background:var(--bg-tertiary);border:1px solid var(--border);border-radius:16px;padding:40px;align-items:center}.quick-start-features,.studios-features{text-align:left}.quick-start-features h4,.studios-features h4{font-size:1.4rem;margin-bottom:15px;color:var(--text-primary)}.quick-start-features p,.studios-features p{color:var(--text-secondary);margin-bottom:20px;line-height:1.6}.vs-divider{display:flex;align-items:center;justify-content:center;width:60px;height:60px;background:var(--primary);color:#fff;border-radius:50%;font-weight:700;font-size:1.2rem}.quick-start-btn{background:var(--secondary);color:var(--bg-primary);padding:12px 24px;border-radius:8px;text-decoration:none;font-weight:600;transition:all .3s ease;display:inline-block;margin-top:10px}.quick-start-btn:hover{background:var(--secondary-dark);transform:translateY(-2px)}.studio-buttons{display:flex;gap:10px;margin-top:10px}.studio-link-btn{background:var(--primary);color:#fff;padding:10px 18px;border-radius:6px;text-decoration:none;font-weight:600;font-size:.9rem;transition:all .3s ease}.studio-link-btn:hover{background:var(--primary-dark);transform:translateY(-1px)}.platform-banners{background:var(--bg-secondary);padding:80px 20px;border-top:1px solid var(--border)}.platform-banners-content{max-width:1200px;margin:0 auto}.platforms-grid{display:grid;grid-template-columns:repeat(3,1fr);grid-template-rows:repeat(2,1fr);gap:20px;margin-top:30px;max-width:900px;margin-left:auto;margin-right:auto}.platform-card{background:var(--bg-tertiary);border:1px solid var(--border);border-radius:12px;padding:25px 20px;text-align:center;transition:all .3s ease;cursor:pointer;min-height:140px;display:flex;flex-direction:column;justify-content:center;align-items:center;text-decoration:none;color:inherit}.platform-card:hover{border-color:var(--primary);transform:translateY(-4px);color:inherit;text-decoration:none}.platform-icon{font-size:2.2rem;margin-bottom:12px}.platform-name{font-size:1.1rem;font-weight:600;margin-bottom:8px}.platform-price{font-size:1.2rem;color:var(--secondary);font-weight:600}.cta-section{max-width:1200px;margin:0 auto;padding:100px 20px;text-align:center}.cta-card{background:var(--bg-secondary);border:2px solid var(--primary);border-radius:20px;padding:60px;position:relative;overflow:hidden}.cta-card:before{content:"";position:absolute;top:0;left:0;right:0;height:100%;background:linear-gradient(135deg,rgba(147,112,219,.1) 0%,rgba(0,255,255,.05) 100%);z-index:0}.cta-content{position:relative;z-index:1}.cta-title{font-size:2.5rem;margin-bottom:20px;color:var(--text-primary);font-weight:700}.cta-desc{font-size:1.2rem;color:var(--text-secondary);margin-bottom:40px;max-width:600px;margin-left:auto;margin-right:auto}.cta-btn{background:var(--gradient-main);color:var(--bg-primary);padding:18px 36px;border-radius:12px;text-decoration:none;font-weight:600;font-size:1.2rem;display:inline-block;transition:all .3s ease}.cta-btn:hover{transform:translateY(-3px);box-shadow:0 15px 35px #9370db66}.footer{background:var(--bg-secondary);border-top:1px solid var(--border);padding:60px 20px 40px}.footer-content{max-width:1200px;margin:0 auto 40px;display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:40px}.footer-brand h3{font-size:1.5rem;margin-bottom:15px;background:var(--gradient-main);-webkit-background-clip:text;background-clip:text;color:transparent}.footer-brand p{color:var(--text-secondary);line-height:1.6}.footer-section h4{font-size:1.1rem;margin-bottom:20px;color:var(--text-primary)}.footer-links{list-style:none;padding:0}.footer-links li{margin-bottom:10px}.footer-links a{color:var(--text-secondary);text-decoration:none;transition:color .2s}.footer-links a:hover{color:var(--secondary)}.footer-bottom{border-top:1px solid var(--border);padding-top:30px;text-align:center;color:var(--text-muted)}@media (max-width: 968px){.section-header p{white-space:normal}.studios-grid{grid-template-columns:1fr;gap:30px}.use-cases-grid{grid-template-columns:repeat(2,1fr);gap:20px}.quick-start-card{grid-template-columns:1fr;gap:30px;text-align:center}.vs-divider{margin:0 auto}.studio-buttons{justify-content:center}.platforms-grid{grid-template-columns:repeat(2,1fr);grid-template-rows:repeat(3,1fr);gap:15px}.hero h2{font-size:2.5rem}.hero-buttons{flex-direction:column;align-items:center}.trust-indicators{flex-direction:column;gap:20px}.footer-content{grid-template-columns:1fr;gap:30px}}@media (max-width: 768px){.nav-buttons{display:none}.hero{padding:60px 20px}.hero h2{font-size:2rem}.use-cases-grid{grid-template-columns:1fr;gap:20px}.platforms-grid{grid-template-columns:1fr;grid-template-rows:repeat(6,1fr)}}.footer-links .link-button{background:none;border:none;color:var(--text-primary);color:inherit;cursor:pointer;text-decoration:none;padding:0;font:inherit;transition:color .2s}.footer-links .link-button:hover{color:var(--secondary)}.dbscan-showcase{background:rgba(255,255,255,.05);border:1px solid rgba(0,191,255,.3);border-radius:20px;padding:40px;margin:40px 0;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);position:relative;overflow:hidden}.dbscan-showcase:before{content:"";position:absolute;top:0;left:0;right:0;height:3px;background:linear-gradient(90deg,#00ffff,#ff00ff,#00ffff);animation:shimmer 3s ease-in-out infinite}@keyframes shimmer{0%,to{opacity:.5}50%{opacity:1}}.demo-title{font-size:1.8rem;margin-bottom:15px;color:#0ff;font-weight:700;text-align:center}.demo-subtitle{font-size:1.1rem;color:#ccc;margin-bottom:30px;line-height:1.4;text-align:center;max-width:600px;margin-left:auto;margin-right:auto}.demo-container{background:#000;border-radius:15px;padding:30px;margin:30px 0;border:2px solid #333;position:relative}.demo-video-area{width:100%;max-width:700px;height:400px;margin:0 auto;background:linear-gradient(45deg,#1a1a1a,#2a2a2a);border-radius:12px;display:flex;align-items:center;justify-content:center;position:relative;overflow:hidden;border:1px solid #444}.demo-gif{width:100%;height:100%;object-fit:cover;border-radius:10px}.demo-caption{margin-top:20px;font-size:1.1rem;color:#00bfff;font-weight:600;display:flex;align-items:center;justify-content:center;gap:10px;text-align:center}.demo-arrow{font-size:1.5rem;animation:bounce 2s ease-in-out infinite}@keyframes bounce{0%,20%,50%,80%,to{transform:translateY(0)}40%{transform:translateY(-8px)}60%{transform:translateY(-4px)}}.demo-features{display:flex;justify-content:center;gap:40px;margin-top:30px;flex-wrap:wrap}.demo-feature{display:flex;flex-direction:column;align-items:center;gap:8px;font-size:.9rem;color:var(--text-primary);font-weight:600}.feature-icon{font-size:2rem;margin-bottom:5px}@media (max-width: 768px){.dbscan-showcase{padding:25px;margin:30px 0}.demo-title{font-size:1.5rem}.demo-subtitle{font-size:1rem}.demo-video-area{height:300px}.demo-features{gap:20px}}.dbscan-showcase .demo-features .demo-feature span:not(.feature-icon){color:var(--text-primary)!important}.demo-arrow{font-size:1.5rem;animation:bounce 2s ease-in-out infinite;color:var(--secondary)!important}.typography-demo-showcase{margin:3rem 0;padding:2rem;background:linear-gradient(135deg,rgba(139,69,19,.1),rgba(255,140,0,.1));border-radius:20px;border:2px solid rgba(255,140,0,.3)}.typography-demo-showcase .demo-title{font-size:1.8rem;font-weight:800;color:#fa0;text-align:center;margin-bottom:.5rem;text-shadow:2px 2px 4px rgba(0,0,0,.5)}.typography-demo-showcase .demo-subtitle{color:#f5f5f5;text-align:center;margin-bottom:2rem;font-size:1.2rem;font-weight:500;text-shadow:1px 1px 2px rgba(0,0,0,.7);line-height:1.4}.typography-demo{border:3px solid #ff8c00;border-radius:12px;box-shadow:0 8px 32px #ff8c004d}@media (max-width: 768px){.typography-demo-showcase{margin:2rem 0;padding:1.5rem}.typography-demo-showcase .demo-title{font-size:1.3rem}}.typography-demo-showcase .demo-caption{color:#f0f0f0;font-weight:600;font-size:1.1rem;text-shadow:1px 1px 3px rgba(0,0,0,.8)}.typography-demo-showcase .demo-features .demo-feature span:last-child{color:#f5f5f5!important;font-weight:600;text-shadow:1px 1px 2px rgba(0,0,0,.7)}.trust-indicators{display:flex;justify-content:center;gap:40px;margin-top:40px;padding:20px;background:rgba(255,255,255,.02);border-radius:12px;border:1px solid var(--border)}.trust-item{text-align:center}.trust-number{font-size:2.5rem;font-weight:700;color:var(--secondary);display:block;margin-bottom:5px}.trust-label{font-size:.9rem;color:var(--text-muted);text-transform:uppercase;letter-spacing:1px}.as-seen-in{margin-top:50px;padding:40px;background:rgba(147,112,219,.05);border:1px solid rgba(147,112,219,.2);border-radius:16px;text-align:center}.as-seen-title{font-size:1.2rem;color:var(--text-secondary);margin-bottom:30px;text-transform:uppercase;letter-spacing:2px;font-weight:600}.media-outlets{display:flex;justify-content:center;align-items:center;gap:30px;margin-bottom:25px;flex-wrap:wrap}.outlet-link{text-decoration:none;transition:all .3s ease}.outlet-link:hover{transform:translateY(-3px)}.outlet-logo{background:var(--bg-secondary);border:1px solid var(--border);border-radius:8px;padding:12px 20px;font-size:.9rem;font-weight:600;color:var(--text-primary);transition:all .3s ease;min-width:120px;text-align:center}.outlet-link:hover .outlet-logo{border-color:var(--primary);color:var(--primary);box-shadow:0 5px 15px #9370db33}.outlet-logo.pending{background:rgba(255,140,0,.1);border-color:#ff8c004d;color:#fa0;font-style:italic}.coverage-stats{font-size:.95rem;color:var(--text-muted);margin-bottom:25px;font-style:italic}.press-release-btn{display:inline-flex;align-items:center;gap:8px;background:var(--gradient-main);color:var(--bg-primary);padding:12px 24px;border-radius:8px;text-decoration:none;font-weight:600;font-size:.95rem;transition:all .3s ease}.press-release-btn:hover{transform:translateY(-2px);box-shadow:0 8px 20px #9370db4d}.stripe-iframe-placeholder{height:1px;width:1px;position:relative;margin:0;padding:0;visibility:hidden}iframe[name=__privateStripeMetricsController1500]{position:fixed!important;top:0!important;left:0!important;width:1px!important;height:1px!important;border:none!important;visibility:hidden!important;opacity:0!important;pointer-events:none!important;transform:translateZ(0)}html,body{min-height:100vh!important;overflow-x:hidden!important;position:relative!important}.resources-page{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;background:#0a0a0a;color:#fff;min-height:100vh;margin:0;padding:0;line-height:1.6}.resources-page .header{background:linear-gradient(180deg,#1a1a1a 0%,#111 100%);border-bottom:1px solid #333;padding:25px 0;position:sticky;top:0;z-index:100;-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px)}.resources-page .header-content{max-width:1400px;margin:0 auto;padding:0 40px;display:flex;justify-content:space-between;align-items:center}.resources-page .header-nav{display:flex;gap:20px;align-items:center}.resources-page .header-nav a{color:#fff;text-decoration:none;padding:8px 16px;border-radius:8px;font-weight:500;transition:all .3s ease;font-size:1rem}.resources-page .header-nav a:hover{background-color:#ffffff1a}@media (max-width: 768px){.resources-page .header-content{padding:0 20px}.resources-page .header-nav{gap:15px;font-size:.9rem}.resources-page .header-nav a{padding:6px 12px;font-size:.9rem}}.resources-page .quick-actions{padding:80px 40px;max-width:1400px;margin:0 auto}.resources-page .quick-actions-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:30px}.resources-page .quick-action-card{background:#1a1a1a;border:2px solid #9370db;border-radius:20px;padding:40px 30px;text-align:center;text-decoration:none;color:inherit;transition:all .4s ease;position:relative;overflow:hidden}.resources-page .quick-action-card.handwriting{border-color:#0ff}.resources-page .quick-action-card.ecard{border-color:#ff6b6b}.resources-page .quick-action-card.showcase{border-color:#444}@media (max-width: 768px){.resources-page .quick-actions{padding:60px 20px}.resources-page .quick-actions-grid{grid-template-columns:1fr;gap:20px}}@media (max-width: 1024px) and (min-width: 769px){.resources-page .quick-actions-grid{grid-template-columns:repeat(2,1fr)}}.resources-page .platform-resources{padding:80px 40px;max-width:1400px;margin:40px auto 0;background:#1a1a1a;border-radius:40px;position:relative}.resources-page .platform-resources:before{content:"";position:absolute;top:0;left:0;right:0;height:4px;background:linear-gradient(135deg,#9370db 0%,#00ffff 100%);border-radius:40px 40px 0 0}.resources-page .platform-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:30px}.resources-page .platform-card{background:#0a0a0a;border:1px solid #333;border-radius:16px;padding:30px;transition:all .3s ease}@media (max-width: 768px){.resources-page .platform-resources{padding:60px 20px;margin:20px auto 0}.resources-page .platform-grid{grid-template-columns:1fr;gap:20px}}.resources-page .video-ecard-resources{padding:80px 40px;max-width:1400px;margin:0 auto}.resources-page .video-ecard-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:30px}.resources-page .video-ecard-card{background:#1a1a1a;border:2px solid #333;border-radius:16px;padding:30px;text-decoration:none;color:inherit;transition:all .4s ease;position:relative;overflow:hidden}@media (max-width: 768px){.resources-page .video-ecard-resources{padding:60px 20px}.resources-page .video-ecard-grid{grid-template-columns:1fr;gap:20px}}@media (max-width: 1024px) and (min-width: 769px){.resources-page .video-ecard-grid{grid-template-columns:repeat(2,1fr)}}.resources-page .profession-resources{padding:80px 40px;max-width:1400px;margin:0 auto}.resources-page .profession-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:30px}.resources-page .profession-card{background:#1a1a1a;border:2px solid #333;border-radius:16px;padding:30px;text-decoration:none;color:inherit;transition:all .4s ease;position:relative;overflow:hidden}@media (max-width: 768px){.resources-page .profession-resources{padding:60px 20px}.resources-page .profession-grid{grid-template-columns:1fr;gap:20px}}@media (max-width: 1024px) and (min-width: 769px){.resources-page .profession-grid{grid-template-columns:repeat(2,1fr)}}.order-lookup-page{min-height:100vh;display:flex;flex-direction:column;background-color:var(--bg-primary);color:var(--text-primary);font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Open Sans,Helvetica Neue,sans-serif;position:relative}.order-lookup-page:before{content:"";position:fixed;top:0;left:0;width:100%;height:100%;z-index:-1;background:radial-gradient(circle at 20% 30%,rgba(147,112,219,.1) 0%,transparent 50%),radial-gradient(circle at 80% 70%,rgba(0,255,255,.08) 0%,transparent 50%),radial-gradient(circle at 60% 20%,rgba(147,112,219,.06) 0%,transparent 50%);animation:float 20s ease-in-out infinite}.lookup-container{max-width:800px;margin:40px auto;flex:1;padding:0 20px;position:relative;z-index:1}.lookup-header{text-align:center;margin-bottom:30px}.lookup-header h1{font-size:2.5rem;margin-bottom:15px;font-weight:700;background:var(--gradient-main);-webkit-background-clip:text;background-clip:text;color:transparent}.subtitle{color:var(--text-secondary);font-size:1.2rem}.lookup-form-container{background-color:var(--bg-secondary);border-radius:16px;border:1px solid var(--border);box-shadow:0 4px 6px #0000004d;padding:40px;margin-bottom:30px;position:relative;overflow:hidden}.lookup-form-container:before{content:"";position:absolute;top:0;left:0;right:0;height:4px;background:var(--gradient-main)}.lookup-form{margin-bottom:20px}.input-group{margin-bottom:24px}.input-group label{display:block;font-weight:600;margin-bottom:10px;color:var(--text-primary);font-size:1rem}.order-input{width:100%;padding:14px 18px;font-size:1rem;background-color:var(--bg-tertiary);border:1px solid var(--border);border-radius:8px;color:var(--text-primary);transition:all .3s ease}.order-input:focus{border-color:var(--primary);outline:none;box-shadow:0 0 0 3px #9370db33;background-color:var(--bg-primary)}.order-input::placeholder{color:var(--text-muted)}.id-hint{font-size:.85rem;color:var(--text-muted);margin-top:8px}.lookup-button{background:var(--gradient-main);color:var(--bg-primary);font-weight:600;font-size:1.1rem;padding:14px 28px;border:none;border-radius:10px;cursor:pointer;transition:all .3s ease;width:100%;position:relative;overflow:hidden}.lookup-button:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 10px 25px #9370db4d}.lookup-button:disabled{background:var(--bg-tertiary);color:var(--text-muted);cursor:not-allowed;transform:none}.loading-spinner{display:inline-block;width:20px;height:20px;border:3px solid rgba(255,255,255,.3);border-radius:50%;border-top-color:var(--bg-primary);animation:spin 1s ease-in-out infinite}.error-message,.lookup-error{margin-top:20px;padding:16px 20px;background-color:#ff6b6b1a;border-left:4px solid var(--error);color:var(--error);border-radius:8px;display:flex;align-items:center}.error-icon{background-color:var(--error);color:var(--bg-primary);width:24px;height:24px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-weight:700;margin-right:12px}.lookup-help{margin-top:40px;padding-top:30px;border-top:1px solid var(--border)}.lookup-help h3{font-size:1.3rem;margin-bottom:20px;color:var(--text-primary);font-weight:600}.lookup-help ul{padding-left:20px;margin-bottom:20px}.lookup-help li{margin-bottom:10px;color:var(--text-secondary);line-height:1.6}.help-links{display:flex;gap:20px;margin-top:25px}.help-links a{color:var(--secondary);text-decoration:none;font-weight:500;transition:color .2s ease}.help-links a:hover{color:var(--secondary-dark);text-decoration:underline}.order-result,.order-details{background-color:var(--bg-secondary);border-radius:16px;border:1px solid var(--border);box-shadow:0 4px 6px #0000004d;padding:40px;position:relative;overflow:hidden}.order-result:before,.order-details:before{content:"";position:absolute;top:0;left:0;right:0;height:4px;background:var(--gradient-main)}.result-header,.order-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:30px;flex-wrap:wrap;gap:15px}.result-header h2,.order-header h3{font-size:1.6rem;color:var(--text-primary);margin:0;font-weight:600}.status-badge{padding:8px 16px;border-radius:20px;font-size:.85rem;font-weight:600;text-transform:uppercase;letter-spacing:1px}.order-card{background-color:var(--bg-tertiary);border-radius:12px;padding:30px;margin-bottom:30px;border:1px solid var(--border)}.order-id-display{background-color:var(--bg-primary);padding:16px;border-radius:8px;margin-bottom:25px;display:flex;align-items:center;border:1px solid var(--border)}.order-label,.label{font-weight:600;color:var(--text-secondary);margin-right:12px;min-width:80px}.order-value,.value{font-family:monospace;font-size:1.1rem;color:var(--secondary)}.order-details-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-bottom:30px}.detail-item,.info-item{display:flex;flex-direction:column;gap:6px}.detail-item.full-width{grid-column:1 / -1}.detail-label{font-size:.85rem;color:var(--text-muted);text-transform:uppercase;letter-spacing:.5px}.detail-value{color:var(--text-primary);font-size:1rem}.download-section{margin-top:30px;padding-top:30px;border-top:1px solid var(--border);text-align:center}.download-section h3{color:var(--text-primary);margin-bottom:15px;font-size:1.4rem;font-weight:600}.download-info{color:var(--text-secondary);margin-bottom:25px;font-size:1.1rem}.download-button{display:inline-block;background:linear-gradient(135deg,#10b981,#34d399);color:var(--bg-primary);font-weight:600;padding:14px 32px;border-radius:10px;text-decoration:none;margin:20px 0;transition:all .3s ease;font-size:1.1rem}.download-button:hover{transform:translateY(-3px);box-shadow:0 10px 25px #10b9814d}.expiry-notice{margin-top:20px;font-size:.9rem;color:var(--text-muted);background-color:var(--bg-primary);padding:12px 20px;border-radius:8px;border:1px solid var(--border)}.processing-section,.processing-info{margin-top:30px;padding-top:30px;border-top:1px solid var(--border);text-align:center}.processing-animation{margin-bottom:25px}.processing-spinner,.spinner{display:inline-block;width:50px;height:50px;border:4px solid rgba(147,112,219,.2);border-radius:50%;border-top-color:var(--primary);animation:spin 1s ease-in-out infinite;margin:20px auto}.auto-refresh-notice{margin-top:20px;font-size:.9rem;color:var(--text-muted);font-style:italic}.result-actions{display:flex;gap:16px;margin-top:40px;justify-content:center}.back-button{background-color:var(--bg-tertiary);color:var(--text-secondary);border:1px solid var(--border);padding:12px 24px;border-radius:8px;font-weight:500;cursor:pointer;transition:all .3s ease;text-decoration:none;display:inline-block}.back-button:hover{background-color:var(--bg-primary);color:var(--text-primary);border-color:var(--primary)}.downloads-link{display:inline-flex;align-items:center;padding:12px 24px;background-color:#00ffff1a;color:var(--secondary);text-decoration:none;border-radius:8px;font-weight:500;transition:all .3s ease;border:1px solid var(--secondary)}.downloads-link:hover{background-color:#0ff3;transform:translateY(-2px)}.order-lookup-section{background-color:var(--bg-secondary);border-radius:16px;border:1px solid var(--border);padding:40px;margin:30px auto;max-width:800px;position:relative;overflow:hidden}.order-lookup-section:before{content:"";position:absolute;top:0;left:0;right:0;height:4px;background:var(--gradient-main)}.order-lookup-section h2{font-size:1.8rem;margin-bottom:30px;color:var(--text-primary);text-align:center;font-weight:600}.footer{text-align:center;padding:30px 20px;color:var(--text-muted);background-color:var(--bg-secondary);border-top:1px solid var(--border);margin-top:60px}@media (max-width: 768px){.lookup-container{margin:20px auto}.order-details-grid{grid-template-columns:1fr}.result-actions{flex-direction:column}.lookup-header h1{font-size:2rem}.lookup-form-container{padding:30px 20px}}.order-lookup-navigation{display:flex;gap:20px;justify-content:center;margin:40px auto;max-width:800px;padding:0 20px;flex-wrap:wrap}.nav-button{padding:12px 24px;border-radius:8px;text-decoration:none;font-weight:600;transition:all .3s ease;display:inline-flex;align-items:center;gap:8px}.nav-button.primary{background:linear-gradient(135deg,#9370db 0%,#00ffff 100%);color:#1a1a1a}.nav-button.primary:hover{transform:translateY(-2px);box-shadow:0 10px 25px #9370db4d}.nav-button.secondary{background:#2d2d2d;color:#ccc;border:1px solid #333333}.nav-button.secondary:hover{background:#1a1a1a;color:#fff;border-color:#9370db;transform:translateY(-2px)}@media (max-width: 768px){.order-lookup-navigation{flex-direction:column}.nav-button{width:100%;justify-content:center}}:root{--bs-primary: #1a1a1a;--bs-secondary: #242424;--bs-accent-linkedin: #0073b1;--bs-accent-youtube: #ff0000;--bs-accent-medium: #00ab6c;--bs-accent-facebook: #1877f2;--bs-accent-github: #24292e;--bs-accent-substack: #ff6719;--bs-text-primary: #ffffff;--bs-text-secondary: #cccccc;--bs-text-muted: #999999;--bs-border: #333333;--bs-success: #4caf50;--bs-error: #f44336;--bs-gradient-dark: linear-gradient(135deg, #1a1a1a 0%, #2d2d2d 100%)}.banner-service-app{min-height:100vh;background:var(--bs-primary);color:var(--bs-text-primary);font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;display:flex;flex-direction:column;align-items:center;position:relative;overflow-x:hidden}.banner-service-bg{position:fixed;top:0;left:0;width:100%;height:100%;z-index:0;background:var(--bs-primary);pointer-events:none}.banner-service-bg:before{content:"";position:absolute;top:0;left:0;width:100%;height:100%;background:radial-gradient(circle at 20% 30%,rgba(0,115,177,.05) 0%,transparent 50%),radial-gradient(circle at 80% 70%,rgba(255,255,255,.02) 0%,transparent 50%);animation:bannerFloat 30s ease-in-out infinite}@keyframes bannerFloat{0%,to{transform:translateY(0) scale(1)}50%{transform:translateY(-10px) scale(1.01)}}.banner-service-header{width:100%;background:rgba(36,36,36,.95);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-bottom:1px solid var(--bs-border);position:sticky;top:0;z-index:100;transition:all .3s ease}.banner-service-header-content{max-width:1200px;margin:0 auto;padding:15px 20px;display:flex;justify-content:space-between;align-items:center;gap:20px}.banner-service-logo-section{display:flex;align-items:center;gap:15px}.banner-service-logo{width:45px;height:45px;border-radius:10px;overflow:hidden;box-shadow:0 2px 8px #0003}.banner-service-logo img{width:100%;height:100%;object-fit:cover}.banner-service-title-section h1{font-size:1.5rem;font-weight:600;margin:0;letter-spacing:-.5px}.banner-service-subtitle{font-size:.9rem;color:var(--bs-text-secondary);margin-top:2px}.banner-service-nav{display:flex;gap:10px;align-items:center;flex-wrap:wrap;justify-content:flex-end}.banner-service-nav-btn{padding:8px 16px;background:transparent;border:1px solid var(--bs-border);color:var(--bs-text-secondary);border-radius:8px;text-decoration:none;font-size:.9rem;font-weight:500;transition:all .2s ease;cursor:pointer;white-space:nowrap}.banner-service-nav-btn:hover{color:var(--bs-text-primary);border-color:var(--bs-text-secondary);background:rgba(255,255,255,.05)}.banner-service-nav-btn.back{background:rgba(255,255,255,.05);border-color:var(--bs-text-secondary)}.banner-service-nav-btn.back:before{content:"←";margin-right:5px}.banner-service-content{position:relative;z-index:1;width:100%;max-width:900px;margin:0 auto;padding:20px;flex:1;display:flex;flex-direction:column;gap:20px}.banner-service-preview-section{background:var(--bs-secondary);border:1px solid var(--bs-border);border-radius:16px;padding:20px;position:relative;overflow:hidden;box-shadow:0 4px 12px #0000001a}.banner-service-preview-container{position:relative;display:flex;justify-content:center;align-items:center;min-height:250px;background:rgba(0,0,0,.2);border-radius:12px;overflow:hidden}.banner-service-preview-image{max-width:100%;height:auto;border-radius:8px;box-shadow:0 4px 16px #0000004d}.banner-service-loading{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:15px;padding:40px}.banner-service-preview-placeholder{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:60px 20px;text-align:center}.banner-service-spinner{width:40px;height:40px;border:3px solid var(--bs-border);border-top:3px solid var(--bs-text-primary);border-radius:50%;animation:bannerSpin 1s linear infinite}@keyframes bannerSpin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.banner-service-form-section{background:var(--bs-secondary);border:1px solid var(--bs-border);border-radius:16px;padding:25px;box-shadow:0 4px 12px #0000001a}.banner-service-form{display:flex;flex-direction:column;gap:16px}.banner-service-form-row{display:flex;align-items:center;gap:12px;background:rgba(0,0,0,.2);padding:12px 16px;border-radius:10px;border:1px solid var(--bs-border);transition:all .2s ease}.banner-service-form-row:hover{border-color:var(--bs-text-secondary);background:rgba(0,0,0,.3)}.banner-service-label{font-size:.95rem;font-weight:500;color:var(--bs-text-secondary);min-width:120px;display:flex;align-items:center;gap:8px}.banner-service-input,.banner-service-select{flex:1;background:rgba(255,255,255,.05);border:1px solid var(--bs-border);color:var(--bs-text-primary);padding:8px 12px;border-radius:6px;font-size:.95rem;transition:all .2s ease}.banner-service-input:focus,.banner-service-select:focus{outline:none;border-color:var(--bs-text-primary);background:rgba(255,255,255,.08)}.banner-service-select option{background:var(--bs-secondary);color:var(--bs-text-primary)}.banner-service-upload{display:flex;align-items:center;gap:10px}.banner-service-upload-btn{padding:8px 16px;background:rgba(255,255,255,.1);border:1px solid var(--bs-text-secondary);color:var(--bs-text-primary);border-radius:6px;font-size:.9rem;font-weight:500;cursor:pointer;transition:all .2s ease}.banner-service-upload-btn:hover{background:rgba(255,255,255,.15);transform:translateY(-1px)}.banner-service-file-selected{color:var(--bs-success);font-size:.9rem;font-weight:500}.banner-service-arrow-controls{position:absolute;width:100%;height:100%;pointer-events:none}.banner-service-arrow-btn{position:absolute;background:rgba(255,255,255,.9);color:var(--bs-primary);border:none;width:32px;height:32px;border-radius:50%;display:flex;align-items:center;justify-content:center;cursor:pointer;font-size:14px;font-weight:700;transition:all .2s ease;pointer-events:all;box-shadow:0 2px 8px #0003}.banner-service-arrow-btn:hover{background:var(--bs-text-primary);transform:scale(1.1)}.banner-service-arrow-btn.top{top:10px;left:50%;transform:translate(-50%)}.banner-service-arrow-btn.bottom{bottom:10px;left:50%;transform:translate(-50%)}.banner-service-arrow-btn.left{left:10px;top:50%;transform:translateY(-50%)}.banner-service-arrow-btn.right{right:10px;top:50%;transform:translateY(-50%)}.banner-service-payment-section{background:var(--bs-gradient-dark);border:1px solid var(--bs-border);border-radius:16px;padding:25px;text-align:center;box-shadow:0 4px 12px #0000001a}.banner-service-promo{font-size:1.1rem;color:var(--bs-text-primary);margin-bottom:10px;font-weight:500}.banner-service-disclaimer{font-size:.85rem;color:var(--bs-text-secondary);margin-bottom:20px;line-height:1.5}.banner-service-disclaimer a{color:var(--bs-text-primary);text-decoration:underline}.banner-service-pay-btn{padding:14px 32px;background:var(--bs-text-primary);color:var(--bs-primary);border:none;border-radius:10px;font-size:1.1rem;font-weight:600;cursor:pointer;transition:all .3s ease;box-shadow:0 4px 12px #fff3}.banner-service-pay-btn:hover{transform:translateY(-2px);box-shadow:0 6px 20px #ffffff4d}.banner-service-app.linkedin .banner-service-pay-btn{background:var(--bs-accent-linkedin);color:#fff}.banner-service-app.youtube .banner-service-pay-btn{background:var(--bs-accent-youtube);color:#fff}.banner-service-app.medium .banner-service-pay-btn{background:var(--bs-accent-medium);color:#fff}.banner-service-app.facebook .banner-service-pay-btn{background:var(--bs-accent-facebook);color:#fff}.banner-service-app.github .banner-service-pay-btn{background:var(--bs-accent-github);color:#fff}.banner-service-app.substack .banner-service-pay-btn{background:var(--bs-accent-substack);color:#fff}.banner-service-error{background:rgba(244,67,54,.1);border:1px solid var(--bs-error);color:var(--bs-error);padding:12px 20px;border-radius:8px;margin:20px 0;text-align:center;font-weight:500}.banner-service-footer{width:100%;background:var(--bs-secondary);border-top:1px solid var(--bs-border);padding:20px;margin-top:auto}.banner-service-footer-links{display:flex;justify-content:center;gap:20px;flex-wrap:wrap}.banner-service-footer-link{background:none;border:none;color:var(--bs-text-secondary);font-size:.9rem;cursor:pointer;text-decoration:underline;transition:color .2s ease}.banner-service-footer-link:hover{color:var(--bs-text-primary)}@media (max-width: 768px){.banner-service-header-content{flex-direction:column;text-align:center}.banner-service-nav{justify-content:center;width:100%}.banner-service-form-row{flex-direction:column;align-items:stretch}.banner-service-label{min-width:auto}.banner-service-content{padding:10px}.banner-service-arrow-btn{width:28px;height:28px;font-size:12px}}.banner-service-warning{position:fixed;bottom:20px;left:50%;transform:translate(-50%);background:rgba(255,152,0,.9);color:#fff;padding:12px 24px;border-radius:8px;font-size:.95rem;font-weight:500;box-shadow:0 4px 12px #0000004d;z-index:1000;animation:slideIn .3s ease-out}@keyframes slideIn{0%{transform:translate(-50%) translateY(100%);opacity:0}to{transform:translate(-50%) translateY(0);opacity:1}}.banner-service-range{flex-grow:1;margin-right:10px}.banner-service-value{min-width:50px;text-align:right}.banner-service-input-full{flex:1;width:100%;padding:12px 15px;box-sizing:border-box;font-size:1rem;background:rgba(255,255,255,.05);border:1px solid var(--bs-border);color:var(--bs-text-primary);border-radius:6px;transition:all .2s ease}.banner-service-input-full:focus{outline:none;border-color:var(--bs-text-primary);background:rgba(255,255,255,.08);box-shadow:0 0 5px #0073b14d}.banner-service-message{font-size:1.2rem;color:var(--bs-text-primary);margin-bottom:20px}.banner-service-form-row input{flex:1!important;width:100%!important;min-width:0!important;max-width:none!important;margin:0!important}.banner-service-form-row{display:flex!important;align-items:center!important;gap:15px!important;padding:12px 16px!important}.banner-service-label{flex-shrink:0!important;flex-grow:0!important;width:auto!important;min-width:100px!important;max-width:150px!important}.banner-service-content h1{color:var(--bs-text-primary)!important;font-size:2.5rem;margin-bottom:20px}.banner-service-content .banner-service-message{color:var(--bs-text-primary)!important;font-size:1.2rem;margin-bottom:30px}.downloads-page{background-color:#1a1a1a;color:#fff;min-height:100vh;font-family:Inter,-apple-system,BlinkMacSystemFont,sans-serif;padding-bottom:50px}.downloads-header{padding:30px 20px;background-color:#111;border-bottom:1px solid #333333}.header-nav{display:flex;justify-content:space-between;max-width:1200px;margin:0 auto 20px;align-items:center}.back-button{color:#ccc;text-decoration:none;display:flex;align-items:center;font-size:.9rem}.back-button:hover{color:#fff;text-decoration:underline}.back-button:before{content:"←";margin-right:5px;font-size:1.2rem}.header-actions{display:flex;gap:10px}.refresh-btn{background-color:transparent;border:1px solid #444444;color:#ccc;padding:8px 12px;border-radius:4px;cursor:pointer;display:flex;align-items:center;font-size:.9rem}.refresh-btn:hover{background-color:#333;color:#fff}.header-title{max-width:1200px;margin:0 auto}.header-title h1{font-size:2.2rem;margin:0 0 8px;background:linear-gradient(135deg,#9370db,#00ffff);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.header-title p{color:#ccc;font-size:1rem;margin:0}.loading-state{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:80px 20px}.spinner{width:50px;height:50px;border:3px solid rgba(255,255,255,.1);border-top:3px solid #9370db;border-radius:50%;animation:spin 1s linear infinite;margin-bottom:20px}.error-banner{background-color:#ff00001a;border:1px solid rgba(255,0,0,.3);color:#ff6b6b;padding:12px 20px;margin:20px auto;max-width:1200px;border-radius:6px;display:flex;justify-content:space-between;align-items:center}.error-banner button{background:none;border:none;color:#ff6b6b;font-size:1.5rem;cursor:pointer}.auth-banner{background:linear-gradient(135deg,rgba(147,112,219,.1),rgba(0,255,255,.1));border:1px solid rgba(147,112,219,.3);padding:20px;margin:20px auto;max-width:1200px;border-radius:8px;display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap}.auth-message{flex:1;min-width:250px}.auth-message h3{margin:0 0 8px;color:#fff}.auth-message p{margin:0;color:#ccc;font-size:.9rem}.auth-actions{display:flex;gap:10px;margin-top:10px}.auth-btn{background-color:#333;color:#fff;padding:8px 16px;border-radius:4px;text-decoration:none;font-size:.9rem;transition:all .2s ease}.auth-btn.primary{background:linear-gradient(135deg,#9370db,#00ffff);color:#000;font-weight:500}.auth-btn:hover{transform:translateY(-2px)}.summary-section{padding:20px;max-width:1200px;margin:0 auto}.summary-cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:20px}.summary-card{background-color:#222;border:1px solid #333333;border-radius:8px;padding:20px;box-shadow:0 4px 6px #0000001a}.summary-card.expiring{border-color:#fa4}.card-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:15px}.card-header h3{margin:0;font-size:1.1rem;color:#ccc;font-weight:500}.card-icon{font-size:1.3rem}.card-value{font-size:2rem;font-weight:700;margin-bottom:5px;color:#fff}.card-detail{font-size:.9rem;color:#999}.downloads-section{padding:20px;max-width:1200px;margin:20px auto}.section-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px;flex-wrap:wrap}.section-header h2{margin:0;font-size:1.5rem;color:#fff}.section-info{color:#999;font-size:.9rem}.downloads-list{display:flex;flex-direction:column;gap:20px}.download-item{background-color:#222;border:1px solid #333333;border-radius:10px;overflow:hidden}.download-header{padding:20px;display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid #333333;flex-wrap:wrap;gap:10px}.download-title{flex:1;min-width:200px}.download-title h3{margin:0 0 8px;font-size:1.2rem;color:#fff}.download-meta{display:flex;align-items:center;gap:10px;flex-wrap:wrap}.animation-type{background-color:#44f;color:#fff;font-size:.7rem;padding:3px 8px;border-radius:10px;text-transform:uppercase;font-weight:500}.job-id{color:#999;font-size:.8rem;font-family:monospace}.download-actions{display:flex;gap:10px}.download-btn{background-color:#333;color:#fff;border:none;padding:8px 16px;border-radius:6px;cursor:pointer;font-size:.9rem;display:flex;align-items:center;transition:all .2s ease}.download-btn.primary{background:linear-gradient(135deg,#10b981,#34d399);color:#000;font-weight:500}.remove-btn{background-color:#333;color:#ff6b6b;border:none;width:36px;height:36px;border-radius:6px;cursor:pointer;display:flex;align-items:center;justify-content:center;font-size:1.1rem;transition:all .2s ease}.download-btn:hover,.remove-btn:hover{transform:translateY(-2px)}.download-details{padding:15px 20px;background-color:#1d1d1d}.detail-row{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:15px;margin-bottom:15px}.detail-item{display:flex;flex-direction:column}.detail-label{font-size:.8rem;color:#999;margin-bottom:4px}.detail-value{font-size:.9rem;color:#fff}.expiration-info{margin-top:10px}.expiration-bar{display:flex;flex-direction:column;gap:5px}.expiration-label{display:flex;justify-content:space-between;font-size:.8rem}.expiration-label span:first-child{color:#999}.time-remaining{font-weight:500}.expiration-progress{height:6px;background-color:#333;border-radius:3px;overflow:hidden}.progress-bar{height:100%;border-radius:3px;transition:width .3s ease}.empty-state{background-color:#222;border:1px dashed #444444;border-radius:10px;padding:40px 20px;text-align:center}.empty-icon{font-size:3rem;margin-bottom:15px;opacity:.6}.empty-state h3{margin:0 0 8px;color:#fff}.empty-state p{margin:0 0 25px;color:#999}.empty-actions{display:flex;gap:15px;justify-content:center;flex-wrap:wrap}.cta-button{background:linear-gradient(135deg,#9370db,#00ffff);color:#000;padding:12px 24px;border-radius:8px;text-decoration:none;font-weight:500;transition:all .2s ease}.cta-button.secondary{background:#333333;color:#fff}.cta-button:hover{transform:translateY(-3px);box-shadow:0 5px 15px #0003}.info-section{padding:0 20px 20px;max-width:1200px;margin:40px auto 0;display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:20px}.info-card{background-color:#ffffff0d;border:1px solid rgba(255,255,255,.1);border-radius:8px;padding:20px}.info-card h3{margin:0 0 15px;color:#fff;font-size:1.1rem}.info-content{color:#ccc;font-size:.9rem}.info-item{margin-bottom:10px;line-height:1.5}@media (max-width: 768px){.header-title h1{font-size:1.8rem}.download-header{flex-direction:column;align-items:flex-start}.download-actions{width:100%;margin-top:10px}.download-btn{flex:1}.detail-row{grid-template-columns:1fr;gap:10px}}.order-lookup-section{background-color:#242424;border-radius:16px;border:1px solid #333333;padding:40px;margin:30px auto;max-width:800px;position:relative;overflow:hidden;box-shadow:0 4px 6px #0000004d}.order-lookup-section:before{content:"";position:absolute;top:0;left:0;right:0;height:4px;background:linear-gradient(135deg,#9370db 0%,#00ffff 100%)}.order-lookup-section h2{font-size:1.8rem;margin-bottom:30px;color:#fff;text-align:center;font-weight:600}.order-lookup-form{max-width:500px;margin:0 auto}.order-lookup-form .input-group{margin-bottom:24px}.order-lookup-form .input-group label{display:block;font-weight:600;margin-bottom:10px;color:#fff;font-size:1rem}.order-lookup-form input{width:100%;padding:14px 18px;font-size:1rem;background-color:#2d2d2d;border:1px solid #333333;border-radius:8px;color:#fff;transition:all .3s ease}.order-lookup-form input:focus{border-color:#9370db;outline:none;box-shadow:0 0 0 3px #9370db33;background-color:#1a1a1a}.order-lookup-form input::placeholder{color:#999}.order-lookup-form input:disabled{opacity:.6;cursor:not-allowed}.order-lookup-form .lookup-button{background:linear-gradient(135deg,#9370db 0%,#00ffff 100%);color:#1a1a1a;font-weight:600;font-size:1.1rem;padding:14px 28px;border:none;border-radius:10px;cursor:pointer;transition:all .3s ease;width:100%;position:relative;overflow:hidden}.order-lookup-form .lookup-button:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 10px 25px #9370db4d}.order-lookup-form .lookup-button:disabled{background:#2d2d2d;color:#999;cursor:not-allowed;transform:none}.lookup-error{margin-top:20px;padding:16px 20px;background-color:#ff6b6b1a;border-left:4px solid #ff6b6b;color:#ff6b6b;border-radius:8px}.order-lookup-section .order-details{animation:fadeIn .3s ease-in}@keyframes fadeIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.order-lookup-section .order-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:30px;flex-wrap:wrap;gap:15px}.order-lookup-section .order-header h3{font-size:1.4rem;color:#fff;margin:0;font-weight:600}.order-lookup-section .status-badge{padding:8px 16px;border-radius:20px;font-size:.85rem;font-weight:600;text-transform:uppercase;letter-spacing:1px}.order-lookup-section .status-completed{background-color:#4f43;color:#4caf50;border:1px solid #4caf50}.order-lookup-section .status-processing{background-color:#0ff3;color:#0ff;border:1px solid #00ffff}.order-lookup-section .status-queued{background-color:#9370db33;color:#9370db;border:1px solid #9370db}.order-lookup-section .status-failed{background-color:#ff6b6b33;color:#ff6b6b;border:1px solid #ff6b6b}.order-lookup-section .order-info{background-color:#2d2d2d;border-radius:10px;padding:25px;margin-bottom:25px;border:1px solid #333333}.order-lookup-section .info-item{display:flex;justify-content:space-between;align-items:center;padding:12px 0;border-bottom:1px solid #333333}.order-lookup-section .info-item:last-child{border-bottom:none}.order-lookup-section .info-item .label{font-weight:600;color:#ccc;font-size:.95rem;text-transform:uppercase;letter-spacing:.5px}.order-lookup-section .info-item .value{color:#0ff;font-size:1rem}.order-lookup-section .download-section{margin-top:30px;padding:30px;background-color:#2d2d2d;border-radius:12px;text-align:center;border:1px solid #333333}.order-lookup-section .download-info{color:#ccc;font-size:1.1rem;margin-bottom:25px}.order-lookup-section .download-button{display:inline-block;background:linear-gradient(135deg,#10b981,#34d399);color:#1a1a1a;font-weight:600;padding:14px 32px;border-radius:10px;text-decoration:none;margin:20px 0;transition:all .3s ease;font-size:1.1rem}.order-lookup-section .download-button:hover{transform:translateY(-3px);box-shadow:0 10px 25px #10b9814d}.order-lookup-section .expiry-notice{margin-top:20px;font-size:.9rem;color:#999;background-color:#1a1a1a;padding:12px 20px;border-radius:8px;border:1px solid #333333;display:inline-block}.order-lookup-section .processing-info{text-align:center;padding:30px}.order-lookup-section .processing-info p{color:#ccc;font-size:1.05rem;margin-bottom:15px}.order-lookup-section .spinner{display:inline-block;width:50px;height:50px;border:4px solid rgba(147,112,219,.2);border-radius:50%;border-top-color:#9370db;animation:spin 1s ease-in-out infinite;margin:20px auto}.order-lookup-section .back-button{background-color:#2d2d2d;color:#ccc;border:1px solid #333333;padding:12px 24px;border-radius:8px;font-weight:500;cursor:pointer;transition:all .3s ease;margin-top:20px;font-size:1rem}.order-lookup-section .back-button:hover{background-color:#1a1a1a;color:#fff;border-color:#9370db;transform:translateY(-1px)}:root{--ecard-primary-new: #9370db;--ecard-primary-dark-new: #7b5cc0;--ecard-secondary-new: #00ffff;--ecard-secondary-dark-new: #00cccc;--ecard-text-primary-new: #ffffff;--ecard-text-secondary-new: #ffffff;--ecard-text-muted-new: #999999;--ecard-bg-primary-new: #1a1a1a;--ecard-bg-secondary-new: #242424;--ecard-bg-tertiary-new: #2d2d2d;--ecard-border-new: #333333;--ecard-success-new: #4caf50;--ecard-error-new: #ff4444;--ecard-gradient-main-new: linear-gradient(135deg, #9370db 0%, #00ffff 100%);--ecard-gradient-secondary-new: linear-gradient(135deg, #1a1a1a 0%, #2d2d2d 100%);--ecard-shadow-sm-new: 0 1px 3px rgba(0, 0, 0, .2);--ecard-shadow-md-new: 0 4px 12px rgba(0, 0, 0, .3);--ecard-shadow-lg-new: 0 10px 25px rgba(0, 0, 0, .4);--ecard-shadow-xl-new: 0 20px 40px rgba(0, 0, 0, .5)}@keyframes ecard-float-new{0%,to{transform:translateY(0) rotate(0)}50%{transform:translateY(-20px) rotate(1deg)}}@keyframes ecard-pulse-new{0%,to{transform:scale(1)}50%{transform:scale(1.05)}}@keyframes ecard-spin-new{to{transform:rotate(360deg)}}@keyframes ecard-fade-in-new{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}@keyframes ecard-loading-dots-new{0%,80%,to{transform:scale(0)}40%{transform:scale(1)}}@keyframes ecard-shimmer-new{0%,to{opacity:.5}50%{opacity:1}}@keyframes ecard-bounce-new{0%,20%,50%,80%,to{transform:translateY(0)}40%{transform:translateY(-8px)}60%{transform:translateY(-4px)}}@keyframes ecard-slide-up-new{0%{opacity:0;transform:translateY(30px)}to{opacity:1;transform:translateY(0)}}@keyframes ecard-pulse-play-new{0%{transform:scale(1);box-shadow:0 8px 32px #0000004d,0 0 0 4px #ffffff1a}50%{transform:scale(1.05);box-shadow:0 12px 40px #0006,0 0 0 8px #fff3}to{transform:scale(1);box-shadow:0 8px 32px #0000004d,0 0 0 4px #ffffff1a}}.ecard-creator-container-new,.ecard-success-container-new{min-height:100vh;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;background:var(--ecard-bg-primary-new);color:var(--ecard-text-primary-new);line-height:1.6;overflow-x:hidden;position:relative;animation:ecard-fade-in-new .8s ease-out}.ecard-creator-container-new *,.ecard-success-container-new *{box-sizing:border-box}.ecard-bg-animation{position:fixed;top:0;left:0;width:100%;height:100%;z-index:-1;background:var(--ecard-bg-primary-new)}.ecard-bg-animation:before{content:"";position:absolute;top:0;left:0;width:100%;height:100%;background:radial-gradient(circle at 20% 30%,rgba(147,112,219,.1) 0%,transparent 50%),radial-gradient(circle at 80% 70%,rgba(0,255,255,.08) 0%,transparent 50%),radial-gradient(circle at 60% 20%,rgba(147,112,219,.06) 0%,transparent 50%);animation:ecard-float-new 20s ease-in-out infinite}.ecard-header-new{padding:3rem 2rem 4rem;text-align:center;position:relative;z-index:1}.ecard-header-content-new{max-width:1600px;margin:0 auto}.ecard-top-navigation-new{display:flex;justify-content:flex-start;margin-bottom:2rem}.ecard-home-button-new{display:inline-flex;align-items:center;gap:.5rem;background:rgba(147,112,219,.2);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);color:var(--ecard-text-primary-new);padding:.75rem 1.25rem;border:2px solid var(--ecard-primary-new);text-decoration:none;font-weight:600;font-size:1rem;border:1px solid var(--ecard-border-new);transition:all .3s cubic-bezier(.4,0,.2,1)}.ecard-home-button-new:hover{color:var(--ecard-text-primary-new);border-color:var(--ecard-primary-new);transform:translateY(-2px)}.ecard-title-section-new{display:flex;flex-direction:column;align-items:center;gap:1.5rem}.ecard-hero-badge-new{display:inline-block;background:rgba(147,112,219,.2);color:var(--ecard-primary-new);padding:8px 24px;border-radius:30px;font-size:.9rem;font-weight:600;text-transform:uppercase;letter-spacing:2px;border:1px solid var(--ecard-primary-new);animation:ecard-pulse-new 2s infinite}.ecard-main-title-new{font-size:3.5rem;font-weight:700;letter-spacing:-1px;margin:0;line-height:1.1;color:var(--ecard-text-primary-new)}.ecard-highlight-new{background:var(--ecard-gradient-main-new);-webkit-background-clip:text;background-clip:text;color:transparent}.ecard-main-subtitle-new{font-size:1.3rem;color:var(--ecard-text-secondary-new);max-width:700px;margin:0;line-height:1.5}.ecard-content-new{max-width:1600px;margin:0 auto;padding:0 2rem 4rem;position:relative;z-index:1}.ecard-step-section-new{background:var(--ecard-bg-secondary-new);border:1px solid var(--ecard-border-new);border-radius:20px;padding:3rem;margin-bottom:2rem;position:relative;overflow:hidden;animation:ecard-fade-in-new .6s ease-out}.ecard-step-section-new:before{content:"";position:absolute;top:0;left:0;right:0;height:4px;background:var(--ecard-gradient-main-new);animation:ecard-shimmer-new 3s ease-in-out infinite}.ecard-step-header-new{display:flex;align-items:flex-start;margin-bottom:3rem;gap:1.5rem}.ecard-step-indicator-new{display:flex;flex-direction:column;align-items:center;flex-shrink:0}.ecard-step-number-new{width:56px;height:56px;border-radius:50%;background:var(--ecard-gradient-main-new);color:var(--ecard-bg-primary-new);display:flex;align-items:center;justify-content:center;font-size:1.4rem;font-weight:800;box-shadow:var(--ecard-shadow-sm-new);position:relative;overflow:hidden}.ecard-category-tab-new:before{content:"";position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.1),transparent);transition:left .6s}.ecard-category-tab-new:hover:not(.active){transform:translateY(-2px);box-shadow:var(--ecard-shadow-md-new);border-color:#9370db33;color:var(--ecard-primary-new)}.ecard-category-tab-new:hover:not(.active):before{left:100%}.ecard-category-tab-new.active{background:var(--ecard-gradient-main-new);color:var(--ecard-bg-primary-new);border-color:var(--ecard-primary-new);transform:translateY(-1px);box-shadow:var(--ecard-shadow-lg-new)}.ecard-category-tab-new.active:after{content:"";position:absolute;top:-2px;right:-2px;bottom:-2px;left:-2px;border-radius:50px;background:var(--ecard-gradient-main-new);opacity:.2;filter:blur(8px);z-index:-1}.ecard-category-icon-new{font-size:1.1rem;display:flex;align-items:center;justify-content:center;flex-shrink:0}.ecard-category-name-new{color:#fff!important;font-weight:600;letter-spacing:.01em}.ecard-category-count-new{background:rgba(0,0,0,.2);color:inherit;padding:.2rem .5rem;border-radius:12px;font-size:.75rem;font-weight:700;min-width:20px;text-align:center;margin-left:.25rem}.ecard-category-tab-new.active .ecard-category-count-new{background:rgba(255,255,255,.2);color:#fff}.ecard-category-dropdown-new{width:100%;padding:.75rem;border:2px solid var(--ecard-border-new);border-radius:12px;background:var(--ecard-bg-secondary-new);font-size:.9rem;font-weight:600;color:var(--ecard-text-primary-new);box-shadow:var(--ecard-shadow-sm-new)}.ecard-category-dropdown-new:focus{outline:none;border-color:var(--ecard-primary-new);box-shadow:0 0 0 3px #9370db1a}.ecard-category-results-header-new{display:flex;justify-content:space-between;align-items:center;margin-bottom:1.5rem;padding:1rem 0;border-bottom:1px solid var(--ecard-border-new)}.ecard-results-title-new{font-size:1.4rem;font-weight:700;color:var(--ecard-text-primary-new);margin:0;display:flex;align-items:center;gap:.5rem}.ecard-results-title-new:before{content:"";width:4px;height:20px;background:var(--ecard-gradient-main-new);border-radius:2px}.ecard-view-all-link-new{background:none;border:none;color:var(--ecard-primary-new);font-weight:600;font-size:.9rem;cursor:pointer;padding:.5rem 1rem;border-radius:8px;transition:all .2s ease;text-decoration:none}.ecard-view-all-link-new:hover{background:rgba(147,112,219,.1);transform:translateY(-1px)}.ecard-templates-gallery-new{display:grid;grid-template-columns:repeat(auto-fit,minmax(340px,1fr));gap:2rem;margin-top:2rem;animation:ecard-slide-up-new .6s ease-out}.ecard-template-card-new{background:var(--ecard-bg-tertiary-new);border-radius:20px;overflow:hidden;cursor:pointer;transition:all .4s cubic-bezier(.4,0,.2,1);border:3px solid transparent;box-shadow:var(--ecard-shadow-md-new);position:relative;transform:translateY(0)}.ecard-template-card-new:before{content:"";position:absolute;top:0;left:0;right:0;height:2px;background:var(--ecard-gradient-main-new);opacity:0;transition:opacity .3s ease}.ecard-template-card-new:hover{transform:translateY(-8px);box-shadow:var(--ecard-shadow-xl-new)}.ecard-template-card-new:hover:before{opacity:1}.ecard-template-card-new.selected{border-color:var(--ecard-primary-new);box-shadow:0 20px 40px #9370db4d,0 0 0 4px #9370db1a;transform:translateY(-4px)}.ecard-template-card-new.selected:before{opacity:1}.ecard-template-video-container-new{position:relative;width:100%;height:220px;background:linear-gradient(135deg,var(--ecard-bg-secondary-new),var(--ecard-bg-tertiary-new));overflow:hidden;display:flex;align-items:center;justify-content:center}.ecard-template-placeholder-new,.ecard-template-video-new{width:100%;height:100%;object-fit:cover;transition:transform .4s cubic-bezier(.4,0,.2,1)}.ecard-template-video-new{position:absolute;top:0;left:0}.ecard-template-card-new:hover .ecard-template-placeholder-new,.ecard-template-card-new:hover .ecard-template-video-new{transform:scale(1.08)}.ecard-template-placeholder-new{background:linear-gradient(135deg,var(--ecard-bg-secondary-new),var(--ecard-bg-tertiary-new));background-size:400% 400%;animation:ecard-shimmer-new 2s ease-in-out infinite}.ecard-template-overlay-new{position:absolute;top:0;left:0;width:100%;height:100%;background:linear-gradient(135deg,rgba(147,112,219,.9),rgba(0,255,255,.8));display:flex;flex-direction:column;align-items:center;justify-content:center;opacity:0;transition:all .3s cubic-bezier(.4,0,.2,1);color:#fff;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);z-index:10}.ecard-template-card-new:hover .ecard-template-overlay-new{opacity:1}.ecard-play-icon-new{background:rgba(255,255,255,.2);border-radius:50%;width:56px;height:56px;display:flex;align-items:center;justify-content:center;margin-bottom:.75rem;border:2px solid rgba(255,255,255,.3);animation:ecard-pulse-new 2s ease-in-out infinite}.ecard-hover-text-new{font-size:.9rem;font-weight:600;text-shadow:0 2px 4px rgba(0,0,0,.3);margin-bottom:.5rem}.ecard-full-preview-btn-new{background:rgba(255,255,255,.9);color:var(--ecard-primary-new);border:none;padding:.5rem 1rem;border-radius:8px;font-size:.875rem;font-weight:600;cursor:pointer;transition:all .2s ease;box-shadow:0 2px 4px #0000001a}.ecard-full-preview-btn-new:hover{background:white;transform:translateY(-1px);box-shadow:0 4px 8px #00000026}.ecard-video-fallback-new{display:flex;flex-direction:column;align-items:center;justify-content:center;color:var(--ecard-text-muted-new)}.ecard-fallback-icon-new{font-size:2rem;margin-bottom:.5rem}.ecard-template-info-new{padding:1.5rem}.ecard-template-header-new{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:1rem;gap:1rem}.ecard-template-name-new{font-size:1.3rem;font-weight:700;color:var(--ecard-text-primary-new);margin:0;line-height:1.3;flex:1}.ecard-template-category-badge-new{background:linear-gradient(135deg,var(--ecard-secondary-new),var(--ecard-primary-new));color:var(--ecard-bg-primary-new);padding:.3rem .8rem;border-radius:20px;font-size:.7rem;font-weight:700;text-transform:uppercase;letter-spacing:.05em;white-space:nowrap;box-shadow:0 2px 8px #00000026}.ecard-selected-indicator-new{display:inline-flex;align-items:center;gap:.5rem;background:var(--ecard-gradient-main-new);color:var(--ecard-bg-primary-new);padding:.5rem 1rem;border-radius:25px;font-size:.85rem;font-weight:600;box-shadow:var(--ecard-shadow-md-new)}.ecard-personalization-form-new{max-width:700px;margin:0 auto}.ecard-form-section-new{background:var(--ecard-bg-tertiary-new);border-radius:20px;padding:2rem;margin-bottom:2rem;border:1px solid var(--ecard-border-new)}.ecard-form-section-title-new{font-size:1.3rem;font-weight:700;color:var(--ecard-text-primary-new);margin:0 0 1.5rem;display:flex;align-items:center;gap:.5rem}.ecard-form-section-title-new:before{content:"";width:4px;height:20px;background:var(--ecard-gradient-main-new);border-radius:2px}.ecard-form-row-new{display:grid;grid-template-columns:1fr 1fr;gap:2rem}.ecard-form-group-new{display:flex;flex-direction:column}.ecard-form-label-new{font-size:1rem;font-weight:600;color:var(--ecard-text-primary-new);margin-bottom:.75rem;display:flex;align-items:center;gap:.75rem}.ecard-optional-badge-new,.ecard-required-badge-new{font-size:.7rem;font-weight:500;padding:.2rem .6rem;border-radius:12px;text-transform:uppercase;letter-spacing:.05em}.ecard-optional-badge-new{background:rgba(153,153,153,.2);color:var(--ecard-text-muted-new)}.ecard-required-badge-new{background:rgba(255,68,68,.2);color:var(--ecard-error-new)}.ecard-form-input-new,.ecard-form-textarea-new{width:100%;padding:1.25rem;border:2px solid var(--ecard-border-new);border-radius:16px;font-size:1rem;transition:all .3s cubic-bezier(.4,0,.2,1);background:var(--ecard-bg-secondary-new);font-family:inherit;font-weight:500;color:var(--ecard-text-primary-new);box-shadow:var(--ecard-shadow-sm-new)}.ecard-form-input-new::placeholder,.ecard-form-textarea-new::placeholder{color:var(--ecard-text-muted-new)}.ecard-form-input-new:focus,.ecard-form-textarea-new:focus{outline:none;border-color:var(--ecard-primary-new);box-shadow:0 0 0 4px #9370db1a,0 4px 12px #0000001a;transform:translateY(-1px)}.ecard-character-count-new{margin-top:.5rem;text-align:right;font-size:.85rem;color:var(--ecard-text-muted-new);font-weight:500}.ecard-character-count-new .warning{color:var(--ecard-error-new);font-weight:600}.ecard-error-message-new{background:linear-gradient(135deg,rgba(255,68,68,.1),rgba(255,68,68,.05));border:2px solid rgba(255,68,68,.3);border-radius:16px;padding:1rem 1.25rem;margin:1.5rem 0;display:flex;align-items:center;gap:.75rem;color:var(--ecard-error-new);font-weight:600;box-shadow:0 4px 12px #ff44441a}.ecard-error-icon-new{color:var(--ecard-error-new);flex-shrink:0}.ecard-payment-error-new{border-color:#ff444480;background:linear-gradient(135deg,rgba(255,68,68,.15),rgba(255,68,68,.1))}.ecard-form-submit-section-new{text-align:center;padding:2rem;background:var(--ecard-bg-secondary-new);border-radius:20px;box-shadow:var(--ecard-shadow-md-new);border:1px solid var(--ecard-border-new)}.ecard-pricing-highlight-new{margin-bottom:2rem}.ecard-price-badge-new{display:inline-flex;align-items:center;gap:.5rem;background:var(--ecard-gradient-main-new);color:var(--ecard-bg-primary-new);padding:.75rem 1.5rem;border-radius:50px;margin-bottom:1rem;box-shadow:var(--ecard-shadow-lg-new)}.ecard-price-new{font-size:1.5rem;font-weight:800}.ecard-price-label-new{font-size:.9rem;font-weight:500;opacity:.9}.ecard-pricing-description-new{font-size:1.1rem;color:var(--ecard-text-secondary-new);margin:0;font-weight:500}.ecard-create-button-new{background:var(--ecard-gradient-main-new);color:var(--ecard-bg-primary-new);border:none;padding:1.25rem 3rem;border-radius:50px;font-size:1.2rem;font-weight:700;cursor:pointer;transition:all .3s cubic-bezier(.4,0,.2,1);box-shadow:var(--ecard-shadow-lg-new);display:inline-flex;align-items:center;gap:.75rem;min-width:280px;justify-content:center;margin-bottom:1rem;position:relative;overflow:hidden}.ecard-create-button-new:before{content:"";position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.2),transparent);transition:left .6s}.ecard-create-button-new:hover:not(.disabled){transform:translateY(-3px);box-shadow:var(--ecard-shadow-xl-new)}.ecard-create-button-new:hover:not(.disabled):before{left:100%}.ecard-create-button-new.disabled{opacity:.6;cursor:not-allowed;transform:none}.ecard-button-spinner-new{width:20px;height:20px;border:2px solid rgba(255,255,255,.3);border-top:2px solid white;border-radius:50%;animation:ecard-spin-new 1s linear infinite}.ecard-terms-notice-new{font-size:.85rem;color:var(--ecard-text-muted-new);margin:0}.ecard-terms-notice-new a{color:var(--ecard-primary-new);text-decoration:none;font-weight:600}.ecard-terms-notice-new a:hover{text-decoration:underline}.ecard-success-container-new{background:var(--ecard-bg-primary-new);display:flex;align-items:center;justify-content:center;padding:2rem}.ecard-success-content-new{background:var(--ecard-bg-secondary-new);border:1px solid var(--ecard-border-new);border-radius:32px;padding:3rem 2rem;text-align:center;max-width:700px;width:100%;box-shadow:var(--ecard-shadow-xl-new);display:flex;flex-direction:column;gap:2rem;animation:ecard-fade-in-new .8s ease-out;position:relative;overflow:hidden}.ecard-success-content-new:before{content:"";position:absolute;top:0;left:0;right:0;height:4px;background:var(--ecard-gradient-main-new);animation:ecard-shimmer-new 3s ease-in-out infinite}.ecard-success-header-new{display:flex;flex-direction:column;align-items:center;gap:1rem}.ecard-success-badge-new{display:inline-block;background:rgba(147,112,219,.2);color:var(--ecard-primary-new);padding:8px 24px;border-radius:30px;font-size:.9rem;font-weight:600;text-transform:uppercase;letter-spacing:2px;border:1px solid var(--ecard-primary-new)}.ecard-success-title-new{font-size:2.5rem;font-weight:800;color:var(--ecard-text-primary-new);margin:0;letter-spacing:-.01em}.ecard-success-subtitle-new{font-size:1.1rem;color:var(--ecard-text-secondary-new);margin:0;max-width:400px;font-weight:500}.ecard-payment-confirmed-new{display:inline-flex;align-items:center;gap:.5rem;background:var(--ecard-success-new);color:#fff;padding:8px 16px;border-radius:25px;font-size:.875rem;font-weight:600;box-shadow:var(--ecard-shadow-md-new)}.ecard-url-share-section-new{background:var(--ecard-bg-tertiary-new);border-radius:16px;padding:1.5rem;border:1px solid var(--ecard-border-new)}.ecard-url-label-new{font-size:.875rem;color:var(--ecard-text-secondary-new);margin-bottom:.75rem;font-weight:500;display:block;text-align:left}.ecard-url-input-group-new{display:flex;gap:.75rem;align-items:center}.ecard-url-input-new{flex:1;padding:.875rem;border:2px solid var(--ecard-border-new);border-radius:12px;font-size:.875rem;font-family:monospace;background:var(--ecard-bg-secondary-new);color:var(--ecard-text-primary-new)}.ecard-url-input-new:focus{outline:none;border-color:var(--ecard-primary-new);box-shadow:0 0 0 3px #9370db1a}.ecard-copy-button-new{background:var(--ecard-primary-new);color:#fff;border:none;padding:.875rem 1rem;border-radius:12px;cursor:pointer;font-size:1rem;transition:all .3s ease;display:flex;align-items:center;justify-content:center;min-width:48px}.ecard-copy-button-new:hover{background:var(--ecard-primary-dark-new);transform:translateY(-1px)}.ecard-main-actions-new{display:flex;flex-direction:row;gap:1rem;justify-content:center;align-items:center;flex-wrap:wrap}.ecard-action-btn-new{padding:1rem 1.5rem;border-radius:12px;text-decoration:none;font-weight:600;font-size:1rem;transition:all .3s ease;display:inline-flex;align-items:center;gap:.5rem;border:none;cursor:pointer;min-width:140px;justify-content:center}.ecard-primary-btn-new{background:var(--ecard-gradient-main-new);color:var(--ecard-bg-primary-new);box-shadow:var(--ecard-shadow-md-new)}.ecard-primary-btn-new:hover{transform:translateY(-2px);box-shadow:var(--ecard-shadow-lg-new)}.ecard-secondary-btn-new{background:var(--ecard-success-new);color:#fff;box-shadow:var(--ecard-shadow-md-new)}.ecard-secondary-btn-new:hover{background:#3e8e41;transform:translateY(-2px);box-shadow:var(--ecard-shadow-lg-new)}.ecard-accent-btn-new{background:var(--ecard-secondary-new);color:var(--ecard-bg-primary-new);box-shadow:var(--ecard-shadow-md-new)}.ecard-accent-btn-new:hover{background:var(--ecard-secondary-dark-new);transform:translateY(-2px);box-shadow:var(--ecard-shadow-lg-new)}.ecard-pay-btn-new{background:linear-gradient(135deg,#ff6b35 0%,#f7931e 100%);color:#fff;box-shadow:var(--ecard-shadow-md-new)}.ecard-pay-btn-new:hover{background:linear-gradient(135deg,#ff5722 0%,#f57c00 100%);transform:translateY(-2px);box-shadow:var(--ecard-shadow-lg-new)}.ecard-outline-btn-new{background:transparent;color:var(--ecard-text-secondary-new);border:2px solid var(--ecard-border-new);box-shadow:none}.ecard-outline-btn-new:hover{border-color:var(--ecard-primary-new);color:var(--ecard-primary-new);transform:translateY(-2px)}.ecard-home-btn-new{background:transparent;color:var(--ecard-text-secondary-new);border:2px solid var(--ecard-border-new);box-shadow:none}.ecard-home-btn-new:hover{border-color:var(--ecard-secondary-new);color:var(--ecard-secondary-new);transform:translateY(-2px)}.ecard-secondary-actions-new{display:flex;justify-content:center;gap:1rem;flex-wrap:wrap}.ecard-delivery-status{margin:2rem 0;padding:1.5rem;border-radius:16px;animation:ecard-slide-up-new .5s ease-out;box-shadow:var(--ecard-shadow-md-new)}.ecard-delivery-status.success{background:linear-gradient(135deg,rgba(76,175,80,.1),rgba(76,175,80,.05));border:2px solid var(--ecard-success-new)}.ecard-delivery-status.failed{background:linear-gradient(135deg,rgba(255,68,68,.1),rgba(255,68,68,.05));border:2px solid var(--ecard-error-new)}.ecard-delivery-status.unknown{background:linear-gradient(135deg,rgba(0,255,255,.1),rgba(0,255,255,.05));border:2px solid var(--ecard-secondary-new)}.ecard-status-success,.ecard-status-failed,.ecard-status-checking{display:flex;align-items:flex-start;gap:1rem}.ecard-icon{font-size:1.5rem;flex-shrink:0}.ecard-status-checking .ecard-icon{animation:ecard-spin-new 2s linear infinite}.ecard-status-success strong{color:var(--ecard-success-new);font-size:1.1rem;display:block;margin-bottom:.5rem}.ecard-status-failed strong{color:var(--ecard-error-new);font-size:1.1rem;display:block;margin-bottom:.5rem}.ecard-status-checking strong{color:var(--ecard-secondary-new);font-size:1.1rem;display:block;margin-bottom:.5rem}.ecard-status-success p,.ecard-status-failed p,.ecard-status-checking p{margin:0;color:var(--ecard-text-secondary-new);font-weight:500;line-height:1.5}.ecard-template-preview-modal-new{position:fixed;top:0;left:0;right:0;bottom:0;background:rgba(0,0,0,.9);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);display:flex;align-items:center;justify-content:center;z-index:10000;padding:1rem;animation:ecard-fade-in-new .3s ease-out;touch-action:none;-webkit-touch-callout:none;-webkit-user-select:none;user-select:none}.ecard-preview-modal-content-new{background:var(--ecard-bg-secondary-new);border:1px solid var(--ecard-border-new);border-radius:20px;max-width:800px;width:100%;max-height:90vh;overflow:hidden;box-shadow:var(--ecard-shadow-xl-new);animation:ecard-slide-up-new .3s ease-out;touch-action:auto;-webkit-touch-callout:initial;-webkit-user-select:initial;user-select:initial;isolation:isolate}.ecard-preview-modal-header-new{display:flex;justify-content:space-between;align-items:center;padding:1.5rem 2rem;border-bottom:1px solid var(--ecard-border-new);background:var(--ecard-bg-tertiary-new);touch-action:manipulation}.ecard-preview-modal-header-new h3{font-size:1.25rem;font-weight:700;color:var(--ecard-text-primary-new);margin:0}.ecard-close-preview-btn-new{background:none;border:none;color:var(--ecard-text-muted-new);cursor:pointer;padding:.5rem;border-radius:8px;transition:all .2s ease;touch-action:manipulation;-webkit-tap-highlight-color:rgba(0,0,0,.1)}.ecard-close-preview-btn-new:hover{background:var(--ecard-bg-primary-new);color:var(--ecard-text-primary-new)}.ecard-preview-video-container-new{position:relative;background:black;overflow:hidden;touch-action:manipulation;-webkit-touch-callout:none;isolation:isolate}.ecard-preview-video-new{width:100%;height:auto;max-height:60vh;display:block;touch-action:manipulation;-webkit-touch-callout:none;-webkit-playsinline:true;object-fit:contain}.ecard-video-play-overlay-new{position:absolute;top:0;left:0;right:0;bottom:0;background:rgba(0,0,0,.4);display:flex;align-items:center;justify-content:center;z-index:1000;cursor:pointer;transition:all .3s ease;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px)}.ecard-video-play-overlay-new.hidden{opacity:0;pointer-events:none;visibility:hidden}.ecard-video-play-button-new{width:100px;height:100px;background:rgba(255,255,255,.95);border-radius:50%;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:all .3s cubic-bezier(.4,0,.2,1);box-shadow:0 8px 32px #0000004d,0 0 0 4px #ffffff1a;position:relative;animation:ecard-pulse-play-new 2s ease-in-out infinite}.ecard-video-play-button-new:hover{transform:scale(1.1);background:rgba(255,255,255,1);box-shadow:0 12px 40px #0006,0 0 0 6px #fff3}.ecard-video-play-button-new:active{transform:scale(.95)}.ecard-video-play-icon-new{width:0;height:0;border-left:30px solid #333;border-top:18px solid transparent;border-bottom:18px solid transparent;margin-left:8px}.ecard-play-instruction-new{position:absolute;bottom:20px;left:50%;transform:translate(-50%);background:rgba(0,0,0,.8);color:#fff;padding:8px 16px;border-radius:20px;font-size:14px;font-weight:500;pointer-events:none;animation:ecard-bounce-new 3s ease-in-out infinite}.ecard-preview-watermark-overlay-new{position:absolute;top:0;left:0;right:0;bottom:0;pointer-events:none;z-index:100;display:flex;align-items:center;justify-content:center;visibility:visible;opacity:1}.ecard-preview-watermark-content-new{transform:rotate(-45deg);text-align:center;color:#fff6;text-shadow:2px 2px 4px rgba(0,0,0,.8);-webkit-user-select:none;user-select:none;font-family:Arial Black,Arial,sans-serif;pointer-events:none}.ecard-watermark-main-new{display:block;font-size:36px;font-weight:900;letter-spacing:6px;text-transform:uppercase;margin-bottom:4px}.ecard-watermark-sub-new{display:block;font-size:12px;font-weight:600;letter-spacing:2px;text-transform:uppercase;opacity:.8}.ecard-preview-modal-actions-new{padding:1.5rem 2rem;display:flex;gap:1rem;justify-content:center;background:var(--ecard-bg-tertiary-new);touch-action:manipulation}.ecard-use-template-btn-new{background:var(--ecard-gradient-main-new);color:var(--ecard-bg-primary-new);border:none;padding:.75rem 2rem;border-radius:12px;font-weight:600;cursor:pointer;transition:all .3s ease;box-shadow:var(--ecard-shadow-md-new);touch-action:manipulation;-webkit-tap-highlight-color:rgba(0,0,0,.1)}.ecard-use-template-btn-new:hover{transform:translateY(-2px);box-shadow:var(--ecard-shadow-lg-new)}.ecard-cancel-preview-btn-new{background:transparent;color:var(--ecard-text-secondary-new);border:2px solid var(--ecard-border-new);padding:.75rem 2rem;border-radius:12px;font-weight:600;cursor:pointer;transition:all .3s ease;touch-action:manipulation;-webkit-tap-highlight-color:rgba(0,0,0,.1)}.ecard-cancel-preview-btn-new:hover{border-color:var(--ecard-primary-new);color:var(--ecard-primary-new)}@media (max-width: 1024px){.ecard-category-tabs-new{justify-content:flex-start;padding:.75rem}.ecard-category-tab-new{padding:.6rem 1rem;font-size:.85rem}.ecard-category-results-header-new{flex-direction:column;align-items:flex-start;gap:.75rem}.ecard-view-all-link-new{align-self:flex-end}}@media (max-width: 768px){.ecard-main-title-new{font-size:2.8rem}.ecard-main-subtitle-new{font-size:1.1rem}.ecard-templates-gallery-new,.ecard-form-row-new{grid-template-columns:1fr;gap:1.5rem}.ecard-step-header-new{flex-direction:column;align-items:flex-start;gap:1rem}.ecard-step-indicator-new{flex-direction:row;align-items:center}.ecard-step-line-new{width:40px;height:2px;margin-top:0;margin-left:1rem}.ecard-main-actions-new{flex-direction:column;align-items:stretch}.ecard-action-btn-new{width:100%}.ecard-secondary-actions-new{flex-direction:column;align-items:stretch}.ecard-category-tabs-container-new{margin-bottom:2rem}.ecard-category-tabs-new{flex-wrap:nowrap;overflow-x:auto;justify-content:flex-start;padding:.5rem;gap:.375rem;background:linear-gradient(90deg,var(--ecard-bg-tertiary-new) 30%,transparent),linear-gradient(-90deg,var(--ecard-bg-tertiary-new) 30%,transparent),var(--ecard-bg-tertiary-new)}.ecard-category-tab-new{flex-shrink:0;padding:.5rem .875rem;font-size:.8rem}.ecard-category-icon-new{font-size:1rem}.ecard-category-count-new{padding:.15rem .4rem;font-size:.7rem;min-width:18px}.ecard-results-title-new{font-size:1.2rem}.ecard-category-results-header-new{padding:.75rem 0}.ecard-preview-modal-content-new{margin:1rem;max-height:85vh}.ecard-preview-modal-header-new{padding:1rem 1.5rem}.ecard-preview-modal-actions-new{padding:1rem 1.5rem;flex-direction:column}.ecard-use-template-btn-new,.ecard-cancel-preview-btn-new{width:100%}.ecard-watermark-main-new{font-size:28px;letter-spacing:4px}.ecard-watermark-sub-new{font-size:10px;letter-spacing:1px}.ecard-video-play-button-new{width:80px;height:80px}.ecard-video-play-icon-new{border-left:24px solid #333;border-top:14px solid transparent;border-bottom:14px solid transparent;margin-left:6px}.ecard-play-instruction-new{font-size:12px;padding:6px 12px;bottom:15px}}@media (max-width: 480px){.ecard-main-title-new{font-size:2.2rem}.ecard-step-section-new{padding:2rem 1.5rem;border-radius:16px}.ecard-form-section-new{padding:1.5rem}.ecard-templates-gallery-new{grid-template-columns:1fr}.ecard-template-video-container-new{height:180px}.ecard-success-content-new{padding:2rem 1.5rem;border-radius:24px}.ecard-url-input-group-new{flex-direction:column;align-items:stretch}.ecard-copy-button-new{width:100%}.ecard-category-tabs-new{margin:0 -1rem;border-radius:0;padding:.5rem 1rem}.ecard-category-tab-new{padding:.4rem .75rem;font-size:.75rem}.ecard-category-name-new{display:none}.ecard-category-tab-new[data-category=all] .ecard-category-name-new{display:inline}.ecard-template-preview-modal-new{padding:.25rem}.ecard-preview-modal-content-new{border-radius:16px;max-height:98vh}.ecard-preview-video-new{max-height:50vh}.ecard-video-play-button-new{width:70px;height:70px}.ecard-video-play-icon-new{border-left:20px solid #333;border-top:12px solid transparent;border-bottom:12px solid transparent;margin-left:5px}}.ecard-step-number-new:after{content:"";position:absolute;top:-8px;right:-8px;bottom:-8px;left:-8px;border-radius:50%;background:var(--ecard-gradient-main-new);opacity:.2;filter:blur(8px);z-index:-1}.ecard-step-line-new{width:2px;height:40px;background:linear-gradient(to bottom,var(--ecard-primary-new),transparent);margin-top:1rem}.ecard-step-text-new{flex:1;padding-top:.5rem}.ecard-step-title-new{font-size:2.2rem;font-weight:800;color:var(--ecard-text-primary-new);margin:0 0 .5rem;letter-spacing:-.01em}.ecard-step-description-new{font-size:1.1rem;color:var(--ecard-text-secondary-new);margin:0;font-weight:500}.ecard-templates-loading-new{text-align:center;padding:4rem 2rem;background:rgba(45,45,45,.5);border:1px solid var(--ecard-border-new);border-radius:16px}.ecard-loading-animation-new{margin-bottom:2rem}.ecard-loading-dots-new{display:inline-flex;gap:.5rem}.ecard-dot-new{width:12px;height:12px;border-radius:50%;background:var(--ecard-primary-new);animation:ecard-loading-dots-new 1.4s ease-in-out infinite both}.ecard-dot-new:nth-child(1){animation-delay:-.32s}.ecard-dot-new:nth-child(2){animation-delay:-.16s}.ecard-templates-loading-new p{color:var(--ecard-text-secondary-new);font-size:1.1rem;margin:0}.ecard-no-templates-new{text-align:center;padding:3rem 2rem;background:rgba(45,45,45,.5);border-radius:16px;border:2px dashed var(--ecard-border-new)}.ecard-no-templates-icon-new{font-size:3rem;margin-bottom:1rem;opacity:.7}.ecard-no-templates-new p{color:var(--ecard-text-secondary-new);font-size:1.1rem;margin-bottom:1.5rem;font-weight:500}.ecard-view-all-btn-new{background:var(--ecard-gradient-main-new);color:var(--ecard-bg-primary-new);border:none;padding:.75rem 2rem;border-radius:50px;font-weight:600;cursor:pointer;transition:all .3s ease;box-shadow:var(--ecard-shadow-md-new)}.ecard-view-all-btn-new:hover{transform:translateY(-2px);box-shadow:var(--ecard-shadow-lg-new)}.ecard-category-tabs-container-new{margin-bottom:2.5rem;position:relative}.ecard-category-tabs-new{display:flex;flex-wrap:wrap;gap:.5rem;padding:1rem;background:var(--ecard-bg-tertiary-new);border-radius:20px;border:1px solid var(--ecard-border-new);overflow-x:auto;scrollbar-width:none;-ms-overflow-style:none}.ecard-category-tabs-new::-webkit-scrollbar{display:none}.ecard-category-tab-new{display:inline-flex;align-items:center;gap:.5rem;padding:.75rem 1.25rem;background:var(--ecard-bg-secondary-new);border:2px solid transparent;border-radius:50px;cursor:pointer;transition:all .3s cubic-bezier(.4,0,.2,1);font-weight:600;font-size:.9rem;color:#fff;white-space:nowrap;box-shadow:var(--ecard-shadow-sm-new);position:relative;overflow:hidden}@keyframes fadeInDown{0%{opacity:0;transform:translateY(-20px)}to{opacity:1;transform:translateY(0)}}@keyframes slideUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}@keyframes pulse{0%{transform:scale(1)}50%{transform:scale(1.05)}to{transform:scale(1)}}@keyframes glow{0%{opacity:.5;transform:scale(.95)}50%{opacity:1;transform:scale(1.05)}to{opacity:.5;transform:scale(.95)}}.animate-fade-down{animation:fadeInDown .6s ease-out}.animate-fade-in{animation:fadeIn .8s ease-out}.animate-slide-up{animation:slideUp .3s ease-out}.ecard-viewer{min-height:100vh;background:linear-gradient(135deg,#f5f3ff,#ede9fe,#e0e7ff);transition:background .7s ease-in-out;padding:2rem 1rem;font-family:Segoe UI,system-ui,-apple-system,BlinkMacSystemFont,Roboto,Oxygen,Ubuntu,Cantarell,sans-serif;color:#1f2937}.ecard-viewer.video-loaded{background:linear-gradient(135deg,#e9d5ff,#ddd6fe,#c7d2fe)}.ecard-container{max-width:1024px;margin:0 auto;padding:1rem}.ecard-viewer-loading{min-height:100vh;background:linear-gradient(135deg,#f5f3ff,#ede9fe,#e0e7ff);display:flex;align-items:center;justify-content:center;padding:1rem}.loading-container{text-align:center;padding:2rem;border-radius:1rem;background-color:#fffc;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);box-shadow:0 10px 15px -3px #0000001a,0 4px 6px -2px #0000000d;max-width:28rem;margin:0 auto}.loading-spinner{margin-bottom:1.5rem;position:relative;width:64px;height:64px;margin:0 auto}.spinner-heart{width:64px;height:64px;border-radius:50%;border:4px solid transparent;border-top-color:#a855f7;animation:spin 1s linear infinite;position:relative}.spinner-heart:before{content:"";position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:32px;height:32px;background-color:#fff;border-radius:50%;display:flex;align-items:center;justify-content:center}.spinner-heart:after{content:"❤️";position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);font-size:18px}.loading-title{margin-top:1.5rem;font-size:1.25rem;font-weight:600;color:#4b5563}.loading-subtitle{margin-top:.5rem;color:#6b7280}.ecard-viewer-error{min-height:100vh;background:linear-gradient(135deg,#fee2e2,#fecaca,#fef3c7);display:flex;align-items:center;justify-content:center;padding:1rem}.error-container{text-align:center;padding:2rem;border-radius:1rem;background-color:#fffc;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);box-shadow:0 10px 15px -3px #0000001a,0 4px 6px -2px #0000000d;max-width:28rem;margin:0 auto}.error-emoji{font-size:3rem;margin-bottom:1rem;color:#ef4444}.error-title{font-size:1.5rem;font-weight:700;margin-bottom:.5rem;color:#1f2937}.error-message{color:#6b7280;margin-bottom:1.5rem}.error-button{display:inline-flex;align-items:center;padding:.75rem 1.5rem;background:linear-gradient(135deg,#6366f1,#4f46e5);color:#fff;border-radius:.5rem;font-weight:500;text-decoration:none;box-shadow:0 4px 6px -1px #0000001a,0 2px 4px -1px #0000000f;transition:all .2s ease-in-out}.error-button:hover{transform:translateY(-2px);box-shadow:0 10px 15px -3px #0000001a,0 4px 6px -2px #0000000d}.ecard-header{text-align:center;margin-bottom:2rem}.header-icon-container{display:inline-block;position:relative;margin-bottom:1rem}.header-icon-glow{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:64px;height:64px;background:linear-gradient(135deg,#ec4899,#8b5cf6,#6366f1);border-radius:50%;opacity:.75;filter:blur(8px);animation:glow 3s ease-in-out infinite}.header-icon{position:relative;background-color:#fff;border-radius:50%;width:48px;height:48px;display:flex;align-items:center;justify-content:center;color:#ec4899}.ecard-title{font-size:2.5rem;font-weight:800;margin-bottom:.5rem;background:linear-gradient(135deg,#6366f1,#8b5cf6,#ec4899);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;color:transparent;line-height:1.2}.ecard-subtitle{font-size:1.25rem;color:#4b5563;margin-top:.5rem;font-weight:500}.sender-name{font-weight:600;color:#8b5cf6}.ecard-content-wrapper{max-width:768px;margin:0 auto;transform:translateZ(0);transition:transform .3s ease-in-out}.ecard-content-wrapper:hover{transform:scale(1.01) translateZ(0)}.ecard-content{background-color:#fff;border-radius:1rem;overflow:hidden;box-shadow:0 20px 25px -5px #0000001a,0 10px 10px -5px #0000000a;position:relative;border:1px solid rgba(0,0,0,.05)}.decorative-border{height:4px;background:linear-gradient(90deg,#ec4899,#8b5cf6,#6366f1)}.decorative-border.bottom{height:2px;opacity:.75}.video-container{position:relative;background-color:#000;overflow:hidden;width:100%;aspect-ratio:16/9;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;-webkit-touch-callout:none;-webkit-tap-highlight-color:transparent}video.ecard-video{width:100%!important;height:100%!important;display:block!important;object-fit:contain!important;background-color:#000!important;-webkit-user-select:none!important;-moz-user-select:none!important;-ms-user-select:none!important;user-select:none!important;-webkit-user-drag:none!important;-khtml-user-drag:none!important;-moz-user-drag:none!important;-o-user-drag:none!important}video.ecard-video::-webkit-media-controls-download-button{display:none!important}video.ecard-video::-webkit-media-controls-enclosure{overflow:hidden!important}.video-overlay{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;align-items:center;justify-content:center;background-color:#00000080;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}.play-button{width:80px;height:80px;border-radius:50%;background-color:#fff3;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);display:flex;align-items:center;justify-content:center;cursor:pointer;border:1px solid rgba(255,255,255,.3);animation:pulse 2s ease-in-out infinite}.play-button-inner{width:64px;height:64px;border-radius:50%;background:linear-gradient(135deg,#ec4899,#8b5cf6,#6366f1);display:flex;align-items:center;justify-content:center;color:#fff}.message-container{padding:2rem}.recipient-section{margin-bottom:1.5rem}.recipient-name{font-size:1.5rem;font-weight:700;color:#1f2937;padding-bottom:.5rem;border-bottom:1px solid #e5e7eb}.message-section{margin-bottom:2rem}.message-box{background:linear-gradient(135deg,#f5f3ff,#ede9fe);padding:1.5rem;border-radius:.75rem;border-left:4px solid #8b5cf6;box-shadow:inset 0 2px 4px #0000000f;position:relative}.message-text{font-size:1.25rem;line-height:1.6;color:#4b5563;white-space:pre-wrap;font-weight:500}.signature-section{text-align:right}.signature-text{font-size:1.125rem;font-weight:600;color:#4b5563;margin-bottom:.25rem}.signature-name{font-size:1.375rem;font-weight:700;background:linear-gradient(135deg,#8b5cf6,#ec4899);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;color:transparent}.view-confirmation{position:fixed;bottom:1rem;right:1rem;background:linear-gradient(135deg,#10b981,#059669);color:#fff;padding:.75rem 1rem;border-radius:.5rem;box-shadow:0 10px 15px -3px #0000001a,0 4px 6px -2px #0000000d;z-index:50;max-width:24rem}.confirmation-content{display:flex;align-items:center}.confirmation-icon{background-color:#fff3;border-radius:50%;width:24px;height:24px;display:flex;align-items:center;justify-content:center;margin-right:.75rem;flex-shrink:0}.confirmation-text{font-size:.875rem;font-weight:500}.view-stats-container{display:flex;justify-content:center;margin-top:1.5rem}.view-stats{display:inline-flex;align-items:center;padding:.5rem 1rem;background-color:#ffffff80;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);border-radius:9999px;box-shadow:0 1px 2px #0000000d;border:1px solid rgba(209,213,219,.5)}.stats-icon{color:#8b5cf6;margin-right:.5rem}.stats-text{font-size:.875rem;color:#4b5563;font-weight:500}.share-section{text-align:center;margin-top:2rem}.share-title{font-size:1.125rem;font-weight:600;color:#4b5563;margin-bottom:1rem}.share-buttons{display:flex;flex-wrap:wrap;justify-content:center;gap:.75rem;margin-top:1rem}.share-button{display:inline-flex;align-items:center;padding:.75rem 1.25rem;border-radius:.5rem;font-weight:500;text-decoration:none;color:#fff;transition:all .2s ease-in-out;box-shadow:0 4px 6px -1px #0000001a,0 2px 4px -1px #0000000f;border:none;cursor:pointer}.share-button:hover{transform:translateY(-2px);box-shadow:0 10px 15px -3px #0000001a,0 4px 6px -2px #0000000d}.copy-button{background:linear-gradient(135deg,#3b82f6,#4f46e5)}.copy-button.copied,.email-button{background:linear-gradient(135deg,#10b981,#059669)}.native-share-button{background:linear-gradient(135deg,#8b5cf6,#ec4899)}.button-icon{margin-right:.5rem}.button-text{font-weight:500}.preview-notice{margin-top:2rem;text-align:center}.notice-content{display:inline-flex;align-items:center;padding:1rem;background:linear-gradient(135deg,#fef3c7,#fffbeb);border-left:4px solid #f59e0b;border-radius:.5rem;box-shadow:0 1px 3px #0000001a,0 1px 2px #0000000f;max-width:32rem;margin:0 auto}.notice-icon{color:#f59e0b;margin-right:.75rem;flex-shrink:0}.notice-text{font-size:.875rem;color:#92400e;font-weight:500;text-align:left}.create-cta{text-align:center;margin-top:4rem;margin-bottom:1.5rem}.cta-container{background-color:#fff;border-radius:.75rem;box-shadow:0 20px 25px -5px #0000001a,0 10px 10px -5px #0000000a;padding:2rem;max-width:32rem;margin:0 auto;border:1px solid rgba(209,213,219,.3);transition:all .3s ease-in-out}.cta-container:hover{transform:translateY(-4px);box-shadow:0 25px 50px -12px #00000040}.cta-icon{width:64px;height:64px;background:linear-gradient(135deg,#8b5cf6,#ec4899);border-radius:50%;display:flex;align-items:center;justify-content:center;margin:0 auto 1rem;color:#fff}.cta-title{font-size:1.5rem;font-weight:700;color:#1f2937;margin-bottom:.5rem}.cta-description{color:#6b7280;margin-bottom:1.5rem}.cta-button{display:inline-flex;align-items:center;padding:.75rem 1.5rem;background:linear-gradient(135deg,#8b5cf6,#ec4899);color:#fff;font-weight:500;border-radius:.5rem;text-decoration:none;box-shadow:0 4px 6px -1px #0000001a,0 2px 4px -1px #0000000f;transition:all .2s ease-in-out}.cta-button:hover{transform:translateY(-2px);box-shadow:0 10px 15px -3px #0000001a,0 4px 6px -2px #0000000d}.button-arrow{margin-left:.5rem}.page-footer{text-align:center;margin-top:2rem}.footer-text{font-size:.875rem;color:#6b7280}@media (max-width: 640px){.ecard-title{font-size:2rem}.ecard-subtitle{font-size:1.125rem}.message-container{padding:1.5rem}.recipient-name{font-size:1.25rem}.message-text{font-size:1.125rem}.share-buttons{flex-direction:column;align-items:center}.share-button{width:100%;justify-content:center}.cta-container{padding:1.5rem}}@media (max-width: 375px){.ecard-title{font-size:1.75rem}.ecard-container{padding:.5rem}.message-container{padding:1rem}}.preview-watermark{position:fixed;top:0;left:0;right:0;bottom:0;pointer-events:none;z-index:9999;background:linear-gradient(45deg,rgba(0,0,0,.02) 25%,transparent 25%,transparent 75%,rgba(0,0,0,.02) 75%);background-size:60px 60px}.watermark-content{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%) rotate(-45deg);text-align:center;color:#00000026;-webkit-user-select:none;user-select:none;font-family:Arial Black,Arial,sans-serif}.watermark-text{font-size:120px;font-weight:900;letter-spacing:20px;margin-bottom:10px;text-transform:uppercase;text-shadow:2px 2px 4px rgba(0,0,0,.1)}.watermark-subtext{font-size:24px;font-weight:600;letter-spacing:4px;opacity:.8;text-transform:uppercase}.video-watermark-overlay{position:absolute!important;top:0!important;left:0!important;right:0!important;bottom:0!important;pointer-events:none!important;z-index:9999!important;overflow:hidden;display:block!important;visibility:visible!important;opacity:1!important;transform:none!important;transition:none!important;width:100%!important;height:100%!important}.video-watermark{position:absolute!important;top:0!important;left:0!important;right:0!important;bottom:0!important;display:flex!important;align-items:center!important;justify-content:center!important;visibility:visible!important;opacity:1!important;transform:none!important;transition:none!important;width:100%!important;height:100%!important}.watermark-diagonal{transform:rotate(-45deg)!important;text-align:center;color:#fffc!important;text-shadow:0 0 10px rgba(0,0,0,1),2px 2px 0px rgba(0,0,0,1),4px 4px 8px rgba(0,0,0,1),-2px -2px 0px rgba(0,0,0,1),-2px 2px 0px rgba(0,0,0,1),2px -2px 0px rgba(0,0,0,1)!important;-webkit-user-select:none;user-select:none;font-family:Arial Black,Arial,sans-serif!important;visibility:visible!important;opacity:1!important;display:block!important;transition:none!important}.watermark-main{display:block!important;font-size:72px!important;font-weight:900!important;letter-spacing:8px!important;text-transform:uppercase!important;margin-bottom:8px!important;text-shadow:0 0 15px rgba(0,0,0,1),3px 3px 0px rgba(0,0,0,1),6px 6px 12px rgba(0,0,0,1),-3px -3px 0px rgba(0,0,0,1),-3px 3px 0px rgba(0,0,0,1),3px -3px 0px rgba(0,0,0,1)!important;visibility:visible!important;opacity:1!important}.watermark-sub{display:block!important;font-size:24px!important;font-weight:600!important;letter-spacing:3px!important;text-transform:uppercase!important;opacity:1!important;text-shadow:0 0 10px rgba(0,0,0,1),2px 2px 0px rgba(0,0,0,1),4px 4px 8px rgba(0,0,0,1),-2px -2px 0px rgba(0,0,0,1),-2px 2px 0px rgba(0,0,0,1),2px -2px 0px rgba(0,0,0,1)!important;visibility:visible!important}.text-watermark{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%) rotate(-15deg);color:#00000014;font-size:18px;font-weight:700;text-transform:uppercase;letter-spacing:2px;pointer-events:none;-webkit-user-select:none;user-select:none;white-space:nowrap;z-index:1}.ecard-viewer.preview-mode{position:relative}.ecard-viewer.preview-mode:before{content:"";position:fixed;top:0;left:0;right:0;bottom:0;background:repeating-linear-gradient(45deg,transparent,transparent 35px,rgba(255,0,0,.02) 35px,rgba(255,0,0,.02) 70px);pointer-events:none;z-index:5}.preview-notice{background:linear-gradient(135deg,#fff3cd 0%,#ffeaa7 100%);border:2px solid #ffc107;border-radius:12px;padding:20px;margin:20px 0;box-shadow:0 4px 12px #ffc10733}.notice-content{display:flex;align-items:flex-start;gap:16px}.notice-icon{flex-shrink:0;color:#856404;margin-top:2px}.notice-text-container{flex:1}.notice-text{color:#856404;font-size:16px;font-weight:600;margin:0 0 8px;line-height:1.5}.notice-subtext{color:#6c5ce7;font-size:14px;margin:0;line-height:1.4;opacity:.9}@media (max-width: 768px){.preview-watermark{background-size:40px 40px}.watermark-content{color:#0003}.watermark-text{font-size:80px;letter-spacing:12px}.watermark-subtext{font-size:18px;letter-spacing:3px}.video-watermark-overlay{z-index:99999!important;position:fixed!important}.video-watermark .watermark-diagonal{color:#ffffffe6!important;text-shadow:0 0 20px rgba(0,0,0,1),4px 4px 0px rgba(0,0,0,1),8px 8px 16px rgba(0,0,0,1),-4px -4px 0px rgba(0,0,0,1),-4px 4px 0px rgba(0,0,0,1),4px -4px 0px rgba(0,0,0,1)!important}.watermark-main{font-size:48px!important;letter-spacing:6px!important;text-shadow:0 0 25px rgba(0,0,0,1),3px 3px 0px rgba(0,0,0,1),6px 6px 12px rgba(0,0,0,1),-3px -3px 0px rgba(0,0,0,1),-3px 3px 0px rgba(0,0,0,1),3px -3px 0px rgba(0,0,0,1)!important;display:block!important;visibility:visible!important;opacity:1!important}.watermark-sub{font-size:16px!important;letter-spacing:2px!important;text-shadow:0 0 15px rgba(0,0,0,1),2px 2px 0px rgba(0,0,0,1),4px 4px 8px rgba(0,0,0,1),-2px -2px 0px rgba(0,0,0,1),-2px 2px 0px rgba(0,0,0,1),2px -2px 0px rgba(0,0,0,1)!important;display:block!important;visibility:visible!important;opacity:1!important}.text-watermark{font-size:16px;letter-spacing:2px;color:#0000001f}}@media (max-width: 480px){.watermark-text{font-size:70px;letter-spacing:8px}.watermark-subtext{font-size:16px;letter-spacing:2px}.video-watermark-overlay{z-index:999999!important;position:fixed!important}.watermark-main{font-size:40px!important;letter-spacing:4px!important;text-shadow:0 0 30px rgba(0,0,0,1),3px 3px 0px rgba(0,0,0,1),6px 6px 12px rgba(0,0,0,1),-3px -3px 0px rgba(0,0,0,1),-3px 3px 0px rgba(0,0,0,1),3px -3px 0px rgba(0,0,0,1)!important;display:block!important;visibility:visible!important;opacity:1!important;position:relative!important}.watermark-sub{font-size:14px!important;letter-spacing:1px!important;text-shadow:0 0 20px rgba(0,0,0,1),2px 2px 0px rgba(0,0,0,1),4px 4px 8px rgba(0,0,0,1),-2px -2px 0px rgba(0,0,0,1),-2px 2px 0px rgba(0,0,0,1),2px -2px 0px rgba(0,0,0,1)!important;display:block!important;visibility:visible!important;opacity:1!important;position:relative!important}.text-watermark{font-size:14px;letter-spacing:1px}}@media (max-width: 375px){.watermark-text{font-size:60px;letter-spacing:6px}.watermark-subtext{font-size:14px;letter-spacing:1px}.video-watermark-overlay{z-index:9999999!important;position:fixed!important}.watermark-main{font-size:35px!important;letter-spacing:3px!important;text-shadow:0 0 35px rgba(0,0,0,1),3px 3px 0px rgba(0,0,0,1),6px 6px 12px rgba(0,0,0,1),-3px -3px 0px rgba(0,0,0,1),-3px 3px 0px rgba(0,0,0,1),3px -3px 0px rgba(0,0,0,1)!important;display:block!important;visibility:visible!important;opacity:1!important;position:relative!important}.watermark-sub{font-size:12px!important;letter-spacing:1px!important;text-shadow:0 0 25px rgba(0,0,0,1),2px 2px 0px rgba(0,0,0,1),4px 4px 8px rgba(0,0,0,1),-2px -2px 0px rgba(0,0,0,1),-2px 2px 0px rgba(0,0,0,1),2px -2px 0px rgba(0,0,0,1)!important;display:block!important;visibility:visible!important;opacity:1!important;position:relative!important}}@media (max-width: 320px){.watermark-content{transform:translate(-50%,-50%) rotate(-30deg)}.watermark-diagonal{transform:rotate(-30deg)}.watermark-text{font-size:50px;letter-spacing:4px}.video-watermark-overlay{z-index:99999999!important;position:fixed!important}.watermark-main{font-size:30px!important;letter-spacing:2px!important;text-shadow:0 0 40px rgba(0,0,0,1),3px 3px 0px rgba(0,0,0,1),6px 6px 12px rgba(0,0,0,1),-3px -3px 0px rgba(0,0,0,1),-3px 3px 0px rgba(0,0,0,1),3px -3px 0px rgba(0,0,0,1)!important;display:block!important;visibility:visible!important;opacity:1!important;position:relative!important;z-index:99999999!important}.watermark-sub{font-size:10px!important;letter-spacing:1px!important;text-shadow:0 0 30px rgba(0,0,0,1),2px 2px 0px rgba(0,0,0,1),4px 4px 8px rgba(0,0,0,1),-2px -2px 0px rgba(0,0,0,1),-2px 2px 0px rgba(0,0,0,1),2px -2px 0px rgba(0,0,0,1)!important;display:block!important;visibility:visible!important;opacity:1!important;position:relative!important;z-index:99999999!important}}.payment-required-screen{min-height:100vh;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,#f5f3ff,#ede9fe,#e0e7ff);padding:2rem}.payment-gate{background:white;padding:3rem 2rem;border-radius:20px;text-align:center;box-shadow:0 20px 25px -5px #0000001a;max-width:500px}.payment-gate h1{color:#374151;margin-bottom:1rem}.payment-gate button{background:linear-gradient(135deg,#6366f1,#ec4899);color:#fff;padding:1rem 2rem;border:none;border-radius:12px;font-weight:600;cursor:pointer;margin-top:1.5rem}.payment-required-screen{min-height:100vh;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,#f5f3ff,#ede9fe,#e0e7ff);padding:2rem;font-family:Segoe UI,system-ui,-apple-system,BlinkMacSystemFont,Roboto,Oxygen,Ubuntu,Cantarell,sans-serif}.payment-gate{background:white;padding:3rem 2rem;border-radius:20px;text-align:center;box-shadow:0 20px 25px -5px #0000001a,0 10px 10px -5px #0000000a;max-width:500px;width:100%;animation:fadeIn .6s ease-out}.payment-gate h1{color:#374151;margin-bottom:1rem;font-size:2rem;font-weight:700;line-height:1.2}.payment-gate p{color:#6b7280;margin-bottom:1.5rem;font-size:1.1rem;line-height:1.6}.payment-gate button{background:linear-gradient(135deg,#6366f1,#ec4899);color:#fff;padding:1rem 2rem;border:none;border-radius:12px;font-weight:600;cursor:pointer;margin-top:1rem;font-size:1rem;transition:all .3s ease-in-out;box-shadow:0 4px 6px -1px #0000001a;min-width:140px}.payment-gate button:hover{transform:translateY(-2px);box-shadow:0 10px 15px -3px #0000001a,0 4px 6px -2px #0000000d}.payment-gate button:active{transform:translateY(0)}.payment-gate-icon{width:64px;height:64px;background:linear-gradient(135deg,#8b5cf6,#ec4899);border-radius:50%;display:flex;align-items:center;justify-content:center;margin:0 auto 1.5rem;color:#fff;font-size:24px}@media (max-width: 640px){.payment-required-screen{padding:1rem}.payment-gate{padding:2rem 1.5rem}.payment-gate h1{font-size:1.75rem}.payment-gate p{font-size:1rem}}.typography-studio{min-height:100vh;background:#1a1a1a;color:#fff;font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;padding:20px}.main-content{display:grid;grid-template-columns:340px 1fr 300px;gap:20px;height:calc(100vh - 420px);min-height:420px;overflow:hidden}.back-button{background:rgba(0,255,255,.1);border:1px solid #00ffff;padding:10px 20px;border-radius:8px;color:#0ff;text-decoration:none;font-size:.9rem;font-weight:400;cursor:pointer;transition:all .2s ease;display:flex;align-items:center;gap:5px}.back-button:hover{background:rgba(0,255,255,.2);border-color:#0ff;color:#0ff;transform:translateY(-1px)}.typography-back-btn{background:rgba(0,255,255,.1);border:1px solid #00ffff;padding:10px 20px;border-radius:8px;color:#0ff;text-decoration:none;font-size:.9rem;font-weight:400;cursor:pointer;transition:all .2s ease;display:flex;align-items:center;gap:5px;position:absolute;left:25px;top:50%;transform:translateY(-50%)}.typography-back-btn:hover{background:rgba(0,255,255,.2);border-color:#0ff;color:#0ff;transform:translateY(-50%) translateY(-1px)}.workspace-controls{display:flex;gap:20px;background:#2d2d2d;padding:15px 25px;border-radius:8px;margin-bottom:20px;border:1px solid #444;flex-wrap:wrap;align-items:center}.workspace-section,.actions-section{display:flex;align-items:center}.workspace-section h3,.actions-section h3{margin:0 10px 0 0;color:#00bfff;font-size:1rem}.status-section{flex:1;display:flex;align-items:center;justify-content:center}.action-buttons{display:flex;gap:10px}.left-panel{background:#2d2d2d;border-radius:8px;padding:20px;border:1px solid #444;overflow-y:auto;min-width:280px}.right-panel{background:#2d2d2d;border-radius:8px;padding:20px;border:1px solid #444;overflow-y:auto;overflow-x:hidden;width:100%;max-width:100%;min-width:0;box-sizing:border-box;height:fit-content!important;max-height:calc(100vh -420px);display:flex;flex-direction:column}.center-panel{background:#2d2d2d;border-radius:8px;padding:15px;border:1px solid #444;display:flex;flex-direction:column;overflow:hidden}.visualization-canvas{border-radius:8px;background:#1a1a1a;transition:all .4s cubic-bezier(.4,0,.2,1);max-width:100%;max-height:100%}.group-title{font-size:12px;font-weight:600;text-transform:uppercase;letter-spacing:.5px;color:#ddd}.control-label span{font-size:11px;color:#999;text-transform:uppercase;letter-spacing:.5px;white-space:nowrap}.panel-title{font-size:14px;font-weight:600;text-transform:uppercase;letter-spacing:.5px;color:#b8a9ff;margin:0;white-space:nowrap}.arrow-btn{background:transparent;border:none;color:#999;width:40px;height:40px;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:all .2s;font-size:16px;padding:0}.arrow-btn:hover:not(:disabled){background:#1a1a1a;color:#9370db}.value-display{flex:1;text-align:center;font-size:14px;font-weight:600;color:#fff;background:#1a1a1a;font-family:SF Mono,Monaco,monospace}.action-btn.secondary{background:#333;color:#ccc}.action-btn.secondary:hover{background:#444}.action-btn.full-width{width:100%;margin-top:12px}.reset-btn{background:#2e7d32!important;color:#fff!important}.reset-btn:hover:not(:disabled){background:#1b5e20!important}.action-btn.export-btn{background:linear-gradient(135deg,#10b981 0%,#059669 100%);color:#fff;border:none;padding:10px 20px;border-radius:6px;font-weight:600;font-size:14px;cursor:pointer;transition:all .2s ease;text-transform:uppercase;letter-spacing:.5px}.action-btn.export-btn:hover:not(:disabled){background:linear-gradient(135deg,#059669 0%,#047857 100%);transform:translateY(-1px);box-shadow:0 4px 12px #10b9814d}.action-btn.export-btn:disabled{background:linear-gradient(135deg,#6b7280 0%,#4b5563 100%);cursor:not-allowed;transform:none;box-shadow:none}.modal-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:rgba(0,0,0,.85);-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);display:flex;align-items:center;justify-content:center;z-index:1000;animation:fadeIn .3s ease}.modal{background:#242424;border-radius:16px;width:90%;max-width:900px;max-height:85vh;display:flex;flex-direction:column;animation:slideIn .3s ease;box-shadow:0 20px 60px #00000080}.modal-header{padding:24px 32px;border-bottom:1px solid #333;display:flex;justify-content:space-between;align-items:center}.modal-title{font-size:20px;font-weight:600;color:#fff;margin:0}.close-btn{background:none;border:none;color:#666;font-size:28px;cursor:pointer;padding:0;width:40px;height:40px;display:flex;align-items:center;justify-content:center;border-radius:8px;transition:all .2s}.modal-body{padding:32px;overflow-y:auto;flex:1}.modal-footer{padding:20px 32px;border-top:1px solid #333;background:#1a1a1a;border-radius:0 0 16px 16px}.footer-info{text-align:center;font-size:13px;color:#666;margin:0}.modal-open canvas.visualization-canvas,.modal-open canvas,.modal-open img,.modal-open .center-panel{pointer-events:none!important}.modal-open .custom-dimension-modal,.modal-open .custom-dimension-modal *{pointer-events:auto!important}.pattern-preview.lissajous:before,.pattern-preview-modal.lissajous:before{content:"∞";position:absolute;top:50%;left:50%;transform:translate(-50%,-50%) rotate(45deg);font-size:48px;color:#9370db;opacity:.3}.pattern-preview.random:before,.pattern-preview-modal.random:before{content:"•••••";position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);font-size:24px;color:#9370db;letter-spacing:8px;opacity:.4}.pattern-density-buttons{display:flex;flex-wrap:wrap;gap:5px;margin-top:10px}.add-pattern-btn{width:100%;padding:12px 16px;margin-top:4px;background:linear-gradient(135deg,#1a1a1a 0%,#2a2a2a 100%);border:2px dashed #666;border-radius:8px;color:#ddd;font-weight:600;font-size:12px;cursor:pointer;transition:all .3s ease;display:flex;align-items:center;justify-content:center;gap:6px;text-transform:uppercase;letter-spacing:.3px;box-shadow:inset 0 0 20px #9370db1a;text-align:center;line-height:1.3;white-space:pre-line}.add-pattern-btn:hover{border-color:#9370db;color:#9370db;background:linear-gradient(135deg,#1a1a1a 0%,#2d2a3a 100%);transform:translateY(-2px);box-shadow:0 4px 12px #9370db4d}.plus-icon{font-size:16px}.active-pattern{background:#0a0a0a;border:1px solid #333;border-radius:8px;padding:16px}.pattern-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:16px}.remove-btn{background:none;border:none;color:#f44;cursor:pointer;font-size:12px;padding:4px 8px;border-radius:4px;transition:all .2s}.remove-btn:hover{background:rgba(255,68,68,.2)}.pattern-grid-modal{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}.pattern-card-modal{background:#1a1a1a;border:2px solid #333;border-radius:12px;padding:24px;cursor:pointer;transition:all .3s ease;text-align:center}.pattern-card-modal:hover{border-color:#9370db;transform:translateY(-4px);box-shadow:0 12px 32px #9370db4d}.pattern-preview-modal{width:100%;height:140px;background:#0a0a0a;border-radius:8px;margin-bottom:20px;display:flex;align-items:center;justify-content:center;font-size:48px;color:#9370db;position:relative;overflow:hidden}.pattern-preview-modal.lissajous:before{font-size:64px;opacity:.5;animation:float 3s ease-in-out infinite}.pattern-preview-modal.grid:before{content:"⊞";position:absolute;font-size:64px;opacity:.5;color:#9370db}.pattern-preview-modal.hex:before{content:"⬡";position:absolute;font-size:64px;opacity:.5;color:#9370db}.pattern-preview-modal.texture:before{content:"≈≈≈";position:absolute;font-size:36px;letter-spacing:8px;opacity:.5;color:#9370db}.pattern-card-name{font-size:18px;font-weight:600;color:#fff;margin:0 0 8px}.pattern-card-description{font-size:14px;color:#999;line-height:1.5;margin:0}@keyframes slideIn{0%{transform:translateY(20px);opacity:0}to{transform:translateY(0);opacity:1}}@keyframes float{0%,to{transform:translateY(0)}50%{transform:translateY(-10px)}}.interactive-canvas-container{position:relative;user-select:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none}.dragging{cursor:grabbing!important}@media (max-width: 1200px){.main-content{grid-template-columns:250px 1fr 250px}.visualization-canvas{width:100%;height:auto;max-width:900px;max-height:810px}}@media (max-width: 768px){.typography-studio{padding:10px}.pattern-grid-modal{grid-template-columns:repeat(2,1fr)}}@media (max-width: 480px){.pattern-grid-modal{grid-template-columns:1fr}}.right-panel-content{flex:1;display:flex;flex-direction:column;gap:20px}.right-panel-footer{margin-top:auto;padding-top:15px;border-top:1px solid #333;font-size:11px;color:#666;text-align:center;line-height:1.3;margin-bottom:0}.demo-canvas-overlay{position:relative;transition:all .3s ease}.demo-canvas-overlay:hover{transform:scale(1.02)}.typography-studio:not(.demo-active) .canvas-container{cursor:default}.typography-studio:not(.demo-active) .visualization-canvas{cursor:default}@media (max-width: 768px){.quick-features-strip{gap:10px;padding:10px}.mini-demo img{width:150px;height:90px}}@keyframes pulse{0%{transform:scale(1);box-shadow:0 4px 15px #00bfff66}50%{transform:scale(1.05);box-shadow:0 6px 20px #00bfff99}to{transform:scale(1);box-shadow:0 4px 15px #00bfff66}}.demo-canvas-overlay:hover .start-creating-btn{transform:scale(1.1);box-shadow:0 6px 25px #00bfffb3}button{cursor:pointer!important}.animation-modal{max-width:600px}.animation-modal .modal-header{padding-bottom:8px}.animation-info{color:#888;font-size:14px;margin:8px 0 0;font-style:italic}.animation-payment-options{display:flex;flex-direction:column;gap:24px}.animation-size-info h3{color:#00bfff;font-size:18px;margin:0 0 8px;font-weight:600}.size-explanation{color:#aaa;font-size:14px;margin:0;line-height:1.4}.payment-section h4{color:#ff8c00;font-size:16px;margin:0 0 16px;font-weight:600}.payment-option{background:linear-gradient(135deg,#2a2a2a 0%,#1a1a1a 100%);border:2px solid #444;border-radius:12px;padding:20px;cursor:pointer;transition:all .3s ease;text-align:center}.payment-option:hover{border-color:#00bfff;transform:translateY(-2px);box-shadow:0 8px 25px #00bfff4d}.payment-option h4{color:#fff;font-size:18px;margin:0 0 8px;font-weight:600}.payment-option .price{color:#00ff7f;font-size:24px;font-weight:700;margin:0 0 8px}.payment-option .description{color:#aaa;font-size:14px;margin:0}.free-tier-info{background:rgba(0,255,127,.1);border:1px solid #00ff7f;border-radius:12px;padding:20px;text-align:center}.free-tier-info h4{color:#00ff7f;font-size:16px;margin:0 0 12px;font-weight:600}.free-tier-info p{color:#ccc;font-size:14px;margin:0 0 16px;line-height:1.5}.secondary-button{background:#333;color:#fff;border:2px solid #555;border-radius:8px;padding:12px 24px;font-size:14px;font-weight:600;cursor:pointer;transition:all .3s ease;text-transform:uppercase;letter-spacing:.5px}.secondary-button:hover{background:#444;border-color:#00ff7f;color:#00ff7f;transform:translateY(-1px)}.free-tier-section{background:rgba(0,255,127,.1);border:1px solid #00ff7f;border-radius:12px;padding:24px;text-align:center}.free-tier-section h3{color:#00ff7f;font-size:20px;margin:0 0 12px;font-weight:600}.free-tier-section p{color:#ccc;font-size:16px;margin:0}.job-status-section{background:#1a1a1a;border:1px solid #333;border-radius:12px;padding:24px}.job-status-section h3{color:#9370db;font-size:18px;margin:0 0 16px;font-weight:600}.job-status-section p{color:#ccc;font-size:14px;margin:0 0 16px}.download-button{background:linear-gradient(135deg,#10b981 0%,#059669 100%);color:#fff;border:none;padding:12px 24px;border-radius:8px;font-weight:600;font-size:14px;cursor:pointer;transition:all .3s ease;text-transform:uppercase;letter-spacing:.5px;text-decoration:none;display:inline-block}.download-button:hover{background:linear-gradient(135deg,#059669 0%,#047857 100%);transform:translateY(-2px);box-shadow:0 6px 20px #10b98166;color:#fff;text-decoration:none}.animation-color-modal{max-width:700px}.animation-color-modal .modal-header{padding-bottom:8px}.modal .close-btn{color:#f44!important;fontSize:28px!important;font-weight:700!important;background-color:#ff44441a!important;border:2px solid #ff4444!important;border-radius:50%!important;width:40px!important;height:40px!important;display:flex!important;align-items:center!important;justify-content:center!important;cursor:pointer!important;transition:all .2s ease!important;box-shadow:0 2px 8px #ff44444d!important;position:absolute!important;top:15px!important;right:15px!important;z-index:1000!important}.modal .close-btn:hover{background-color:#f44!important;color:#fff!important;transform:scale(1.1)!important;box-shadow:0 4px 15px #ff444480!important}.modal .close-btn:active{transform:scale(.95)!important}.color-selection-options{display:flex;flex-direction:column;gap:24px}.color-option{background:linear-gradient(135deg,#2a2a2a 0%,#1a1a1a 100%);border:2px solid #444;border-radius:12px;padding:20px;cursor:pointer;transition:all .3s ease;position:relative}.color-option-header{display:flex;align-items:center;gap:12px;margin-bottom:8px}.color-option-header input[type=radio]{width:18px;height:18px;accent-color:#00ff7f}.color-option-header h4{color:#fff;font-size:18px;margin:0;font-weight:600}.color-description{color:#aaa;font-size:14px;margin:0 0 16px 30px;line-height:1.4}.color-modal-footer{margin-top:32px;padding-top:24px;border-top:1px solid #333;text-align:center}.proceed-button{background:linear-gradient(135deg,#00bfff 0%,#0080ff 100%);color:#fff;border:none;padding:14px 32px;border-radius:8px;font-weight:600;font-size:16px;cursor:pointer;transition:all .3s ease;text-transform:uppercase;letter-spacing:.5px;min-width:200px}.proceed-button:hover{background:linear-gradient(135deg,#0080ff 0%,#0060ff 100%);transform:translateY(-2px);box-shadow:0 8px 25px #00bfff66}.color-option.selected .color-sample{animation:colorPulse 2s ease-in-out infinite}@keyframes colorPulse{0%,to{transform:scale(1);box-shadow:0 0 #00ff7f00}50%{transform:scale(1.05);box-shadow:0 0 20px #00ff7f4d}}.animation-color-modal.optimized-layout{max-width:600px}.animation-size-info{text-align:center;margin-bottom:24px;padding:16px;background:linear-gradient(135deg,rgba(0,191,255,.1) 0%,rgba(0,191,255,.05) 100%);border-radius:8px;border:1px solid rgba(0,191,255,.2)}.animation-size-info h3{margin:0 0 8px;color:#00bfff;font-size:20px}.animation-size-info .size-explanation{margin:0;color:#aaa;font-size:14px}.color-selection-content{display:flex;flex-direction:column;gap:24px}.color-options-section{display:flex;flex-direction:column;gap:16px}.color-option{background:linear-gradient(135deg,#2a2a2a 0%,#1a1a1a 100%);border:2px solid #444;border-radius:12px;padding:20px;cursor:pointer;transition:all .3s ease;width:100%}.color-option:hover{border-color:#00bfff;transform:translateY(-2px);box-shadow:0 8px 25px #00bfff33}.color-option.selected{border-color:#00ff7f;background:linear-gradient(135deg,rgba(0,255,127,.1) 0%,#1a1a1a 100%);box-shadow:0 8px 25px #00ff7f4d}.action-section{display:flex;align-items:center;justify-content:space-between;background:linear-gradient(135deg,#1a1a1a 0%,#2a2a2a 100%);border:2px solid #444;border-radius:12px;padding:24px;margin-top:8px}.payment-info{text-align:left}.price-highlight{font-size:32px;font-weight:700;color:#00ff7f;line-height:1;margin-bottom:4px}.payment-details{color:#aaa;font-size:14px;font-weight:500}.proceed-button-large{background:linear-gradient(135deg,#00bfff 0%,#0080ff 100%);color:#fff;border:none;padding:16px 32px;border-radius:12px;font-weight:600;font-size:18px;cursor:pointer;transition:all .3s ease;text-transform:uppercase;letter-spacing:.5px;min-width:220px;box-shadow:0 4px 15px #00bfff4d}.proceed-button-large:hover{background:linear-gradient(135deg,#0080ff 0%,#0060ff 100%);transform:translateY(-3px);box-shadow:0 8px 25px #00bfff80}.proceed-button-large:active{transform:translateY(-1px)}@media (max-width: 768px){.action-section{flex-direction:column;gap:16px;text-align:center}.proceed-button-large{width:100%;min-width:unset}.animation-color-modal.optimized-layout{max-width:90vw;margin:20px}}.color-picker-modal{max-width:500px;width:90%}.color-picker-subtitle{color:#888;font-size:14px;margin:8px 0 0;font-style:italic}.color-picker-body{padding:24px}.current-selection{display:flex;align-items:center;gap:12px;margin-bottom:24px;padding:16px;background:#1a1a1a;border-radius:8px;border:1px solid #333}.current-color-display-large{width:40px;height:40px;border-radius:8px;border:2px solid #444}.current-color-code{font-family:SF Mono,Monaco,monospace;font-size:14px;font-weight:600;color:#fff;background:#333;padding:8px 12px;border-radius:6px;text-transform:uppercase}.color-grid-section{margin-bottom:24px}.color-grid-section h4{color:#ccc;font-size:14px;font-weight:500;margin-bottom:12px}.color-square{width:28px;height:28px;border:1px solid rgba(255,255,255,.2);border-radius:4px;cursor:pointer;transition:all .2s ease;position:relative}.color-square:hover{transform:scale(1.15);border-color:#ffffff80;z-index:10;box-shadow:0 2px 8px #0006}.color-square.selected{border:3px solid #00ff7f;transform:scale(1.1);box-shadow:0 0 0 2px #00ff7f4d}.html5-color-input{width:100%;height:40px;border:1px solid #444;border-radius:8px;cursor:pointer;background:none}.monochrome-simple-picker{margin-left:30px;margin-top:16px}.current-color-simple{display:flex;align-items:center;gap:12px}.current-color-simple label{color:#ccc;font-size:14px;font-weight:500}.color-swatch-simple{width:32px;height:32px;border-radius:6px;border:2px solid #444}.color-value-simple{color:#fff;font-family:SF Mono,Monaco,monospace;font-size:12px;font-weight:600;text-transform:uppercase;background:#333;padding:6px 10px;border-radius:4px;border:1px solid #555}.choose-color-btn{background:#444;color:#ccc;border:1px solid #666;padding:8px 16px;border-radius:6px;cursor:pointer;font-size:12px;transition:all .2s ease}.choose-color-btn:hover{background:#555;color:#fff;border-color:#00bfff}.color-picker-overlay{z-index:1100}.color-picker-modal{max-width:500px;background:#242424}.color-grid-section h4{color:#ccc;font-size:14px;margin-bottom:12px}.color-grid-compact{display:grid;gap:3px;margin-bottom:16px}.basic-grid-compact,.grayscale-grid-compact{grid-template-columns:repeat(8,1fr)}.color-square{width:28px;height:28px;border:1px solid rgba(255,255,255,.2);border-radius:4px;cursor:pointer}.color-square:hover{transform:scale(1.15);border-color:#ffffff80}@media (max-width: 768px){.mobile-notice{background:linear-gradient(135deg,#d63447 0%,#ff6b35 100%);color:#fff;padding:16px 20px;text-align:center;position:fixed;top:0;left:0;right:0;z-index:1000;box-shadow:0 4px 12px #0000004d;font-size:14px;font-weight:600}.typography-studio{margin-top:80px;padding:10px;overflow-x:hidden}.action-buttons{grid-template-columns:1fr!important;gap:12px}.action-btn{padding:16px 12px!important;font-size:14px!important;min-height:44px}.canvas-container>div{transform:translate(-50%) scale(.4)!important}.demo-canvas-overlay{left:50%!important;transform:translate(-50%) translateY(-50%) scale(.4)!important;top:50%!important}.modal{width:95%;max-width:95%;margin:10px;max-height:90vh}.modal-header{padding:20px 20px 15px}.modal-body{padding:20px}}@media (min-width: 481px) and (max-width: 1024px){.typography-studio{height:100vh;overflow:hidden}.main-content{height:calc(100vh - 200px);overflow:hidden}}@media (max-width: 480px){.mobile-notice{padding:12px 15px;font-size:13px}.typography-studio{margin-top:70px;padding:8px;height:100vh;overflow:hidden}.main-content{height:calc(100vh - 150px);overflow:hidden}.action-btn{padding:14px;font-size:14px}.canvas-container>div{transform:translate(-50%) scale(.3)!important}.demo-canvas-overlay{transform:translate(-50%) translateY(-50%) scale(.3)!important}.modal{width:98%;margin:5px;max-height:95vh}.modal-header,.modal-body{padding:15px}}.typo-studio-context-menu{background:#2a2a2a;border:1px solid #444;border-radius:8px;box-shadow:0 4px 12px #00000080;padding:8px 0;min-width:200px;animation:typoStudioContextMenuFadeIn .15s ease-out}@keyframes typoStudioContextMenuFadeIn{0%{opacity:0;transform:scale(.95) translateY(-5px)}to{opacity:1;transform:scale(1) translateY(0)}}.typo-studio-context-menu-item{display:flex;align-items:center;padding:10px 16px;cursor:pointer;color:#fff!important;font-size:14px;transition:all .2s ease;-webkit-user-select:none;user-select:none}.typo-studio-context-menu-item:hover:not(.typo-studio-disabled){background:#3a3a3a;color:#4ecdc4}.typo-studio-context-menu-item.typo-studio-disabled{opacity:.5;cursor:not-allowed}.typo-studio-context-menu-icon{font-size:16px;margin-right:12px;width:20px;text-align:center}.typo-studio-context-menu-label{flex:1;font-weight:500;color:#fff!important}.typo-studio-context-menu-shortcut{margin-left:20px;font-size:12px;color:#999;font-family:monospace}.typo-studio-context-menu-separator{height:1px;background:#444;margin:4px 0}.typo-studio-modal-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:rgba(0,0,0,.8);display:flex;align-items:center;justify-content:center;z-index:999;animation:typoStudioFadeIn .2s ease-out}@keyframes typoStudioFadeIn{0%{opacity:0}to{opacity:1}}.typo-studio-circular-text-modal{background:#2a2a2a;border-radius:12px;box-shadow:0 8px 32px #00000080;width:90%;max-width:600px;max-height:90vh;overflow:hidden;animation:typoStudioSlideIn .3s ease-out}@keyframes typoStudioSlideIn{0%{transform:translateY(-20px);opacity:0}to{transform:translateY(0);opacity:1}}.typo-studio-modal-header{display:flex;justify-content:space-between;align-items:center;padding:20px;border-bottom:1px solid #444}.typo-studio-modal-header h2{margin:0;color:#4ecdc4;font-size:20px;font-weight:600}.typo-studio-close-btn{background:none;border:none;font-size:24px;color:#999;cursor:pointer;padding:0;width:32px;height:32px;display:flex;align-items:center;justify-content:center;border-radius:4px;transition:all .2s}.typo-studio-close-btn:hover{background:#3a3a3a;color:#fff}.typo-studio-modal-body{padding:20px;overflow-y:auto;max-height:calc(90vh - 140px)}.typo-studio-input-section{margin-bottom:24px}.typo-studio-input-section label,.typo-studio-preview-section label,.typo-studio-control-item label{display:block;color:#ccc;font-size:14px;font-weight:500;margin-bottom:8px}.typo-studio-input-section input[type=text]{width:100%;padding:12px;background:#1a1a1a;border:2px solid #444;border-radius:8px;color:#fff;font-size:16px;transition:border-color .2s}.typo-studio-input-section input[type=text]:focus{outline:none;border-color:#4ecdc4}.typo-studio-input-hint{margin-top:8px;font-size:12px;color:#999}.typo-studio-preview-section{margin-bottom:24px;text-align:center}.typo-studio-preview-canvas{background:#1a1a1a;border:1px solid #444;border-radius:8px;margin-top:8px}.typo-studio-controls-section{display:flex;flex-direction:column;gap:20px}.typo-studio-control-item{display:flex;align-items:center;gap:16px}.typo-studio-control-item label{width:120px;margin-bottom:0}.typo-studio-control-item input[type=range]{flex:1;height:4px;background:#444;border-radius:2px;outline:none;-webkit-appearance:none}.typo-studio-control-item input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:16px;height:16px;background:#4ecdc4;border-radius:50%;cursor:pointer}.typo-studio-control-item input[type=range]::-moz-range-thumb{width:16px;height:16px;background:#4ecdc4;border-radius:50%;cursor:pointer;border:none}.typo-studio-control-value{min-width:50px;text-align:right;color:#4ecdc4;font-weight:600}.typo-studio-direction-buttons{display:flex;gap:8px;flex:1}.typo-studio-direction-btn{flex:1;padding:8px 16px;background:#1a1a1a;border:2px solid #444;border-radius:6px;color:#999;cursor:pointer;transition:all .2s;font-size:14px}.typo-studio-direction-btn:hover{border-color:#666;color:#ccc}.typo-studio-direction-btn.active{background:#4ecdc4;border-color:#4ecdc4;color:#1a1a1a;font-weight:600}.typo-studio-modal-footer{display:flex;justify-content:flex-end;gap:12px;padding:20px;border-top:1px solid #444}.typo-studio-cancel-btn,.typo-studio-add-btn{padding:10px 24px;border:none;border-radius:6px;font-size:14px;font-weight:600;cursor:pointer;transition:all .2s}.typo-studio-cancel-btn{background:#3a3a3a;color:#ccc}.typo-studio-cancel-btn:hover{background:#444;color:#fff}.typo-studio-add-btn{background:#4ecdc4;color:#1a1a1a}.typo-studio-add-btn:hover:not(:disabled){background:#45b8b0}.typo-studio-add-btn:disabled{opacity:.5;cursor:not-allowed}.neon-color-picker{position:relative;margin:15px 0}.color-picker-header label{display:block;color:#ccc;font-weight:500;margin-bottom:10px;font-size:14px;text-transform:uppercase;letter-spacing:.5px}.color-target{font-size:12px;color:#4ecdc4;text-transform:none;margin-left:5px}.color-indicator{width:100%;height:40px;border:2px solid #444;border-radius:8px;cursor:pointer;position:relative;transition:all .2s ease;display:flex;align-items:center;justify-content:center;font-family:monospace;font-size:14px;font-weight:700;padding:0;background:#1a1a1a}.color-indicator:hover{border-color:#666;transform:translateY(-1px)}.color-hex{background:rgba(0,0,0,.5);padding:2px 8px;border-radius:4px;color:#fff;text-shadow:0 1px 2px rgba(0,0,0,.8)}.color-picker-modal{position:absolute;top:calc(100% + 10px);left:0;right:0;background:#2a2a2a;border:2px solid #444;border-radius:12px;padding:0;z-index:100;box-shadow:0 10px 30px #000c;animation:expandIn .2s ease-out}@keyframes expandIn{0%{opacity:0;transform:scale(.95) translateY(-10px)}to{opacity:1;transform:scale(1) translateY(0)}}.modal-header{display:flex;justify-content:space-between;align-items:center;padding:15px 20px;border-bottom:1px solid #333}.modal-header h4{margin:0;color:#fff;font-size:16px;text-transform:uppercase;letter-spacing:.5px}.close-btn{background:none;border:none;color:#666;font-size:24px;cursor:pointer;padding:0;width:30px;height:30px;display:flex;align-items:center;justify-content:center;border-radius:50%;transition:all .2s ease}.close-btn:hover{background:#333;color:#fff}.neon-colors-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:10px;padding:20px}.neon-color-btn{width:100%;aspect-ratio:1;border:2px solid transparent;border-radius:8px;cursor:pointer;position:relative;transition:all .2s ease;padding:0;overflow:hidden}.neon-color-btn:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background:inherit;filter:blur(10px);opacity:0;transition:opacity .2s ease}.neon-color-btn:hover{transform:scale(1.05);border-color:#ffffff4d}.neon-color-btn:hover:before{opacity:.5}.neon-color-btn.active{border-color:#fff;box-shadow:0 0 20px currentColor}.checkmark{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);color:#000;font-size:20px;font-weight:700;text-shadow:0 0 4px rgba(255,255,255,.8)}.custom-color-section{padding:15px 20px 20px;border-top:1px solid #333;margin-top:10px}.custom-color-btn{width:100%;padding:10px;background:#333;border:2px solid #444;border-radius:8px;color:#ccc;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:10px;transition:all .2s ease;font-size:14px;font-weight:500}.custom-color-btn:hover{background:#3a3a3a;border-color:#555;color:#fff}.gradient-icon{font-size:18px}.custom-picker-wrapper{display:flex;align-items:center;gap:15px}.custom-color-input{width:60px;height:40px;border:2px solid #444;border-radius:8px;cursor:pointer;padding:2px}.custom-picker-wrapper span{color:#999;font-size:14px}@media (max-width: 480px){.neon-colors-grid{grid-template-columns:repeat(4,1fr)}}.reset-color-section{padding:0 20px 20px}.reset-color-btn{width:100%;padding:10px;background:transparent;border:2px dashed #555;border-radius:8px;color:#999;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:8px;transition:all .2s ease;font-size:14px;font-weight:500}.reset-color-btn:hover{border-color:#777;color:#ccc;background:rgba(255,255,255,.05)}.reset-icon{font-size:16px}.color-mode-section{padding:15px 20px;border-top:1px solid #333}.mode-buttons{display:grid;grid-template-columns:1fr 1fr;gap:10px}.mode-btn{padding:10px 15px;background:#333;border:2px solid #444;border-radius:8px;color:#ccc;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:8px;transition:all .2s ease;font-size:13px;font-weight:500}.mode-btn:hover{background:#3a3a3a;border-color:#555;color:#fff}.mode-btn.random-btn:hover{border-color:#f0f;color:#f0f}.mode-btn.clear-btn:hover{border-color:#4ecdc4;color:#4ecdc4}.mode-icon{font-size:18px}.color-instructions{padding:10px 20px;text-align:center;font-size:13px;color:#999;border-top:1px solid #333}.color-instructions p{margin:0}.color-target{font-size:12px;color:#4ecdc4;text-transform:none;margin-left:5px;font-weight:700;animation:pulse 2s infinite}@keyframes pulse{0%{opacity:.6}50%{opacity:1}to{opacity:.6}}.progressive-controls{display:flex;flex-direction:column;gap:12px}.control-section{background:#1a1a1a;border:1px solid #333;border-radius:8px;padding:16px;margin-bottom:12px}.control-section h3{margin:0 0 15px;color:#d4c5ff;font-size:1.1rem;border-bottom:1px solid #444;padding-bottom:8px}.control-section h4{color:#fff;font-weight:600;margin-bottom:16px;font-size:14px;letter-spacing:1px}.control-section.hero-mode{padding:40px 20px;text-align:center}.size-section{padding:12px 16px 8px!important;margin-bottom:8px!important}.size-section .section-header{margin-bottom:8px!important}.size-section .reveal-more-btn{margin-top:8px!important}.landing-header h3{font-size:24px;font-weight:300;letter-spacing:2px;margin-bottom:8px;color:#4ecdc4}.landing-subtitle{font-size:14px;color:#aaa;margin-bottom:20px}.text-input-wrapper{margin-bottom:12px}.text-input.hero-input{font-size:18px;padding:20px;text-align:center;border:2px solid #333;border-radius:8px;background:#0a0a0a;transition:all .3s ease}.text-input.hero-input:focus{border-color:#4ecdc4;box-shadow:0 0 20px #4ecdc433}.landing-hints{margin-top:20px}.example-chips{display:flex;align-items:center;justify-content:center;gap:10px;margin-bottom:15px;flex-wrap:wrap}.example-chips span{color:#666;font-size:12px}.example-chip{padding:6px 12px;background:#1a1a1a;border:1px solid #333;border-radius:20px;color:#ccc;font-size:12px;cursor:pointer;transition:all .2s ease}.example-chip:hover{background:#2a2a2a;color:#4ecdc4;border-color:#4ecdc4}.visual-slider{display:flex;flex-direction:column;align-items:stretch;gap:4px;margin-bottom:16px}.slider-label{font-size:13px;color:#ddd;flex-shrink:0}.slider-value{font-size:11px;color:#999;text-align:center}input[type=range],.visual-range,.simple-range{width:100%;height:1px!important;background:#2a2a2a;border-radius:.5px;outline:none;-webkit-appearance:none;margin-bottom:5px}input[type=range]::-webkit-slider-runnable-track,.visual-range::-webkit-slider-runnable-track,.simple-range::-webkit-slider-runnable-track{height:1px;background:#2a2a2a;border-radius:.5px}input[type=range]::-webkit-slider-thumb,.visual-range::-webkit-slider-thumb,.simple-range::-webkit-slider-thumb{-webkit-appearance:none;width:18px;height:18px;background:#4ecdc4;border-radius:50%;cursor:pointer;border:2px solid #fff;transition:all .2s ease;margin-top:-8.5px}.visual-range::-webkit-slider-thumb:hover,.simple-range::-webkit-slider-thumb:hover{transform:scale(1.2);box-shadow:0 0 10px #4ecdc480}.range-value{font-size:11px;color:#4ecdc4;font-weight:700;margin-left:8px}input[type=range]::-moz-range-thumb,.visual-range::-moz-range-thumb,.simple-range::-moz-range-thumb{width:18px;height:18px;background:#4ecdc4;border-radius:50%;cursor:pointer;border:2px solid #fff;-moz-appearance:none;-webkit-appearance:none;appearance:none}input[type=range]::-moz-range-track,.visual-range::-moz-range-track,.simple-range::-moz-range-track{height:1px;background:#2a2a2a;border-radius:.5px;border:none}.visual-slider input[type=range]{height:1px!important;background:#2a2a2a!important;border:none!important}.visual-slider input[type=range]::-webkit-slider-runnable-track{height:1px!important;background:#2a2a2a!important;border-radius:.5px!important;border:none!important}.visual-slider input[type=range]::-moz-range-track{height:1px!important;background:#2a2a2a!important;border-radius:.5px!important;border:none!important}.layout-selector{display:flex;gap:8px;margin-bottom:16px}.layout-btn{flex:1;padding:12px 8px;border:2px solid #444;background:#2a2a2a;color:#999;border-radius:6px;cursor:pointer;transition:all .2s;display:flex;flex-direction:column;align-items:center;gap:4px;min-width:70px}.layout-btn:hover{border-color:#666;background:#333;color:#ccc}.layout-btn.active{border-color:#4ecdc4;background:#1a3a3a;color:#4ecdc4}.layout-icon{font-size:18px;font-weight:700}.layout-label{font-size:10px;text-transform:uppercase;letter-spacing:.3px;color:inherit;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}.layout-controls .control-item{margin-bottom:16px}.layout-controls .control-item:last-child{margin-bottom:0}.layout-controls input[type=range],.layout-controls .simple-range{width:100%!important;height:1px!important;background:#2a2a2a!important;border-radius:.5px!important;outline:none!important;-webkit-appearance:none!important;margin-bottom:5px!important}.layout-controls input[type=range]::-webkit-slider-thumb,.layout-controls .simple-range::-webkit-slider-thumb{-webkit-appearance:none!important;width:18px!important;height:18px!important;background:#4ecdc4!important;border-radius:50%!important;cursor:pointer!important;border:2px solid #fff!important;transition:all .2s ease!important;margin-top:-8.5px!important}.layout-controls .range-value{font-size:11px!important;color:#4ecdc4!important;font-weight:700!important;margin-left:8px!important}.layout-controls .toggle-group{display:flex;gap:4px;margin-top:8px;width:100%}.layout-controls .toggle-btn{flex:1;min-width:0;padding:8px 4px;border:1px solid #444;background:#2a2a2a;color:#999;border-radius:4px;cursor:pointer;transition:all .2s;font-size:9px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:40px}.layout-controls .toggle-btn:hover{border-color:#666;background:#333;color:#ccc}.layout-controls .toggle-btn.active{border-color:#4ecdc4;background:#1a3a3a;color:#4ecdc4;font-weight:600}.control-item{margin-bottom:12px}.control-item label{display:block;margin-bottom:8px;color:#ddd;font-weight:500;font-size:13px}.section-header{margin-bottom:12px;padding-bottom:8px;border-bottom:1px solid #2a2a2a}.section-header h4{font-size:12px;font-weight:600;letter-spacing:.8px;color:#fff!important;margin:0}.subsection-header{margin:8px 0 12px;padding-bottom:6px;border-bottom:1px solid #333}.subsection-header h5{margin:0;font-size:10px;font-weight:600;letter-spacing:.8px;color:#888;text-transform:uppercase}.collapsible-header{cursor:pointer;-webkit-user-select:none;user-select:none}.collapsible-header:hover{opacity:.9}.collapse-icon{color:#9370db!important;font-size:12px;font-weight:700;transition:transform .2s ease,color .2s ease}.collapsible-header:hover .collapse-icon{color:#b8a9ff!important}.position-controls{margin-top:10px;display:flex;flex-direction:column;align-items:center}.position-row{display:flex;align-items:center;justify-content:center;gap:12px;margin:8px 0;padding:0;flex-wrap:nowrap;width:100%;max-width:160px}.position-row button{width:32px;height:32px;background:#1a1a1a;border:1px solid #3a3a3a;border-radius:4px;color:#ccc;cursor:pointer;transition:all .2s ease;flex-shrink:0;font-size:14px;display:flex;align-items:center;justify-content:center}.position-row button:hover{background:#2a2a2a;color:#4ecdc4;border-color:#4ecdc4}.position-row span{font-size:12px;color:#ccc;min-width:60px;text-align:center;flex:1;white-space:nowrap;font-weight:500}.center-btn{width:100%;max-width:100px;margin:8px auto 0;padding:6px;background:#1a1a1a;border:1px solid #2a2a2a;border-radius:4px;color:#ccc!important;font-size:11px;cursor:pointer;transition:all .2s ease}.center-btn:hover{background:#2a2a2a;color:#4ecdc4!important;border-color:#4ecdc4}.alignment-controls{margin-bottom:20px}.alignment-group{display:flex;gap:20px;background:transparent;border:none;border-radius:6px;overflow:visible;height:32px;min-height:32px;width:100%;justify-content:center;margin:0 auto}.alignment-group .align-btn{flex:0 0 auto;width:32px;height:32px;background:#1a1a1a;border:1px solid #333;border-radius:4px;color:#666;cursor:pointer;transition:all .2s;font-size:16px;padding:0;margin:0;display:flex;align-items:center;justify-content:center}.alignment-group .align-btn:hover:not(.active){background:#2a2a2a;color:#9370db;border-color:#555}.alignment-group .align-btn.active{background:#9370db;color:#fff;border-color:#9370db}.toggle-group{display:flex;gap:6px;margin-top:8px;width:100%}.toggle-btn{flex:1;min-width:0;padding:8px 10px;border:1px solid #444;background:#2a2a2a;color:#999;border-radius:4px;cursor:pointer;transition:all .2s;font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:60px}.toggle-btn:hover{border-color:#666;background:#333;color:#ccc}.toggle-btn.active{border-color:#4ecdc4;background:#1a3a3a;color:#4ecdc4;font-weight:600}.reveal-more-btn{width:100%;padding:10px;margin-top:12px;background:linear-gradient(135deg,#1a1a1a 0%,#2a2a2a 100%);border:1px solid #333;border-radius:6px;color:#4ecdc4;font-size:13px;cursor:pointer;transition:all .3s ease}.reveal-more-btn:hover{background:linear-gradient(135deg,#2a2a2a 0%,#333 100%);border-color:#4ecdc4;transform:translateY(-2px);box-shadow:0 5px 15px #4ecdc433}.fade-in{animation:fadeIn .5s ease-out}.font-selector{margin-bottom:16px}.font-selector-label{display:block;margin-bottom:8px;color:#ddd;font-weight:500;font-size:13px}.font-selector-dropdown{position:relative}.font-selector-current{width:100%;background:#1a1a1a;border:1px solid #444;border-radius:6px;padding:12px;color:#fff;cursor:pointer;transition:all .2s ease;display:flex;align-items:center;justify-content:space-between}.font-selector-current:hover{border-color:#666;background:#222}.font-current-info{display:flex;align-items:center;gap:12px}.font-current-preview{font-size:20px;font-weight:700;color:#4ecdc4;min-width:30px}.font-current-details{display:flex;flex-direction:column;align-items:flex-start}.font-current-name{font-size:14px;font-weight:500;color:#fff}.font-current-category{font-size:11px;color:#888;text-transform:uppercase;letter-spacing:.5px}.font-dropdown-arrow{color:#9370db;font-size:12px;transition:transform .2s ease}.font-dropdown-arrow.open{transform:rotate(180deg)}.font-selector-options{position:absolute;top:100%;left:0;right:0;background:#1a1a1a;border:1px solid #444;border-radius:6px;box-shadow:0 4px 12px #0000004d;z-index:1000;max-height:200px;overflow-y:auto;margin-top:4px}.font-option{width:100%;background:transparent;border:none;padding:12px;color:#fff;cursor:pointer;transition:all .2s ease;display:flex;align-items:center;gap:12px;text-align:left}.font-option:hover{background:#2a2a2a}.font-option.active{background:#1a3a3a;border-left:3px solid #4ecdc4}.font-option-preview{font-size:18px;font-weight:700;color:#4ecdc4;min-width:30px}.font-option-details{display:flex;flex-direction:column;align-items:flex-start}.font-option-name{font-size:13px;font-weight:500;color:#fff}.font-option-category{font-size:10px;color:#888;text-transform:uppercase;letter-spacing:.5px}.font-selector-overlay{position:fixed;top:0;left:0;right:0;bottom:0;z-index:999}.mobile-hint{font-size:12px;color:#666;margin:0}.pro-tip{background:rgba(78,205,196,.1)!important;border:1px solid rgba(78,205,196,.3)!important;padding:10px 15px!important;border-radius:8px!important;margin:15px 0!important;font-size:13px!important;color:#fff!important;line-height:1.4!important}.pro-tip span,.pro-tip *{color:#fff!important}.color-by-number-modal{position:fixed;top:80px;left:50%;transform:translate(-50%);width:90%;max-width:800px;background:#2a2a2a;border:2px solid #444;border-radius:12px;box-shadow:0 10px 30px #000c;z-index:1000;max-height:300px;display:flex;flex-direction:column}.modal-header{padding:15px 20px;border-bottom:1px solid #333;display:flex;justify-content:space-between;align-items:center}.modal-header h3{margin:0;color:#fff;font-size:18px}.mode-selector{display:flex;gap:10px}.mode-btn{padding:8px 16px;background:#333;border:1px solid #444;color:#999;border-radius:6px;cursor:pointer;transition:all .2s;font-size:13px}.mode-btn:hover{background:#3a3a3a;color:#ccc}.mode-btn.active{background:#1a3a3a;border-color:#4ecdc4;color:#4ecdc4}.modal-body{display:flex;padding:20px;gap:20px;overflow:hidden;flex:1}.word-list{flex:1;overflow-y:auto;max-height:150px;display:flex;flex-wrap:wrap;gap:8px;align-content:flex-start;padding-right:10px}.word-item{padding:6px 12px;background:#333;border:2px solid #444;border-radius:20px;cursor:pointer;transition:all .2s;display:flex;align-items:center;gap:8px;font-size:14px;height:fit-content}.word-item.line-item{flex-basis:100%;border-radius:8px}.word-item:hover{border-color:#666;transform:translateY(-1px)}.word-item.selected{border-color:#4ecdc4;box-shadow:0 0 10px #4ecdc44d}.word-item.hovered{border-color:#888}.word-number{background:rgba(255,255,255,.1);padding:2px 6px;border-radius:10px;font-size:11px;font-weight:700;color:#4ecdc4}.word-text{font-weight:500}.color-palette{width:300px;display:flex;flex-direction:column;gap:10px}.color-palette h4{margin:0;color:#ccc;font-size:14px}.color-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:8px}.color-btn{width:100%;aspect-ratio:1;border:2px solid transparent;border-radius:8px;cursor:pointer;transition:all .2s;position:relative}.color-btn:hover:not(:disabled){transform:scale(1.1);border-color:#ffffff4d}.color-btn:disabled{opacity:.3;cursor:not-allowed}.color-btn.active{border-color:#fff;box-shadow:0 0 15px currentColor}.color-btn.active:after{content:"✓";position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);color:#000;font-weight:700;font-size:16px;text-shadow:0 0 3px rgba(255,255,255,.8)}.modal-footer{padding:15px 20px;border-top:1px solid #333;display:flex;gap:10px;justify-content:flex-end}.action-btn{padding:8px 16px;border:none;border-radius:6px;cursor:pointer;font-weight:500;transition:all .2s;font-size:14px}.random-btn{background:#444;color:#ccc}.random-btn:hover{background:#555;color:#fff}.reset-btn{background:transparent;border:1px dashed #666;color:#999}.reset-btn:hover{border-color:#888;color:#ccc}.done-btn{background:#4ecdc4;color:#000}.done-btn:hover{background:#5fd6ce;transform:translateY(-1px)}.word-list::-webkit-scrollbar{width:6px}.word-list::-webkit-scrollbar-track{background:#222;border-radius:3px}.word-list::-webkit-scrollbar-thumb{background:#444;border-radius:3px}.word-list::-webkit-scrollbar-thumb:hover{background:#555}.canvas-number-overlay{position:absolute;color:#4ecdc4;font-weight:700;font-size:12px;background:rgba(0,0,0,.8);padding:2px 6px;border-radius:10px;pointer-events:none;z-index:10;border:1px solid #4ecdc4}.confirmation-modal-backdrop{position:fixed;top:0;left:0;right:0;bottom:0;background:rgba(0,0,0,.7);-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);display:flex;align-items:center;justify-content:center;z-index:9999;animation:fadeIn .2s ease-out}.confirmation-modal{background:#2a2a2a;border:1px solid #444;border-radius:12px;box-shadow:0 20px 60px #00000080;max-width:480px;width:90%;max-height:90vh;overflow:hidden;animation:slideIn .3s ease-out}.confirmation-modal__header{display:flex;align-items:center;gap:12px;padding:24px 24px 16px;border-bottom:1px solid #444}.confirmation-modal__icon{font-size:24px;display:flex;align-items:center;justify-content:center;width:40px;height:40px;border-radius:8px;background:rgba(255,255,255,.1)}.confirmation-modal__title{margin:0;color:#fff;font-size:18px;font-weight:600;flex:1}.confirmation-modal__content{padding:20px 24px}.confirmation-modal__message{margin:0;color:#ccc;font-size:14px;line-height:1.5}.confirmation-modal__actions{display:flex;gap:12px;padding:16px 24px 24px;justify-content:flex-end}.confirmation-modal__button{padding:10px 20px;border:none;border-radius:6px;font-size:14px;font-weight:500;cursor:pointer;transition:all .2s ease;min-width:80px}.confirmation-modal__button--cancel{background:#444;color:#fff;border:1px solid #666}.confirmation-modal__button--cancel:hover{background:#555;border-color:#777}.confirmation-modal__button--confirm{background:#00bfff;color:#fff}.confirmation-modal__button--confirm:hover{background:#0099cc}.confirmation-modal--destructive .confirmation-modal__icon{background:rgba(255,69,58,.2);color:#ff453a}.confirmation-modal--destructive .confirmation-modal__button--confirm{background:#ff453a;color:#fff}.confirmation-modal--destructive .confirmation-modal__button--confirm:hover{background:#d63031}.confirmation-modal--warning .confirmation-modal__icon{background:rgba(255,204,0,.2);color:#fc0}.confirmation-modal--warning .confirmation-modal__button--confirm{background:#ffcc00;color:#000}.confirmation-modal--warning .confirmation-modal__button--confirm:hover{background:#e6b800}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes slideIn{0%{opacity:0;transform:scale(.9) translateY(-20px)}to{opacity:1;transform:scale(1) translateY(0)}}.confirmation-modal__button:focus{outline:2px solid #00bfff;outline-offset:2px}.confirmation-modal--destructive .confirmation-modal__button--confirm:focus{outline-color:#ff453a}@media (max-width: 640px){.confirmation-modal{margin:20px;width:calc(100% - 40px)}.confirmation-modal__actions{flex-direction:column-reverse}.confirmation-modal__button{width:100%}}.message-modal-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:rgba(0,0,0,.7);-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);display:flex;align-items:center;justify-content:center;z-index:2000;animation:messageModalFadeIn .2s ease-out}@keyframes messageModalFadeIn{0%{opacity:0}to{opacity:1}}.message-modal{background:#2a2a2a;border-radius:12px;border:2px solid #444;width:90%;max-width:480px;max-height:80vh;overflow:hidden;box-shadow:0 20px 60px #00000080;animation:messageModalSlideIn .3s ease-out;position:relative}@keyframes messageModalSlideIn{0%{transform:translateY(-20px) scale(.95);opacity:0}to{transform:translateY(0) scale(1);opacity:1}}.message-modal-header{display:flex;align-items:center;gap:12px;padding:24px 24px 16px;border-bottom:1px solid #444}.message-modal-icon{font-size:24px;display:flex;align-items:center;justify-content:center;width:40px;height:40px;border-radius:8px;flex-shrink:0}.message-modal.info .message-modal-icon{background:rgba(0,191,255,.15)}.message-modal.warning .message-modal-icon{background:rgba(255,149,0,.15)}.message-modal.error .message-modal-icon{background:rgba(255,69,58,.15)}.message-modal.success .message-modal-icon{background:rgba(48,209,88,.15)}.message-modal-title{color:#fff;margin:0;font-size:1.25rem;font-weight:600;flex:1}.message-modal-content{padding:20px 24px}.message-modal-text{color:#ccc;margin:0;font-size:1rem;line-height:1.6;text-align:left}.message-modal-footer{padding:16px 24px 24px;display:flex;justify-content:flex-end;align-items:center;gap:12px}.message-modal-button{background:#00bfff;color:#fff;border:none;border-radius:8px;padding:12px 24px;font-size:1rem;font-weight:600;cursor:pointer;transition:all .2s ease;min-width:120px;flex-shrink:0}.message-modal-button:hover{background:#0099cc;transform:translateY(-1px)}.message-modal-button:active{transform:translateY(0)}.message-modal-button.warning{background:#ff9500}.message-modal-button.warning:hover{background:#e6860e}.message-modal-button.error{background:#ff453a}.message-modal-button.error:hover{background:#e6362d}.message-modal-button.success{background:#30d158}.message-modal-button.success:hover{background:#28be4f}.message-modal-button.secondary{background:#444;color:#ccc;min-width:auto;padding:12px 24px;flex-shrink:0}.message-modal-button.secondary:hover{background:#555;color:#fff}@media (max-width: 600px){.message-modal{margin:20px;width:calc(100% - 40px)}.message-modal-header{padding:20px 20px 16px}.message-modal-content{padding:16px 20px}.message-modal-footer{padding:16px 20px 20px}}.typography-image-manager-root{background:transparent;margin:0;padding:0}.typography-image-upload-section{background:#0a0a0a;border:1px solid #333;border-radius:8px;padding:16px;margin-bottom:16px}.typography-image-upload-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:12px}.typography-image-upload-title{font-size:12px;font-weight:600;text-transform:uppercase;letter-spacing:.5px;color:#b8a9ff;margin:0}.typography-image-upload-buttons{display:flex;gap:8px;flex-wrap:wrap}.typography-image-upload-btn{background:linear-gradient(135deg,#667eea 0%,#764ba2 100%);color:#fff;border:none;padding:8px 12px;border-radius:4px;font-size:11px;font-weight:500;cursor:pointer;transition:all .3s ease;text-transform:uppercase;letter-spacing:.3px}.typography-image-upload-btn:hover{transform:translateY(-1px);box-shadow:0 4px 12px #667eea66}.typography-image-upload-btn:disabled{background:#444;color:#888;cursor:not-allowed;transform:none;box-shadow:none}.typography-image-upload-btn.danger{background:linear-gradient(135deg,#ff7675 0%,#d63031 100%)}.typography-image-upload-input{display:none}.typography-image-list{background:#0a0a0a;border:1px solid #333;border-radius:8px;max-height:300px;overflow-y:auto;margin-bottom:16px}.typography-image-list-empty{padding:24px;text-align:center;color:#666;font-size:12px;font-style:italic}.typography-image-item{display:flex;align-items:center;padding:12px;border-bottom:1px solid #222;cursor:pointer;transition:all .2s ease;position:relative}.typography-image-item:last-child{border-bottom:none}.typography-image-item:hover{background:#1a1a1a}.typography-image-item.selected{background:rgba(184,169,255,.1);border-left:3px solid #B8A9FF}.typography-image-thumbnail{width:40px;height:40px;object-fit:cover;border-radius:4px;margin-right:12px;border:1px solid #333}.typography-image-item-info{flex:1;min-width:0}.typography-image-item-name{font-size:12px;font-weight:500;color:#fff;margin-bottom:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.typography-image-item-details{font-size:10px;color:#888;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.typography-image-item-actions{display:flex;gap:4px;align-items:center}.typography-image-visibility-btn{background:none;border:none;color:#666;cursor:pointer;padding:4px;border-radius:3px;transition:all .2s ease;font-size:14px}.typography-image-visibility-btn:hover{background:#333;color:#b8a9ff}.typography-image-visibility-btn.visible{color:#10b981}.typography-image-visibility-btn.hidden{color:#ef4444}.typography-image-remove-btn{background:#ff4444;border:none;color:#fff;cursor:pointer;padding:4px 8px;border-radius:3px;transition:all .2s ease;font-size:12px;font-weight:700}.typography-image-remove-btn:hover{background:#cc3333}.typography-image-quick-controls{background:#0a0a0a;border:1px solid #333;border-radius:8px;margin-bottom:16px}.typography-image-quick-header{padding:12px 16px;border-bottom:1px solid #222;background:#111}.typography-image-quick-title{font-size:12px;font-weight:600;text-transform:uppercase;letter-spacing:.5px;color:#b8a9ff;margin:0}.typography-image-control-group{padding:16px;border-bottom:1px solid #222}.typography-image-control-group:last-child{border-bottom:none}.typography-image-control-label{font-size:11px;color:#ddd;margin-bottom:8px;font-weight:500;text-transform:uppercase;letter-spacing:.3px}.typography-image-position-grid{display:grid;grid-template-columns:1fr 1fr 1fr;grid-template-rows:1fr 1fr;gap:6px;max-width:120px;margin:0 auto}.typography-image-pos-btn{background:rgba(184,169,255,.1);border:1px solid rgba(184,169,255,.3);color:#b8a9ff;cursor:pointer;padding:8px;border-radius:4px;font-size:14px;transition:all .2s ease;display:flex;align-items:center;justify-content:center;min-height:32px}.typography-image-pos-btn:hover{background:rgba(184,169,255,.2);border-color:#b8a9ff;transform:scale(1.05)}.typography-image-pos-btn.center{font-size:12px;font-weight:700}.typography-image-pos-btn:nth-child(1){grid-column:2;grid-row:1}.typography-image-pos-btn:nth-child(2){grid-column:1;grid-row:2}.typography-image-pos-btn:nth-child(3){grid-column:2;grid-row:2}.typography-image-pos-btn:nth-child(4){grid-column:3;grid-row:2}.typography-image-pos-btn:nth-child(5){grid-column:2;grid-row:3}.typography-image-value-control{display:flex;align-items:center;gap:8px}.typography-image-value-btn{background:rgba(184,169,255,.1);border:1px solid rgba(184,169,255,.3);color:#b8a9ff;cursor:pointer;padding:8px 12px;border-radius:4px;font-size:16px;font-weight:700;transition:all .2s ease;min-width:40px;display:flex;align-items:center;justify-content:center}.typography-image-value-btn:hover{background:rgba(184,169,255,.2);border-color:#b8a9ff;transform:scale(1.05)}.typography-image-value-display{flex:1;text-align:center;font-size:14px;font-weight:600;color:#fff;background:#1a1a1a;padding:8px 12px;border-radius:4px;border:1px solid #333;min-width:60px}.typography-image-reset-btn{background:rgba(34,197,94,.1);border:1px solid rgba(34,197,94,.3);color:#22c55e;cursor:pointer;padding:8px 12px;border-radius:4px;font-size:11px;font-weight:600;transition:all .2s ease;text-transform:uppercase;letter-spacing:.3px}.typography-image-reset-btn:hover{background:rgba(34,197,94,.2);border-color:#22c55e}.typography-image-layer-btn{width:100%;background:rgba(184,169,255,.1);border:1px solid rgba(184,169,255,.3);color:#b8a9ff;cursor:pointer;padding:10px 16px;border-radius:6px;font-size:12px;font-weight:500;transition:all .2s ease;text-align:center}.typography-image-layer-btn:hover{background:rgba(184,169,255,.2);border-color:#b8a9ff}.typography-image-layer-btn.background{color:#fbbf24;background:rgba(251,191,36,.1);border-color:#fbbf244d}.typography-image-layer-btn.foreground{color:#06b6d4;background:rgba(6,182,212,.1);border-color:#06b6d44d}.typography-image-editor-section{padding:16px;border-top:1px solid #333}.typography-image-editor-btn{width:100%;background:linear-gradient(135deg,#667eea 0%,#764ba2 100%);border:none;color:#fff;cursor:pointer;padding:12px 16px;border-radius:6px;font-size:13px;font-weight:600;transition:all .3s ease;text-transform:uppercase;letter-spacing:.3px}.typography-image-editor-btn:hover{transform:translateY(-1px);box-shadow:0 4px 12px #667eea66}.typography-image-list::-webkit-scrollbar{width:6px}.typography-image-list::-webkit-scrollbar-track{background:rgba(255,255,255,.1);border-radius:3px}.typography-image-list::-webkit-scrollbar-thumb{background:rgba(184,169,255,.5);border-radius:3px}.typography-image-list::-webkit-scrollbar-thumb:hover{background:rgba(184,169,255,.7)}@media (max-width: 768px){.typography-image-upload-buttons{flex-direction:column}.typography-image-upload-btn{width:100%}.typography-image-item{padding:8px}.typography-image-thumbnail{width:32px;height:32px}.typography-image-position-grid{max-width:100px}.typography-image-pos-btn{padding:6px;font-size:12px;min-height:28px}}@keyframes typography-image-fade-in{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.typography-image-fade-in{animation:typography-image-fade-in .3s ease}.handwriting-studio{min-height:100vh;background:#1a1a1a;color:#fff;font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;padding:20px}.studio-header{display:flex;justify-content:space-between;align-items:center;background:#2d2d2d;padding:15px 25px;border-radius:8px;margin-bottom:20px;border:1px solid #444}.header-left{display:flex;align-items:center;gap:20px}.handwriting-back-btn{background:rgba(0,255,255,.1);border:1px solid #00ffff;padding:10px 20px;border-radius:8px;color:#0ff;text-decoration:none;font-size:.9rem;font-weight:400;cursor:pointer;transition:all .2s ease;display:flex;align-items:center;gap:5px;position:absolute;left:25px;top:50%;transform:translateY(-50%)}.handwriting-back-btn:hover{background:rgba(0,255,255,.2);border-color:#0ff;color:#0ff;transform:translateY(-50%) translateY(-1px)}.back-button{color:#00bfff;text-decoration:none;font-weight:500;padding:8px 16px;border:1px solid #00bfff;border-radius:4px;transition:all .3s ease}.back-button:hover{background:#00bfff;color:#000}.header-title h1{margin:0;font-size:1.5rem;background:linear-gradient(90deg,#00bfff,#9370db);-webkit-background-clip:text;background-clip:text;color:transparent}.header-title p{margin:0;color:#ccc;font-size:.9rem}.design-templates{background:#2d2d2d;padding:15px 25px;border-radius:8px;margin-bottom:20px;border:1px solid #444}.design-templates h3{margin:0 0 8px;color:#9370db;font-size:1rem}.design-templates p{margin:0 0 15px;color:#ccc;font-size:.9rem}.template-buttons{display:flex;gap:10px;flex-wrap:wrap}.template-btn{background:#444;color:#fff;border:1px solid #666;padding:8px 16px;border-radius:4px;cursor:pointer;font-size:.9rem;transition:all .3s ease}.template-btn:hover{background:#555;border-color:#00bfff}.workspace-controls{display:flex;gap:20px;background:#2d2d2d;padding:15px 25px;border-radius:8px;margin-bottom:20px;border:1px solid #444;flex-wrap:wrap}.workspace-section h3,.actions-section h3{margin:0 0 10px;color:#00bfff;font-size:1rem}.mode-buttons{display:flex;gap:5px}.mode-btn{background:#444;color:#fff;border:2px solid #666;padding:8px 16px;border-radius:4px;cursor:pointer;font-weight:600;transition:all .3s ease}.mode-btn.active{background:#0073b1;border-color:#00bfff;color:#fff}.mode-btn:hover:not(.active){border-color:#888}.status-section{flex:1;display:flex;align-items:center}.status-message{background:#1a4a2e;color:#4caf50;padding:10px 15px;border-radius:4px;font-weight:500;border:1px solid #2e7d32}.action-buttons{display:flex;justify-content:center;gap:10px}.action-btn{padding:10px 20px;border:none;border-radius:4px;font-weight:600;cursor:pointer;transition:all .3s ease}.generate-btn{background:#9370db;color:#fff}.generate-btn:hover{background:#7b5db3}.dbscan-btn{background:#ff8c00;color:#fff}.dbscan-btn:hover{background:#e6790f}.clear-btn{background:#ff4444;color:#fff}.clear-btn:hover{background:#cc3333}.action-btn:disabled{background:#666;color:#aaa;cursor:not-allowed}.error-message{background:#4a1a1a;color:#ff6b6b;padding:15px;border-radius:4px;margin-bottom:20px;border:1px solid #8b0000}.left-panel{background:#2d2d2d;border-radius:8px;padding:20px;border:1px solid #444;overflow-y:auto}.control-section h3{margin:0 0 15px;color:#9370db;font-size:1.1rem;border-bottom:1px solid #444;padding-bottom:8px}.text-input-section{margin-bottom:20px}.text-input-section label{display:block;margin-bottom:8px;color:#ccc;font-weight:500}.text-input{width:100%;background:#1a1a1a;border:1px solid #444;border-radius:4px;padding:10px;color:#fff;font-family:monospace;resize:vertical;box-sizing:border-box}.alignment-buttons{margin-bottom:20px}.alignment-buttons h4{margin:0 0 10px;color:#00bfff;font-size:.9rem}.align-btn{background:#00bfff;color:#000;border:none;padding:8px 16px;border-radius:4px;margin-right:10px;cursor:pointer;font-weight:600}.align-btn:hover{background:#0099cc}.slider-controls{margin-bottom:20px}.slider-group{margin-bottom:15px}.slider-group label{display:block;margin-bottom:5px;color:#ccc;font-size:.9rem;font-weight:500}.slider-group input[type=range]{width:100%;height:4px;background:#444;border-radius:2px;outline:none;-webkit-appearance:none;margin-bottom:5px}.slider-group input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:16px;height:16px;background:#9370db;border-radius:50%;cursor:pointer}.slider-group span{color:#00bfff;font-weight:600;font-size:.9rem}.drawing-controls{margin-bottom:20px}.drawing-controls h4{margin:0 0 10px;color:#00bfff;font-size:.9rem}.drawing-toggle{width:100%;padding:10px 16px;background:rgba(255,255,255,.1);border:2px solid rgba(255,255,255,.2);border-radius:8px;color:#fff;font-weight:600;cursor:pointer;transition:all .3s ease;margin-bottom:10px}.drawing-toggle.active{background:linear-gradient(90deg,#00ff7f,#00cc66);border-color:#00ff7f;color:#000}.drawing-info{font-size:.9rem;color:#ccc;text-align:center;margin-top:10px}.file-operations h4{margin:0 0 10px;color:#00bfff;font-size:.9rem}.file-input{width:100%;background:#1a1a1a;border:2px dashed #444;border-radius:4px;padding:10px;color:#fff;margin-bottom:10px;cursor:pointer;box-sizing:border-box}.file-btn{width:100%;padding:10px;border:none;border-radius:4px;margin-bottom:5px;cursor:pointer;font-weight:600}.save-btn{background:#4caf50;color:#fff}.export-btn{background:#ff8c00;color:#fff}.center-panel{background:#2d2d2d;border-radius:8px;padding:20px;border:1px solid #444;display:flex;flex-direction:column}.canvas-container{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;position:relative}.canvas-container h3{margin:0 0 15px;color:#00bfff;font-size:1.1rem}.visualization-canvas{border-radius:8px;max-width:100%;max-height:100%;background:#1a1a1a;border:2px solid #333;transition:all .3s ease}.canvas-info{margin-top:10px;color:#00ff7f;font-weight:600;animation:pulse 2s infinite}@keyframes pulse{0%,to{opacity:1}50%{opacity:.6}}.data-layers-status{display:flex;justify-content:center;gap:20px;margin-top:15px;padding:10px;background:#1a1a1a;border-radius:4px}.layer-indicator{display:flex;align-items:center;gap:8px;padding:5px 10px;border-radius:4px;background:#333;opacity:.5;transition:opacity .3s ease}.layer-indicator.active{opacity:1}.layer-dot{width:12px;height:12px;border-radius:50%}.layer-dot.loaded{background:#666666}.layer-dot.typography{background:#9370db}.layer-dot.drawing{background:#00ffff}.positioning-controls,.quality-controls{margin-bottom:20px}.positioning-controls h4,.quality-controls h4{margin:0 0 10px;color:#00bfff;font-size:.9rem}.dbscan-controls{background:#1a1a1a;padding:15px;border-radius:4px;border:1px solid #ff8c00}.dbscan-controls h4{margin:0 0 15px;color:#ff8c00;font-size:.9rem}.clustering-results{background:#0a2a1a;padding:10px;border-radius:4px;margin-top:10px;border:1px solid #4caf50}.clustering-results h5{margin:0 0 8px;color:#4caf50;font-size:.9rem}.clustering-results div{color:#ccc;font-size:.8rem;margin-bottom:3px}.workspace-stats{margin-top:20px}.workspace-stats h4{margin:0 0 10px;color:#00bfff;font-size:.9rem}.stat-item{display:flex;justify-content:space-between;align-items:center;font-size:.9rem;margin-bottom:8px}.stat-item strong{color:#ccc}.stat-item span{color:#00bfff;font-weight:600}.loading-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background:rgba(0,0,0,.8);display:flex;justify-content:center;align-items:center;z-index:1000}.loading-spinner{display:flex;flex-direction:column;align-items:center;gap:20px;color:#fff;font-size:1.1rem;font-weight:600}.spinner{width:50px;height:50px;border:4px solid rgba(255,255,255,.2);border-top:4px solid #00bfff;border-radius:50%;animation:spin 1s linear infinite}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@media (max-width: 1200px){.main-content{grid-template-columns:250px 1fr 250px}}@media (max-width: 900px){.main-content{grid-template-columns:1fr;gap:10px}.left-panel,.right-panel{max-height:300px}.workspace-controls{flex-direction:column;gap:15px}}.center-panel{flex:1;display:flex;flex-direction:column;padding:15px;overflow:hidden}.visualization-canvas{border-radius:8px;background:#1a1a1a;transition:all .3s ease;width:900px;height:810px}.visualization-canvas.drawing-enabled{border-color:#f4a;box-shadow:0 0 10px #ff44aa80}@media (max-width: 1200px){.visualization-canvas{width:100%;height:auto;max-width:900px;max-height:810px}.canvas-container{height:auto;min-height:450px}}.canvas-container{position:relative}.canvas-loading{position:absolute;top:10px;right:10px;background:rgba(0,0,0,.7);color:#00bfff;padding:5px 10px;border-radius:4px;font-size:12px;z-index:10}.auto-generate-toggle label{font-size:1.1rem;display:flex;align-items:center;gap:8px}.auto-generate-toggle input[type=checkbox]{width:20px;height:20px;transform:scale(1.2)}.alignment-controls{margin-top:20px}.alignment-controls label{display:block;color:#fff;font-size:14px;margin-bottom:10px;font-weight:500}.alignment-buttons{display:flex;gap:10px}.back-button{color:#fff;background:#0084ff;text-decoration:none;font-weight:600;padding:10px 20px;border:none;border-radius:6px;transition:all .3s ease;display:inline-flex;align-items:center;gap:8px}.back-button:hover{background:#0066cc;transform:translateY(-1px);box-shadow:0 4px 12px #0084ff4d}.pattern-grid-section{margin-bottom:20px}.pattern-grid-section h4{margin:0 0 15px;color:#9370db;font-size:1rem;font-weight:600}.pattern-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:10px;margin-bottom:20px}.pattern-card{background:#1a1a1a;border:2px solid #444;border-radius:8px;padding:10px;cursor:pointer;transition:all .3s ease;position:relative;overflow:hidden}.pattern-card:hover{border-color:#9370db;transform:translateY(-2px);box-shadow:0 4px 12px #9370db4d}.pattern-card.active{border-color:#00ff7f;background:rgba(0,255,127,.1)}.pattern-preview{width:100%;height:80px;background:#0a0a0a;border-radius:4px;margin-bottom:8px;position:relative;overflow:hidden}.pattern-preview.lissajous:before{content:"∞";position:absolute;top:50%;left:50%;transform:translate(-50%,-50%) rotate(45deg);font-size:48px;color:#9370db;opacity:.3}.pattern-preview.grid:before{content:"";position:absolute;top:10px;right:10px;bottom:10px;left:10px;border:3px dotted #9370db;opacity:.4}.pattern-preview.random:before{content:"•••••";position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);font-size:24px;color:#9370db;letter-spacing:8px;opacity:.4}.pattern-preview.spiral:before{content:"@";position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);font-size:48px;color:#9370db;opacity:.3;animation:spin 4s linear infinite}.pattern-preview.wave:before{content:"〜〜〜";position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);font-size:24px;color:#9370db;opacity:.4}.pattern-preview.constellation:before{content:"✦ ✦ ✦";position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);font-size:20px;color:#9370db;opacity:.4}.pattern-name{font-size:.85rem;font-weight:600;color:#fff;text-align:center;margin-bottom:4px}.pattern-description{font-size:.75rem;color:#888;text-align:center;line-height:1.3}.pattern-point-count{position:absolute;top:5px;right:5px;background:rgba(0,0,0,.8);color:#00ff7f;font-size:.7rem;padding:2px 6px;border-radius:3px;font-weight:600}.pattern-controls{margin-top:15px;padding-top:15px;border-top:1px solid #444}.pattern-intensity-control{margin-bottom:10px}.pattern-density-buttons{display:flex;gap:5px;margin-top:10px}.density-btn{flex:1;padding:6px;background:#333;border:1px solid #555;border-radius:4px;color:#fff;font-size:.8rem;cursor:pointer;transition:all .2s ease}.density-btn:hover{background:#444;border-color:#9370db}.density-btn.active{background:#9370db;border-color:#9370db;color:#fff}.pattern-info-box{background:rgba(147,112,219,.1);border:1px solid #9370db;border-radius:4px;padding:10px;margin-top:10px;font-size:.8rem;color:#ccc}.panel-header{margin-bottom:20px;padding-bottom:15px;border-bottom:1px solid #333}.panel-title{font-size:14px;font-weight:600;text-transform:uppercase;letter-spacing:.5px;color:#0ff;margin:0}.control-group{background:#1a1a1a;border:1px solid #333;border-radius:8px;margin-bottom:16px;overflow:hidden}.group-header{padding:12px 16px;background:#222;border-bottom:1px solid #333}.group-title{font-size:12px;font-weight:600;text-transform:uppercase;letter-spacing:.5px;color:#ccc}.group-content{padding:16px}.control-item{margin-bottom:16px}.control-item:last-child{margin-bottom:0}.control-label{margin-bottom:8px}.control-label span{font-size:11px;color:#999;text-transform:uppercase;letter-spacing:.5px}.arrow-control{display:flex;align-items:center;background:#0a0a0a;border:1px solid #333;border-radius:6px;overflow:hidden;height:40px}.arrow-btn{background:transparent;border:none;color:#666;width:40px;height:40px;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:all .2s;font-size:16px;padding:0}.arrow-btn:hover:not(:disabled){background:#1a1a1a;color:#0ff}.arrow-btn:disabled{opacity:.3;cursor:not-allowed}.value-display{flex:1;text-align:center;font-size:14px;font-weight:600;color:#fff;font-family:SF Mono,Monaco,monospace}.color-selector{margin-top:8px}.color-buttons{display:flex;gap:8px;flex-wrap:wrap}.color-btn{width:32px;height:32px;border:2px solid transparent;border-radius:6px;cursor:pointer;transition:all .2s}.color-btn:hover{transform:scale(1.1)}.color-btn.active{border-color:#0ff;box-shadow:0 0 8px #00ffff80}.quick-action-buttons{display:flex;flex-direction:column;gap:8px}.action-btn.secondary{background:#333;color:#ccc;width:100%;padding:10px;border:none;border-radius:6px;cursor:pointer;font-weight:600;font-size:12px;transition:all .2s}.action-btn.secondary:hover:not(:disabled){background:#444}.action-btn.primary{background:#00ffff;color:#000;width:100%;padding:10px;border:none;border-radius:6px;cursor:pointer;font-weight:600;font-size:12px;transition:all .2s}.action-btn.primary:hover:not(:disabled){background:#00cccc;transform:translateY(-1px);box-shadow:0 4px 12px #00ffff4d}.action-btn:disabled{opacity:.5;cursor:not-allowed}.drawing-active{color:#0f0;font-weight:600}.control-group .stat-item{display:flex;justify-content:space-between;align-items:center;padding:8px 0;border-bottom:1px solid #2a2a2a}.control-group .stat-item:last-child{border-bottom:none}.control-group .stat-item strong{font-size:12px;color:#999;text-transform:uppercase;letter-spacing:.5px}.control-group .stat-item span{font-size:14px;color:#0ff;font-weight:600}.workspace-section h3,.actions-section h3{margin:0 10px 0 0;color:#00bfff;font-size:1rem;line-height:1}.studio-header .back-button{position:absolute;left:25px}.studio-header{display:flex;justify-content:center;align-items:center;background:#2d2d2d;padding:15px 25px;border-radius:8px;margin-bottom:20px;border:1px solid #444;position:relative}.studio-header .back-button{position:absolute;left:25px;color:#fff;background:#0084ff;text-decoration:none;font-weight:600;padding:10px 20px;border:none;border-radius:6px;transition:all .3s ease;display:inline-flex;align-items:center;gap:8px}.studio-header .back-button:hover{background:#0066cc;transform:translateY(-1px);box-shadow:0 4px 12px #0084ff4d}.header-title{text-align:center}.header-title h1{margin:0;font-size:1.8rem;background:linear-gradient(90deg,#00bfff,#00ffff);-webkit-background-clip:text;background-clip:text;color:transparent;text-transform:uppercase;letter-spacing:2px}.header-title p{margin:5px 0 0;color:#ccc;font-size:.9rem;text-transform:uppercase;letter-spacing:1px}.workspace-controls{display:flex;gap:20px;background:#2d2d2d;padding:15px 25px;border-radius:8px;margin-bottom:20px;border:1px solid #444;align-items:center;min-height:70px}.status-section{flex:1;display:flex;align-items:center;justify-content:center;min-height:44px}.status-placeholder{height:44px;width:100%}.status-message{padding:10px 15px;border-radius:4px;font-weight:500;animation:fadeIn .3s ease-in}.actions-section{display:flex;align-items:center}.main-content{display:grid;grid-template-columns:280px 1fr 280px;gap:20px;height:calc(100vh - 300px);min-height:600px}.right-panel{background:#2d2d2d;border-radius:8px;padding:20px;border:1px solid #444;height:100%;overflow-y:auto;overflow-x:hidden}.right-panel .control-section{height:100%;display:flex;flex-direction:column}.right-panel .panel-header{flex-shrink:0}.right-panel .control-section>div:not(.panel-header){flex:1;overflow-y:auto;overflow-x:hidden}.canvas-info{margin-top:10px;color:#00ff7f;font-weight:600;height:20px;opacity:1;transition:opacity .3s ease}.canvas-info.hidden{opacity:0;visibility:hidden}.canvas-info.visible{opacity:1;visibility:visible;animation:pulse 2s infinite}.canvas-container{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;position:relative;gap:15px}.tips-content{font-size:13px;color:#ccc;line-height:1.6}.tips-content p{margin:0 0 8px;padding-left:4px}.tips-content p:last-child{margin-bottom:0}.actions-section{text-align:center;display:flex;flex-direction:column;align-items:center}.action-buttons{display:flex;justify-content:center;gap:10px;width:100%}.modal-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background:rgba(0,0,0,.8);display:flex;justify-content:center;align-items:center;z-index:1000}.animation-modal{background:#2d2d2d;border-radius:8px;padding:0;max-width:350px;width:90%;max-height:80vh;overflow-y:auto;border:1px solid #444}.modal-header{padding:20px 25px 15px;border-bottom:1px solid #444;position:relative}.modal-title{margin:0 0 8px;color:#0ff;font-size:1.2rem;font-weight:600}.animation-info{color:#888;font-size:14px;margin:0;font-style:italic}.close-btn{position:absolute;top:15px;right:20px;background:transparent;border:none;color:#888;font-size:24px;cursor:pointer;padding:0;width:30px;height:30px;display:flex;align-items:center;justify-content:center}.close-btn:hover{color:#fff}.modal-body{padding:20px 25px}.animation-payment-options h3{color:#fff;margin:0 0 20px}.payment-option{background:#1a1a1a;border:2px solid #444;border-radius:8px;padding:20px;margin-bottom:15px;cursor:pointer;transition:all .3s ease}.payment-option:hover{border-color:#0ff;transform:translateY(-2px)}.payment-option h4{color:#0ff;margin:0 0 8px;font-size:1.1rem}.payment-option .price{color:#4caf50;font-size:1.5rem;font-weight:700;margin:0 0 8px}.payment-option .description{color:#ccc;margin:0;font-size:.9rem}.job-status-section h3{color:#fff;margin:0 0 15px}.job-status-section p{color:#ccc;margin:0 0 10px}.download-button{display:inline-block;background:#4caf50;color:#fff;padding:12px 24px;border-radius:6px;text-decoration:none;font-weight:600;margin-top:15px;transition:all .3s ease}.download-button:hover{background:#45a049;transform:translateY(-1px)}.actions-section{text-align:center}.actions-section h3{margin:0 0 10px;color:#00bfff;font-size:1rem}.animation-info{color:#888;font-size:14px;margin:5px 0 15px;font-style:italic}.workspace-controls{display:flex;justify-content:center;align-items:center;background:#2d2d2d;padding:15px 25px;border-radius:8px;margin-bottom:20px;border:1px solid #444;min-height:70px;gap:20px}.actions-section{display:flex;justify-content:center;align-items:center}.actions-section h3{display:none}.action-buttons{display:flex;justify-content:center;gap:10px;flex-wrap:wrap}.status-section{position:absolute;left:25px;display:flex;align-items:center;min-height:44px}.status-placeholder{height:44px;width:200px}.status-message{padding:10px 15px;border-radius:4px;font-weight:500;animation:fadeIn .3s ease-in;white-space:nowrap}.status-message.error{background:#4a1a1a;color:#ff6b6b;border:1px solid #8b0000}@keyframes fadeIn{0%{opacity:0;transform:scale(.95)}to{opacity:1;transform:scale(1)}}.visualization-canvas{touch-action:none!important;user-select:none!important;-webkit-user-select:none!important;-webkit-touch-callout:none!important;-webkit-tap-highlight-color:transparent!important}.canvas-container{touch-action:manipulation!important}@media screen and (max-width: 768px) and (orientation: portrait){.handwriting-studio{height:auto;overflow-y:auto;padding:10px}.studio-header{margin-bottom:10px;padding:10px 15px}.workspace-controls{margin-bottom:10px;padding:10px 15px;min-height:50px}.main-content{grid-template-columns:1fr;gap:15px;height:auto;min-height:auto}.center-panel{order:1;padding:10px}.canvas-container{width:100%;height:auto}.canvas-container>div{width:100%!important;max-width:600px!important;height:auto!important;margin:0 auto}.canvas-container canvas,.canvas-container video{width:100%!important;height:auto!important;max-width:600px!important;max-height:400px!important}.left-panel,.right-panel{order:2;max-height:none;overflow-y:visible;margin-bottom:15px}.control-group{margin-bottom:10px}}@media screen and (min-width: 769px) and (max-width: 1024px) and (orientation: landscape){.handwriting-studio{padding:8px;height:100vh;overflow:hidden;box-sizing:border-box}.studio-header,.workspace-controls{margin-bottom:8px;padding:8px 15px;height:50px;box-sizing:border-box}.main-content{grid-template-columns:160px 1fr 160px;gap:8px;height:calc(100vh - 130px);min-height:auto;overflow:hidden;box-sizing:border-box}.center-panel{padding:5px;display:flex;flex-direction:column;justify-content:center;overflow:hidden;height:100%;box-sizing:border-box}.left-panel,.right-panel{height:100%;max-height:none;overflow-y:auto;padding:10px;box-sizing:border-box}.canvas-container{width:100%;height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;box-sizing:border-box;overflow:hidden}.canvas-container h3{margin:0 0 5px;font-size:.85rem;flex-shrink:0}.canvas-container>div{width:480px!important;height:432px!important;max-width:480px!important;max-height:432px!important;position:relative;margin:0 auto;flex-shrink:1;overflow:hidden}.canvas-container canvas,.canvas-container video{width:480px!important;height:432px!important;max-width:480px!important;max-height:432px!important;object-fit:contain;border-radius:6px}.canvas-info{margin-top:5px;font-size:11px;flex-shrink:0}.control-group{margin-bottom:8px}.group-content{padding:8px}.control-item{margin-bottom:8px}}@media screen and (min-width: 1025px) and (max-width: 1366px) and (orientation: landscape){.canvas-container>div{width:600px!important;height:540px!important;max-width:600px!important;max-height:540px!important}.canvas-container canvas,.canvas-container video{width:600px!important;height:540px!important;max-width:600px!important;max-height:540px!important}.main-content{grid-template-columns:200px 1fr 200px;gap:15px}.left-panel,.right-panel{padding:15px}}@media screen and (max-width: 600px){.handwriting-studio{padding:5px}.main-content{grid-template-columns:1fr;gap:10px;padding:0}.canvas-container>div{width:calc(100vw - 30px)!important;max-width:400px!important;height:auto!important}.canvas-container canvas,.canvas-container video{width:100%!important;height:auto!important;max-width:400px!important;max-height:300px!important}}.studio-selector-page{min-height:100vh;background:#1a1a1a;color:#fff;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;position:relative;overflow-x:hidden}.studio-selector-page .ss-bg-animation{position:fixed;top:0;left:0;width:100%;height:100%;z-index:0;background:#1a1a1a}.studio-selector-page .ss-bg-animation:before{content:"";position:absolute;top:0;left:0;width:100%;height:100%;background:radial-gradient(circle at 20% 30%,rgba(147,112,219,.1) 0%,transparent 50%),radial-gradient(circle at 80% 70%,rgba(0,255,255,.08) 0%,transparent 50%),radial-gradient(circle at 60% 20%,rgba(147,112,219,.06) 0%,transparent 50%);animation:ssFloat 20s ease-in-out infinite}@keyframes ssFloat{0%,to{transform:translateY(0) rotate(0)}50%{transform:translateY(-20px) rotate(1deg)}}.studio-selector-page .ss-header{background:rgba(36,36,36,.95);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-bottom:1px solid #333333;position:sticky;top:0;z-index:10}.studio-selector-page .ss-header-content{max-width:1200px;margin:0 auto;padding:20px;display:flex;justify-content:space-between;align-items:center}.studio-selector-page .ss-back-button{background:rgba(0,255,255,.1);border:1px solid #00ffff;padding:10px 20px;border-radius:8px;color:#0ff;font-size:.9rem;font-weight:400;cursor:pointer;transition:all .2s ease;display:flex;align-items:center;gap:5px}.studio-selector-page .ss-back-button:hover{transform:translateY(-1px);box-shadow:0 4px 8px #00ffff4d}.studio-selector-page .ss-header-center{text-align:center;flex:1}.studio-selector-page .ss-header-center h1{font-size:2rem;margin:0 0 5px;background:linear-gradient(135deg,#9370db 0%,#00ffff 100%);-webkit-background-clip:text;background-clip:text;color:transparent;font-weight:700}.studio-selector-page .ss-header-center p{margin:0;color:#ccc;font-size:.95rem}.studio-selector-page .ss-header-spacer{width:100px}.studio-selector-page .ss-content{position:relative;z-index:1;max-width:1200px;margin:0 auto;padding:60px 20px}.studio-selector-page .ss-intro{text-align:center;margin-bottom:60px}.studio-selector-page .ss-intro h2{font-size:2.5rem;margin-bottom:20px;font-weight:700;background:linear-gradient(135deg,#9370db 0%,#00ffff 100%);-webkit-background-clip:text;background-clip:text;color:transparent}.studio-selector-page .ss-intro p{font-size:1.2rem;color:#ccc;max-width:600px;margin:0 auto}.studio-selector-page .ss-studios-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(400px,1fr));gap:40px;margin-bottom:60px}.studio-selector-page .ss-studio-link{text-decoration:none;display:block}.studio-selector-page .ss-studio-card{background:#242424;border:2px solid transparent;border-radius:20px;padding:50px 40px;position:relative;overflow:hidden;transition:all .4s ease;height:100%;min-height:450px}.studio-selector-page .ss-card-glow{position:absolute;top:-2px;left:-2px;right:-2px;bottom:-2px;border-radius:20px;opacity:1;transition:opacity .4s ease;z-index:-1}.studio-selector-page .ss-typography-card{background:linear-gradient(135deg,#9370db,#7b5cc0);box-shadow:0 20px 40px #9370db4d}.studio-selector-page .ss-typography-card .ss-card-glow{background:linear-gradient(135deg,#9370db,#7b5cc0)}.studio-selector-page .ss-typography-card h3,.studio-selector-page .ss-typography-card .ss-studio-desc{color:#fff}.studio-selector-page .ss-typography-card .ss-feature-item{color:#555}.studio-selector-page .ss-handwriting-card{background:linear-gradient(135deg,#f59e0b,#d97706);box-shadow:0 20px 40px #f59e0b4d}.studio-selector-page .ss-handwriting-card .ss-card-glow{background:linear-gradient(135deg,#f59e0b,#d97706)}.studio-selector-page .ss-handwriting-card h3,.studio-selector-page .ss-handwriting-card .ss-studio-desc{color:#fff}.studio-selector-page .ss-handwriting-card .ss-feature-item{color:#555}.studio-selector-page .ss-studio-card:hover{transform:translateY(-8px);border-color:transparent}.studio-selector-page .ss-typography-card:hover{box-shadow:0 25px 50px #9370db66}.studio-selector-page .ss-handwriting-card:hover{box-shadow:0 25px 50px #f59e0b66}.studio-selector-page .ss-card-content{position:relative;z-index:1}.studio-selector-page .ss-studio-icon{font-size:4rem;margin-bottom:25px;display:block}.studio-selector-page .ss-studio-card h3{font-size:2rem;margin-bottom:20px;font-weight:700;color:#fff;position:relative;z-index:2}.studio-selector-page .ss-studio-desc{font-size:1.2rem;font-weight:500;color:#ccc;line-height:1.6;margin-bottom:35px;opacity:1}.studio-selector-page .ss-features{margin-bottom:40px}.studio-selector-page .ss-feature-item{display:flex;align-items:center;gap:12px;margin-bottom:15px;color:#555;font-size:.95rem;font-weight:400;opacity:1}.studio-selector-page .ss-feature-icon{color:#4caf50;font-weight:700;font-size:1.1rem;opacity:1}.studio-selector-page .ss-card-action{display:flex;align-items:center;justify-content:space-between;padding-top:20px;border-top:1px solid #333333;color:#fff;font-weight:600;font-size:1.1rem}.studio-selector-page .ss-arrow{font-size:1.5rem;transition:transform .3s ease}.studio-selector-page .ss-studio-card:hover .ss-arrow{transform:translate(5px)}.studio-selector-page .ss-info-section{margin-bottom:40px}.studio-selector-page .ss-info-card{background:#242424;border:1px solid #333333;border-radius:12px;padding:30px;text-align:center;max-width:800px;margin:0 auto}.studio-selector-page .ss-info-card h4{font-size:1.3rem;margin-bottom:15px;color:#fff}.studio-selector-page .ss-info-card p{color:#ccc;line-height:1.6;font-size:1.05rem}.studio-selector-page .ss-bottom-cta{display:none}.studio-selector-page .ss-footer{margin-top:80px;padding:40px 20px;border-top:1px solid #333333}.studio-selector-page .ss-footer-content{max-width:1200px;margin:0 auto;text-align:center}.studio-selector-page .ss-footer-links{display:flex;justify-content:center;gap:30px;margin-bottom:20px;flex-wrap:wrap}.studio-selector-page .ss-footer-links button{background:rgba(255,255,255,.05);border:1px solid #444444;padding:10px 20px;border-radius:8px;color:#888;font-size:.9rem;cursor:pointer;transition:all .2s ease;text-decoration:none}.studio-selector-page .ss-footer-links button:hover{background:rgba(0,255,255,.1);border-color:#0ff;color:#0ff;transform:translateY(-1px)}.studio-selector-page .ss-footer-copyright{color:#666;font-size:.85rem}@media (max-width: 900px){.studio-selector-page .ss-studios-grid{grid-template-columns:1fr;gap:30px}.studio-selector-page .ss-studio-card{min-height:400px}}@media (max-width: 768px){.studio-selector-page .ss-header-content{flex-direction:column;gap:15px}.studio-selector-page .ss-header-spacer{display:none}.studio-selector-page .ss-intro h2{font-size:2rem}.studio-selector-page .ss-intro p{font-size:1.1rem}.studio-selector-page .ss-studio-card{padding:35px 25px}.studio-selector-page .ss-studio-card h3{font-size:1.6rem}.studio-selector-page .ss-studio-desc{font-size:1.05rem}}:root{--primary: #9370db;--primary-dark: #7b5cc0;--secondary: #00ffff;--secondary-dark: #00cccc;--text-primary: #ffffff;--text-secondary: #cccccc;--text-muted: #999999;--bg-primary: #1a1a1a;--bg-secondary: #242424;--bg-tertiary: #2d2d2d;--border: #333333;--success: #4caf50;--error: #ff6b6b;--warning: #ffaa44;--gradient-main: linear-gradient(135deg, #9370db 0%, #00ffff 100%);--gradient-secondary: linear-gradient(135deg, #1a1a1a 0%, #2d2d2d 100%)}.order-status-page{min-height:100vh;background-color:var(--bg-primary);color:var(--text-primary);font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;position:relative}.order-status-page:before{content:"";position:fixed;top:0;left:0;width:100%;height:100%;z-index:-1;background:radial-gradient(circle at 20% 30%,rgba(147,112,219,.1) 0%,transparent 50%),radial-gradient(circle at 80% 70%,rgba(0,255,255,.08) 0%,transparent 50%),radial-gradient(circle at 60% 20%,rgba(147,112,219,.06) 0%,transparent 50%);animation:float 20s ease-in-out infinite}@keyframes float{0%,to{transform:translateY(0) rotate(0)}50%{transform:translateY(-20px) rotate(1deg)}}.order-status-container{max-width:900px;margin:0 auto;padding:60px 20px;position:relative;z-index:1}.loading-state,.error-state{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:60vh;text-align:center}.spinner{width:60px;height:60px;border:4px solid rgba(147,112,219,.2);border-radius:50%;border-top-color:var(--primary);animation:spin 1s ease-in-out infinite;margin-bottom:25px}@keyframes spin{to{transform:rotate(360deg)}}.loading-state p,.error-state p{font-size:1.1rem;color:var(--text-secondary)}.error-state h2{font-size:2rem;color:var(--error);margin-bottom:20px}.error-actions{display:flex;gap:20px;margin-top:30px}.button{background:var(--gradient-main);color:var(--bg-primary);padding:12px 24px;border-radius:8px;text-decoration:none;font-weight:600;transition:all .3s ease;display:inline-block;border:none;cursor:pointer}.button:hover{transform:translateY(-2px);box-shadow:0 10px 25px #9370db4d}.button.secondary{background:transparent;color:var(--secondary);border:2px solid var(--secondary)}.button.secondary:hover{background:var(--secondary);color:var(--bg-primary)}.order-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:40px;flex-wrap:wrap;gap:20px}.order-header h1{font-size:2.2rem;margin:0;background:var(--gradient-main);-webkit-background-clip:text;background-clip:text;color:transparent;font-weight:700}.status-badge{padding:10px 20px;border-radius:25px;font-size:.9rem;font-weight:600;text-transform:uppercase;letter-spacing:1px}.status-completed{background-color:#4f43;color:var(--success);border:1px solid var(--success)}.status-processing{background-color:#0ff3;color:var(--secondary);border:1px solid var(--secondary)}.status-queued{background-color:#9370db33;color:var(--primary);border:1px solid var(--primary)}.status-failed{background-color:#ff6b6b33;color:var(--error);border:1px solid var(--error)}.order-details-card{background-color:var(--bg-secondary);border-radius:16px;border:1px solid var(--border);padding:40px;box-shadow:0 4px 6px #0000004d;position:relative;overflow:hidden}.order-details-card:before{content:"";position:absolute;top:0;left:0;right:0;height:4px;background:var(--gradient-main)}.order-info-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:25px;margin-bottom:30px}.info-item{display:flex;flex-direction:column;gap:8px}.info-item.full-width{grid-column:1 / -1}.label{font-size:.9rem;color:var(--text-muted);text-transform:uppercase;letter-spacing:.5px;font-weight:600}.value{color:var(--text-primary);font-size:1.05rem}.download-section{margin-top:40px;padding-top:40px;border-top:1px solid var(--border);text-align:center}.download-section h3{font-size:1.6rem;margin-bottom:15px;color:var(--text-primary);font-weight:600}.download-section p{color:var(--text-secondary);font-size:1.1rem;margin-bottom:30px}.download-button{display:inline-block;background:linear-gradient(135deg,#10b981,#34d399);color:var(--bg-primary);font-weight:600;padding:16px 36px;border-radius:12px;text-decoration:none;margin:20px 0;transition:all .3s ease;font-size:1.2rem}.download-button:hover{transform:translateY(-3px);box-shadow:0 15px 30px #10b9814d}.expiry-notice{margin-top:25px;padding:16px 24px;background-color:var(--bg-tertiary);border-radius:10px;border:1px solid var(--border);display:inline-block}.expiry-notice strong{color:var(--secondary)}.bookmark-reminder{margin-top:20px;padding:20px;background-color:#9370db1a;border-radius:10px;border:1px solid var(--primary);color:var(--text-secondary)}.bookmark-reminder strong{color:var(--primary)}.processing-section{margin-top:40px;padding:40px;background-color:var(--bg-tertiary);border-radius:12px;text-align:center;border:1px solid var(--border)}.processing-section h3{font-size:1.5rem;margin-bottom:15px;color:var(--secondary)}.processing-section p{color:var(--text-secondary);font-size:1.1rem;margin-bottom:30px}.processing-indicator{display:flex;flex-direction:column;align-items:center;gap:20px}.status-message{color:var(--text-primary);font-size:1rem;font-style:italic}.auto-refresh-notice{margin-top:25px;padding:15px;background-color:#00ffff1a;border-radius:8px;color:var(--secondary);font-size:.9rem}.error-section{margin-top:40px;padding:40px;background-color:#ff6b6b1a;border-radius:12px;text-align:center;border:1px solid var(--error)}.error-section h3{font-size:1.5rem;margin-bottom:15px;color:var(--error)}.error-section p{color:var(--text-secondary);font-size:1.1rem;margin-bottom:20px}.error-message{padding:20px;background-color:var(--bg-tertiary);border-radius:8px;color:var(--error);margin-bottom:25px;font-family:monospace}.support-info{margin-top:30px}.support-info p{margin-bottom:10px;color:var(--text-secondary)}.support-link{color:var(--secondary);text-decoration:none;font-weight:600;font-size:1.1rem;transition:color .2s ease}.support-link:hover{color:var(--secondary-dark);text-decoration:underline}.order-actions{display:flex;gap:20px;justify-content:center;margin-top:50px}.bookmark-info{margin-top:60px;padding:40px;background-color:var(--bg-secondary);border-radius:16px;text-align:center;border:1px solid var(--border)}.bookmark-info h3{font-size:1.4rem;margin-bottom:15px;color:var(--text-primary)}.bookmark-info p{color:var(--text-secondary);margin-bottom:20px}.order-link{padding:16px 24px;background-color:var(--bg-tertiary);border-radius:8px;font-family:monospace;color:var(--secondary);word-break:break-all;border:1px solid var(--border);font-size:.9rem}@media (max-width: 768px){.order-status-container{padding:40px 20px}.order-header{flex-direction:column;text-align:center}.order-header h1{font-size:1.8rem}.order-details-card{padding:30px 20px}.order-actions{flex-direction:column;width:100%}.button{width:100%;text-align:center}.error-actions{flex-direction:column;width:100%}}
