.art-style-label,.art-style-modal-label{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border:1px solid rgba(0,0,0,.1);border-radius:12px;bottom:8px;box-shadow:0 2px 8px #00000026;font-size:11px;font-weight:600;left:8px;line-height:1.2;max-width:calc(100% - 16px);padding:4px 8px;position:absolute;right:8px;text-align:center;z-index:10}.art-style-label,.art-style-modal-label{background:#fffffff2;color:#333;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.art-style-modal-label{border-radius:10px;bottom:6px;font-size:10px;left:6px;max-width:calc(100% - 12px);padding:3px 6px;right:6px}.art-style-grid{display:flex;flex-direction:column;gap:16px}.art-style-row{display:flex;gap:12px;justify-content:flex-start}.art-style-item{flex:1;max-width:120px;min-width:80px;position:relative}.art-style-item input:checked+label{border-color:#66bb6a!important;box-shadow:0 4px 16px #66bb6a66!important;transform:translateY(-2px)!important}.art-style-card,.art-style-modal-card{aspect-ratio:1;background:#fff;border:2px solid hsla(0,0%,100%,.8);border-radius:16px;box-shadow:0 4px 16px #00000014,0 2px 4px #0000000a;cursor:pointer;display:flex;flex-direction:column;overflow:hidden;position:relative;transform:translateY(0);transition:all .3s cubic-bezier(.25,.8,.25,1)}.art-style-card:hover,.art-style-modal-card:hover{border-color:#66bb6a66;box-shadow:0 8px 24px #0000001f,0 4px 8px #00000014;transform:translateY(-3px) scale(1.02)}.art-style-card.selected,.art-style-modal-card.selected,.art-type-radio:checked+.art-style-card,.modal-radio:checked+.art-style-modal-card{border-color:#66bb6a;box-shadow:0 6px 20px #66bb6a4d,0 3px 6px #66bb6a33;transform:translateY(-2px)}.art-style-img-wrapper,.art-style-modal-img-wrapper{align-items:center;border-radius:16px;display:flex;height:100%;justify-content:center;overflow:hidden;position:relative;width:100%}.art-style-img,.art-style-modal-img{height:100%;object-fit:cover;transition:transform .3s ease;width:100%}.art-style-card:hover .art-style-img,.art-style-modal-card:hover .art-style-modal-img{transform:scale(1.05)}.art-style-modal-title,.art-style-title{background-color:#f8f9ff;color:#333;font-size:13px;font-weight:500;line-height:1.2;padding:6px 8px;text-align:center}.art-style-more{align-items:center;aspect-ratio:1;background:linear-gradient(135deg,#66bb6a0d,#81c78408);border:2px dashed rgba(102,187,106,.4);border-radius:16px;cursor:pointer;display:flex;flex-direction:column;height:100%;justify-content:center;position:relative;transition:all .3s cubic-bezier(.25,.8,.25,1);width:100%}.art-style-more:hover{background:linear-gradient(135deg,#66bb6a1f,#81c78414);border-color:#66bb6a;box-shadow:0 4px 12px #66bb6a33;transform:translateY(-2px) scale(1.02)}.art-style-more.selected{background:linear-gradient(135deg,#66bb6a26,#81c7841a);border-color:#66bb6a;box-shadow:0 4px 16px #66bb6a4d;transform:translateY(-2px)}.art-style-more:before{color:#558b2f;content:"more";display:block;font-size:10px;font-weight:600;margin-bottom:4px}.art-style-more-count{color:#2e7d32;font-size:16px;font-weight:700}.art-type-radio:checked+.art-style-card:after,.modal-radio:checked+.art-style-modal-card:after{background:#4ade80;background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' stroke='%23fff' viewBox='0 0 24 24'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' stroke-width='3' d='m5 13 4 4L19 7'/%3E%3C/svg%3E");background-position:50%;background-repeat:no-repeat;background-size:14px;border:2px solid #fff;border-radius:50%;box-shadow:0 2px 8px #4ade8066;content:"";height:24px;position:absolute;right:8px;top:8px;width:24px;z-index:20}.modal-radio:checked+.art-style-modal-card:after{background-size:13px;box-shadow:0 3px 10px #4ade8080;height:22px;width:22px}.art-style-modal-overlay{align-items:center;align-items:center!important;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);background:linear-gradient(135deg,#000000b3,#00000080);display:flex;height:100vh;justify-content:center;justify-content:center!important;left:0;opacity:0;overflow:hidden;padding:1rem;position:fixed;top:0;transition:opacity .18s ease-out;visibility:hidden;width:100vw;will-change:opacity;z-index:99999}.art-style-modal-overlay.active{opacity:1;visibility:visible}.art-style-modal{background:linear-gradient(135deg,#fff,#f8f9ff);border:1px solid hsla(0,0%,100%,.2);border-radius:24px;box-shadow:0 24px 48px #0003,0 8px 16px #0000001a;left:50%!important;margin:0 auto;margin:0!important;max-height:85vh;max-width:900px;overflow:hidden;position:relative;position:absolute!important;top:50%!important;transform:translate(-50%,-50%) translateY(30px) scale(.95)!important;transition:transform .18s ease-out;width:90%;will-change:transform;z-index:100000}.art-style-modal-overlay.active .art-style-modal{transform:translate(-50%,-50%) translateY(0) scale(1)!important}.art-style-modal-header{align-items:center;background:linear-gradient(135deg,#66bb6a1a,#81c7840d);border-bottom:1px solid rgba(0,0,0,.08);display:flex;justify-content:space-between;padding:20px 24px;position:relative;z-index:10001}.art-style-modal-header:before{content:"🎨";font-size:24px;margin-right:10px}.art-style-modal-header h3{align-items:center;color:#2c3e50;display:flex;font-size:20px;font-weight:700;margin:0}.art-style-modal-body{background:linear-gradient(135deg,#fff,#fafbff);contain:content;max-height:calc(85vh - 90px);overflow-y:auto;padding:24px}.art-style-modal-close{align-items:center;background:linear-gradient(135deg,#fff,#f0f0f0);border:1px solid rgba(0,0,0,.1);border-radius:50%;box-shadow:0 2px 8px #0000001a;color:#666;cursor:pointer;display:flex;height:36px;justify-content:center;margin-left:12px;transition:all .3s cubic-bezier(.25,.8,.25,1);width:36px;z-index:10002}.art-style-modal-close:hover{background:linear-gradient(135deg,#ff6b6b,#ee5a52);box-shadow:0 4px 12px #ff6b6b4d;color:#fff;transform:scale(1.1)}.art-style-modal-close svg{height:1.25rem;transition:transform .3s ease;width:1.25rem}.art-style-modal-close:hover svg{transform:rotate(90deg)}.art-style-modal-grid{display:grid;gap:16px;grid-template-columns:repeat(5,1fr);justify-items:center;padding:8px}.art-style-modal-item{animation:modalItemFadeIn .4s ease forwards;max-width:160px;position:relative;width:100%}@keyframes modalItemFadeIn{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}@media (max-width:768px){.art-style-grid{gap:16px}.art-style-row{gap:12px}.art-style-item{flex-basis:calc(33.33% - 8px);max-width:calc(33.33% - 8px);min-width:80px}.art-style-label,.art-style-modal-label{background:#fffffff2;border-radius:10px;bottom:6px;box-shadow:0 2px 6px #00000026;color:#333;font-size:10px;left:6px;max-width:calc(100% - 12px);overflow:hidden;padding:3px 6px;right:6px;text-overflow:ellipsis;white-space:nowrap}.art-style-modal{border-radius:20px!important;max-height:80vh!important;max-width:none!important;width:95%!important}.art-style-modal-grid{gap:20px;grid-template-columns:repeat(2,1fr);justify-items:center;padding:0 16px}.art-style-modal-item{max-width:140px;width:100%}.art-style-modal-header{background:linear-gradient(135deg,#66bb6a26,#81c78414);border-bottom:1px solid rgba(102,187,106,.2);padding:18px 20px}.art-style-modal-header:before{font-size:28px;margin-right:8px}.art-style-modal-header h3{color:#1b5e20;font-size:18px;font-weight:700}.art-style-modal-body{background:linear-gradient(135deg,#fff,#f8fffe);max-height:calc(80vh - 100px);padding:20px 16px}.art-style-modal-close{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:linear-gradient(135deg,#ffffffe6,#f8f9ffe6);box-shadow:0 4px 12px #00000026;height:32px;width:32px}.art-style-modal-close:hover{background:linear-gradient(135deg,#ff6b6b,#ee5a52);transform:scale(1.05)}.art-style-card,.art-style-modal-card{border-radius:14px;box-shadow:0 3px 12px #00000014,0 1px 3px #0000000f}.art-style-card:hover,.art-style-modal-card:hover{box-shadow:0 6px 16px #0000001a;transform:translateY(-2px) scale(1.01)}.art-style-more{background:linear-gradient(135deg,#66bb6a0d,#81c78408);border:2px dashed rgba(102,187,106,.4);border-radius:14px}.art-style-more:hover{background:linear-gradient(135deg,#66bb6a1a,#81c7840d);border-color:#66bb6a;transform:translateY(-1px)}.art-style-more:before{color:#558b2f;font-size:9px;font-weight:600}.art-style-more-count{color:#2e7d32;font-size:15px;font-weight:700}.art-style-modal-overlay{-webkit-backdrop-filter:none;backdrop-filter:none}}@media (max-width:480px){.art-style-item{min-width:70px}.art-style-modal{border-radius:16px!important;max-height:75vh!important;width:98%!important}.art-style-modal-grid{gap:16px;grid-template-columns:repeat(2,1fr);padding:0 8px}.art-style-modal-item{max-width:130px}.art-style-modal-body{max-height:calc(75vh - 90px);padding:16px 12px}.art-style-modal-header{padding:16px}.art-style-modal-header h3{font-size:16px}}@media (min-width:769px){.art-style-item{flex-basis:calc(33.33% - 8px);max-width:calc(33.33% - 8px)}.art-style-modal-grid{gap:24px;grid-template-columns:repeat(5,1fr);padding:16px}.art-style-modal-item{max-width:150px}.art-style-modal{border-radius:20px;box-shadow:0 25px 50px #0003,0 10px 20px #0000001a;max-width:1000px}.art-style-modal-header{background:linear-gradient(135deg,#66bb6a1a,#81c7840d);border-bottom:1px solid rgba(102,187,106,.15);padding:24px 28px}.art-style-modal-header h3{color:#1b5e20;font-size:22px;font-weight:700}.art-style-modal-body{background:linear-gradient(135deg,#fff,#fafbff);padding:28px}.art-style-modal-close{-webkit-backdrop-filter:blur(15px);backdrop-filter:blur(15px);background:linear-gradient(135deg,#fffffff2,#f8f9fff2);border:1px solid hsla(0,0%,100%,.2);box-shadow:0 4px 12px #0000001a;height:40px;width:40px}.art-style-modal-close svg{height:1.4rem;width:1.4rem}.art-style-card:hover,.art-style-modal-card:hover{border-color:#66bb6a66;box-shadow:0 12px 28px #00000026,0 6px 12px #0000001a;transform:translateY(-4px) scale(1.03)}.art-style-more:hover{box-shadow:0 8px 20px #66bb6a33;transform:translateY(-3px) scale(1.02)}.art-style-more-count{font-size:18px;font-weight:700}.art-style-label,.art-style-modal-label{background:#fffffff2;color:#333;font-size:12px;max-width:calc(100% - 16px);overflow:hidden;padding:4px 8px;text-overflow:ellipsis;white-space:nowrap}}.art-style-modal-body,.cascade-option-group{scrollbar-width:none;-ms-overflow-style:none;scroll-behavior:smooth;-webkit-overflow-scrolling:touch}.art-style-modal-body::-webkit-scrollbar,.cascade-option-group::-webkit-scrollbar{display:none;height:0;width:0}.modal{@apply fixed inset-0 z-50 flex items-center justify-center opacity-0 pointer-events-none transition-all duration-500;background-color:#000000fa}.modal-open{@apply opacity-100 pointer-events-auto;}.modal-box{@apply bg-transparent rounded-xl shadow-2xl transform scale-95 transition-all duration-500;max-width:100vw;width:100vw}.modal-open .modal-box{@apply scale-100;}.modal-image-container{align-items:center;display:flex;height:95vh;justify-content:center;padding:.25rem}#modal-image{border:2px solid hsla(0,0%,100%,.15);border-radius:.5rem;box-shadow:0 20px 50px #00000080;max-height:95vh;max-width:95vw;object-fit:contain;opacity:0;transform:scale(.95);transition:opacity .7s ease,transform .7s ease}#modal-image.loaded{opacity:1;transform:scale(1.1)}.btn-circle{@apply rounded-full w-12 h-12 min-h-0 p-0 flex items-center justify-center;transition:all .3s ease}.btn-glass{@apply bg-black bg-opacity-30 backdrop-blur-md text-white border-transparent;box-shadow:0 8px 32px #0000004d}.btn-glass:hover{@apply bg-red-500 bg-opacity-70 text-white transform scale-110;}.modal-backdrop{cursor:pointer;top:0;right:0;bottom:0;left:0;position:absolute}.modal-backdrop button{opacity:0;position:absolute}.gallery-card img{transition:opacity .8s ease,transform .8s ease}.gallery-card figure{border-radius:.75rem;box-shadow:0 4px 15px #0000001a;overflow:hidden;position:relative;transition:all .3s ease}.gallery-card figure:after{background:#fff3;bottom:0;content:"";left:0;opacity:0;pointer-events:none;position:absolute;right:0;top:0;transition:opacity .3s ease}.gallery-card:hover figure:after{opacity:1}.gallery-card:active figure:after{background:#0000001a;opacity:1}.gallery-card figure:before{align-items:center;background:#00000080;border-radius:50%;color:#fff;content:"🔍";display:flex;font-size:24px;height:50px;justify-content:center;left:50%;opacity:0;position:absolute;top:50%;transform:translate(-50%,-50%) scale(0);transition:all .3s ease;width:50px;z-index:10}.gallery-card:hover figure:before{opacity:.9;transform:translate(-50%,-50%) scale(1)}.gallery-card{transition:box-shadow .3s ease}.gallery-card:hover{box-shadow:0 15px 30px #00000026}.canvas-result-image{display:block;margin:auto;max-height:100%;max-width:100%;object-fit:contain}.history-images-container{width:100%}.history-images-container .flex{overflow-x:auto;scrollbar-width:none;-ms-overflow-style:none;padding-bottom:4px}.history-images-container .flex::-webkit-scrollbar{display:none}.history-image-item{flex-shrink:0;transition:transform .2s ease}.history-image-item:hover{transform:translateY(-2px)}.blackboard-canvas{min-height:400px;position:relative;transition:all .3s ease}.blackboard-canvas.ready{background-color:transparent;border-color:#3b82f6;box-shadow:0 4px 6px -1px #0000001a,0 2px 4px -1px #0000000f}.blackboard-canvas.loading{background-color:transparent;border-color:#f59e0b}.blackboard-canvas.loading:before{animation:spin 1s linear infinite;border:2px solid #f59e0b;border-radius:50%;border-top-color:transparent;content:"";height:2rem;left:50%;position:absolute;top:50%;transform:translate(-50%,-50%);width:2rem}@keyframes spin{to{transform:translate(-50%,-50%) rotate(1turn)}}@media (min-width:769px){.canvas-production-container{display:flex;flex-direction:column;height:100%}.canvas-main-image-area{align-items:center;display:flex;flex:1;justify-content:center;max-height:calc(100% - 120px);min-height:0}.history-images-container{background:transparent;border-radius:8px;flex-shrink:0;height:100px}.history-image-item img{border-radius:6px;height:80px!important;object-fit:cover;width:80px!important}.history-images-container .flex{align-items:center;height:100%;padding:4px 0}.history-images-container h4{color:#6b7280;font-size:14px}.blackboard-canvas{min-height:calc(80vh - 45px - 2rem)}}@media (max-width:768px){.history-images-container{background:transparent;margin-top:16px;padding:8px}.history-image-item img{height:64px!important;width:64px!important}.blackboard-canvas{min-height:300px}}.flat-dropdown-container{box-sizing:border-box;overflow:visible;width:100%}.flat-dropdown-options{box-sizing:border-box;display:flex;flex-wrap:wrap;gap:.5rem;width:100%}.flat-dropdown-item{display:flex;flex:1;min-width:80px;position:relative;transition:all .3s ease}.flat-dropdown-content{align-items:center;background:#f1f8e9;border:2px solid transparent;border-radius:10px;box-sizing:border-box;color:#558b2f;cursor:pointer;display:flex;font-size:13px;font-weight:600;gap:.375rem;height:100%;justify-content:center;overflow:hidden;padding:11px;text-align:center;text-overflow:ellipsis;transition:all .3s ease;-webkit-user-select:none;user-select:none;width:100%}.flat-dropdown-content.with-icon{flex-direction:row;gap:.375rem;justify-content:center;padding:11px}.flat-dropdown-content.text-only{padding:11px}.flat-dropdown-icon{align-items:center;color:#558b2f;display:flex;flex-shrink:0;height:20px;justify-content:center;margin:0;transition:color .3s ease;width:20px}.flat-dropdown-icon svg{height:18px;width:18px}.flat-dropdown-title{color:#558b2f;font-size:13px;font-weight:600;overflow:hidden;text-overflow:ellipsis;transition:color .3s ease;white-space:nowrap}@media (min-width:769px){.flat-dropdown-item:hover .flat-dropdown-content{background:#e8f5e9;transform:translateY(-1px)}.flat-dropdown-item:hover .flat-dropdown-icon{color:#4b5563}.flat-dropdown-item:hover .flat-dropdown-title{color:#1f2937}.flat-dropdown-item:active .flat-dropdown-content{transform:scale(.98)}}.flat-dropdown-item.selected .flat-dropdown-content{background:linear-gradient(135deg,#66bb6a,#43a047);border-color:transparent;color:#fff}.flat-dropdown-item.selected .flat-dropdown-icon{color:#fff}.flat-dropdown-item.selected .flat-dropdown-title{color:#fff;font-weight:600}@media (min-width:769px){.flat-dropdown-item.selected .flat-dropdown-content{box-shadow:0 4px 12px #4caf504d}}.flat-dropdown-item:focus-within .flat-dropdown-content{outline:2px solid #228b22;outline-offset:2px}@media (max-width:768px){.flat-dropdown-content{font-size:12px;padding:9px}}@media (max-width:640px){.flat-dropdown-options{gap:.375rem}.flat-dropdown-content{font-size:11px;padding:8px}.flat-dropdown-content.with-icon{gap:.25rem;padding:8px}.flat-dropdown-icon{height:18px;width:18px}.flat-dropdown-icon svg{height:16px;width:16px}.flat-dropdown-title{font-size:11px}}@media (max-width:480px){.flat-dropdown-content{font-size:10px;padding:7px}.flat-dropdown-content.with-icon{padding:7px}.flat-dropdown-title{font-size:10px}}@media print{.flat-dropdown-content{background:#fff!important;border:1px solid #000!important;box-shadow:none!important}.flat-dropdown-item.selected .flat-dropdown-content{background:#f3f4f6!important;border-width:2px!important}}@media (prefers-reduced-motion:reduce){.flat-dropdown-content,.flat-dropdown-icon,.flat-dropdown-item,.flat-dropdown-title{transition:none!important}}.upload-area *{box-sizing:border-box}.uploaded-state.hidden{display:none!important}.delete-btn{background-color:#000000b3!important;transition:opacity .2s ease-in-out,transform .2s ease-in-out!important}.delete-btn:hover{background-color:#000c!important;transform:scale(1.05)!important}@keyframes upload-pulse{0%,to{opacity:.6}50%{opacity:1}}.uploaded-state{align-items:center!important;background:#fffffff2!important;bottom:0!important;display:flex!important;justify-content:center!important;left:0!important;padding:10px!important;position:absolute!important;right:0!important;top:0!important}.uploaded-state img{border-radius:12px!important;max-height:100%!important;max-width:100%!important;object-fit:contain!important}@media (max-width:768px){.upload-area{border-radius:14px!important;padding:30px 16px!important}}@media (max-width:480px){.upload-area{border-radius:12px!important;padding:25px 12px!important}}.control-panel-container{display:flex;flex-direction:column;overflow:hidden;position:relative}.control-panel-mobile.glassmorphism-container{height:auto!important}.control-panel-mobile.glassmorphism-container .control-panel-content{flex:none!important;max-height:none!important;overflow-y:visible!important;padding-bottom:0!important}.control-panel-mobile.glassmorphism-container{flex:none!important;max-height:none!important;overflow:visible!important;padding-bottom:0!important}.control-panel-content{flex:1;overflow-y:auto;padding-bottom:80px;scrollbar-width:thin}.control-panel-content.has-credit{padding-bottom:130px}.control-panel-fixed-buttons{background-color:#fff;border-top:1px solid rgba(0,0,0,.05);bottom:0;box-shadow:0 -4px 12px #0000000d;display:flex;gap:16px;left:0;padding:16px;position:absolute;right:0;z-index:10}.create-mode-container{background:rgba(var(--primary),.05);border-radius:1rem;display:flex;margin-bottom:1.5rem;overflow:hidden;padding:.25rem;position:relative}.art-carousel-arrow svg,.faq-toggle svg{height:1.5rem;width:1.5rem}.mode-option{border-radius:.75rem;color:rgb(var(--dark),.7);cursor:pointer;flex:1;font-weight:500;padding:.65rem 1rem;position:relative;text-align:center;transition:all .3s ease;z-index:2}.mode-option.active{color:#fff}.mode-slider{background:var(--gradient-primary);border-radius:.75rem;bottom:.25rem;box-shadow:0 4px 15px rgba(var(--primary),.3);left:.25rem;position:absolute;top:.25rem;transition:transform .3s ease;width:calc(50% - .5rem);z-index:1}.mode-slider.right{transform:translate(100%)}.control-panel-content,.control-panel-scrollable{scrollbar-width:none;-ms-overflow-style:none;scroll-behavior:smooth;-webkit-overflow-scrolling:touch}.control-panel-content::-webkit-scrollbar,.control-panel-scrollable::-webkit-scrollbar{display:none;height:0;width:0}.control-panel-content::-webkit-scrollbar{width:4px}.control-panel-content::-webkit-scrollbar-thumb{background-color:#0000001a;border-radius:4px}.create-mode-content-wrapper{margin-bottom:1rem;min-height:auto;position:relative;width:100%}.create-mode-content{height:0;left:0;opacity:0;overflow:hidden;pointer-events:none;position:absolute;top:0;transition:opacity .3s ease,visibility .3s ease;visibility:hidden;width:100%}.create-mode-content.active{height:auto;opacity:1;overflow:visible;pointer-events:auto;position:relative;visibility:visible}@media (max-width:768px){.glassmorphism-container.control-panel-mobile{border-radius:24px!important;overflow:visible!important;padding:28px 20px!important}.control-panel-mobile .control-panel-content{flex:none!important;max-height:none!important;overflow-y:visible!important;padding-bottom:0!important}.control-panel-mobile .control-panel-fixed-buttons{background-color:transparent!important;border-radius:0!important;border-top:none!important;bottom:auto!important;box-shadow:none!important;left:auto!important;margin:0!important;padding:0!important;position:relative!important;right:auto!important}}@media (max-width:480px){.glassmorphism-container.control-panel-mobile{border-radius:20px!important;padding:20px 16px!important}.control-panel-mobile .control-panel-fixed-buttons{background-color:transparent;border-top:none;gap:.5rem!important;margin:0!important;padding:0!important}}.help-icon-container{align-items:center;display:inline-flex;justify-content:center;position:relative}.help-tooltip{background-color:#333333f2;border-radius:.5rem;bottom:120%;box-shadow:0 4px 8px #00000026;color:#fff;font-size:.875rem;line-height:1.4;max-width:280px;min-width:200px;padding:.5rem .75rem;position:absolute;right:-10px;transform:translate(0);transition:opacity .2s ease,visibility .2s ease;z-index:50}.help-tooltip:after{border-left:8px solid transparent;border-right:8px solid transparent;border-top:8px solid rgba(51,51,51,.95);bottom:-8px;content:"";height:0;position:absolute;right:12px;width:0}.text-gray-400{color:#9ca3af}@keyframes fadeIn{0%{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}.help-tooltip.visible{animation:fadeIn .2s ease-out forwards}.control-panel-container-separated{display:flex;flex-direction:column;position:relative}.control-panel-content-separated{display:flex;flex-direction:column;gap:1rem}.component-card{animation:fadeIn .3s ease-out;border:1px solid rgba(0,0,0,.05)}.component-card:hover{border-color:rgba(var(--green-700,21,128,61),.1)}@media (max-width:768px){.control-panel-container-separated{padding:0}.control-panel-content-separated{gap:.5rem}.component-card{border-radius:1.5rem;margin-bottom:0;padding:1rem}.component-card:last-child{margin-bottom:0}}@media (max-width:480px){.control-panel-content-separated{gap:.375rem}.component-card{border-radius:1.25rem;padding:.75rem}}.control-panel-mobile.control-panel-container-separated{height:auto!important;overflow:visible!important}.control-panel-mobile .control-panel-content-separated{overflow-y:visible!important;padding-bottom:0!important}.shadow-soft{box-shadow:0 4px 12px #0000000f}.shadow-accent{box-shadow:0 8px 25px #15803d26}.texture-border{border:1px solid rgba(0,0,0,.06)}.glassmorphism-container{backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);background:#ffffffd9;border-radius:32px;box-shadow:0 24px 64px #00000012,inset 0 0 0 1px #ffffff80,inset 0 2px 4px #fffc;overflow:hidden;padding:20px 16px;position:relative;transition:all .3s cubic-bezier(.4,0,.2,1)}.glassmorphism-container:before{animation:borderRotate 10s linear infinite;background:linear-gradient(45deg,#4caf5080,#9c27b080,#ff980080,#4caf5080);border-radius:32px;bottom:0;content:"";left:0;-webkit-mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);-webkit-mask-composite:xor;mask-composite:exclude;opacity:0;padding:2px;position:absolute;right:0;top:0;transition:opacity .3s;z-index:-1}@keyframes borderRotate{0%{transform:rotate(0)}to{transform:rotate(1turn)}}.glassmorphism-container:hover:before{opacity:.6}@media (max-width:768px){.glassmorphism-container{border-radius:24px;margin-bottom:8px;padding:16px}.glassmorphism-container:before{animation:none;border-radius:24px}}@media (max-width:480px){.glassmorphism-container{border-radius:20px;padding:12px}.glassmorphism-container:before{animation:none;border-radius:20px}}.card-icon{align-items:center;background:linear-gradient(135deg,#c5e1a5,#aed581);border-radius:8px;box-shadow:0 2px 4px #aed58133;color:#2e7d32;display:flex;flex-shrink:0;font-size:16px;height:32px;justify-content:center;transition:all .3s ease;width:32px}.card-icon:hover{background:linear-gradient(135deg,#aed581,#9ccc65);box-shadow:0 4px 8px #aed5814d;transform:scale(1.05)}@media (max-width:768px){.card-icon{border-radius:7px;font-size:14px;height:28px;width:28px}}@media (max-width:480px){.card-icon{border-radius:6px;font-size:12px;height:24px;width:24px}}#generate-btn,.generate-button{align-items:center;background:linear-gradient(135deg,#66bb6a,#43a047);border:none;border-radius:12px;box-shadow:0 4px 15px #4caf504d;color:#fff;cursor:pointer;display:flex;flex:1;font-size:14px;font-weight:600;gap:8px;justify-content:center;min-width:160px;padding:13px;transform:translateY(0);transition:all .3s ease;width:100%}#generate-btn:hover,.generate-button:hover{box-shadow:0 6px 20px #4caf5066;transform:translateY(-2px)}#regenerate-btn{align-items:center;background:#fff;border:2px solid #e8f5e9;border-radius:12px;color:#558b2f;cursor:pointer;display:flex;flex:1;font-size:14px;font-weight:600;gap:8px;justify-content:center;min-width:140px;padding:13px;transform:translateY(0);transition:all .3s ease}#regenerate-btn:hover{background:#f1f8e9;border-color:#81c784;box-shadow:0 4px 12px #81c7844d;transform:translateY(-2px)}.btn-secondary{align-items:center;background:#fff;border:2px solid #e8f5e9;border-radius:12px;color:#558b2f;cursor:pointer;display:flex;flex:1;font-size:14px;font-weight:600;gap:8px;justify-content:center;min-width:140px;padding:13px;transform:translateY(0);transition:all .3s ease}.btn-secondary:hover{background:#f1f8e9;border-color:#81c784;box-shadow:0 4px 12px #81c7844d;transform:translateY(-2px)}#generate-btn svg,#regenerate-btn svg,.generate-button svg{height:1.5rem;width:1.5rem}#regenerate-btn svg{flex-shrink:0}.control-panel-fixed-buttons .generate-button,.control-panel-fixed-buttons button{min-height:46px;padding:.6rem .8rem}.control-panel-mobile.glassmorphism-container .control-panel-fixed-buttons{align-items:center!important;background-color:transparent!important;border-radius:0!important;border-top:none!important;bottom:auto!important;box-shadow:none!important;display:flex!important;justify-content:center!important;left:auto!important;margin:0!important;padding:0!important;position:relative!important;right:auto!important}@media (max-width:768px){.control-panel-mobile .control-panel-fixed-buttons{background-color:transparent!important;border-top:none!important;box-shadow:none!important;margin:0!important;padding:0!important}.control-panel-fixed-buttons .generate-button,.control-panel-fixed-buttons button{font-size:1rem;min-height:52px;padding:1rem 1.2rem}#generate-btn,.generate-button{gap:.6rem;padding:1rem 1.2rem}#regenerate-btn,.btn-secondary{gap:.6rem;min-width:130px;padding:1rem 1.2rem}}@media (max-width:480px){.control-panel-mobile .control-panel-fixed-buttons{background-color:transparent!important;border-top:none!important;box-shadow:none!important;margin:0!important;padding:0!important}#generate-btn,#regenerate-btn,.btn-secondary,.generate-button{font-size:14px;min-height:48px;min-width:140px;padding:14px}}.vertical-tools-container{display:flex;flex-direction:column;gap:1.5rem;margin:0 auto;max-width:48rem;width:100%}.vertical-tools-container .vertical-control-panel{display:flex;flex-direction:column;gap:1rem;width:100%}.vertical-tools-container .vertical-result-display{margin-top:2rem;width:100%}.vertical-tools-container .chat-input{border-radius:1rem;box-shadow:0 1px 3px var(--vt-shadow-color);overflow:hidden;transition:box-shadow .3s ease}.vertical-tools-container .chat-input:focus-within{box-shadow:0 4px 6px var(--vt-shadow-color)}.vertical-tools-container .chat-input textarea{border:none;color:var(--vt-text-color);font-size:1rem;max-height:12rem;min-height:3rem;outline:none;padding:.75rem 1rem;resize:none;transition:border-color .3s ease;width:100%}.vertical-tools-container .chat-input .button-row{background-color:var(--vt-background-color);border-top:1px solid var(--vt-border-color);display:flex;justify-content:space-between;padding:.5rem 1rem}.vertical-tools-container .chat-input .left-buttons,.vertical-tools-container .chat-input .right-buttons{align-items:center;display:flex;gap:.5rem}.vertical-tools-container .dropdown-group{display:flex;flex-wrap:wrap;gap:.5rem;justify-content:center}.vertical-tools-container .dropdown-group .btn{align-items:center;background-color:#fff;border:1px solid var(--vt-border-color);border-radius:.5rem;color:var(--vt-text-color);cursor:pointer;display:flex;font-size:.875rem;font-weight:500;gap:.5rem;padding:.5rem .75rem;transition:all .2s ease}.vertical-tools-container .dropdown-group .btn:hover{background-color:var(--vt-background-color)}.vertical-tools-container .dropdown-group .btn.selected{background-color:var(--vt-primary-color);border-color:var(--vt-primary-color);color:#fff}.vertical-tools-container .dropdown-group .btn svg{height:1rem;width:1rem}.vertical-tools-container .result-display{border-radius:1rem;box-shadow:0 2px 4px var(--vt-shadow-color);overflow:hidden}.vertical-tools-container .submit-btn{background-color:var(--vt-secondary-color);border:none;color:#fff;cursor:pointer}@media (max-width:640px){.vertical-tools-container{padding:1rem}.vertical-tools-container .dropdown-group{justify-content:flex-start}.vertical-tools-container .chat-input textarea{font-size:.875rem}}