body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;margin:0}code{font-family:source-code-pro,Menlo,Monaco,Consolas,Courier New,monospace}*{box-sizing:border-box;margin:0;padding:0}:root{--primary-gradient:linear-gradient(135deg,#ff4757,#ff3838);--secondary-color:#ff6b9d;--secondary-gradient:linear-gradient(135deg,#ff6b9d,#ff3d71);--accent-color:#ff9f43;--accent-gradient:linear-gradient(135deg,#ff9f43,#feca57);--bg-primary:linear-gradient(135deg,#f8f9fa,#e9ecef 50%,#dee2e6);--bg-secondary:#fffc;--bg-card:#ffffffe6;--bg-glass:#ffffffb3;--text-primary:#2c3e50;--text-secondary:#5a6c7d;--text-muted:#7f8c8d;--shadow-glow:0 0 30px #ff475733;--shadow-card:0 8px 32px #0000001a;--shadow-hover:0 12px 40px #ff47574d}body{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;color:#2c3e50;color:var(--text-primary);font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif}.App,body{background:linear-gradient(135deg,#f8f9fa,#e9ecef 50%,#dee2e6);background:var(--bg-primary);overflow:hidden}.App{height:100vh;position:relative;width:100%}.App:before{background:radial-gradient(circle at 20% 50%,#add8e64d 0,#0000 50%),radial-gradient(circle at 80% 20%,#87ceeb33 0,#0000 50%),radial-gradient(circle at 40% 80%,#b0e0e640 0,#0000 50%);content:"";height:100%;left:0;pointer-events:none;position:fixed;top:0;width:100%;z-index:-1}.button{align-items:center;cursor:pointer;display:flex;font-size:14px;font-weight:600;gap:6px;letter-spacing:.1em;padding:12px 24px}.button-lg{font-size:16px;padding:14px 28px}.button-lg,.button-md{align-items:center;cursor:pointer;display:flex;font-weight:600;gap:8px;letter-spacing:.1em}.button-md{font-size:14px;padding:10px 16px}.button-primary{-webkit-tap-highlight-color:transparent;-webkit-touch-callout:none;animation:buttonPulse 3s ease-in-out 1s infinite;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:linear-gradient(135deg,#ff4757,#ff3838);background:var(--primary-gradient);border:2px solid #fff3;border-radius:12px;box-shadow:0 4px 15px #ff475766;color:#fff;justify-content:center;outline:none;overflow:hidden;position:relative;transition:all .3s cubic-bezier(.4,0,.2,1);-webkit-user-select:none;user-select:none}.button-primary:before{background:linear-gradient(90deg,#0000,#ffffff4d,#0000);content:"";height:100%;left:-100%;position:absolute;top:0;transition:left .6s ease;width:100%}.button-primary:hover:before{left:100%}.button-primary:hover{animation-play-state:paused;background:linear-gradient(135deg,#ff3838,#ff1744);border-color:#ffffff4d;box-shadow:0 6px 20px #ff475780;transform:translateY(-2px) scale(1.02)}.button-primary:active{box-shadow:0 2px 10px #ff47574d;transform:translateY(0) scale(.98)}.button-primary svg{flex-shrink:0;transition:transform .3s ease}.button-secondary{-webkit-tap-highlight-color:transparent;-webkit-touch-callout:none;background:#ffffffe6;border:2px solid #0000001a;border-radius:12px;box-shadow:0 2px 8px #0000001a;color:#2c3e50;color:var(--text-primary);justify-content:center;outline:none;overflow:hidden;position:relative;transition:all .3s cubic-bezier(.4,0,.2,1);-webkit-user-select:none;user-select:none}.button-secondary:hover{background:#fff;border-color:#00000026;box-shadow:0 4px 12px #00000026;transform:translateY(-2px) scale(1.02)}.button-secondary:active{box-shadow:0 1px 4px #0000001a;transform:translateY(0) scale(.98)}.button-secondary:disabled{box-shadow:0 2px 8px #0000001a;cursor:not-allowed;opacity:.5;transform:none}.button-secondary svg{flex-shrink:0;transition:transform .3s ease}.button-link{-webkit-tap-highlight-color:transparent;align-items:center;background:none;border:none;border-bottom:1px solid #fff3;border-radius:12px;color:#fffc;cursor:pointer;display:flex;font-size:18px;font-weight:500;gap:10px;outline:none;padding:8px 12px;text-decoration:underline;text-decoration:none;transition:all .3s ease}.button-link:hover{background:#ffffff1a;color:#fff;text-decoration:none;transform:translateY(-1px)}.button-link:active{background:#ffffff26;transform:translateY(0)}@media (orientation:landscape) and (min-width:1200px){.button-lg{font-size:22px;padding:15px 30px}.button-lg,.button-md{border-radius:30px;font-weight:600}.button-md{font-size:18px;padding:10px 15px}.button-link{border-radius:15px;box-shadow:0 2px 4px #0000001a;font-size:16px;letter-spacing:.1em;padding:5px 15px}}@media (orientation:landscape) and (min-width:1400px){.button-lg{border-radius:48px;font-size:28px;font-weight:600;padding:20px 48px}.button-md{border-radius:30px;font-size:22px;font-weight:600;padding:12px 24px}.button-link{border-radius:22px;box-shadow:0 2px 4px #0000001a;font-size:22px;letter-spacing:.1em;padding:5px 22px}}@media screen and (orientation:portrait) and (min-width:768px) and (min-height:1024px){.button-lg{border-radius:48px;font-size:26px;font-weight:600;padding:20px 48px}.button-link{border-radius:22px;font-size:22px;letter-spacing:.1em;padding:10px 22px}}@media screen and (orientation:portrait) and (min-width:1024px) and (min-height:1366px){.button-lg{border-radius:54px;font-size:28px;font-weight:700;padding:22px 54px}.button-link{border-radius:26px;font-size:24px;letter-spacing:.1em;padding:12px 26px}}@keyframes buttonPulse{0%,to{box-shadow:0 4px 15px #ff475766}50%{box-shadow:0 4px 15px #ff475799,0 0 20px #ff47574d}}.category-menu{background:#0000;border-bottom:none;position:-webkit-sticky;position:sticky;top:60px;z-index:100}.category-list{-ms-overflow-style:none;display:flex;gap:12px;overflow-x:auto;padding:16px;scroll-behavior:smooth;scrollbar-width:none}.category-list::-webkit-scrollbar{display:none}.category-item{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#ffffffb3;border:1px solid #ffffff4d;border-radius:25px;cursor:pointer;flex-shrink:0;font-size:14px;font-weight:400;letter-spacing:.125em;overflow:hidden;padding:10px 20px;position:relative;transition:all .3s ease;white-space:nowrap}.category-item:before{background:#0000;content:"";height:100%;left:-100%;position:absolute;top:0;transition:left .3s ease;width:100%;z-index:-1}.category-item:hover{background:#ffffffe6;border:1px solid #ff475733;color:var(--primary-color);transform:translateY(-2px)}.category-item:hover:before{left:0}.category-item.active{background:#f646461c;border:1px solid #ff47574d;color:var(--primary-color);font-weight:600;transform:translateY(-2px)}.category-item.active:before{left:0}@media (orientation:landscape) and (min-width:1920px) and (min-height:1080px){.category-list{gap:20px;padding:5px 50px 15px}}@media (orientation:portrait) and (min-width:768px) and (min-height:1024px){.category-menu{top:70px}.category-list{gap:16px;padding:20px}.category-item{align-items:center;border-radius:26px;display:flex;font-size:18px;justify-content:center;min-height:48px;padding:14px 28px}}@media (orientation:portrait) and (min-width:1024px) and (min-height:1366px){.category-menu{top:70px}.category-list{gap:20px;padding:30px}.category-item{align-items:center;border-radius:30px;display:flex;font-size:22px;justify-content:center;min-height:48px;padding:16px 30px}}.cached-image-container{display:block;height:100%;overflow:hidden;position:relative;width:100%}.cached-image-container img{display:block;filter:brightness(.9) contrast(1.1);height:100%;object-fit:cover;transition:transform .4s cubic-bezier(.4,0,.2,1),opacity .3s ease;width:100%}.image-loading-placeholder{align-items:center;aspect-ratio:1;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#f5f5f5cc;border-radius:12px 12px 0 0;bottom:0;display:flex;justify-content:center;left:0;position:absolute;right:0;top:0}.image-loading-spinner{animation:imageSpinnerRotate 1s cubic-bezier(.4,0,.2,1) infinite;border:2px solid #ff475733;border-radius:50%;border-top:2px solid var(--primary-color);height:24px;width:24px}@keyframes imageSpinnerRotate{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}.template-card{-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);background:#ffffffe6;border-radius:16px;break-inside:avoid;cursor:pointer;margin-bottom:16px;overflow:hidden;page-break-inside:avoid;position:relative;transition:all .4s cubic-bezier(.4,0,.2,1)}.template-card:before{background:var(--primary-gradient);bottom:0;content:"";left:0;opacity:0;position:absolute;right:0;top:0;transition:opacity .3s ease;z-index:-1}.template-card:hover{border-color:var(--primary-color);transform:translateY(-8px) scale(1.02)}.template-card:hover:before{opacity:.1}.template-cover{aspect-ratio:1;border-radius:12px 12px 0 0;overflow:hidden;position:relative;width:100%}.template-cover:after{background:linear-gradient(135deg,#ff47571a,#ff6b9d1a 50%,#ff9f431a);bottom:0;content:"";left:0;opacity:0;position:absolute;right:0;top:0;transition:opacity .3s ease}.template-card:hover .template-cover:after{opacity:1}.make-similar-btn{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:var(--primary-gradient);border:2px solid #fff3;border-radius:25px;box-shadow:0 4px 15px #ff475766;color:#fff;cursor:pointer;font-size:14px;font-weight:600;left:50%;letter-spacing:.25em;opacity:1;padding:12px 24px;position:absolute;top:calc(100% - 90px);transform:translateX(-50%);transition:all .3s cubic-bezier(.4,0,.2,1);visibility:visible;width:60%;z-index:30}.template-card:hover .make-similar-btn{border-color:#ffffff4d;box-shadow:0 6px 20px #ff475780;opacity:1;transform:translateX(-50%) scale(1.05);visibility:visible}.make-similar-btn:hover{background:linear-gradient(135deg,#ff3838,#ff1744);border-color:#fff6;box-shadow:0 8px 25px #ff475799;transform:translateX(-50%) scale(1.1)}.template-cover-image img{display:block;filter:brightness(.9) contrast(1.1);height:auto;transition:transform .4s cubic-bezier(.4,0,.2,1);width:100%}.template-card:hover .template-cover-image img{filter:brightness(1) contrast(1.2);transform:scale(1.1)}.template-info{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#fffffff2;padding:32px 16px 16px;position:relative;z-index:1}.template-title{-webkit-line-clamp:2;-webkit-box-orient:vertical;line-clamp:2;color:var(--text-primary);display:-webkit-box;font-size:14px;font-weight:600;letter-spacing:1px;line-height:1.4;margin:0;overflow:hidden;text-align:center;text-overflow:ellipsis;transition:all .3s ease}.template-card:hover .template-title{color:var(--primary-color);transform:translateY(-1px)}@media (orientation:landscape) and (min-width:1200px){.template-card{margin-bottom:35px}.template-title{color:var(--text-secondary);line-height:1.2}.make-similar-btn,.template-title{font-size:14px;font-weight:600;letter-spacing:.1em}.make-similar-btn{border-radius:25px;padding:10px 20px;top:calc(100% - 88px)}}@media (orientation:landscape) and (min-width:1440px){.template-card{margin-bottom:50px}.template-title{color:var(--text-secondary);font-size:18px;font-weight:600;letter-spacing:.1em;line-height:1.2}.make-similar-btn{border-radius:30px;font-size:16px;font-weight:700;letter-spacing:.25em;padding:10px 20px;top:calc(100% - 94px);width:50%}}@media screen and (orientation:portrait) and (min-width:768px) and (min-height:1024px){.template-card{border-radius:20px;box-shadow:0 6px 24px #0000001f;margin-bottom:50px}.template-cover{aspect-ratio:1;border-radius:16px 16px 0 0}.make-similar-btn{border:3px solid #ffffff40;border-radius:30px;box-shadow:0 6px 20px #ff475773;font-size:16px;font-weight:700;letter-spacing:.25em;padding:12px 28px;top:calc(100% - 110px);width:70%}.template-card:hover .make-similar-btn{border-color:#ffffff59;box-shadow:0 8px 28px #ff47578c;transform:translateX(-50%) scale(1.08)}.make-similar-btn:hover{border-color:#ffffff73;box-shadow:0 10px 32px #ff4757a6;transform:translateX(-50%) scale(1.12)}.template-info{padding:40px 20px 20px}.template-title{font-size:16px;font-weight:700;letter-spacing:1.2px;line-height:1.5}}@media screen and (orientation:portrait) and (min-width:1024px) and (min-height:1366px){.template-card{border-radius:24px;margin-bottom:64px}.template-cover{aspect-ratio:1;border-radius:20px 20px 0 0}.make-similar-btn{border-radius:35px;box-shadow:0 8px 24px #ff475780;font-size:20px;font-weight:500;letter-spacing:.25em;min-height:60px;padding:16px 30px;top:calc(100% - 130px);width:50%}.template-card:hover .make-similar-btn{box-shadow:0 10px 32px #ff475799;transform:translateX(-50%) scale(1.1)}.make-similar-btn:hover{box-shadow:0 12px 36px #ff4757b3;transform:translateX(-50%) scale(1.15)}.template-info{padding:48px 24px 24px}.template-title{font-size:18px;font-weight:400;letter-spacing:1.4px;line-height:1.6}}.template-grid-container{background:#0000;flex:1 1;overflow-y:auto;padding:8px 16px 20px}.template-grid-container::-webkit-scrollbar{display:none}.template-grid-container{-ms-overflow-style:none;scrollbar-width:none}.template-grid{column-count:2;column-gap:16px;width:100%}.load-more-trigger{align-items:center;display:flex;justify-content:center;min-height:80px;padding:32px 0}.loading-indicator{color:var(--text-secondary);font-size:14px;font-weight:500;gap:16px}.spinner{animation:spin 1s cubic-bezier(.4,0,.2,1) infinite;border:3px solid #ff475733;border-radius:50%;border-top:3px solid var(--primary-color);box-shadow:0 0 20px #ff47574d;height:32px;width:32px}.no-more-text{color:var(--text-muted);font-size:14px;text-align:center}@media (min-width:768px){.template-grid{column-count:3;column-gap:20px}}@media (min-width:1024px){.template-grid{column-count:4;column-gap:24px}}@media (orientation:landscape) and (min-width:1200px){.template-grid-container{flex:1 1;padding:0 50px 10px}.template-grid{column-count:5;column-gap:40px}}@media (orientation:landscape) and (min-width:1440px){.template-grid-container{flex:1 1;padding:20px 50px}.template-grid{column-count:5;column-gap:50px}}@media screen and (orientation:portrait) and (min-width:768px) and (min-height:1024px){.template-grid-container{padding:8px 20px}.template-grid{column-count:2;column-gap:50px}.load-more-trigger{min-height:100px;padding:40px 0}.loading-indicator{font-size:16px;font-weight:600;gap:20px}.spinner{border-width:4px;box-shadow:0 0 24px #ff475759;height:40px;width:40px}@keyframes spin{0%{box-shadow:0 0 24px #ff475759;transform:rotate(0deg)}50%{box-shadow:0 0 36px #ff47578c}to{box-shadow:0 0 24px #ff475759;transform:rotate(1turn)}}.no-more-text{font-size:16px}}@media screen and (orientation:portrait) and (min-width:1024px) and (min-height:1366px){.template-grid-container{padding:8px 30px 10px}.template-grid{column-count:2;column-gap:64px}.load-more-trigger{min-height:120px;padding:48px 0}.loading-indicator{font-size:18px;font-weight:700;gap:24px}.spinner{border-width:5px;box-shadow:0 0 28px #ff475766;height:48px;width:48px}@keyframes spin{0%{box-shadow:0 0 28px #ff475766;transform:rotate(0deg)}50%{box-shadow:0 0 40px #ff475799}to{box-shadow:0 0 28px #ff475766;transform:rotate(1turn)}}.no-more-text{font-size:18px}}.photo-processing-modal-overlay{align-items:center;animation:overlayFadeIn .3s ease-out;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);background:#0009;bottom:0;display:flex;justify-content:center;left:0;position:fixed;right:0;top:0;z-index:1000}@keyframes overlayFadeIn{0%{opacity:0}to{opacity:1}}.photo-processing-modal{animation:modalSlideIn .4s ease-out;-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);background:#fffffff2;border:1px solid #ffffff4d;border-radius:20px;box-shadow:0 20px 40px #0003;max-height:80vh;max-width:600px;overflow:hidden}@keyframes modalSlideIn{0%{opacity:0;transform:translateY(30px) scale(.95)}to{opacity:1;transform:translateY(0) scale(1)}}.modal-header{align-items:center;border-bottom:1px solid #fff3;display:flex;justify-content:space-between;padding:24px 32px 16px}.modal-title{color:#2c3e50;font-size:24px;font-weight:600;letter-spacing:.1em;margin:0}.modal-close-btn{background:none;border:none;border-radius:8px;color:#666;cursor:pointer;padding:8px;transition:background-color .2s ease}.modal-close-btn svg g{stroke:var(--primary-color)}.modal-close-btn:hover{background:#0000000d;color:#333}.modal-content{padding:32px}.processing-options{display:flex;gap:24px;justify-content:center}.processing-option{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#fffc;border:2px solid #ffffff4d;border-radius:16px;cursor:pointer;flex:1 1;max-width:240px;padding:24px 20px;text-align:center;transition:all .3s ease}.processing-option:hover{background:#ffffffe6;border-color:#ff475766;box-shadow:0 12px 24px #00000026;transform:translateY(-4px)}.processing-option:active{transform:translateY(-2px)}.option-image{align-items:center;background:linear-gradient(135deg,#f5f7fa,#c3cfe2);border-radius:12px;display:flex;height:120px;justify-content:center;margin:0 auto 20px;overflow:hidden;width:120px}.raster-preview{height:80px;position:relative;width:80px}.layer{border-radius:8px;height:60px;opacity:.8;position:absolute;width:60px}.layer-1{background:linear-gradient(45deg,#ff6b6b,#ee5a24);left:0;top:0;z-index:3}.layer-2{background:linear-gradient(45deg,#4ecdc4,#44bd32);left:10px;top:15px;z-index:2}.layer-3{background:linear-gradient(45deg,#45b7d1,#96ceb4);left:20px;top:30px;z-index:1}.style-preview{border-radius:8px;height:80px;overflow:hidden;position:relative;width:80px}.style-effect{animation:styleGradient 3s ease infinite;background:linear-gradient(45deg,#667eea,#764ba2 25%,#f093fb 50%,#f5576c 75%,#4facfe);background-size:400% 400%;border-radius:8px;height:100%;width:100%}@keyframes styleGradient{0%{background-position:0 50%}50%{background-position:100% 50%}to{background-position:0 50%}}.option-title{color:#2c3e50;font-size:20px;font-weight:600;letter-spacing:.06em;margin:0 0 12px}.option-description{color:#666;font-size:14px;letter-spacing:.01em;line-height:1.5;margin:0}@media (max-width:768px){.photo-processing-modal{margin:20px;width:95%}.modal-header{padding:20px 24px 12px}.modal-title{font-size:20px}.modal-content{padding:24px 20px}.processing-options{flex-direction:column;gap:20px}.processing-option{max-width:none;padding:20px}.option-image{height:100px;margin-bottom:16px;width:100px}.raster-preview{height:70px;width:70px}.layer{height:50px;width:50px}.style-preview{height:70px;width:70px}.option-title{font-size:18px}.option-description{font-size:13px}}@media (max-width:480px){.modal-header{padding:16px 20px 8px}.modal-title{font-size:18px}.modal-content{padding:20px 16px}.processing-option{padding:16px}.option-image{height:80px;margin-bottom:12px;width:80px}.raster-preview{height:60px;width:60px}.layer{height:40px;width:40px}.style-preview{height:60px;width:60px}}.home-page{background:#0000;height:100vh;position:relative}.home-page,.title-section{display:flex;flex-direction:column}.title-section{align-items:center;justify-content:center;padding:30px 0}.title-section .title{-webkit-text-fill-color:#0000;-webkit-background-clip:text;background-clip:text;background-image:linear-gradient(133deg,var(--text-primary),var(--primary-color));font-size:x-large;font-weight:300;letter-spacing:.2em;padding:16px 16px 0;text-align:center}.title-section .subtitle{color:var(--text-secondary);font-size:large;font-weight:500;letter-spacing:.1em;margin-top:8px;text-align:center}@media (orientation:landscape) and (min-width:1200px){.title-section .title{font-size:xx-large;padding:0 15px}.title-section .subtitle{font-size:large}}@media (orientation:landscape) and (min-width:1400px){.title-section .title{font-size:xx-large;padding:20px 20px 0}.title-section .subtitle{font-size:x-large;margin-top:12px}}.home-page .template-grid-container{flex:1 1;overflow-y:auto}.app-header{align-items:center;-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);background:#fffffff2;display:flex;justify-content:space-between;padding:16px 20px;position:-webkit-sticky;position:sticky;top:0;z-index:100}.header-back-button{align-items:center;background:#0000;border:none;border-radius:20px;color:var(--primary-color);cursor:pointer;display:flex;font-size:14px;font-weight:500;gap:4px;transition:all .3s ease}.header-back-button:hover{color:#333;transform:translateX(-2px)}.header-back-button svg{transition:transform .3s ease}.header-back-button:hover svg{transform:translateX(-2px)}.header-title{color:var(--text-primary);font-size:20px;font-weight:300;left:50%;letter-spacing:.2em;margin:0;position:absolute;transform:translateX(-50%)}.header-spacer{height:44px;width:44px}@media (orientation:landscape) and (min-width:1200px){.app-header{-webkit-backdrop-filter:none;backdrop-filter:none;background:#0000;padding:20px 40px 0}.header-back-button{color:var(--text-secondary);font-size:26px;font-weight:600;padding-left:5px}.header-back-button svg path{stroke:var(--text-secondary)}.header-title{color:var(--text-primary);font-size:26px;font-weight:700;letter-spacing:.2em;text-shadow:0 2px 4px #0000001a}}@media (orientation:landscape) and (min-width:1440px){.app-header{-webkit-backdrop-filter:none;backdrop-filter:none;background:#0000;padding:30px 50px 0}.header-back-button{color:var(--text-secondary);font-size:26px;font-weight:600;padding-left:5px}.header-back-button svg path{stroke:var(--text-secondary)}.header-title{color:var(--text-primary);font-size:26px;font-weight:700;letter-spacing:.2em;text-shadow:0 2px 4px #0000001a}}@media screen and (orientation:portrait) and (min-width:768px) and (min-height:1024px){.app-header{padding:16px 20px}.header-back-button,.header-title{font-size:20px}}@media screen and (orientation:portrait) and (min-width:1024px) and (min-height:1366px){.app-header{padding:20px 30px}.header-back-button,.header-title{font-size:26px}}.ai-processing-loader{position:fixed;z-index:9999}.ai-processing-loader,.ai-processing-overlay{align-items:center;bottom:0;display:flex;justify-content:center;left:0;right:0;top:0}.ai-processing-overlay{backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);background:linear-gradient(135deg,#000000e6,#28000af2 50%,#000000e6);position:absolute}.ai-processing-content{align-items:center;display:flex;flex-direction:column;justify-content:center;padding:40px;position:relative;text-align:center}.ai-core-animation{height:200px;margin-bottom:40px;position:relative;width:200px}.ai-core{animation:ai-core-rotate 4s linear infinite;background:linear-gradient(45deg,#ff4757,#ff3742,#ff1744);box-shadow:0 0 30px #ff475799,inset 0 0 20px #fff3;height:100px;left:50%;position:absolute;top:50%;transform:translate(-50%,-50%);width:100px}.ai-core,.ai-core-inner{align-items:center;border-radius:50%;display:flex;justify-content:center}.ai-core-inner{background:#0000004d;border:2px solid #ffffff4d;height:90px;width:90px}.ai-brain{animation:ai-brain-pulse 2s ease-in-out infinite}.ai-brain-svg{filter:drop-shadow(0 0 10px rgba(255,71,87,.8))}.ai-pulse-ring{animation:ai-pulse 3s ease-out infinite;border:2px solid #ff47574d;border-radius:50%;left:50%;position:absolute;top:50%;transform:translate(-50%,-50%)}.ring-1{animation-delay:0s;height:120px;width:120px}.ring-2{animation-delay:1s;height:150px;width:150px}.ring-3{animation-delay:2s;height:180px;width:180px}.ai-data-stream{height:100%;left:0;position:absolute;top:0;width:100%}.data-particle{animation:data-flow 3s linear infinite;background:#ff4757;border-radius:50%;box-shadow:0 0 10px #ff4757cc;height:4px;position:absolute;width:4px}.particle-1{animation-delay:0s;animation-duration:2.5s;left:50%;top:20%}.particle-2{animation-delay:.5s;animation-duration:3s;left:80%;top:50%}.particle-3{animation-delay:1s;animation-duration:2.8s;left:50%;top:80%}.particle-4{animation-delay:1.5s;animation-duration:3.2s;left:20%;top:50%}.particle-5{animation-delay:2s;animation-duration:2.6s;left:30%;top:30%}.particle-6{animation-delay:2.5s;animation-duration:3.5s;left:70%;top:70%}.ai-status-info{color:#fff;z-index:10}.ai-stage-title{-webkit-text-fill-color:#0000;animation:text-shimmer 3s ease-in-out infinite;background:linear-gradient(135deg,#ff4757,#fff,#ff1744);background-clip:text;-webkit-background-clip:text;font-size:28px;font-weight:700;letter-spacing:.25em;margin:0 0 12px}.ai-progress-container{align-items:center;display:flex;gap:12px;margin-top:20px;width:39vw}.ai-progress-bar{background:#fff3;border:1px solid #ff47574d;border-radius:3px;flex:1 1;height:10px;overflow:hidden}.ai-progress-fill{animation:progress-shimmer 2s ease-in-out infinite;background:linear-gradient(90deg,#ff4757,#ff3742,#ff1744);border-radius:3px;box-shadow:0 0 10px #ff475799;height:100%;transition:width .3s ease}.ai-progress-text{color:#ff4757;font-size:14px;font-weight:600;min-width:40px;text-align:right}.ai-tech-decorations{height:100%;left:0;pointer-events:none;position:absolute;top:0;width:100%}.tech-line{animation:tech-scan 4s ease-in-out infinite;background:linear-gradient(90deg,#0000,#ff475799,#0000);position:absolute}.tech-line-1{animation-delay:0s;top:20%}.tech-line-1,.tech-line-2{height:1px;left:0;width:100%}.tech-line-2{animation-delay:1s;top:40%}.tech-line-3{animation-delay:2s;top:60%}.tech-line-3,.tech-line-4{height:1px;left:0;width:100%}.tech-line-4{animation-delay:3s;top:80%}@keyframes ai-core-rotate{0%{transform:translate(-50%,-50%) rotate(0deg)}to{transform:translate(-50%,-50%) rotate(1turn)}}@keyframes ai-brain-pulse{0%,to{opacity:1;transform:scale(1)}50%{opacity:.8;transform:scale(1.1)}}@keyframes ai-pulse{0%{opacity:1;transform:translate(-50%,-50%) scale(.8)}to{opacity:0;transform:translate(-50%,-50%) scale(1.2)}}@keyframes data-flow{0%{opacity:0;transform:rotate(0deg) translateX(60px) rotate(0deg)}10%{opacity:1}90%{opacity:1}to{opacity:0;transform:rotate(1turn) translateX(60px) rotate(-1turn)}}@keyframes icon-bounce{0%,to{transform:translateY(0)}50%{transform:translateY(-10px)}}@keyframes text-shimmer{0%,to{background-position:-200%}50%{background-position:200%}}@keyframes progress-shimmer{0%,to{box-shadow:0 0 10px #ff475799}50%{box-shadow:0 0 20px #ff4757}}@keyframes tech-scan{0%,to{opacity:0;transform:translateX(-100%)}50%{opacity:1;transform:translateX(100%)}}@media (max-width:480px){.ai-processing-content{max-width:300px;padding:20px}.ai-core-animation{height:150px;margin-bottom:30px;width:150px}.ai-core{height:80px;width:80px}.ai-core-inner{height:70px;width:70px}.ai-brain-svg{height:60px;width:60px}.ring-1{height:100px;width:100px}.ring-2{height:120px;width:120px}.ring-3{height:140px;width:140px}.ai-stage-icon{font-size:36px;margin-bottom:12px}.ai-stage-title{font-size:24px}.ai-stage-description{font-size:14px}}.qr-code-generator{display:inline-block;position:relative}.qr-code-generator.qr-responsive{align-items:center;display:flex;height:100%;justify-content:center;width:100%}.qr-canvas{border-radius:8px;box-shadow:0 2px 8px #0000001a;display:block}.qr-canvas-responsive{aspect-ratio:1;object-fit:contain}.qr-loading-placeholder{align-items:center;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#f5f5f5cc;border:1px solid #ff475733;border-radius:8px;display:flex;justify-content:center}.qr-loading-spinner{animation:qrSpinnerRotate 1s cubic-bezier(.4,0,.2,1) infinite;border:2px solid #ff475733;border-radius:50%;border-top:2px solid var(--primary-color);height:24px;width:24px}@keyframes qrSpinnerRotate{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}.qr-error-placeholder{align-items:center;background:#fff5f5e6;border:1px solid #ff47574d;border-radius:8px;color:var(--primary-color);display:flex;flex-direction:column;font-size:12px;justify-content:center;padding:8px;text-align:center}.qr-error-placeholder span{font-size:24px;margin-bottom:4px}.qr-error-placeholder p{font-weight:500;margin:0}.download-section,.upload-section{align-items:center;-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);background:#fffffff2;border:1px solid #ffffff4d;border-radius:20px;box-shadow:0 8px 32px #0003;display:flex;flex-direction:column;flex-shrink:0;gap:24px;margin:12px auto 0;padding:32px 24px}.download-section{background:#fff6}.camera-button{-webkit-tap-highlight-color:transparent;-webkit-touch-callout:none;align-items:center;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:linear-gradient(135deg,#ff4757,#ff3742);border:2px solid #fff3;border-radius:25px;box-shadow:0 4px 15px #ff475766;color:#fff;cursor:pointer;display:flex;font-size:16px;font-weight:600;gap:10px;letter-spacing:.1em;margin-top:16px;outline:none;padding:14px 32px;transition:all .3s cubic-bezier(.4,0,.2,1);-webkit-user-select:none;user-select:none}.camera-button:hover{background:linear-gradient(135deg,#ff3838,#ff1744);border-color:#ffffff4d;box-shadow:0 6px 20px #ff475780;transform:translateY(-2px) scale(1.02)}.camera-button:active{transform:translateY(0) scale(.98)}.camera-button:focus{box-shadow:0 4px 15px #ff475766;outline:none}.upload-instruction{text-align:center}.upload-instruction h4{color:#ff4757;font-size:20px;font-weight:600;letter-spacing:.1em;margin:0 0 8px}.upload-instruction p{color:#666;font-size:14px;font-weight:400;letter-spacing:.05em;line-height:1.5;margin:0}.qr-code-container{align-items:center;display:flex;flex-direction:column;gap:16px}.qr-code-wrapper{align-items:center;aspect-ratio:1;background:#fff;border:2px solid #ff47574d;border-radius:16px;box-shadow:0 8px 24px #ff475733;display:flex;height:200px;justify-content:center;max-height:320px;max-width:320px;min-height:160px;min-width:160px;overflow:hidden;padding:8px;position:relative;width:200px}.download-section .qr-code-wrapper{box-shadow:none}.qr-code{border-radius:8px;height:100%;width:100%}.qr-code-overlay{border-radius:16px;bottom:0;overflow:hidden;pointer-events:none}.qr-code-overlay,.scanning-line{left:0;position:absolute;right:0;top:0}.scanning-line{animation:scan 2s linear infinite;background:linear-gradient(90deg,#0000,#ff4757 50%,#0000);border-radius:1px;height:2px}@keyframes scan{0%{opacity:0;transform:translateY(-2px)}10%{opacity:1}90%{opacity:1}to{opacity:0;transform:translateY(200px)}}.qr-code-text{color:#666;font-size:14px;font-weight:300;letter-spacing:.05em;margin:0;text-align:center}.qr-session-info{color:#666;display:block;font-family:Courier New,monospace;font-size:12px;margin-top:4px}@media (max-width:767px){.upload-section{border-radius:16px;gap:20px;margin:8px auto 0;padding:24px 20px}.upload-instruction h4{font-size:18px}.upload-instruction p{font-size:13px}.qr-code-wrapper{border-radius:12px;height:180px;padding:6px;width:180px}.camera-button{border-radius:20px;font-size:14px;gap:8px;padding:12px 24px}@keyframes scan{0%{opacity:0;transform:translateY(-2px)}10%{opacity:1}90%{opacity:1}to{opacity:0;transform:translateY(180px)}}}@media (min-width:768px){.upload-section{border-radius:18px;gap:26px;padding:28px}.qr-code-wrapper{height:220px;width:220px}.qr-code-text{font-size:16px;font-weight:400;letter-spacing:.08em}@keyframes scan{0%{opacity:0;transform:translateY(-2px)}10%{opacity:1}90%{opacity:1}to{opacity:0;transform:translateY(220px)}}}@media (min-width:1024px){.upload-section{border-radius:24px;gap:28px;padding:30px;width:600px}.qr-code-wrapper{height:240px;width:240px}.camera-button{border:3px solid #ffffff40;border-radius:30px;font-size:22px;font-weight:700;gap:12px;letter-spacing:.15em;min-height:56px;padding:18px 50px}.camera-button:hover{box-shadow:0 8px 28px #ff47578c;transform:translateY(-3px) scale(1.05)}.upload-instruction h4{font-size:26px;font-weight:700;letter-spacing:.15em}.upload-instruction p{font-size:16px;font-weight:500;letter-spacing:.08em}.qr-code-text{font-size:12px}@keyframes scan{0%{opacity:0;transform:translateY(-2px)}10%{opacity:1}90%{opacity:1}to{opacity:0;transform:translateY(240px)}}}@media (orientation:landscape) and (min-width:1200px){.upload-section{align-items:center;display:flex;flex-direction:column;gap:30px;height:100%;justify-content:center;margin:0 auto;padding:40px}.download-section{padding:20px}.qr-code-wrapper{height:220px;width:220px}.camera-button{border:3px solid #ffffff40;border-radius:30px;font-size:22px;font-weight:700;gap:12px;letter-spacing:.15em;padding:15px 40px}.camera-button:hover{box-shadow:0 8px 28px #ff47578c;transform:translateY(-3px) scale(1.05)}.upload-instruction h4{font-size:28px;font-weight:700;letter-spacing:.15em}.upload-instruction p{font-size:16px;font-weight:500;letter-spacing:.08em}@keyframes scan{0%{opacity:0;transform:translateY(-2px)}10%{opacity:1}90%{opacity:1}to{opacity:0;transform:translateY(220px)}}}@media (orientation:landscape) and (min-width:1440px){.upload-section{align-items:center;display:flex;flex-direction:column;gap:50px;height:100%;justify-content:center;margin:0 auto;padding:50px}.download-section{padding:20px}.qr-code-wrapper{height:260px;width:260px}.camera-button{border:3px solid #ffffff40;border-radius:30px;font-size:22px;font-weight:700;gap:12px;letter-spacing:.15em;min-height:56px;padding:18px 50px}.camera-button:hover{box-shadow:0 8px 28px #ff47578c;transform:translateY(-3px) scale(1.05)}.upload-instruction h4{font-size:32px;font-weight:700;letter-spacing:.15em}.upload-instruction p{font-size:18px;font-weight:500;letter-spacing:.08em}@keyframes scan{0%{opacity:0;transform:translateY(-2px)}10%{opacity:1}90%{opacity:1}to{opacity:0;transform:translateY(260px)}}}@media screen and (orientation:portrait) and (min-width:768px) and (min-height:1024px){.upload-section{border-radius:24px;gap:28px;padding:40px 32px;width:100%}.camera-button{border:3px solid #ffffff40;border-radius:30px;font-size:22px;font-weight:700;gap:12px;letter-spacing:.15em;min-height:56px;padding:18px 50px}.camera-button:hover{box-shadow:0 8px 28px #ff47578c;transform:translateY(-3px) scale(1.05)}.upload-instruction h4{font-size:26px;font-weight:700;letter-spacing:.15em}.upload-instruction p{font-size:16px;font-weight:500;letter-spacing:.08em}.qr-code-wrapper{border:3px solid #ff475759;border-radius:20px;height:280px;padding:20px;width:280px}.qr-code-text{font-size:16px;font-weight:400;letter-spacing:.08em}@keyframes scan{0%{opacity:0;transform:translateY(-2px)}10%{opacity:1}90%{opacity:1}to{opacity:0;transform:translateY(280px)}}}@media screen and (orientation:portrait) and (min-width:1024px) and (min-height:1366px){.upload-section{border-radius:28px;gap:30px;padding:30px;width:100%}.camera-button{border:4px solid #ffffff4d;border-radius:35px;font-size:28px;font-weight:700;gap:14px;letter-spacing:.3em;margin-bottom:30px;padding:22px 54px}.camera-button:hover{box-shadow:0 10px 32px #ff475799;transform:translateY(-4px) scale(1.08)}.upload-instruction h4{font-size:32px;font-weight:600;letter-spacing:.2em;padding-bottom:10px}.upload-instruction p{font-size:20px;font-weight:500;letter-spacing:.1em;padding-bottom:15px}.qr-code-wrapper{border:4px solid #ff475766;border-radius:24px;height:320px;padding:26px;width:320px}.qr-code-text{font-size:18px;font-weight:300;letter-spacing:.1em}@keyframes scan{0%{opacity:0;transform:translateY(-2px)}10%{opacity:1}90%{opacity:1}to{opacity:0;transform:translateY(320px)}}}.template-detail{display:flex;flex-direction:column;height:100vh;overflow:hidden;position:relative}.template-detail:before{background-image:inherit;background-position:inherit;background-repeat:inherit;background-size:inherit;bottom:0;content:"";filter:blur(50px);left:0;position:absolute;right:0;top:0;transform:translateZ(0);will-change:transform;z-index:-1}.template-detail-overlay{-webkit-backdrop-filter:blur(39px);backdrop-filter:blur(39px);background:#ffffff63;bottom:0;display:flex;flex-direction:column;left:0;padding-bottom:24px;position:absolute;right:0;top:0;z-index:1}@keyframes pulse-warning{0%{opacity:.9;transform:scale(1)}to{opacity:1;transform:scale(1.05)}}.template-detail-content{display:flex;flex:1 1;flex-direction:column;gap:24px;justify-content:center;overflow-y:auto;padding:20px}.template-detail-content::-webkit-scrollbar{display:none}.template-detail-content{-ms-overflow-style:none;scrollbar-width:none}.template-preview-section{align-items:center;display:flex;flex-shrink:0;justify-content:center;margin-bottom:12px}.template-preview{-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);background:#fffffff2;border:1px solid #ffffff4d;border-radius:16px;box-shadow:0 8px 32px #0000001a;gap:20px;justify-content:space-between;padding:16px}.template-preview,.template-preview-container{align-items:center;display:flex;overflow:hidden;position:relative}.template-preview-container{aspect-ratio:1;border-radius:8px;height:100%;justify-content:center;width:100%}.template-preview-image{border-radius:8px;height:100%;object-fit:cover;width:100%}.template-preview-overlay{background:#0006;border-radius:8px;bottom:0;left:0;position:absolute;right:0;top:0;z-index:10}.preview-question-mark,.template-preview-overlay{align-items:center;display:flex;justify-content:center}.preview-question-mark{animation:pulse-question 2s ease-in-out infinite;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);background:#ffffff63;border:2px solid #fff9;border-radius:16px;height:128px;width:128px;will-change:transform,opacity}@keyframes pulse-question{0%{opacity:.8;transform:scale(1) translateZ(0)}50%{opacity:1;transform:scale(1.05) translateZ(0)}to{opacity:.8;transform:scale(1) translateZ(0)}}.transform-arrow{align-items:center;display:flex;flex-shrink:0;justify-content:center}.transform-arrow svg{height:60px;opacity:.6;width:60px}.transform-arrow svg[viewBox="0 0 24 24"]{filter:drop-shadow(0 0 8px rgba(76,175,80,.3));opacity:.8}.user-photo-container{align-items:center;border-radius:8px;display:flex;height:100%;justify-content:center;overflow:hidden;position:relative;width:100%}.user-photo{animation:photoFadeIn .8s ease-out;aspect-ratio:1;border-radius:8px;cursor:pointer;transform:translateZ(0);transition:transform .3s cubic-bezier(.4,0,.2,1);width:100%;will-change:transform}.user-photo:hover{transform:scale(1.02)}.user-photo:active{transform:scale(.98)}@keyframes photoFadeIn{0%{opacity:0;transform:scale(.95) translateY(10px)}to{opacity:1;transform:scale(1) translateY(0)}}.user-photo-container.has-photo{animation:containerGlow .8s ease-out}.user-photo-container.has-photo .user-photo{border-radius:0}.user-photo.style-only-photo{aspect-ratio:auto;background:#0000;height:auto;max-width:100%;object-fit:cover;width:auto}.user-photo-container.style-only-mode.has-photo{aspect-ratio:1;background:#474747}@keyframes containerGlow{0%{box-shadow:0 0 0 0 #ff475766}50%{box-shadow:0 0 0 8px #ff47571a}to{box-shadow:0 0 0 0 #ff475700}}.photo-placeholder{align-items:center;aspect-ratio:1;background:#0000000d;border:1px dashed #0003;border-radius:8px;display:flex;flex-direction:column;height:100%;justify-content:center;padding:16px;text-align:center;width:100%}.photo-placeholder svg{height:96px;margin-bottom:8px;opacity:.8;width:96px}.question-mark{font-size:120px;font-weight:300;line-height:1;margin:0}.photo-placeholder-text{color:#00000080;font-size:18px;font-weight:300;letter-spacing:.1em;margin:8px 0 0}.result-actions-section,.start-creation-section{align-items:center;animation:sectionSlideIn .6s ease-out .3s both;display:flex;flex-direction:column;gap:16px;margin:24px auto;padding:0 24px;position:relative}.result-actions-section{margin-bottom:0}@keyframes sectionSlideIn{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.primary-actions{display:flex;gap:60px;margin-top:16px}.secondary-actions{display:flex;gap:40px;margin-top:30px}.sse-status{border-radius:0;font-size:14px;font-weight:500;padding:0;position:fixed;right:30px;top:30px;transition:all .3s ease;z-index:1000}.sse-status.error{background:#0000;border:none;box-shadow:none;color:#ff1744}.status-text{font-weight:500}.session-id{background:#0003;border-radius:4px;font-family:Courier New,monospace;font-size:12px;margin-left:8px;padding:2px 6px}.print-preview-section{align-items:center;animation:fadeInUp .6s ease-out;display:flex;flex-direction:column;gap:30px}.print-preview-container{align-items:center;display:flex;flex-grow:1;justify-content:center}.layered-image-preview{aspect-ratio:1;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#ffffff0d;border:8px solid #fff3;border-radius:8px;box-shadow:0 20px 40px #0003,0 0 0 1px #ffffff1a;height:100%;overflow:hidden;position:relative}.layer-image{border-radius:8px;height:100%;left:0;object-fit:cover;position:absolute;top:0;width:100%}.user-layer{animation:slideInFromLeft 1s ease-out 2s,userLayerFade 8s ease-in-out 3s infinite;z-index:2}.style-layer{animation:slideInFromRight 1s ease-out 2s,styleLayerFade 8s ease-in-out 3s infinite;z-index:1}.raster-layer{animation:photoFadeIn 1s ease-out 2s}.style-only-result{animation:photoFadeIn 1s ease-out;z-index:1}@keyframes slideInFromLeft{0%{opacity:0;transform:translateX(-100%)}to{opacity:1;transform:translateX(0)}}@keyframes userLayerFade{0%,30%{opacity:1}50%,80%{opacity:0}to{opacity:1}}@keyframes styleLayerFade{0%,30%{opacity:0}50%,80%{opacity:1}to{opacity:0}}@keyframes fadeInUp{0%{opacity:0;transform:translateY(30px)}to{opacity:1;transform:translateY(0)}}.print-button-container{align-items:center;display:flex;flex-direction:column;gap:12px;justify-content:center}.print-success-notification{align-items:center;animation:slideInFromRight .3s ease-out;background:linear-gradient(135deg,#4caf50,#45a049);border-radius:12px;box-shadow:0 4px 12px #4caf504d;color:#fff;display:flex;font-weight:500;gap:12px;padding:16px 24px;position:fixed;right:20px;top:20px;z-index:1001}@keyframes slideInFromRight{0%{opacity:0;transform:translateX(100px)}to{opacity:1;transform:translateX(0)}}.print-success-notification.fade-out{animation:fadeOut .3s ease-out forwards}@keyframes fadeOut{0%{opacity:1;transform:translateX(0)}to{opacity:0;transform:translateX(100px)}}@media (max-width:480px){.template-detail-content{gap:16px;padding:16px}.template-preview{flex-direction:column;gap:16px;max-height:35vh;width:100%}.transform-arrow{transform:rotate(90deg)}.preview-question-mark{height:60px;width:60px}.preview-question-mark svg{height:48px;width:48px}}@media (min-width:768px){.template-detail-content{justify-content:center;padding:24px}.template-preview{max-height:45vh}}@media (min-width:1024px){.template-detail-content{justify-content:center;padding:32px}.template-preview{max-height:50vh;width:600px}}@media (orientation:landscape) and (min-width:1200px){.template-detail-overlay{padding-bottom:0}.template-detail-content{padding:30px 60px 60px}.template-detail-content.processed{align-items:center}.template-preview-group-container{display:flex;flex-direction:row;gap:30px;height:100%;justify-content:center}.template-preview-group-container.has-photo{height:auto}.template-preview-container{gap:30px;height:100%;padding:10px}.print-preview-section,.template-preview-section{flex-grow:1;height:100%;margin-bottom:0}.template-preview-section.has-photo{flex-grow:0;height:47vh;margin-bottom:0;width:60%}.template-preview{border-radius:24px;flex-grow:1;height:100%;max-height:100%;padding:40px}.template-preview-section.has-photo .template-preview{padding:24px}.transform-arrow svg{height:70px;width:70px}.user-photo-container{height:auto}.photo-placeholder svg{height:120px;margin-bottom:5px;width:120px}.template-preview-container{height:auto;padding:0}.secondary-actions{margin-top:20px}.primary-actions{gap:30px;margin-top:0}.start-creation-section{gap:15px;margin:15px auto;padding:0 30px}.button-primary svg{height:24px;width:24px}.print-button-container{gap:30px;margin-top:30px}}@media screen and (orientation:portrait) and (min-width:768px) and (min-height:1024px){.template-detail-content{gap:20px;justify-content:center;padding:20px}.template-preview{border-radius:20px;padding:20px;width:100%}}@media screen and (orientation:portrait) and (min-width:1024px) and (min-height:1366px){.template-detail-content{gap:30px;justify-content:center;padding:30px}.template-preview{border-radius:24px;padding:30px;width:100%}.transform-arrow svg{height:70px;width:70px}.photo-placeholder svg{height:128px;margin-bottom:16px;width:128px}.start-creation-section{gap:20px;margin:30px auto;padding:0 30px}}.template-preview-section.processed-hidden{display:none}.upload-status{color:#666;font-size:14px;font-style:italic;margin-top:8px}.member-restriction-overlay{align-items:center;background-color:#000000b3;bottom:0;display:flex;justify-content:center;left:0;padding:20px;position:fixed;right:0;top:0;z-index:10000}.member-restriction-dialog{animation:slideUp .3s ease-out;background:#fff;border-radius:20px;box-shadow:0 8px 32px #0003;max-width:900px;overflow:hidden;padding:0;position:relative;width:90%}.dialog-close-button{align-items:center;background:#ffffffe6;border:none;border-radius:50%;box-shadow:0 2px 8px #0000001a;color:#666;cursor:pointer;display:flex;justify-content:center;padding:10px;position:absolute;right:20px;top:20px;transition:all .2s;z-index:10}.dialog-close-button:hover{background-color:#fff;box-shadow:0 4px 12px #00000026;color:#000}.dialog-content{display:flex;min-height:500px}.display-area{background:linear-gradient(135deg,#f8f9fa,#e9ecef);display:flex;flex:1 1;flex-direction:column;justify-content:space-between;padding:48px 40px}.dialog-title{color:#1a1a1a;font-size:28px;font-weight:700;margin:0 0 12px}.dialog-description{color:#666;font-size:15px;line-height:1.6;margin:0 0 32px}.phone-display{display:flex;flex:1 1;flex-direction:column;justify-content:center;margin:20px 0}.phone-label{color:#666;font-size:14px;font-weight:500;letter-spacing:.05em;margin-bottom:12px;text-transform:uppercase}.phone-number{align-items:center;background:#fff;border-radius:12px;box-shadow:0 2px 8px #00000014;color:#1a1a1a;display:flex;font-family:Courier New,monospace;font-size:36px;font-weight:600;justify-content:center;letter-spacing:.1em;min-height:80px;padding:20px}.phone-number .placeholder{color:#bbb;font-family:inherit;font-size:18px;font-weight:400;letter-spacing:normal}.error-message{animation:shake .5s ease-in-out;background-color:#fee;border:1px solid #fcc;border-radius:12px;color:#c33;font-size:15px;margin:20px 0;padding:16px 20px;text-align:center}@keyframes shake{0%,to{transform:translateX(0)}25%{transform:translateX(-10px)}75%{transform:translateX(10px)}}.dialog-actions{display:flex;gap:16px;margin-top:24px}.dialog-actions button{flex:1 1}.numpad-area{align-items:center;background:linear-gradient(135deg,#667eea,#764ba2);display:flex;flex:0 0 400px;justify-content:center;padding:48px 32px}.numpad-grid{grid-gap:16px;display:grid;gap:16px;grid-template-columns:repeat(3,1fr);max-width:320px;width:100%}.numpad-button{-webkit-tap-highlight-color:transparent;aspect-ratio:1;background:#fffffff2;border:none;border-radius:16px;box-shadow:0 4px 12px #0000001a;color:#333;cursor:pointer;font-size:28px;font-weight:600;outline:none;transition:all .2s ease;-webkit-user-select:none;user-select:none}.numpad-button:hover:not(:disabled){background:#fff;box-shadow:0 6px 16px #00000026;transform:translateY(-2px)}.numpad-button:active:not(:disabled){box-shadow:0 2px 8px #0000001a;transform:translateY(0)}.numpad-button:disabled{cursor:not-allowed;opacity:.5}.numpad-clear,.numpad-delete{font-size:18px;font-weight:600}.numpad-delete{font-size:32px}@media (max-width:900px){.dialog-content{flex-direction:column}.display-area,.numpad-area{padding:32px 28px}.numpad-area{flex:0 0 auto}.phone-number{font-size:28px;min-height:70px}}@media (max-width:600px){.member-restriction-dialog{border-radius:0;max-width:100%;min-height:100vh;width:100%}.dialog-content{min-height:100vh}.dialog-title{font-size:24px}.dialog-description{font-size:14px}.display-area,.numpad-area{padding:24px 20px}.phone-number{font-size:24px;min-height:60px}.numpad-grid{gap:12px}.numpad-button{border-radius:12px;font-size:24px}}.camera-capture-container{background:var(--bg-primary);display:flex;flex-direction:column;height:100vh}.camera-main-area{background:linear-gradient(#fffc,#f5f5f5cc);border-radius:12px}.camera-main-area,.camera-video-container{align-items:center;display:flex;justify-content:center;overflow:hidden;position:relative}.camera-video-container{background-color:#ffffffb3;border-radius:8px;box-shadow:var(--shadow-card);margin:0 auto;width:100%}.camera-video-container.square-mode{aspect-ratio:1}.camera-video-container.photo-mode{aspect-ratio:3/4}.camera-video{height:100%;object-fit:cover;width:100%}.countdown-overlay{align-items:center;background:#0000004d;bottom:0;display:flex;justify-content:center;left:0;position:absolute;right:0;top:0;z-index:10}.countdown-number{animation:pulse 1s infinite;color:#fff;font-size:120px;font-weight:700;text-shadow:0 0 15px #ff4757cc}@keyframes pulse{0%{opacity:1;transform:scale(1)}50%{opacity:.8;transform:scale(1.1)}to{opacity:1;transform:scale(1)}}.photo-preview-container{align-items:center;background-color:#ffffffb3;border-radius:8px;display:flex;height:100%;justify-content:center;margin:0 auto;overflow:hidden;width:100%}.photo-preview-container.square-mode{aspect-ratio:1}.photo-preview-container.photo-mode{aspect-ratio:3/4}.photo-preview{max-height:100%;max-width:100%;object-fit:contain}.photo-error{background-color:#00000080;border-radius:8px;color:#fff;font-size:18px;padding:20px;text-align:center}.camera-instruction{margin:16px 0;padding:0 20px;text-align:center}.camera-instruction p{background-color:#ffffffb3;border-radius:8px;color:#666;color:var(--text-secondary,#666);display:inline-block;font-size:16px;letter-spacing:.1em;line-height:1.5;margin:0;padding:8px 12px}.camera-controls{display:flex;justify-content:center;margin-top:10px;padding:24px 48px}.camera-action-button{align-items:center;background-color:#ff4757;background-color:var(--primary-color,#ff4757);border:none;border-radius:24px;box-shadow:0 4px 12px #ff475733;color:#fff;cursor:pointer;display:flex;font-size:18px;font-weight:600;gap:4px;gap:10px;letter-spacing:.2em;margin-bottom:15px;min-width:160px;padding:14px 28px;transition:all .3s ease}.camera-action-button:hover{background-color:#ff2d42;box-shadow:0 4px 8px #ff47574d;transform:translateY(-2px)}.camera-action-button:disabled{background-color:#ff758f;box-shadow:none;cursor:not-allowed;transform:none}.photo-action-buttons{display:flex;gap:50px;justify-content:center;width:100%}.retake-button{background-color:#6c757d}.retake-button:hover{background-color:#5a6268;box-shadow:0 4px 8px #6c757d4d}.confirm-button{background-color:var(--primary-color,#ff4757)}@media (orientation:landscape) and (min-width:1200px){.template-detail-content.camera-capture-content{display:flex;flex-direction:row;gap:20px}.camera-main-area{align-items:center;background:linear-gradient(#fffc,#f5f5f5cc);border-radius:12px;display:flex;justify-content:center;overflow:hidden;position:relative}.camera-video-container{height:100%}.camera-controls{align-items:center;flex-direction:column;flex-grow:1;justify-content:center}.camera-action-button,.camera-button{font-size:18px;padding:20px}.camera-instruction{margin:50px 0}.camera-instruction p{background:none;font-size:14px;font-weight:400;padding:0 15px 10px}}@media (orientation:landscape) and (min-width:1440px){.camera-button{font-size:22px;padding:30px}.camera-action-button{font-size:20px;padding:20px}.camera-instruction{margin:50px 0}.camera-instruction p{background:none;font-size:18px;font-weight:300;padding:10px 15px}}@media screen and (orientation:portrait) and (min-width:768px) and (min-height:1024px){.camera-instruction p{font-size:18px;padding:10px 16px}.camera-controls{padding:30px 24px 50px}.camera-action-button{font-size:22px;padding:16px 32px}.countdown-number{font-size:160px}}@media screen and (orientation:portrait) and (min-width:1024px) and (min-height:1366px){.camera-instruction{margin:24px 0}.camera-instruction p{font-size:22px;padding:12px 20px}.camera-controls{padding:40px 30px 60px}.camera-action-button{font-size:26px;padding:18px 36px}.countdown-number{font-size:200px}}.not-found{align-items:center;background:var(--bg-primary);display:flex;justify-content:center;min-height:100vh;padding:20px;position:relative}.not-found:before{background:radial-gradient(circle at 20% 50%,#ff47571a 0,#0000 50%),radial-gradient(circle at 80% 20%,#ff6b9d1a 0,#0000 50%),radial-gradient(circle at 40% 80%,#ff9f431a 0,#0000 50%);bottom:0;content:"";left:0;pointer-events:none;position:absolute;right:0;top:0;z-index:-1}.not-found-content{-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);background:#fffffff2;border:1px solid #ff475733;border-radius:20px;box-shadow:0 8px 32px #0000001a;color:var(--text-primary);max-width:500px;padding:40px 32px;text-align:center}.not-found-icon{color:var(--primary-color);margin-bottom:24px}.not-found-title{-webkit-text-fill-color:#0000;background:var(--primary-gradient);-webkit-background-clip:text;background-clip:text;font-size:72px;font-weight:900;margin:0 0 16px;text-shadow:none}.not-found-subtitle{color:var(--text-primary);font-size:28px;font-weight:600;margin:0 0 16px}.not-found-description{color:var(--text-secondary);font-size:18px;line-height:1.6;margin:0 0 32px}.not-found-actions{display:flex;flex-wrap:wrap;gap:16px;justify-content:center}.go-back-button,.go-home-button{align-items:center;background:#0000;border:none;border-radius:20px;color:var(--primary-color);cursor:pointer;display:flex;font-size:14px;font-weight:500;gap:4px;padding:8px 16px;text-decoration:none;transition:all .3s ease}.go-back-button:hover,.go-home-button:hover{color:#333;transform:translateX(-2px)}.go-back-button svg,.go-home-button svg{height:20px;transition:transform .3s ease;width:20px}.go-back-button:hover svg,.go-home-button:hover svg{transform:translateX(-2px)}@media (max-width:480px){.not-found-content{margin:0 16px;padding:32px 24px}.not-found-title{font-size:56px}.not-found-subtitle{font-size:24px}.not-found-description{font-size:16px}.not-found-actions{align-items:center;flex-direction:column;gap:12px}.go-back-button,.go-home-button{justify-content:center;max-width:280px;padding:12px 20px;width:100%}}.photo-upload-container{overflow-x:hidden}.crop-fullscreen-container{background-color:#000;bottom:0;display:flex;flex-direction:column;left:0;position:fixed;right:0;top:0;z-index:1000}.crop-header{align-items:center;background-color:#000c;display:flex;justify-content:space-between;padding:12px 16px 12px 0;position:relative;z-index:1001}.crop-reset-button{background:none;border:none;border-radius:6px;color:#fff;cursor:pointer;font-size:16px;font-weight:500;padding:8px 12px;transition:background-color .2s ease}.crop-reset-button:hover{background-color:#ffffff1a}.crop-reset-button:active{background-color:#fff3}.crop-image-wrapper{align-items:center;display:flex;flex:1 1;justify-content:center;padding:20px;position:relative}.crop-source-image{max-height:100%;object-fit:contain}.crop-bottom-actions{background-color:#000c;display:flex;gap:16px;justify-content:space-between;padding:20px 16px;position:relative;z-index:1001}.crop-action-button{border:none;border-radius:25px;cursor:pointer;flex:1 1;font-size:16px;font-weight:500;min-height:44px;padding:12px 24px;transition:all .2s ease}.crop-cancel-button{background-color:#666;color:#fff}.crop-cancel-button:hover{background-color:#777}.crop-cancel-button:active{background-color:#555}.crop-confirm-button{background-color:#ff4757;background-color:var(--primary-color);color:#fff}.crop-confirm-button:hover{background-color:#ff3a4c}.crop-confirm-button:active{background-color:#e03345}.crop-fullscreen-container .reactEasyCrop_Container{background-color:#000!important}.crop-fullscreen-container .reactEasyCrop_CropArea{border:2px solid #ff4757!important;border:2px solid var(--primary-color)!important;box-shadow:0 0 0 1px #ffffff80}.crop-fullscreen-container .reactEasyCrop_CropAreaGrid:after,.crop-fullscreen-container .reactEasyCrop_CropAreaGrid:before{border:1px solid #ffffff4d!important}@media (max-width:767px){.crop-reset-button{font-size:17px;padding:10px 16px}.crop-image-wrapper{padding:16px}.crop-bottom-actions{gap:20px;padding:24px 20px}.crop-action-button{font-size:17px;min-height:48px;padding:14px 28px}}.photo-upload-container:has(.crop-fullscreen-container) .photo-upload-content>:not(.crop-fullscreen-container){display:none}.photo-upload-container:before{align-items:center;background-color:#ff4757;background-color:var(--primary-color);color:#fff;content:"选择照片";display:flex;font-size:20px;font-weight:200;justify-content:center;letter-spacing:.2em;padding:12px 0;position:-webkit-sticky;position:sticky;top:0;z-index:200}.photo-upload-container{background-color:#f9f9f9;display:flex;flex-direction:column;height:100vh;position:relative}.photo-upload-content{display:flex;flex:1 1;flex-direction:column;gap:20px;overflow-y:auto;padding:20px}.upload-title{color:#ff4757;color:var(--primary-color);font-size:20px;font-weight:600;margin:0 0 16px;text-align:center}.upload-area{background-color:#fff;border-radius:12px;box-shadow:0 2px 8px #0000000d;margin-bottom:16px}.upload-area,.upload-placeholder{align-items:center;display:flex;flex-direction:column;justify-content:center;padding:16px}.upload-placeholder{border:2px dashed #ff4757;border:2px dashed var(--primary-color);border-radius:12px;cursor:pointer;height:320px;transition:all .3s ease;width:100%}.upload-placeholder:active{background-color:#ff47570d}.upload-icon{margin-bottom:16px}.upload-hint,.upload-icon{color:#ff4757;color:var(--primary-color)}.upload-hint{font-size:16px;font-weight:400;margin:0 0 8px;text-align:center}.upload-tip{color:#666;color:var(--text-secondary);font-size:13px;margin:0;text-align:center}.loading-indicator{align-items:center;background:#ffffffe6;border-radius:12px;box-shadow:0 4px 12px #0000001a;display:flex;flex-direction:column;gap:12px;justify-content:center;margin:16px 0;padding:20px}.loading-spinner{animation:spin 1s linear infinite;border:3px solid #e3f2fd;border-radius:50%;border-top-color:#2196f3;height:32px;width:32px}.loading-indicator p{color:#666;font-size:14px;font-weight:500;margin:0}.success-message{animation:slideInFromTop .3s ease-out;background:linear-gradient(135deg,#4caf50,#45a049);border-radius:12px;box-shadow:0 4px 12px #4caf504d;color:#fff;font-size:16px;font-weight:500;gap:12px;margin:16px 0;padding:16px 0}.success-icon,.success-message{align-items:center;display:flex;justify-content:center}.success-icon{background:#fff3;border-radius:50%;height:28px;width:28px}.error-message{align-items:center;animation:slideInFromTop .3s ease-out;background-color:#fff;border:2px solid #dc3545;border-radius:8px;box-shadow:0 2px 8px #dc354526;color:#dc3545;display:flex;font-size:16px;font-weight:500;justify-content:center;margin:10px 0;padding:12px 16px}.error-message p,.error-message--crop{color:#dc3545;margin:0}.error-message--crop{background-color:#fff;border:2px solid #dc3545;bottom:80px;box-shadow:0 4px 16px #dc354540;left:50%;max-width:80%;position:absolute;text-align:center;transform:translateX(-50%);z-index:1000}@keyframes slideInFromTop{0%{opacity:0;transform:translateY(-20px)}to{opacity:1;transform:translateY(0)}}@keyframes spin{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}.crop-container{align-items:center;background-color:#fff;border-radius:12px;box-shadow:0 2px 8px #0000000d;display:flex;flex-direction:column;gap:16px;width:100%}.crop-image-wrapper{background-color:#000;border-radius:8px;margin:0 auto;max-width:500px;overflow:hidden;width:100%}.crop-source-image{display:block;max-width:100%}.crop-instructions{color:#333;color:var(--text-primary);font-size:14px;text-align:center}.crop-instructions p{margin:5px 0}.crop-actions{display:flex;gap:12px;justify-content:space-between;max-width:300px;width:100%}.cancel-button{background-color:#8e8e8e;color:#fff}.image-preview-section{display:flex;flex-direction:column;gap:16px;width:100%}.image-preview-container{align-items:center;display:flex;justify-content:center;overflow:hidden;width:100%}.image-preview{border-radius:8px;height:auto;width:100%}.image-actions{display:flex;gap:12px;justify-content:space-between;padding:0 8px}.action-button{align-items:center;border:none;border-radius:24px;cursor:pointer;display:flex;flex:1 1;font-size:15px;font-weight:500;gap:6px;justify-content:center;padding:10px 16px;transition:all .2s ease}.reselect-button{background-color:#8e8e8e;color:#fff}.confirm-button{background-color:#ff4757;background-color:var(--primary-color);color:#fff}.reselect-button:active{background-color:#777}.confirm-button:active{background-color:#ff3a4c}.upload-instructions{padding:16px}.upload-instructions h3{color:#ff4757;color:var(--primary-color);font-size:20px;font-weight:300;letter-spacing:.1em;padding-bottom:5px}.instructions-text{color:#333;color:var(--text-primary);font-size:16px;letter-spacing:.05em;line-height:1.5;margin-bottom:12px;text-align:justify}.instructions-icon{color:#ff4757;color:var(--primary-color);font-weight:700;line-height:1.5;padding-right:5px}@media (max-width:767px){.crop-actions{flex-direction:row;width:100%}.action-button{width:100%}}:root{--primary-color:#ff4757;--text-primary:#333;--text-secondary:#666}.session-indicator{align-items:center;background:linear-gradient(135deg,#28a745,#20c997);border-radius:10px;box-shadow:0 2px 8px #28a7454d;color:#fff;display:flex;font-size:14px;font-weight:500;gap:8px;justify-content:center;margin-bottom:16px;padding:12px 16px}.session-indicator.disconnected{background:linear-gradient(135deg,#ffc107,#fd7e14);box-shadow:0 2px 8px #ffc1074d;color:#212529}.session-icon{font-size:16px}.session-text{font-weight:600}.session-hint{font-size:12px;margin-left:8px;opacity:.8}.session-id-short{background:#fff3;border-radius:4px;font-family:Courier New,monospace;font-size:12px;padding:2px 6px}.upload-success-page{align-items:center;animation:fadeIn .3s ease-in-out;bottom:0;display:flex;justify-content:center;left:0;position:fixed;right:0;top:0;z-index:2000}@keyframes fadeIn{0%{opacity:0;transform:scale(.9)}to{opacity:1;transform:scale(1)}}.success-content{align-items:center;animation:slideUp .4s ease-out .1s both;display:flex;flex-direction:column;padding:10px 30px;text-align:center}@keyframes slideUp{0%{opacity:0;transform:translateY(30px)}to{opacity:1;transform:translateY(0)}}.success-icon-large{animation:bounce .6s ease-out .3s both;margin-bottom:20px}@keyframes bounce{0%{transform:scale(0)}50%{transform:scale(1.1)}to{transform:scale(1)}}.success-title{color:#2c3e50;font-size:28px;font-weight:700;letter-spacing:.2rem;line-height:1.2;margin:0 0 12px}.success-description{color:#5a6c7d;font-size:18px;letter-spacing:.05em;line-height:1.5;margin:0 0 30px}@media (max-width:480px){.success-content{padding:30px 20px}.success-title{font-size:28px}.success-description{font-size:18px}}
/*# sourceMappingURL=main.794f7c16.css.map*/