.upper-canvas{display:block!important;opacity:1!important;visibility:visible!important}.upper-canvas{background:rgba(255,0,0,.3)!important;outline:4px solid #0f0!important;z-index:9999!important;pointer-events:auto!important;position:absolute!important;width:100%!important;height:100%!important;top:0!important;left:0!important;right:0!important;bottom:0!important}.quote-creator-container{min-height:100vh;background:linear-gradient(135deg,#ff6b35 0%,#f4511e 100%);padding:.25rem 0}.quote-creator-header{text-align:center;margin-bottom:.25rem;color:#fff}.quote-creator-header h1{font-size:2.5rem;font-weight:bold;margin-bottom:.5rem;text-shadow:2px 2px 4px rgba(0,0,0,.3)}.quote-creator-header p{font-size:1.1rem;opacity:.9}.quote-workspace{background:#fff;border-radius:15px;box-shadow:0 10px 30px rgba(0,0,0,.2);overflow:hidden;margin:0 auto;max-width:1400px}.editor-toolbar{position:sticky;top:0;z-index:5;display:flex;align-items:center;gap:.5rem;padding:.5rem .75rem;background:#fff;border-bottom:1px solid #e9ecef}.btn-icon{border:1px solid #e9ecef;background:#f8f9fa;color:#495057;border-radius:6px;padding:.4rem .6rem;font-size:.9rem;cursor:pointer}.btn-icon:hover{background:#eef2f7}.btn-icon.primary{background:linear-gradient(135deg,#ff6b35 0%,#f4511e 100%);color:#fff;border-color:transparent}.toolbar-divider{width:1px;height:24px;background:#e9ecef}.toolbar-spacer{flex:1}.canvas-section{padding:.1rem .5rem;display:flex;justify-content:center;align-items:flex-start}.quote-canvas-wrap{max-width:100%;width:100%;aspect-ratio:16/9;min-width:320px;min-height:180px;background:transparent;position:relative;z-index:1;border:2px solid #dee2e6;border-radius:8px;overflow:hidden}.quote-canvas-wrap .canvas-container{margin:0 auto;position:relative;width:100%!important;height:100%!important;top:0;left:0;right:0;bottom:0}.quote-canvas-wrap .canvas-container{outline:0!important;background:transparent!important}.quote-canvas-wrap .canvas-container .upper-canvas{position:absolute!important;z-index:10!important;pointer-events:auto!important;width:100%!important;height:100%!important;top:0;left:0;right:0;bottom:0;background:transparent!important;outline:0!important}.quote-canvas-wrap .canvas-container .lower-canvas{position:absolute!important;z-index:1!important;width:100%!important;height:100%!important;top:0;left:0;right:0;bottom:0;background:transparent!important}.canvas-loading{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1rem;padding:2rem}.spinner{width:50px;height:50px;border:4px solid #f3f3f3;border-top:4px solid #ff6b35;border-radius:50%;animation:spin 1s linear infinite}@keyframes spin{0%{transform:rotate(0deg)}100%{transform:rotate(360deg)}}.canvas-loading p{color:#6c757d;font-size:1rem;margin:0}#quoteCanvas{display:block}.quote-canvas-wrap .canvas-container .upper-canvas{position:absolute!important;z-index:10!important;pointer-events:auto!important}.quote-canvas-wrap .canvas-container .lower-canvas{position:absolute!important;z-index:1!important}.controls-section{padding:.25rem .5rem;border-top:1px solid #dee2e6}.background-selectors{margin-bottom:1rem;transition:all .3s ease}.background-selectors.collapsed{max-height:0;padding-top:0;padding-bottom:0;margin-bottom:0;overflow:hidden}.background-selectors h4{color:#495057;margin-bottom:1rem;font-weight:600}.preset-colors{margin-top:.5rem;padding-top:.5rem;border-top:1px solid #e9ecef}.preset-colors h5{font-size:.9rem;color:#6c757d;margin-bottom:.75rem;font-weight:600}.preset-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:.5rem}.preset-btn{width:100%;aspect-ratio:1;border:2px solid #dee2e6;border-radius:8px;cursor:pointer;transition:all .2s ease}.preset-btn:hover{transform:scale(1.05);border-color:#ff6b35;box-shadow:0 2px 8px rgba(244,81,30,.3)}.text-controls{background:#f8f9fa;border-radius:10px;padding:.5rem;margin-top:.25rem}@media(max-width:768px){.quote-creator-header h1{margin:.25rem 0;font-size:1.4rem}.quote-creator-header p{display:none}.editor-toolbar{padding:.25rem .5rem}.btn-icon{padding:.3rem .45rem;font-size:.85rem}.canvas-section{padding:0 .5rem}.controls-section{padding:.25rem .5rem}.text-controls{padding:.5rem;margin-top:.25rem}}.text-controls h4{color:#495057;margin-bottom:1rem;font-weight:600}.control-group{margin-bottom:1rem}.control-group label{display:block;margin-bottom:.5rem;color:#6c757d;font-weight:500;font-size:.9rem}.control-row{display:grid;grid-template-columns:1fr 1fr;gap:1rem}.control-row-3{display:grid;grid-template-columns:1fr 1fr 1fr;gap:1rem}.form-control,.form-select{border:2px solid #e9ecef;border-radius:8px;padding:.5rem .6rem;font-size:.9rem;transition:border-color .3s ease}.form-control:focus,.form-select:focus{border-color:#ff6b35;box-shadow:0 0 0 .2rem rgba(255,107,53,.25);outline:0}.color-input{width:100%;height:36px;border:2px solid #e9ecef;border-radius:8px;cursor:pointer;transition:border-color .3s ease}.color-input:hover{border-color:#ff6b35}.form-range{width:100%}.range-value{display:inline-block;margin-left:.5rem;font-weight:600;color:#495057;min-width:30px}.btn-group{display:flex;gap:0}.btn-align{flex:1;padding:.5rem;border:1px solid #e9ecef;background:#fff;cursor:pointer;transition:all .2s ease}.btn-align:first-child{border-radius:6px 0 0 6px}.btn-align:last-child{border-radius:0 6px 6px 0}.btn-align:not(:first-child){border-left:0}.btn-align:hover{background:#f8f9fa;border-color:#ff6b35}.text-properties-panel{background:#fff;border:2px solid #e9ecef;border-radius:10px;padding:1rem;margin-top:.75rem;opacity:.6;transition:opacity .3s ease}.text-properties-panel.active{opacity:1;border-color:#ff6b35}.text-properties-panel:not(.active){max-height:0;padding:0;margin-top:0;border:0;overflow:hidden}.action-buttons{display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:1rem;margin-top:1rem}.btn-action{padding:.75rem 1.5rem;border:0;border-radius:8px;font-weight:600;font-size:.9rem;cursor:pointer;transition:all .3s ease;text-transform:uppercase;letter-spacing:.5px}.btn-primary-custom{background:linear-gradient(135deg,#ff6b35 0%,#f4511e 100%);color:#fff;box-shadow:0 3px 10px rgba(244,81,30,.3)}.btn-primary-custom:hover{transform:translateY(-2px);box-shadow:0 5px 15px rgba(244,81,30,.4)}.btn-success-custom{background:linear-gradient(135deg,#ff6b35 0%,#f4511e 100%);color:#fff;box-shadow:0 3px 10px rgba(255,107,53,.3)}.btn-success-custom:hover{transform:translateY(-2px);box-shadow:0 5px 15px rgba(255,107,53,.4)}.btn-action:disabled{opacity:.5;cursor:not-allowed;transform:none!important}::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-track{background:#f1f1f1;border-radius:10px}::-webkit-scrollbar-thumb{background:#ff6b35;border-radius:10px}::-webkit-scrollbar-thumb:hover{background:#f4511e}@media(max-width:768px){.quote-creator-container{padding:.5rem 0}.quote-creator-header h1{font-size:1.75rem}.quote-creator-header p{font-size:.95rem}.canvas-section{padding:.5rem;min-height:200px}.quote-canvas-wrap{padding:.5rem}#quoteCanvas{border-width:1px}.controls-section{padding:.75rem}.editor-toolbar{flex-wrap:wrap;padding:.5rem;gap:.25rem}.btn-icon{font-size:.8rem;padding:.35rem .5rem}.control-row,.control-row-3{grid-template-columns:1fr}.preset-grid{grid-template-columns:repeat(3,1fr)}.action-buttons{grid-template-columns:1fr}.text-controls,.background-selectors{padding:.75rem}.text-controls h4,.background-selectors h4{font-size:1rem;margin-bottom:.75rem}}@media(max-width:480px){.quote-creator-header h1{font-size:1.5rem}.canvas-section{padding:.25rem}.quote-canvas-wrap{padding:.25rem}}