:root{--primary:#8F37FF;--primary-hover:#7D2CE6;--background:#0F051D;--card-bg:rgba(255,255,255,0.05);--card-border:rgba(255,255,255,0.1);--text-light:#FFFFFF;--text-muted:#B8A1E8;--error:#FF6B6B;--success:#4CAF50;--radius-lg:16px;--radius-md:12px;--radius-sm:8px;--shadow:0 10px 30px rgba(0,0,0,0.2);--transition:all 0.3s cubic-bezier(0.4,0,0.2,1);}
*{box-sizing:border-box;margin:0;padding:0;}
html{background-color:var(--background);font-family:'Inter',-apple-system,BlinkMacSystemFont,sans-serif;scroll-behavior:smooth;}
body{margin:0;padding:0;min-height:100vh;color:var(--text-light);background:linear-gradient(180deg,#1E0B36 0%,#0F051D 100%);line-height:1.6;}
main{max-width:1200px;margin:0 auto;padding:40px 20px;}
.page-title{text-align:center;margin-bottom:40px;font-size:42px;font-weight:700;background:linear-gradient(90deg,#8F37FF,#D53F8C);-webkit-background-clip:text;background-clip:text;color:transparent;}
.page-subtitle{text-align:center;color:var(--text-muted);max-width:700px;margin:0 auto 40px;font-size:18px;}
.try-it{width:100%;max-width:1100px;margin:0 auto;}
.model-card{border-radius:var(--radius-lg);background:var(--card-bg);border:1px solid var(--card-border);box-shadow:var(--shadow);transition:var(--transition);overflow:hidden;}
.model-card:hover{box-shadow:0 15px 35px rgba(0,0,0,0.3);}
.model-card-container{display:flex;flex-direction:row;width:100%;padding:24px;gap:24px;}
.model-card-col{display:flex;flex-direction:column;width:100%;}
.image-input{width:100%;max-width:400px;}
.model-input-col{display:flex;flex-direction:column;width:100%;border-radius:var(--radius-md);}
.show-for-file-upload-mode{width:100%;margin-bottom:20px;}
.model-input-file-picker{display:none;}
.upload-area{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:40px;border-radius:var(--radius-md);border:2px dashed var(--card-border);background:rgba(20,16,39,0.5);transition:var(--transition);cursor:pointer;text-align:center;}
.upload-area:hover{border-color:var(--primary);background:rgba(45,40,60,0.3);}
.upload-icon{width:60px;height:60px;margin-bottom:20px;fill:var(--primary);}
.drag-and-drop{color:var(--text-light);font-size:18px;font-weight:500;margin-bottom:8px;}
.subtext-caption{color:var(--text-muted);font-size:14px;margin-bottom:16px;}
.hyperlink{color:var(--text-muted);text-decoration:none;transition:var(--transition);}
.hyperlink:hover{color:var(--primary);text-decoration:underline;}
.copy-paste{color:var(--text-muted);font-size:14px;margin-top:16px;}
#paste-area{background:rgba(74,66,97,0.7);border:none;color:white;padding:6px 12px;border-radius:var(--radius-sm);cursor:pointer;transition:var(--transition);font-size:14px;}
#paste-area:hover{background:var(--primary);}
.button{display:inline-flex;align-items:center;justify-content:center;padding:12px 24px;font-size:16px;font-weight:600;border-radius:100px;cursor:pointer;transition:var(--transition);border:none;white-space:nowrap;}
#modelSubmitButton{width:100%;background:var(--primary);color:white;padding:22px;font-size:18px;font-weight:600;cursor:pointer;border:none;border-radius:8px;box-shadow:0 4px 6px rgba(0,0,0,0.1);transition:all 0.3s ease;text-transform:uppercase;letter-spacing:0.5px;position:relative;overflow:hidden;}
#modelSubmitButton:hover{background:var(--primary-hover);transform:translateY(-3px);box-shadow:0 6px 12px rgba(0,0,0,0.15);}
#modelSubmitButton:active{transform:translateY(1px);box-shadow:0 2px 4px rgba(0,0,0,0.1);}
#modelSubmitButton:disabled{opacity:0.6;cursor:not-allowed;transform:none;box-shadow:none;background:var(--primary);}
#modelSubmitButton::after{content:'';position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,0.2),transparent);transition:0.5s;}
#modelSubmitButton:hover::after{left:100%;}
.image-output{display:flex;flex-direction:column;gap:16px;width:100%;}
#progressContainer{width:100%;height:8px;background:rgba(255,255,255,0.1);border-radius:4px;overflow:hidden;}
#deepaiProgressBar{height:100%;background:linear-gradient(90deg,var(--primary),#D53F8C);width:0%;transition:width 0.5s ease;}
.try-it-result-area{width:100%;height:500px;border-radius:var(--radius-md);background:rgba(17,13,35,0.7);position:relative;overflow:hidden;}
.placeholder-image{width:100%;height:100%;object-fit:contain;transition:all 0.3s ease;}
.placeholder-image.loading{animation:pulseAnimation 2s infinite ease-in-out;filter:brightness(0.7);}
@keyframes pulseAnimation{0%{transform:scale(1);opacity:0.8;}50%{transform:scale(1.02);opacity:1;}100%{transform:scale(1);opacity:0.8;}}
.loading-overlay{position:absolute;top:0;left:0;right:0;bottom:0;display:flex;align-items:center;justify-content:center;background:rgba(15,5,29,0.7);z-index:10;border-radius:var(--radius-md);}
.loading-spinner{width:50px;height:50px;border:4px solid rgba(143,55,255,0.3);border-radius:50%;border-top-color:var(--primary);animation:spin 1s ease-in-out infinite;}
@keyframes spin{to{transform:rotate(360deg);}}
#download-button {display: none;background: #10b981;border: none;border-radius: 5px;margin:10px 10px 10px 0;padding: 5px 15px;color: white;font-size: 18px;cursor: pointer;transition: all 0.3s cubic-bezier(0.25, 0.8, 0.25, 1);gap: 10px;box-shadow: 0 4px 12px rgba(99, 102, 241, 0.4);position: relative;overflow: hidden;letter-spacing: 0.5px;}
#download-button[imagewasGenerated="True"]{display:inline-flex;animation:fadeIn 0.4s ease-out;}
#download-button:hover{background:var(--primary-hover);transform:translateY(-3px);}
#download-button:active{transform:translateY(1px);box-shadow:0 2px 8px rgba(99,102,241,0.4);}
#download-button::after{content:'';position:absolute;top:0;left:0;right:0;bottom:0;border-radius:5px;box-shadow:0 0 8px rgba(99,102,241,0.6);opacity:0;transition:opacity 0.3s;}
#download-button:hover::after{opacity:1;}
@keyframes fadeIn{from{opacity:0;transform:translateY(10px);}to{opacity:1;transform:translateY(0);}}
.download-icon{width:20px;height:20px;}
#errorpopup{position:fixed;bottom:30px;left:50%;transform:translateX(-50%);background:rgba(33,17,39,0.95);border:1px solid var(--error);border-radius:100px;padding:12px 24px;display:none;align-items:center;gap:12px;z-index:100;box-shadow:0 5px 20px rgba(0,0,0,0.3);backdrop-filter:blur(10px);}
#errorpopup.show{display:flex;animation:fadeInUp 0.5s,fadeOutDown 0.5s 2.5s forwards;}
.errorIcon{width:20px;height:20px;fill:var(--error);}
@keyframes fadeInUp{from{opacity:0;transform:translateX(-50%) translateY(20px);}to{opacity:1;transform:translateX(-50%) translateY(0);}}
@keyframes fadeOutDown{from{opacity:1;transform:translateX(-50%) translateY(0);}to{opacity:0;transform:translateX(-50%) translateY(20px);}}
footer{padding:40px 0;border-top:1px solid rgba(255,255,255,0.05);margin-top:60px;}
.footer-container{max-width:1200px;margin:0 auto;padding:0 20px;display:flex;flex-direction:column;align-items:center;gap:24px;}
.footer-links{display:flex;gap:10px;}
.footer-link{color:var(--text-muted);text-decoration:none;transition:var(--transition);}
.footer-link:hover{color:var(--text-light);}
.copyright{color:var(--text-muted);font-size:14px;}
.examples-section{margin:80px 0;text-align:center;}
.section-title{font-size:32px;margin-bottom:30px;background:linear-gradient(90deg,#8F37FF,#D53F8C);-webkit-background-clip:text;background-clip:text;color:transparent;}
.examples-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:20px;margin-top:30px;}
.example-card{border-radius:var(--radius-md);overflow:hidden;background:var(--card-bg);border:1px solid var(--card-border);transition:var(--transition);}
.example-card:hover{transform:translateY(-5px);box-shadow:0 15px 35px rgba(0,0,0,0.3);}
.example-image{width:100%;height:300px;object-fit:cover;}
.example-caption{padding:15px;text-align:center;}
.example-title{font-weight:600;margin-bottom:5px;}
.example-description{color:var(--text-muted);font-size:14px;}
.seo-section{margin:60px 0;padding:30px;background:rgba(255,255,255,0.03);border-radius:var(--radius-lg);}
.seo-title{font-size:24px;margin-bottom:20px;color:var(--text-light);}
.seo-text{color:var(--text-muted);line-height:1.8;margin-bottom:20px;}
.seo-list{color:var(--text-muted);margin-left:20px;margin-bottom:20px;}
.seo-list li{margin-bottom:10px;}
@media (max-width:1024px){.model-card-container{flex-direction:column;}.image-input{max-width:100%;}.try-it-result-area{height:400px;}.examples-grid{grid-template-columns:repeat(auto-fill,minmax(250px,1fr));}}
@media (max-width:768px){.page-title{font-size:32px;}.page-subtitle{font-size:16px;}.model-card-container{padding:16px;}.upload-area{padding:30px 20px;}.section-title{font-size:28px;}}
@media (max-width:480px){.page-title{font-size:28px;}.footer-links{flex-direction:column;}.try-it-result-area{height:300px;}#modelSubmitButton{padding:14px;font-size:16px;}.upload-icon{width:48px;height:48px;}.drag-and-drop{font-size:16px;}.examples-grid{grid-template-columns:1fr;}.example-image{height:250px;}.seo-section{padding:20px;}}
.comparison-gallery{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:2rem;max-width:1400px;margin:0 auto;}
.comparison-card{position:relative;border-radius:12px;overflow:hidden;box-shadow:0 10px 30px rgba(0,0,0,0.08);transition:all 0.4s cubic-bezier(0.175,0.885,0.32,1.1);}
.comparison-card:hover{transform:translateY(-5px);box-shadow:0 15px 40px rgba(0,0,0,0.12);}
.image-wrapper{position:relative;width:100%;height:300px;overflow:hidden;--slider-pos:50%;}
.image{position:absolute;top:0;left:0;width:100%;height:100%;background-size:cover;background-position:center;background-repeat:no-repeat;}
.image.before{z-index:1;}
.image.after{z-index:2;clip-path:inset(0 0 0 50%);filter:saturate(1.1);}
.slider-handle{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:48px;height:48px;border-radius:50%;background:white;z-index:3;cursor:ew-resize;box-shadow:0 4px 20px rgba(0,0,0,0.2);display:flex;align-items:center;justify-content:center;transition:all 0.3s ease;}
.slider-handle:hover{transform:translate(-50%,-50%) scale(1.1);box-shadow:0 6px 25px rgba(0,0,0,0.25);}
.slider-icon{width:24px;height:24px;fill:#555;}
.caption-container{display:flex;justify-content:space-between;padding:1rem;background:linear-gradient(to top,rgba(0,0,0,0.7) 0%,transparent 100%);position:absolute;bottom:0;width:100%;z-index:4;}
.caption{padding:0.5rem 1.2rem;border-radius:20px;font-weight:600;font-size:0.9rem;color:white;text-shadow:0 1px 3px rgba(0,0,0,0.3);backdrop-filter:blur(5px);transition:all 0.3s ease;}
.before-caption{background:rgba(100,100,100,0.6);border:1px solid rgba(255,255,255,0.2);}
.after-caption{background:rgba(40,120,200,0.6);border:1px solid rgba(255,255,255,0.2);}
.caption:hover{transform:translateY(-2px);box-shadow:0 4px 8px rgba(0,0,0,0.15);}
.image-wrapper::after{content:'';position:absolute;top:0;bottom:0;left:var(--slider-pos);width:2px;background:white;z-index:3;pointer-events:none;box-shadow:0 0 10px rgba(0,0,0,0.5);transform:translateX(-50%);transition:left 0.2s ease-out;}
.rcy{margin:20px auto 0;width:95%;height:auto;max-height:250px;}
.buttons-container{display:block;}
.button-disable-watermark{display:inline;max-width:450px;margin:10px 10px 10px 0;padding:0;border:none;border-radius:5px;color:#fff;font-size:18px;letter-spacing:.5px;cursor:pointer;box-shadow:0 4px 12px rgba(143,55,255,.4);transition:all .3s cubic-bezier(.4,0,.2,1);position:relative;overflow:hidden}.button-inner-wrapper{display:inline-flex;align-items:stretch;border-radius:5px;overflow:hidden}.button-text-part{padding:5px 10px;background:linear-gradient(135deg,#8F37FF,#7D2CE6);display:flex;align-items:center;justify-content:center;transition:all .3s cubic-bezier(.4,0,.2,1);flex:1;min-width:0}.button-price-part{padding:5px 10px;background:linear-gradient(135deg,#FFD700,#FFA500);font-weight:700;display:flex;align-items:center;justify-content:center;transition:all .3s cubic-bezier(.4,0,.2,1);position:relative;white-space:nowrap}.button-price-part::before{content:'';position:absolute;left:0;top:50%;transform:translateY(-50%);height:60%;width:1px;background:linear-gradient(to bottom,rgba(255,255,255,.2),rgba(255,255,255,.4),rgba(255,255,255,.2))}.button-disable-watermark:hover{transform:translateY(-2px);box-shadow:0 6px 16px rgba(143,55,255,.5)}.button-disable-watermark:hover .button-text-part{background:linear-gradient(135deg,#7D2CE6,#6B22CC)}.button-disable-watermark:hover .button-price-part{background:linear-gradient(135deg,#FFC000,#FF8C00)}.button-disable-watermark:active{transform:translateY(1px);box-shadow:0 3px 8px rgba(143,55,255,.4)}@media (max-width:480px){.button-text-part{justify-content:center;text-align:center}.button-price-part{justify-content:center}.button-price-part::before{content:none}.button-price-part::after{content:'';position:absolute;top:0;left:50%;transform:translateX(-50%);width:80%;height:1px;background:linear-gradient(to right,transparent,rgba(255,255,255,.4),transparent)}}
.footer-contacts{width:100%;max-width:800px;margin:20px auto 0;padding:20px;border-radius:var(--radius-md);background:rgba(255,255,255,0.03);border:1px solid var(--card-border);text-align:center;}
.footer-contacts p{color:var(--text-light);font-weight:600;margin-bottom:15px;font-size:18px;}
.footer-contacts ul{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:12px;}
.footer-contacts li{color:var(--text-muted);font-size:15px;line-height:1.5;}
.footer-contacts a{color:var(--primary);text-decoration:none;transition:var(--transition);font-weight:500;}
.footer-contacts a:hover{color:var(--primary-hover);text-decoration:underline;}
@media (max-width:768px){.footer-contacts{padding:15px;text-align:left;}.footer-contacts p{font-size:16px;}.footer-contacts li{font-size:14px;}}
@media (max-width:480px){.footer-contacts{margin-top:15px;padding:12px;}.footer-contacts ul{gap:10px;}}
.modal{position:fixed;top:0;left:0;width:100%;height:100%;background-color:rgba(0,0,0,0.7);display:none;align-items:center;justify-content:center;z-index:1000;backdrop-filter:blur(5px);}
.modal.show{display:flex;animation:fadeIn 0.3s ease;}
@keyframes fadeIn{from{opacity:0;}to{opacity:1;}}
.modal-content{background-color: #12151a;border:1px solid var(--card-border);border-radius:var(--radius-lg);padding:30px;width:90%;max-width:500px;box-shadow:var(--shadow);transform:translateY(20px);transition:transform 0.3s ease;}
.modal.show .modal-content{transform:translateY(0);}
.modal-title{color:transparent;font-size:24px;margin-bottom:20px;text-align:center;background:linear-gradient(90deg,#6366F1,#8B5CF6);-webkit-background-clip:text;background-clip:text;}
.modal-description{color:var(--text-muted);margin-bottom:20px;text-align:center;line-height:1.5;}
.modal-opis{color:var(--text-muted);margin-bottom:20px;text-align:center;line-height:1;font-style:italic;}
.modal-input{width:100%;padding:12px 16px;margin-bottom:20px;border-radius:var(--radius-md);border:1px solid var(--card-border);background-color:rgba(255,255,255,0.05);color:var(--text-light);font-size:16px;outline:none;transition:var(--transition);}
.modal-input:focus{border-color:var(--primary);box-shadow:0 0 0 2px rgba(99,102,241,0.2);}
.modal-input.error{border-color:var(--error);box-shadow:0 0 0 2px rgba(239,68,68,0.2);}
.modal-buttons{display:flex;gap:15px;justify-content:center;}
.modal-button {padding: 12px 6px;border-radius: 5px;font-weight: 600;cursor: pointer;transition: var(--transition);flex: 1;border: none;font-size: 16px;}
.modal-button.submit{background-color:var(--primary);color:white;}
.modal-button.submit:hover{background-color:var(--primary-hover);transform:translateY(-2px);}
.modal-button.cancel{background-color:transparent;color:var(--text-light);border:1px solid var(--card-border);}
.modal-button.cancel:hover{background-color:rgba(255,255,255,0.05);transform:translateY(-2px);}
.pay{width:90%;max-width:300px;display:block;margin:20px auto 0;border-radius:var(--radius-md);box-shadow:var(--shadow);border:1px solid var(--card-border);transition:var(--transition);background-color:rgba(255,255,255,0.05);padding:5px;}
#yookassa-widget-container {position: fixed;top: 0;left: 0;width: 100%;height: 100%;background: rgba(0, 0, 0, 0.5);z-index: 9999;display: flex;justify-content: center;align-items: center;}
.checkout-modal.micromodal-slide[aria-hidden="false"] .checkout-modal__overlay {background-color: #000;}
.partner-sites{margin:40px 0;text-align:center}.partner-sites-title{font-size:24px;margin-bottom:30px;color:var(--text-light);background:linear-gradient(90deg,#8F37FF,#D53F8C);-webkit-background-clip:text;background-clip:text;color:transparent}.partner-sites-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:20px;max-width:1200px;margin:0 auto}.partner-site-button{display:flex;align-items:center;padding:20px;background:var(--card-bg);border:1px solid var(--card-border);border-radius:var(--radius-md);text-decoration:none;color:var(--text-light);transition:var(--transition);gap:15px}.partner-site-button:hover{transform:translateY(-5px);box-shadow:var(--shadow);border-color:var(--primary);background:rgba(143,55,255,0.1)}.partner-site-icon{font-size:32px;width:50px;height:50px;display:flex;align-items:center;justify-content:center;background:rgba(143,55,255,0.2);border-radius:var(--radius-sm)}.partner-site-text{display:flex;flex-direction:column;align-items:flex-start;text-align:left;flex:1}.partner-site-name{font-weight:600;font-size:18px;margin-bottom:5px}.partner-site-description{color:var(--text-muted);font-size:14px;line-height:1.4}@media (max-width:768px){.partner-sites-grid{grid-template-columns:1fr}.partner-site-button{padding:15px}.partner-site-icon{font-size:28px;width:40px;height:40px}.partner-site-name{font-size:16px}.partner-site-description{font-size:13px}}