:root{font-family:system-ui,Avenir,Helvetica,Arial,sans-serif;line-height:1.5;font-weight:400;color-scheme:light dark;color:#ffffffde;background-color:#242424;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}a{font-weight:500;color:#646cff;text-decoration:inherit}a:hover{color:#535bf2}body{margin:0;display:flex;place-items:center;min-width:320px;min-height:100vh;overflow-y:auto;overflow-x:hidden}h1{font-size:24px;line-height:1.1}button{border-radius:8px;border:1px solid transparent;padding:.6em 1.2em;font-size:1em;font-weight:500;font-family:inherit;background-color:#1a1a1a;cursor:pointer;transition:border-color .25s}button:hover{border-color:#646cff}button:focus,button:focus-visible{outline:4px auto -webkit-focus-ring-color}@media (prefers-color-scheme: light){:root{color:#213547;background-color:#fff}a:hover{color:#747bff}button{background-color:#f9f9f9}}:root{--primary: #3a86ff;--secondary: #8338ec;--accent: #ff006e;--background: #f8f9fa;--card-bg: #ffffff;--text-primary: #212529;--text-secondary: #6c757d;--border-color: #e9ecef;--shadow: 0 4px 6px rgba(0, 0, 0, .05);--green: #43aa8b;--yellow: #f9c74f;--red: #f94144;--radius: 8px;--padding-standard: 20px}html.dark-mode,html.dark-mode body{--background: #1a1a2e;--card-bg: #16213e;--text-primary: #e6e6e6;--text-secondary: #b0b0b0;--border-color: #2a2a3a;--shadow: 0 4px 6px rgba(0, 0, 0, .2)}.dark-mode header h1{background:linear-gradient(135deg,#4a96ff,#a358ff);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.dark-mode .scenario-header,.dark-mode .form-header,.dark-mode .message-header,.dark-mode .scenario-quick-info{background-color:#16213eb3}.dark-mode .message-format-indicator{background-color:#1a1a2ecc}.dark-mode textarea{background-color:#16213eb3;color:var(--text-primary);border-color:var(--border-color)}.dark-mode .model-response-container{background-color:#16213e80;border-color:var(--border-color)}.dark-mode .model-response-badge{background-color:#1a1a2ecc}.dark-mode .evaluation-results h2:after,.dark-mode .improvement-section h3:after,.dark-mode .model-response-section h3:after{background-color:var(--primary)}*{box-sizing:border-box;margin:0;padding:0;font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Open Sans,Helvetica Neue,sans-serif}html,body{height:100%;width:100%;overflow-y:auto}body{background-color:var(--background);color:var(--text-primary);line-height:1.5;display:flex;justify-content:center;min-height:100vh;overflow-y:auto}.transition-ready body{transition:background-color .3s ease,color .3s ease}#root{width:100%;display:flex;justify-content:center;overflow-y:auto}.app-container{width:100%;margin:0 auto;max-height:100vh}header{text-align:center;margin-bottom:2.5rem}header h1{font-size:2.5rem;margin-bottom:.5rem;background:linear-gradient(135deg,var(--primary),var(--secondary));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}header p{color:var(--text-secondary);font-size:1.1rem}.theme-toggle{margin-top:1rem;padding:.5rem 1rem;border-radius:20px;border:1px solid var(--border-color);background-color:var(--card-bg);color:var(--text-primary);cursor:pointer;font-size:.9rem;display:inline-flex;align-items:center;gap:.5rem;transition:all .3s ease}.theme-toggle:hover{background-color:var(--border-color)}.vertical-layout{display:flex;flex-direction:column;gap:2rem;overflow-y:visible;margin-bottom:2rem}.card{background-color:var(--card-bg);border-radius:var(--radius);box-shadow:var(--shadow);border:1px solid var(--border-color);transition:all .3s ease;width:100%}.loading-card{padding:3rem;text-align:center}.evaluation-loading-card{padding:3rem;text-align:center;background-color:var(--card-bg);animation:pulse 2s infinite}.evaluation-loading-card .loading-indicator{display:flex;flex-direction:column;align-items:center;gap:1.5rem}.evaluation-loading-card .spinner{border-top-color:var(--accent)}.evaluation-loading-card p{font-size:1.1rem;color:var(--text-secondary)}@keyframes pulse{0%{box-shadow:0 0 #ff006e1a}70%{box-shadow:0 0 0 10px #ff006e00}to{box-shadow:0 0 #ff006e00}}.loading-indicator{display:flex;flex-direction:column;align-items:center;gap:1rem}.spinner{width:48px;height:48px;border:5px solid var(--border-color);border-top-color:var(--primary);border-radius:50%;animation:spin 1s linear infinite}.spinner-small{display:inline-block;width:16px;height:16px;border:2px solid rgba(255,255,255,.3);border-top-color:#fff;border-radius:50%;animation:spin 1s linear infinite;margin-right:8px;vertical-align:middle}@keyframes spin{to{transform:rotate(360deg)}}.scenario-card,.response-card,.message-response-card,.response-display-card{display:flex;flex-direction:column;overflow:hidden}.scenario-header,.form-header,.message-header{padding:1.25rem;border-bottom:1px solid var(--border-color);display:flex;align-items:center;justify-content:space-between;background-color:#f8f9fa80}.scenario-header h2,.form-header h2,.message-header h2{font-size:1.25rem;font-weight:600;color:var(--text-primary);margin:0}.scenario-tag{background-color:var(--primary);color:#fff;font-size:.75rem;font-weight:500;padding:.25rem .75rem;border-radius:100px}.message-format-indicator{display:flex;align-items:center;gap:.5rem;font-size:.875rem;font-weight:500;padding:.25rem .75rem;background-color:#f8f9facc;border-radius:100px;border:1px solid var(--border-color)}.format-icon{font-size:1rem}.scenario-content{padding:1.25rem;flex-grow:1;display:flex;flex-direction:column;gap:1.25rem}.scenario-section{display:flex;flex-direction:column;gap:1rem}.context-text,.challenge-text{font-size:.95rem;line-height:1.6}.scenario-quick-info{background-color:#f8f9fa80;border-radius:var(--radius);padding:1rem;display:flex;flex-direction:column;gap:.75rem}.quick-info-item{display:flex;align-items:center;gap:.5rem;font-size:.875rem}.quick-info-icon{font-size:1rem}.quick-info-label{font-weight:600;color:var(--text-secondary)}.quick-info-value{color:var(--text-primary)}.received-message-container,.user-response-container{display:flex;flex-direction:column}.received-message,.user-response{background-color:var(--card-bg);position:relative}.received-message{border-left:4px solid var(--primary)}.user-response{border-left:4px solid var(--accent)}.message-text{padding:1.25rem;font-size:.95rem;line-height:1.6;color:var(--text-primary)}.message-header-info{display:flex;align-items:center;gap:.75rem;padding:1.25rem 1.25rem 0}.profile-picture{width:2.5rem;height:2.5rem;border-radius:50%;background-color:#6c757d;color:#fff;display:flex;align-items:center;justify-content:center;font-weight:600;font-size:.95rem}.sender-name{font-weight:600;font-size:.95rem;color:var(--text-primary)}form{display:flex;flex-direction:column;height:100%}.form-group{display:flex;flex-direction:column;flex-grow:1}.reply-label{display:flex;align-items:center;gap:.5rem;padding:.75rem 1.25rem;background-color:#3a86ff0d;font-size:.9rem;font-weight:500;border-bottom:1px solid var(--border-color)}.reply-icon{font-size:1rem}textarea{flex-grow:1;resize:none;padding:1.25rem;border:none;background-color:#fff;color:var(--text-primary);font-size:.95rem;line-height:1.6;margin-bottom:0;min-height:150px;transition:background-color .3s ease,color .3s ease}textarea:focus{outline:none;background-color:#f8f9fa80}.submit-button{background-color:var(--primary);color:#fff;border:none;padding:1rem;font-size:1rem;font-weight:600;cursor:pointer;transition:background-color .2s;border-radius:0 0 var(--radius) var(--radius)}.submit-button:hover{background-color:#2978ff}.submit-button:disabled{background-color:var(--text-secondary);cursor:not-allowed}.error-message{background-color:#f941441a;color:var(--red);padding:1rem;margin:1rem 0;border-radius:var(--radius);text-align:center;font-size:.95rem}.evaluation-results{background-color:var(--card-bg);border-radius:var(--radius);box-shadow:var(--shadow);border:1px solid var(--border-color);padding:2rem}.evaluation-results h2{margin-bottom:1.5rem;font-size:1.5rem;position:relative;display:inline-block}.evaluation-results h2:after{content:"";position:absolute;bottom:-.5rem;left:0;width:40px;height:3px;background-color:var(--primary)}.overall-score-container{display:flex;align-items:flex-start;gap:2rem;margin-bottom:2rem;padding-bottom:2rem;border-bottom:1px solid var(--border-color)}.overall-score{display:flex;flex-direction:column;align-items:center;gap:.5rem}.score-circle{display:flex;align-items:center;justify-content:center;width:80px;height:80px;border-radius:50%;font-size:1.75rem;font-weight:700;color:#fff}.score-label{font-size:.875rem;font-weight:600;color:var(--text-secondary)}.evaluation-summary{flex:1;font-size:1rem;line-height:1.6}.criteria-scores{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:1rem;margin-bottom:2rem}.score-card{display:flex;flex-direction:column;align-items:center;gap:.5rem;padding:1rem;background-color:#f8f9fa80;border-radius:var(--radius);border:1px solid var(--border-color)}.criterion-name{font-size:.9rem;font-weight:600;color:var(--text-secondary)}.criterion-score{display:flex;align-items:center;justify-content:center;width:40px;height:40px;border-radius:50%;font-size:1rem;font-weight:700;color:#fff}.improvement-section,.model-response-section{margin-bottom:2rem;padding:0 0 1.5rem}.improvement-section h3,.model-response-section h3{font-size:1.1rem;margin-bottom:1rem;color:var(--text-primary);position:relative;display:inline-block}.improvement-section h3:after,.model-response-section h3:after{content:"";position:absolute;bottom:-.5rem;left:0;width:30px;height:2px;background-color:var(--primary)}.improvements-list{list-style-type:none;display:flex;flex-direction:column;gap:.75rem}.improvements-list li{position:relative;padding-left:1.5rem;font-size:.95rem;line-height:1.5}.improvements-list li:before{content:"•";position:absolute;left:.5rem;color:var(--primary);font-weight:700}.model-response-container{background-color:#43aa8b0d;border:1px solid rgba(67,170,139,.2);border-radius:var(--radius);overflow:hidden}.model-response-header{padding:.75rem 1rem;background-color:#43aa8b1a;display:flex;align-items:center}.model-response-badge{display:flex;align-items:center;gap:.5rem;font-size:.875rem;font-weight:600;color:var(--green)}.badge-icon{font-size:1rem}.model-response-content{padding:1.25rem}.model-response-content p{font-size:.95rem;line-height:1.6;color:var(--text-primary)}.action-buttons{display:flex;gap:1rem;margin-top:2rem}.primary-button,.secondary-button{padding:.75rem 1.5rem;font-size:.95rem;font-weight:600;border-radius:var(--radius);cursor:pointer;transition:all .2s}.primary-button{background-color:var(--primary);color:#fff;border:none}.primary-button:hover{background-color:#2978ff}.secondary-button{background-color:#fff;color:var(--text-primary);border:1px solid var(--border-color)}.secondary-button:hover{background-color:#f8f9facc}@media (max-width: 900px){.app-container{padding:1.5rem;max-height:none}.overall-score-container{flex-direction:column;gap:1.5rem}.criteria-scores{grid-template-columns:repeat(auto-fit,minmax(150px,1fr))}}@media (max-width: 600px){.app-container{padding:1rem}.criteria-scores{grid-template-columns:repeat(2,1fr)}.evaluation-results{padding:1.5rem}.action-buttons{flex-direction:column}}.dark-mode .received-message{border-left:4px solid var(--primary)}.dark-mode .user-response{border-left:4px solid var(--accent)}.dark-mode .profile-picture{background-color:#4a4a5a}.auth-page{display:flex;justify-content:center;align-items:center;min-height:calc(100vh - 150px)}.auth-form-container{width:100%;max-width:500px}.auth-card{background-color:var(--card-bg);border-radius:12px;box-shadow:0 4px 24px #0000001a;padding:40px}.auth-card h2{color:var(--text-primary);text-align:center;margin-bottom:30px;font-size:26px}.auth-form{display:flex;flex-direction:column;gap:20px}.auth-form .form-group{display:flex;flex-direction:column;gap:8px}.auth-form label{color:var(--text-secondary);font-weight:500;font-size:14px}.auth-form input{padding:12px 16px;border-radius:8px;border:1px solid var(--border-color);background-color:var(--input-bg);color:var(--text-primary);font-size:16px;transition:border-color .3s,box-shadow .3s}.auth-form input:focus{outline:none;border-color:var(--primary-color);box-shadow:0 0 0 2px #407bff33}.auth-button{background-color:var(--primary-color);color:#fff;border:none;border-radius:8px;padding:14px;font-size:16px;font-weight:600;cursor:pointer;transition:background-color .3s;margin-top:10px}.auth-button:hover{background-color:var(--primary-hover)}.auth-button:disabled{background-color:var(--disabled-color);cursor:not-allowed}.auth-toggle{margin-top:25px;text-align:center;color:var(--text-secondary)}.toggle-button{background:none;border:none;color:var(--primary-color);font-weight:600;cursor:pointer;padding:0;margin-left:5px}.toggle-button:hover{text-decoration:underline}.auth-error{background-color:#ff63471a;color:tomato;padding:12px;border-radius:8px;font-size:14px;margin-bottom:5px}.field-error{color:tomato;font-size:13px;margin-top:4px}.header-controls{display:flex;align-items:center;gap:16px}.user-profile{display:flex;align-items:center;gap:16px;background-color:var(--card-bg);padding:8px 16px;border-radius:50px;box-shadow:0 2px 8px #0000001a}.user-info{display:flex;align-items:center;gap:12px}.user-avatar{width:32px;height:32px;background-color:var(--primary-color);color:#fff;border-radius:50%;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:14px}.user-details{display:flex;flex-direction:column}.user-details h3{font-size:14px;margin:0;color:var(--text-primary)}.user-details p{font-size:12px;margin:0;color:var(--text-secondary)}.logout-button{background:none;border:none;color:var(--text-secondary);font-size:13px;cursor:pointer;padding:6px 12px;border-radius:4px;transition:background-color .3s}.logout-button:hover{background-color:var(--hover-bg)}.loading-screen{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:calc(100vh - 150px);gap:20px}.dark-mode .auth-card{background-color:var(--card-bg)}.dark-mode .auth-form input{background-color:var(--input-bg);color:var(--text-primary);border-color:var(--border-color)}.dark-mode .auth-form input::placeholder{color:var(--text-tertiary)}@media (max-width: 600px){.auth-card{padding:30px 20px}.auth-form input{padding:10px 14px}.user-profile{padding:6px 12px}.user-details h3{font-size:13px}}.password-strength{display:flex;align-items:center;margin-top:.5rem;gap:10px}.strength-meter{display:flex;flex:1;gap:4px}.strength-segment{height:4px;flex:1;background-color:var(--border-color);border-radius:2px;transition:background-color .3s}.strength-label{font-size:.75rem;font-weight:500;min-width:60px;text-align:right}.scenario-mode-toggle{display:flex;justify-content:center;margin-bottom:2rem;border-radius:var(--radius);overflow:hidden;border:1px solid var(--border-color);width:fit-content;margin-left:auto;margin-right:auto;background-color:var(--card-bg);box-shadow:var(--shadow)}.scenario-mode-toggle button{padding:.75rem 1.5rem;background-color:transparent;border:none;color:var(--text-primary);font-weight:500;font-size:.9rem;cursor:pointer;transition:all .2s;min-width:180px;position:relative}.scenario-mode-toggle button.active{background-color:var(--primary);color:#fff}.scenario-mode-toggle button:not(.active):hover{background-color:#3a86ff1a}.dark-mode .scenario-mode-toggle{background-color:#16213eb3;border-color:var(--border-color)}.dark-mode .scenario-mode-toggle button:not(.active){color:var(--text-primary)}.dark-mode .scenario-mode-toggle button:not(.active):hover{background-color:#3a86ff1a}.form-actions{display:flex;gap:1rem;justify-content:flex-end;padding:1.25rem;border-top:1px solid var(--border-color);background-color:#f8f9fa80}.dark-mode .form-actions{background-color:#16213eb3}@media (max-width: 600px){.scenario-mode-toggle{width:100%}.scenario-mode-toggle button{min-width:0;flex:1;padding:.75rem .5rem;font-size:.8rem}.form-actions{flex-direction:column}}.scenario-generator-card{border:1px solid var(--border-color);transition:all .3s ease}.generator-intro{margin-bottom:1.5rem;font-size:.95rem;line-height:1.6;color:var(--text-secondary)}.preferences-form{display:flex;flex-direction:column;gap:1.25rem;margin-bottom:2rem}.preference-group{display:flex;flex-direction:column;gap:.5rem}.preference-group label{font-size:.9rem;font-weight:600;color:var(--text-primary)}.preference-select{width:100%;padding:.75rem;border-radius:var(--radius);border:1px solid var(--border-color);background-color:var(--card-bg);color:var(--text-primary);font-size:.9rem;transition:all .3s ease;-webkit-appearance:none;-moz-appearance:none;appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'%3E%3C/path%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 1rem center;cursor:pointer}.preference-select:focus{outline:none;border-color:var(--primary);box-shadow:0 0 0 2px #3a86ff33}.dark-mode .preference-select{background-color:#16213eb3;border-color:var(--border-color);color:var(--text-primary);background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%23e6e6e6' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'%3E%3C/path%3E%3C/svg%3E")}.generate-button{width:100%;background-color:var(--primary);color:#fff;border:none;padding:.9rem;font-size:1rem;font-weight:600;border-radius:var(--radius);cursor:pointer;transition:background-color .2s;display:flex;align-items:center;justify-content:center}.generate-button:hover{background-color:#2978ff}.generate-button:disabled{background-color:var(--text-secondary);cursor:not-allowed}@media (max-width: 600px){.preferences-form{gap:1rem}.preference-group label{font-size:.85rem}.preference-select,.generate-button{padding:.7rem;font-size:.9rem}}.navbar{display:flex;justify-content:space-between;align-items:center;padding:1rem 0;margin-bottom:2rem;position:relative}.navbar-brand{text-align:left}.navbar-brand h1{font-size:2rem;margin-bottom:.25rem;background:linear-gradient(135deg,var(--primary),var(--secondary));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.navbar-tagline{color:var(--text-secondary);font-size:.9rem}.navbar-actions{display:flex;align-items:center;gap:1rem}.user-profile{position:relative}.user-avatar{width:2.5rem;height:2.5rem;border-radius:50%;background-color:var(--primary);color:#fff;display:flex;align-items:center;justify-content:center;font-weight:600;font-size:1rem;cursor:pointer;box-shadow:0 2px 5px #0000001a;transition:all .2s}.user-avatar:hover{transform:translateY(-2px);box-shadow:0 4px 8px #00000026}.dropdown-menu{position:absolute;top:calc(100% + .5rem);right:0;width:220px;background-color:var(--card-bg);border-radius:var(--radius);box-shadow:0 4px 12px #00000026;border:1px solid var(--border-color);z-index:100;overflow:hidden;animation:dropdown-fade-in .2s ease}.dropdown-header{padding:1rem;border-bottom:1px solid var(--border-color)}.dropdown-user-info{display:flex;flex-direction:column;gap:.25rem}.dropdown-name{font-weight:600;font-size:.95rem;color:var(--text-primary)}.dropdown-email{font-size:.8rem;color:var(--text-secondary)}.dropdown-divider{border-bottom:1px solid var(--border-color)}.dropdown-items{padding:.5rem}.dropdown-item{display:flex;align-items:center;gap:.75rem;width:100%;padding:.75rem;border-radius:var(--radius);border:none;background-color:transparent;color:var(--text-primary);font-size:.9rem;text-align:left;cursor:pointer;transition:background-color .2s}.dropdown-item:hover{background-color:#3a86ff1a}.dropdown-icon{font-size:1rem}.dark-mode .dropdown-menu{background-color:var(--card-bg);border-color:var(--border-color)}.dark-mode .dropdown-item:hover{background-color:#3a86ff26}@media (max-width: 600px){.navbar{flex-direction:column;align-items:flex-start;gap:1rem}.navbar-actions{width:100%;justify-content:space-between}.dropdown-menu{width:200px}}.dropdown-error{background-color:#f941441a;color:var(--red);margin:.5rem;padding:.5rem .75rem;border-radius:var(--radius);font-size:.8rem;text-align:center}.dropdown-item:disabled{opacity:.6;cursor:not-allowed;background-color:transparent!important}.dropdown-item:disabled:hover{background-color:transparent!important}.dark-mode .dropdown-error{background-color:#f9414426}.logout-debug-button{background-color:#ff4757;color:#fff;border:none;padding:.5rem 1rem;border-radius:4px;font-size:.8rem;cursor:pointer;margin-left:.5rem}.logout-debug-button:hover{background-color:#ff6b81}.typeform-style{display:flex;justify-content:center;align-items:center;min-height:calc(100vh - 80px);background-color:#f8f9fa}.auth-content{display:flex;width:100%;border-radius:8px;overflow:hidden;box-shadow:0 10px 30px #00000014}.typeform-style .auth-form-container{width:40%;max-width:none;background-color:#fff;height:100%;display:flex;flex-direction:column;overflow-y:auto;overflow-x:hidden}.typeform-style .auth-card{width:100%;height:100%;padding:40px;border-radius:0;box-shadow:none;display:flex;flex-direction:column}.typeform-style .auth-card h2{text-align:left;font-size:32px;font-weight:700;color:#212529;margin-bottom:10px}.auth-subtitle{color:#6c757d;margin-bottom:30px;font-size:16px;line-height:1.5}.auth-form-wrapper{display:flex;flex-direction:column;width:100%}.google-signin{margin-bottom:20px}.google-button{display:flex;align-items:center;justify-content:center;width:100%;padding:12px 16px;border:1px solid #e0e0e0;border-radius:6px;background-color:#fff;color:#212529;font-size:16px;font-weight:500;cursor:pointer;transition:all .2s}.google-button:hover{background-color:#f8f9fa}.google-button img{width:20px;height:20px;margin-right:10px}.auth-divider{display:flex;align-items:center;margin:20px 0;color:#6c757d}.auth-divider:before,.auth-divider:after{content:"";flex:1;height:1px;background-color:#e0e0e0}.auth-divider span{padding:0 15px;font-size:14px}.typeform-style .auth-form{display:flex;flex-direction:column;gap:16px;margin-bottom:20px}.typeform-style .form-group{margin-bottom:0}.typeform-style .form-group label{display:block;margin-bottom:8px;font-size:14px;font-weight:500;color:#212529}.input-icon-wrapper{position:relative;display:flex;align-items:center}.input-icon{position:absolute;left:12px;color:#6c757d;display:flex;align-items:center;justify-content:center}.typeform-style .form-group input{width:100%;padding:12px 16px;border:1px solid #e0e0e0;border-radius:6px;font-size:16px;color:#212529;background-color:#fff;transition:all .2s}.typeform-style .form-group input::placeholder{color:#a0a0a0}.typeform-style .form-group input:focus{border-color:#3a86ff;box-shadow:0 0 0 3px #3a86ff26;outline:none}.label-with-link{display:flex;justify-content:space-between;align-items:center;margin-bottom:8px}.forgot-password{font-size:14px;color:#3a86ff;text-decoration:none}.forgot-password:hover{text-decoration:underline}.typeform-style .auth-button{width:100%;padding:14px;border:none;border-radius:6px;background-color:#f9bb00;color:#fff;font-size:16px;font-weight:600;cursor:pointer;transition:all .2s;margin-top:10px}.typeform-style .auth-button:hover{background-color:#e5ac00}.typeform-style .auth-toggle{text-align:center;margin-top:20px;color:#6c757d;font-size:14px;padding:15px 0;border-top:1px solid #f0f0f0}.dark-mode .typeform-style .auth-toggle{border-top-color:#2a2a3a}.auth-link-button{background:none;border:none;color:#3a86ff;font-size:14px;font-weight:600;cursor:pointer;padding:0;margin-left:5px}.auth-link-button:hover{text-decoration:underline}.dark-mode .auth-link-button{color:#5a9aff}.dark-mode .auth-link-button:hover{color:#7aadff}.auth-preview{width:60%;height:initial;background-color:#f0d19f;padding:40px;display:flex;flex-direction:column;justify-content:center;align-items:center}.auth-preview-content{width:100%;max-width:400px;height:100%;display:flex;flex-direction:column;justify-content:center;position:relative}.preview-form{border-radius:8px;overflow:hidden;background-color:#fff;box-shadow:0 5px 15px #00000014;height:300px;display:flex;flex-direction:column;position:relative}.preview-form-header{padding:16px;border-bottom:1px solid #f0f0f0}.preview-logo-area{width:100px;height:20px;background-color:#f0f0f0;border-radius:4px}.preview-form-content{flex:1;display:flex;align-items:center;justify-content:center}.preview-text{text-align:center;color:#fff;padding:20px}.preview-text h3{font-size:24px;font-weight:700;margin-bottom:20px;color:#fff;text-shadow:0 1px 2px rgba(0,0,0,.1)}.preview-button{background-color:#000;color:#fff;border:none;border-radius:4px;padding:10px 24px;font-size:16px;font-weight:600;cursor:pointer}.preview-controls{display:flex;flex-direction:column;position:absolute;right:-80px;top:50%;transform:translateY(-50%);gap:20px}.theme-selector{display:flex;gap:10px;padding:10px;background-color:#fff;border-radius:50px;box-shadow:0 2px 10px #0000000d}.theme-dot{width:24px;height:24px;border-radius:50%;cursor:pointer;transition:all .2s}.theme-dot.active{transform:scale(1.2);box-shadow:0 2px 5px #0003}.theme-dot-brown{background-color:#f0d19f}.theme-dot-blue{background-color:#80d0ff}.theme-dot-white{background-color:#fff;border:1px solid #e0e0e0}.theme-dot-black{background-color:#000}.font-selector{background-color:#fff;padding:10px 15px;border-radius:50px;text-align:center;box-shadow:0 2px 10px #0000000d;font-size:14px;color:#212529}.optimize-button{background-color:#bf8035;padding:10px 15px;border-radius:8px;text-align:center;box-shadow:0 2px 10px #0000000d;font-size:14px;color:#fff;font-weight:500;display:flex;align-items:center;justify-content:center;cursor:pointer}.optimize-button:before{content:"✨";margin-right:5px}@media (max-width: 992px){.auth-content{flex-direction:column;height:auto;max-width:600px}.typeform-style .auth-form-container,.auth-preview{width:100%}.auth-preview{padding:30px;min-height:400px}.preview-controls{position:relative;right:0;top:0;transform:none;flex-direction:row;justify-content:center;margin-top:20px}}@media (max-width: 576px){.typeform-style{padding:0}.auth-content{height:100vh;border-radius:0;box-shadow:none}.typeform-style .auth-card{padding:30px 20px}.auth-preview{display:none}}.dark-mode .typeform-style{background-color:#1a1a2e}.dark-mode .typeform-style .auth-form-container{background-color:#16213e}.dark-mode .typeform-style .auth-card h2{color:#e6e6e6}.dark-mode .auth-subtitle{color:#b0b0b0}.dark-mode .google-button{background-color:#24294e;border-color:#2a2a3a;color:#e6e6e6}.dark-mode .google-button:hover{background-color:#2d335e}.dark-mode .auth-divider{color:#b0b0b0}.dark-mode .auth-divider:before,.dark-mode .auth-divider:after{background-color:#2a2a3a}.dark-mode .typeform-style .form-group label{color:#e6e6e6}.dark-mode .input-icon{color:#b0b0b0}.dark-mode .typeform-style .form-group input{background-color:#24294e;border-color:#2a2a3a;color:#e6e6e6}.dark-mode .typeform-style .form-group input::placeholder{color:#8a8a9a}.dark-mode .typeform-style .form-group input:focus{border-color:#3a86ff;box-shadow:0 0 0 3px #3a86ff40}.dark-mode .forgot-password,.dark-mode .single-sign-on-button{color:#5a9aff}.dark-mode .single-sign-on-button:hover{color:#7aadff}.typeform-navbar{display:flex;justify-content:space-between;align-items:center;padding:20px 40px;background-color:transparent;box-shadow:none}.typeform-navbar .navbar-brand h1{font-size:24px;font-weight:700;color:#212529;margin:0;background:none;-webkit-text-fill-color:initial}.dark-mode .typeform-navbar .navbar-brand h1{color:#e6e6e6;background:none;-webkit-text-fill-color:initial}.navbar-support{display:flex;align-items:center;margin-right:20px;font-size:14px;color:#6c757d}.contact-link{color:#212529;font-weight:500;text-decoration:none;margin-left:4px}.contact-link:hover{text-decoration:underline}.language-selector{display:flex;align-items:center;gap:5px;padding:8px 12px;border-radius:4px;cursor:pointer;font-size:14px;margin-right:15px;color:#212529}.language-selector:hover{background-color:#0000000d}.typeform-theme-toggle{background:none;border:none;font-size:18px;cursor:pointer;padding:8px;border-radius:4px;margin:0;color:#212529}.typeform-theme-toggle:hover{background-color:#0000000d}.dark-mode .typeform-navbar{color:#e6e6e6}.dark-mode .navbar-support{color:#b0b0b0}.dark-mode .contact-link,.dark-mode .language-selector{color:#e6e6e6}.dark-mode .language-selector:hover{background-color:#ffffff1a}.dark-mode .typeform-theme-toggle{color:#e6e6e6}.dark-mode .typeform-theme-toggle:hover{background-color:#ffffff1a}@media (max-width: 768px){.typeform-navbar{padding:15px 20px}.navbar-support{display:none}}.input-icon-wrapper input{padding-left:40px!important}.signature-field{position:relative}.signature-container{margin-top:12px}.signature-button{width:100%;min-height:120px;border:2px dashed #d1d5db;border-radius:8px;background:#fafafa;color:#6b7280;cursor:pointer;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;transition:all .2s ease;font-family:inherit;font-size:14px}.signature-button:hover{border-color:#9ca3af;background:#f3f4f6}.signature-button:focus{outline:none;border-color:var(--primary);box-shadow:0 0 0 3px #3a86ff1a}.signature-icon{font-size:24px}.signature-preview{border:1px solid #e5e7eb;border-radius:8px;padding:16px;background:#fff;min-height:120px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px}.signature-image{max-width:100%;max-height:180px;border:1px solid #e5e7eb;border-radius:4px}.signature-text{text-align:center;color:#111827}.signature-edit-button{background:var(--primary);color:#fff;border:none;padding:6px 12px;border-radius:4px;font-size:12px;cursor:pointer;transition:background-color .2s ease}.signature-edit-button:hover{background:#2978ff}.signature-modal-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:#00000080;display:flex;align-items:center;justify-content:center;z-index:1000;padding:20px}.signature-modal{background:#fff;border-radius:12px;width:100%;max-width:600px;max-height:80vh;overflow:hidden;box-shadow:0 25px 50px #00000040}.signature-modal-header{display:flex;align-items:center;justify-content:space-between;padding:24px 24px 16px;border-bottom:1px solid #e5e7eb;background:linear-gradient(135deg,#f8f9fa,#fff)}.signature-modal-header h2{margin:0;font-size:22px;font-weight:700;color:#111827;letter-spacing:-.025em}.signature-modal-close{background:#6b72801a;border:none;font-size:20px;cursor:pointer;color:#6b7280;width:36px;height:36px;display:flex;align-items:center;justify-content:center;border-radius:8px;transition:all .3s ease;font-weight:600}.signature-modal-close:hover{background:#ef44441a;color:#ef4444;transform:scale(1.05)}.signature-modal-content{padding:24px;max-height:60vh;overflow-y:auto;background:#fff}.signature-tabs{display:flex;background:#f8f9fa;border-radius:8px;padding:4px;margin-bottom:24px;gap:4px}.signature-tab{flex:1;padding:12px 20px;border:none;background:transparent;color:#6b7280;font-size:14px;font-weight:600;cursor:pointer;border-radius:6px;transition:all .3s ease;position:relative;text-align:center}.signature-tab:hover{color:#374151;background:#fff9}.signature-tab.active{color:var(--primary);background:#fff;box-shadow:0 2px 4px #0000001a;transform:translateY(-1px)}.signature-content{min-height:200px}.signature-type-section p,.signature-draw-section p,.signature-upload-section p{margin:0 0 16px;color:#374151;font-size:14px}.signature-font-selector{margin-bottom:20px}.signature-font-selector label{display:block;margin-bottom:8px;color:#374151;font-size:14px;font-weight:500}.font-selector-dropdown{width:100%;padding:8px 12px;border:1px solid #d1d5db;border-radius:6px;font-size:14px;background:#fff;color:#374151;cursor:pointer;transition:border-color .2s ease}.font-selector-dropdown:focus{outline:none;border-color:var(--primary);box-shadow:0 0 0 3px #3a86ff1a}.signature-typing-area{border:2px solid var(--primary);border-radius:8px;padding:20px;background:#fff;min-height:120px;position:relative}.signature-direct-input{width:100%;min-height:80px;font-size:36px;color:#374151;text-align:center;display:flex;align-items:center;justify-content:center;outline:none;border:none;resize:none;background:transparent;word-wrap:break-word;overflow-wrap:break-word;line-height:1.2}.signature-direct-input:empty:before{content:attr(data-placeholder);color:#9ca3af;font-style:italic;opacity:.7}.signature-direct-input:focus:empty:before{opacity:.5}.signature-font-dancing-script{font-family:Dancing Script,cursive!important}.signature-font-great-vibes{font-family:Great Vibes,cursive!important}.signature-font-allura{font-family:Allura,cursive!important}.signature-font-pacifico{font-family:Pacifico,cursive!important}.signature-font-sacramento{font-family:Sacramento,cursive!important}.signature-font-kaushan-script{font-family:Kaushan Script,cursive!important}.signature-font-satisfy{font-family:Satisfy,cursive!important}.signature-font-amatic-sc{font-family:Amatic SC,cursive!important}.signature-type-input{width:100%;padding:12px;border:1px solid #d1d5db;border-radius:6px;font-size:16px;transition:border-color .2s ease}.signature-type-input:focus{outline:none;border-color:var(--primary);box-shadow:0 0 0 3px #3a86ff1a}.signature-canvas-container{border:1px solid #d1d5db;border-radius:6px;background:#fff;margin-bottom:12px}.signature-canvas{width:100%;height:200px;cursor:crosshair;display:block}.signature-clear-button{background:#ef4444;color:#fff;border:none;padding:8px 16px;border-radius:4px;font-size:12px;cursor:pointer;transition:background-color .2s ease}.signature-clear-button:hover{background:#dc2626}.signature-upload-section{text-align:center}.signature-upload-area{border:2px dashed #d1d5db;border-radius:8px;padding:40px 20px;color:#6b7280;cursor:pointer;transition:all .2s ease;background:#fafafa}.signature-upload-area:hover{border-color:#3b82f6;background:#f0f9ff;color:#3b82f6}.signature-upload-preview{border:1px solid #e5e7eb;border-radius:8px;padding:16px;background:#fff}.signature-preview-image{max-width:100%;max-height:200px;border:1px solid #e5e7eb;border-radius:4px;margin-bottom:12px}.upload-actions{display:flex;gap:8px;justify-content:center}.upload-change-button{background:#3b82f6;color:#fff;border:none;padding:6px 12px;border-radius:4px;font-size:12px;cursor:pointer;transition:background-color .2s ease}.upload-change-button:hover{background:#2563eb}.upload-clear-button{background:#ef4444;color:#fff;border:none;padding:6px 12px;border-radius:4px;font-size:12px;cursor:pointer;transition:background-color .2s ease}.upload-clear-button:hover{background:#dc2626}.upload-file-info{margin-top:12px;padding:8px 12px;background:#f3f4f6;border-radius:4px;font-size:12px;color:#6b7280;display:flex;align-items:center;justify-content:center;gap:8px}.file-name{color:#374151;font-weight:500}.file-size{color:#9ca3af}.upload-error{margin-top:12px;padding:8px 12px;background:#fef2f2;border:1px solid #fecaca;border-radius:4px;color:#dc2626;font-size:12px}.upload-icon{font-size:32px;margin-bottom:12px}.signature-upload-placeholder p{margin:0 0 8px;font-size:16px;font-weight:500}.signature-upload-placeholder small{font-size:12px;color:#9ca3af}.signature-modal-footer{display:flex;gap:12px;justify-content:flex-end;padding:20px 24px 24px;border-top:1px solid #e5e7eb;background:#f8f9fa}.signature-cancel-button{background:#fff;border:1px solid #d1d5db;color:#374151;padding:12px 24px;border-radius:8px;font-size:14px;font-weight:600;cursor:pointer;transition:all .3s ease;box-shadow:0 1px 2px #0000000d}.signature-cancel-button:hover{background:#f9fafb;border-color:#9ca3af;transform:translateY(-1px);box-shadow:0 2px 4px #0000001a}.signature-submit-button{background:linear-gradient(135deg,var(--primary) 0%,#2563eb 100%);color:#fff;border:none;padding:12px 24px;border-radius:8px;font-size:14px;font-weight:600;cursor:pointer;transition:all .3s ease;box-shadow:0 2px 4px #3b82f64d}.signature-submit-button:hover:not(:disabled){background:linear-gradient(135deg,#2563eb,#1d4ed8);transform:translateY(-1px);box-shadow:0 4px 8px #3b82f666}.signature-submit-button:disabled{background:#9ca3af;cursor:not-allowed;transform:none;box-shadow:none}.dark-mode .signature-button{background:#16213eb3;border-color:var(--border-color);color:var(--text-secondary)}.dark-mode .signature-button:hover{background:#16213ee6;border-color:#4b5563}.dark-mode .signature-preview{background:var(--card-bg);border-color:var(--border-color)}.dark-mode .signature-modal{background:var(--card-bg);color:var(--text-primary)}.dark-mode .signature-modal-content{background:var(--card-bg)}.dark-mode .signature-modal-header{border-bottom-color:var(--border-color);background:linear-gradient(135deg,rgba(22,33,62,.9) 0%,var(--card-bg) 100%)}.dark-mode .signature-modal-header h2{color:var(--text-primary)}.dark-mode .signature-modal-close{background:#ffffff1a;color:var(--text-secondary)}.dark-mode .signature-modal-close:hover{background:#ef444433;color:#ef4444}.dark-mode .signature-tabs{background:#16213eb3}.dark-mode .signature-tab{color:var(--text-secondary)}.dark-mode .signature-tab:hover{color:var(--text-primary);background:#ffffff1a}.dark-mode .signature-tab.active{color:var(--primary);background:var(--card-bg);box-shadow:0 2px 8px #0000004d}.dark-mode .signature-font-selector label{color:var(--text-primary)}.dark-mode .font-selector-dropdown{background:#16213eb3;border-color:var(--border-color);color:var(--text-primary)}.dark-mode .font-selector-dropdown:focus{border-color:var(--primary);box-shadow:0 0 0 3px #3a86ff33}.dark-mode .signature-typing-area{background:#16213eb3;border-color:var(--primary)}.dark-mode .signature-direct-input{color:var(--text-primary)}.dark-mode .signature-direct-input:empty:before{color:var(--text-secondary)}.dark-mode .signature-type-input{background:#16213eb3;border-color:var(--border-color);color:var(--text-primary)}.dark-mode .signature-type-input:focus{border-color:var(--primary);box-shadow:0 0 0 3px #3a86ff33}.dark-mode .signature-canvas-container{border-color:var(--border-color);background:#fff}.dark-mode .signature-upload-area{border-color:var(--border-color);color:var(--text-secondary);background:#16213e4d}.dark-mode .signature-upload-area:hover{border-color:var(--primary);background:#3b82f61a;color:var(--primary)}.dark-mode .signature-upload-preview{background:var(--card-bg);border-color:var(--border-color)}.dark-mode .signature-preview-image{border-color:var(--border-color)}.dark-mode .upload-file-info{background:#16213e80;color:var(--text-secondary)}.dark-mode .file-name{color:var(--text-primary)}.dark-mode .upload-error{background:#ef44441a;border-color:#ef44444d;color:#fca5a5}.dark-mode .signature-modal-footer{border-top-color:var(--border-color);background:#16213eb3}.dark-mode .signature-cancel-button{background:var(--card-bg);border-color:var(--border-color);color:var(--text-primary);box-shadow:0 1px 2px #0003}.dark-mode .signature-cancel-button:hover{background:#ffffff1a;border-color:#4b5563;box-shadow:0 2px 4px #0000004d}:root{--primary-color: #4A90E2;--primary-color-hover: #4281CF;--background-color: #f8f9fa;--sidebar-background: #ffffff;--content-background: #fdfdfd;--card-background: #ffffff;--text-primary: #202124;--text-secondary: #5f6368;--border-color: #e0e2e6;--hover-bg-color: #f1f3f4;--active-bg-color: #e8f0fe;--active-text-color: var(--primary-color);--danger-color: #d93025;--shadow-sm: 0 1px 2px 0 rgba(0, 0, 0, .03);--shadow-md: 0 2px 4px -1px rgba(0, 0, 0, .05), 0 1px 2px -1px rgba(0, 0, 0, .03);--shadow-lg: 0 5px 10px -3px rgba(0, 0, 0, .05), 0 2px 4px -2px rgba(0, 0, 0, .03);--transition-fast: all .2s cubic-bezier(.4, 0, .2, 1)}@keyframes dropdown-fade-in{0%{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}.app-container{display:flex;flex-direction:column;height:100vh;width:100%;background-color:var(--background-color);color:var(--text-primary);font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica,Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji",Segoe UI Symbol}.main-content{display:flex;flex:1;overflow:hidden}.top-navbar{display:flex;align-items:center;justify-content:space-between;height:64px;padding:0 24px;background-color:#f5f5f5;z-index:10;border-bottom:1px solid var(--border-color)}.logo{display:flex;align-items:center;gap:12px;font-size:20px;font-weight:600}.logo .logo-text{color:#333}.logo svg{fill:#333;stroke:#333}.navbar-right{display:flex;align-items:center;gap:16px}.user-profile{display:flex;align-items:center;gap:8px;cursor:pointer;position:relative;padding:6px 10px;border-radius:8px;transition:var(--transition-fast);border:1px solid #d0d0d0;background-color:#fff;box-shadow:none}.user-profile:hover{background-color:#e8e8e8;border-color:#b0b0b0}.user-icon{width:24px;height:24px;background-color:#4a90e2;color:#fff;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:12px;font-weight:500}.username{font-weight:500;color:#333}.dropdown-icon-wrapper{display:flex;align-items:center;justify-content:center;color:#666;transition:transform .2s}.user-profile[aria-expanded=true] .dropdown-icon-wrapper{transform:rotate(180deg)}.upgrade-button{display:flex;align-items:center;gap:8px;padding:8px 12px;border:1px solid #d0d0d0;border-radius:8px;font-size:14px;font-weight:500;cursor:pointer;color:#333;background-color:#fff;transition:var(--transition-fast)}.upgrade-button:hover{background-color:#e8e8e8;border-color:#b0b0b0}.upgrade-button .upgrade-icon{color:#4a90e2}.sidebar{width:256px;background-color:var(--sidebar-background);border-right:1px solid var(--border-color);padding:24px 0;overflow-y:auto;flex-shrink:0;display:flex;flex-direction:column}.search-wrapper{padding:0 24px;margin-bottom:24px}.sidebar-search{width:100%;padding:10px 16px;border:1px solid var(--border-color);border-radius:8px;font-size:14px;background-color:var(--background-color);color:var(--text-primary);outline:none;transition:var(--transition-fast)}.sidebar-search:focus{border-color:var(--primary-color);box-shadow:0 0 0 2px var(--active-bg-color)}.create-form-button-container{padding:0 24px;margin-bottom:24px}.create-form-sidebar-btn{width:100%;padding:12px 0;display:flex;align-items:center;justify-content:center;gap:8px;background-color:#000;color:#fff;border:none;border-radius:8px;font-size:14px;font-weight:500;cursor:pointer;transition:var(--transition-fast)}.create-form-sidebar-btn:hover{background-color:#333}.workspaces-section{padding:0 16px;flex-grow:1}.section-header{display:flex;justify-content:space-between;align-items:center;padding:0 8px;margin-bottom:8px;font-size:13px;font-weight:600;color:var(--text-secondary);text-transform:uppercase;letter-spacing:.5px}.add-btn{width:28px;height:28px;background:none;border:none;color:var(--text-secondary);cursor:pointer;display:flex;align-items:center;justify-content:center;border-radius:6px;transition:var(--transition-fast);padding:0;min-width:28px;min-height:28px}.add-btn:hover{background-color:var(--hover-bg-color);color:var(--text-primary)}.add-btn svg{width:16px;height:16px;stroke:currentColor;flex-shrink:0}.workspace-list{display:flex;flex-direction:column;gap:4px}.workspace-item{display:flex;align-items:center;padding:8px 12px;border-radius:6px;cursor:pointer;font-size:14px;font-weight:500;color:var(--text-secondary);transition:var(--transition-fast)}.workspace-item:hover,.workspace-item.active{background-color:var(--active-bg-color);color:var(--active-text-color);font-weight:600}.workspace-icon{margin-right:10px;color:var(--text-secondary)}.workspace-name{flex:1}.workspace-count{color:var(--text-secondary);font-size:13px;font-weight:400}.workspace-item.active .workspace-count{color:var(--active-text-color)}.dashboard-content{flex:1;overflow-y:auto;background-color:var(--content-background);padding:0}.invite-btn{background:none;border:1px solid var(--border-color);border-radius:4px;padding:8px 12px;display:flex;align-items:center;gap:6px;cursor:pointer;font-size:14px;color:var(--text-primary)}.invite-btn .icon{font-size:16px}.dashboard-container{max-width:1200px;margin:0 auto;padding:20px}.dashboard-header{display:flex;justify-content:space-between;align-items:center;padding:24px 32px;border-bottom:1px solid var(--border-color);background-color:var(--content-background);margin-bottom:0;position:sticky;top:0;z-index:5}.workspace-title-container{display:flex;align-items:center;gap:12px}.workspace-title{font-size:28px;font-weight:600;color:var(--text-primary);margin:0}.workspace-menu-trigger{background:none;border:none;color:var(--text-secondary);cursor:pointer;width:36px;height:36px;display:flex;align-items:center;justify-content:center;border-radius:4px;transition:all .2s ease-in-out;opacity:.6}.workspace-title-container:hover .workspace-menu-trigger{opacity:1}.workspace-menu-trigger:hover{background-color:var(--hover-bg-color)}.workspace-menu-trigger svg{flex-shrink:0}.controls-section{display:flex;align-items:center;gap:12px}.date-selector{display:flex;align-items:center;background:var(--card-background);border:1px solid var(--border-color);border-radius:6px;padding:8px 12px;cursor:pointer;font-size:14px;color:var(--text-secondary);font-weight:500;transition:var(--transition-fast)}.date-selector:hover{background-color:var(--hover-bg-color)}.date-selector svg{margin-right:8px}.date-selector svg path{stroke:var(--text-secondary)}.view-toggle{display:flex;border:1px solid var(--border-color);border-radius:6px;overflow:hidden}.view-btn{background:var(--card-background);border:none;padding:8px 12px;cursor:pointer;color:var(--text-secondary)}.view-btn svg{display:block}.view-btn.active{background:var(--active-bg-color);color:var(--active-text-color)}.view-btn.active svg path,.view-btn.active svg rect{stroke:var(--active-text-color)}.user-actions{display:flex;gap:15px;align-items:center}.search-container{position:relative}.search-input{padding:10px 15px;border:1px solid var(--border-color);border-radius:4px;width:250px;font-size:14px;background-color:#fff;color:var(--text-primary)}.create-btn{background-color:var(--primary-color);color:#fff;border:none;border-radius:4px;padding:10px 20px;font-weight:500;cursor:pointer;display:flex;align-items:center;gap:8px;transition:var(--transition-fast)}.create-btn:hover{background-color:var(--primary-color-hover)}.plus-icon{font-size:18px;font-weight:700}.forms-container-wrapper{width:100%;height:calc(100% - 81px);overflow-y:auto;padding:32px;border:none;background-color:var(--background-color)}.forms-container{display:grid;gap:16px;width:100%}.forms-container.grid-view{grid-template-columns:repeat(4,1fr)}.forms-container.list-view{grid-template-columns:1fr;gap:8px}.form-card{background-color:var(--card-background);border-radius:8px;border:1px solid var(--border-color);padding:16px;cursor:pointer;transition:var(--transition-fast);display:flex;flex-direction:column;position:relative;height:120px;box-shadow:var(--shadow-sm)}.form-card.has-dropdown-open{z-index:20}.form-card:hover{border-color:var(--primary-color);box-shadow:var(--shadow-md);transform:translateY(-3px)}.form-card .options-menu{position:absolute;right:12px;top:12px;width:28px;height:28px;display:flex;align-items:center;justify-content:center;color:var(--text-secondary);cursor:pointer;opacity:0;transition:var(--transition-fast);z-index:10;border-radius:4px}.form-card .options-menu:hover{background-color:var(--hover-bg-color)}.form-card:hover .options-menu{opacity:1}.form-icon-container{display:flex;align-items:center;justify-content:center;width:32px;height:32px;background-color:var(--active-bg-color);border-radius:8px;margin-bottom:auto}.form-icon-container svg{width:18px;height:18px}.form-icon-container svg path{stroke:var(--primary-color)}.form-title{font-size:14px;font-weight:500;color:var(--text-primary);margin-top:12px;margin-bottom:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.form-responses{font-size:12px;color:var(--text-secondary)}.empty-state{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:60px 20px;text-align:center;background-color:var(--content-background);border-radius:12px;border:1px dashed var(--border-color);min-height:400px}.empty-state h2{margin-bottom:8px;color:var(--text-primary);font-weight:500;cursor:pointer;display:flex;align-items:center;gap:8px;font-size:15px;transition:var(--transition-fast)}.empty-state p{margin-bottom:24px;color:var(--text-secondary);font-size:15px;max-width:300px;margin-left:auto;margin-right:auto}.create-form-btn{background-color:var(--primary-color);color:#fff;border:none;border-radius:8px;padding:12px 24px;font-weight:500;cursor:pointer;display:flex;align-items:center;gap:8px;font-size:15px;transition:var(--transition-fast)}.create-form-btn:hover{background-color:var(--primary-color-hover)}.loading-state{display:flex;justify-content:center;align-items:center;min-height:300px;font-size:15px;color:#666}.user-dropdown{position:absolute;top:calc(100% + 8px);right:0;width:280px;background-color:#fff;border-radius:12px;box-shadow:0 10px 25px #00000026;border:1px solid #e0e0e0;z-index:100;overflow:hidden;animation:dropdown-fade-in .2s ease}.dropdown-header{padding:16px}.dropdown-user-info{display:flex;align-items:center;gap:12px}.dropdown-user-icon{width:40px;height:40px;background-color:#4a90e2;color:#fff;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:18px;font-weight:500;flex-shrink:0}.dropdown-user-details{display:flex;flex-direction:column}.dropdown-name{font-weight:600;font-size:15px;color:#333}.dropdown-email{font-size:13px;color:#666}.dropdown-divider{height:1px;background-color:#e0e0e0;margin:8px 0;border:none}.dropdown-items{padding:8px}.dropdown-item{display:flex;align-items:center;gap:12px;width:100%;padding:10px 12px;border-radius:6px;border:none;background-color:transparent;color:#333;font-size:14px;text-align:left;cursor:pointer;transition:var(--transition-fast)}.dropdown-icon{font-size:18px;color:#666}.form-options-dropdown{position:absolute;top:100%;right:0;width:220px;background-color:#fff;border-radius:8px;box-shadow:0 10px 25px #00000026;z-index:1000;overflow:hidden;animation:dropdown-fade-in .15s ease-in-out;border:1px solid #e0e0e0;padding:8px}.dropdown-item{padding:10px 12px;font-size:14px;color:#333;cursor:pointer;display:flex;align-items:center;justify-content:space-between;border-radius:6px;transition:var(--transition-fast)}.dropdown-item:hover{background-color:#f5f5f5}.dropdown-divider{height:1px;background-color:#e0e0e0;margin:4px 0;border:none}.submenu-arrow{font-size:16px;color:#666;margin-left:8px}.delete-option{color:#dc3545}.delete-option:hover{background-color:#fef2f2;color:#dc3545}.list-view .form-card{flex-direction:row;align-items:center;height:auto;min-height:auto;padding:12px 24px;gap:20px;border:1px solid var(--border-color);border-radius:8px;box-shadow:none;background-color:var(--card-background);transition:border-color .2s ease,background-color .2s ease;transform:none}.list-view .form-card:hover{background-color:var(--hover-bg-color);transform:none;box-shadow:none;border:1px solid var(--primary-color)}.list-view .form-icon-container{display:flex;align-items:center;justify-content:center;width:36px;height:36px;background-color:var(--active-bg-color);border-radius:8px;flex-shrink:0}.list-view .form-icon-container svg{width:20px;height:20px}.list-view .form-title{margin:0;padding:0;flex-grow:1;font-weight:500;font-size:15px}.list-view .form-responses{margin:0;font-size:14px;color:var(--text-secondary);white-space:nowrap;padding:0 24px}.list-view .options-menu{position:relative;opacity:1;top:auto;right:auto;color:var(--text-secondary);width:32px;height:32px;display:flex;align-items:center;justify-content:center;border-radius:4px;transition:var(--transition-fast)}.list-view .options-menu:hover{background-color:var(--hover-bg-color)}.options-menu-icon{width:20px;height:20px}.create-new-form-card{display:flex;align-items:center;justify-content:center;border:2px solid var(--border-color);background:transparent;color:var(--text-secondary);transition:var(--transition-fast);text-align:center}.create-new-form-card:hover{border-color:var(--primary-color);color:var(--primary-color);background:var(--active-bg-color)}.create-new-form-card div{display:flex;flex-direction:column;align-items:center;gap:6px}.create-new-form-card .plus-icon-large{font-size:20px;line-height:1;transition:var(--transition-fast)}.create-new-form-card:hover .plus-icon-large{transform:scale(1.1)}.list-view .create-new-form-card{display:none}.bulk-action-toolbar{display:flex;align-items:center;justify-content:space-between;padding:16px 32px;background-color:var(--active-bg-color);border-bottom:1px solid var(--border-color);margin:0;border-radius:0}.bulk-selection-info{display:flex;align-items:center;gap:16px;font-size:14px;font-weight:500;color:var(--text-primary)}.clear-selection-btn{background:#fff;border:1px solid var(--border-color);border-radius:6px;padding:.6em 1.2em;font-size:1em;color:var(--text-primary);cursor:pointer;transition:var(--transition-fast);margin-left:10px}.clear-selection-btn:hover{background-color:var(--hover-bg-color);color:var(--text-primary)}.bulk-actions{display:flex;align-items:center;gap:8px}.bulk-action-btn{display:flex;align-items:center;gap:8px;padding:8px 16px;border:1px solid var(--border-color);border-radius:6px;background-color:var(--card-background);color:var(--text-primary);font-size:14px;font-weight:500;cursor:pointer;transition:var(--transition-fast)}.bulk-action-btn:hover{background-color:var(--hover-bg-color);border-color:var(--primary-color)}.bulk-delete-btn{color:var(--danger-color)}.bulk-delete-btn:hover{background-color:#fef2f2;border-color:var(--danger-color)}.form-checkbox{position:absolute;opacity:0;transition:opacity .2s ease-in-out;cursor:pointer;z-index:10}.form-checkbox.visible{opacity:1}.grid-selection-checkbox{position:absolute;top:12px;right:12px;background-color:#ffffffe6;border-radius:4px;padding:4px;box-shadow:var(--shadow-sm);cursor:pointer;z-index:10}.list-view .form-checkbox.list-checkbox{position:relative;left:0;top:0;margin-right:12px;background:none;padding:0;box-shadow:none;opacity:0;transition:opacity .2s ease-in-out}.list-view .form-checkbox.list-checkbox.visible{opacity:1}.form-checkbox input[type=checkbox],.grid-selection-checkbox input[type=checkbox]{width:18px;height:18px;accent-color:var(--primary-color);cursor:pointer;margin:0;pointer-events:auto}.form-card.selected{background-color:var(--active-bg-color);border-color:var(--primary-color)}.form-card.selected .form-title{color:var(--active-text-color);font-weight:600}.forms-container.selection-mode .form-card{cursor:pointer}.forms-container.selection-mode .form-card:hover:not(.selected){background-color:#f8f9fa;border-color:#d0d7de}.forms-container.selection-mode .form-card:hover.selected{background-color:#e3f2fd}.forms-container.selection-mode .form-card .form-icon-container,.forms-container.selection-mode .form-card .form-title,.forms-container.selection-mode .form-card .form-responses{pointer-events:none}.form-checkbox,.form-checkbox input[type=checkbox],.grid-selection-checkbox,.grid-selection-checkbox input[type=checkbox]{pointer-events:auto}.grid-view .form-card{position:relative}.form-card .options-menu{z-index:3}.workspace-item{position:relative;-webkit-user-select:none;user-select:none}.workspace-drag-handle{position:absolute;left:8px;top:50%;transform:translateY(-50%);width:12px;height:12px;color:var(--text-secondary);cursor:grab;opacity:0;transition:opacity .2s ease;z-index:1}.workspace-drag-handle:hover{color:var(--text-primary)}.workspace-drag-handle:active{cursor:grabbing}.workspace-item:hover .workspace-drag-handle{opacity:1}.workspace-item .workspace-name{margin-left:20px}.workspace-item.dragging{opacity:.5;transform:scale(.98);background-color:var(--hover-bg-color);z-index:1000}.workspace-item.drag-over{background-color:var(--active-bg-color);border:2px dashed var(--primary-color);border-radius:6px}.workspace-item.drag-over .workspace-name{color:var(--primary-color);font-weight:600}.workspace-item{transition:transform .2s ease,opacity .2s ease,background-color .2s ease}.workspace-item:not(.dragging){transform:translateZ(0)}.modal-overlay,.template-modal-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background-color:#00000080;display:flex;align-items:center;justify-content:center;z-index:1000;animation:fadeIn .2s ease-out}.choose-start-modal{position:relative;background:#fff;border-radius:12px;padding:32px;max-width:800px;width:90%;box-shadow:0 20px 25px -5px #0000001a,0 10px 10px -5px #0000000a;animation:slideUp .3s ease-out}.choose-start-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:32px;padding-bottom:16px;border-bottom:1px solid var(--border-color)}.choose-start-header h2{margin:0;font-size:24px;font-weight:600;color:var(--text-primary)}.modal-close-btn{background:none;border:none;padding:8px;cursor:pointer;border-radius:6px;color:var(--text-secondary);transition:all .2s ease}.modal-close-btn:hover{background-color:var(--hover-bg-color);color:var(--text-primary)}.choose-start-options{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}.start-option{display:flex;flex-direction:column;align-items:center;text-align:center;padding:32px 24px;border:2px solid var(--border-color);border-radius:12px;cursor:pointer;transition:all .2s ease;background:var(--card-background)}.start-option:hover{border-color:var(--primary-color);box-shadow:0 4px 12px #4a90e226;transform:translateY(-2px)}.option-icon{margin-bottom:16px;display:flex;align-items:center;justify-content:center;width:80px;height:80px;border-radius:16px}.import-icons{display:grid;grid-template-columns:1fr 1fr;gap:8px;width:100%;height:100%}.import-icon-item{background:var(--hover-bg-color);border-radius:8px;display:flex;align-items:center;justify-content:center;font-size:16px}.start-option h3{margin:0 0 8px;font-size:18px;font-weight:600;color:var(--text-primary)}.start-option p{margin:0;font-size:14px;color:var(--text-secondary)}.template-modal{position:relative;background:#fff;border-radius:6px;width:95%;max-width:1400px;height:90%;max-height:900px;display:flex;flex-direction:column;box-shadow:0 24px 48px #00000014,0 8px 16px #0000000a;animation:slideUp .3s ease-out;overflow:hidden;border:1px solid var(--border-color)}.template-modal-header{padding:28px 32px;border-bottom:1px solid var(--border-color);background:var(--card-background)}.modal-title-section h2{margin:0;font-size:24px;font-weight:600;color:var(--text-primary)}.search-input-container{position:relative;width:100%}.search-icon{position:absolute;left:10px;top:50%;transform:translateY(-50%);color:var(--text-secondary);font-size:14px}.template-search-input-modal{width:100%;padding:10px 12px 10px 36px;border:1px solid var(--border-color);border-radius:6px;font-size:13px;background-color:#fff;color:var(--text-primary);outline:none;transition:border-color .2s ease}.template-search-input-modal:focus{border-color:var(--primary-color);box-shadow:none;outline:none}.template-sidebar{width:240px;background:var(--background-color);border-right:1px solid var(--border-color);padding:0;overflow-y:auto;display:flex;flex-direction:column}.template-search-section{padding:20px 16px;border-bottom:1px solid var(--border-color)}.category-list{display:flex;flex-direction:column;gap:4px;padding:20px 16px;flex:1}.category-btn{display:flex;align-items:center;justify-content:space-between;padding:12px 16px;border:none;background:none;text-align:left;cursor:pointer;border-radius:8px;font-size:14px;font-weight:500;color:var(--text-secondary);transition:all .2s ease;width:100%}.category-btn:hover{background-color:var(--hover-bg-color);color:var(--text-primary)}.category-btn.active{background-color:var(--active-bg-color);color:var(--active-text-color);font-weight:600}.category-icon{margin-right:12px;font-size:16px}.category-name{flex:1}.category-count{font-size:12px;background:var(--border-color);color:var(--text-secondary);padding:2px 6px;border-radius:12px;font-weight:500}.category-btn.active .category-count{background:var(--primary-color);color:#fff}.template-grid-container{flex:1;padding:24px;overflow-y:auto;background:#fafafa}.no-templates-found{display:flex;flex-direction:column;align-items:center;justify-content:center;height:100%;text-align:center;color:var(--text-secondary)}.no-templates-found h3{margin:0 0 8px;font-size:18px;font-weight:600;color:var(--text-primary)}.no-templates-found p{margin:0;font-size:14px}.template-category-section{margin-bottom:32px}.category-header{display:flex;align-items:center;gap:12px;margin-bottom:20px;padding-bottom:12px;border-bottom:1px solid #e5e7eb}.category-header h3{margin:0;font-size:18px;font-weight:600;color:var(--text-primary);flex:1}.template-count{font-size:14px;color:var(--text-secondary)}.template-grid-modal{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;min-width:0;width:100%}.template-card-modal{background:var(--card-background);border:1px solid var(--border-color);border-radius:4px;overflow:hidden;cursor:pointer;transition:all .2s ease;box-shadow:0 1px 3px #0000000d;min-width:0;max-width:320px}.template-card-modal:hover{border-color:var(--primary-color);box-shadow:0 2px 8px #0000001a;transform:translateY(-1px)}.template-preview-modal{height:100px;padding:16px;display:flex;flex-direction:column;align-items:center;justify-content:center;position:relative;border-bottom:1px solid var(--border-color)}.template-preview-icon{font-size:24px;margin-bottom:8px}.template-preview-fields{display:flex;gap:4px;align-items:center}.field-indicator{width:20px;height:3px;border-radius:2px;opacity:.7}.field-indicator.more{width:auto;padding:2px 6px;font-size:10px;font-weight:600;border-radius:8px;color:#fff;text-align:center;line-height:1}.template-info-modal{padding:16px 18px 18px}.template-name{margin:0 0 6px;font-size:14px;font-weight:600;color:var(--text-primary);line-height:1.3;word-wrap:break-word;overflow-wrap:break-word}.template-description{margin:0 0 12px;font-size:12px;color:var(--text-secondary);line-height:1.4;word-wrap:break-word;overflow-wrap:break-word}.template-meta{display:flex;justify-content:space-between;align-items:center}.field-count{font-size:12px;color:var(--text-secondary);font-weight:500}.btn-use-template{padding:6px 12px;background-color:var(--primary-color);color:#fff;border:none;border-radius:4px;font-size:12px;font-weight:500;cursor:pointer;transition:all .2s ease}.btn-use-template:hover{background-color:var(--primary-color-hover)}.template-modal-footer{padding:20px 32px;border-top:1px solid var(--border-color);background:var(--card-background);display:flex;justify-content:flex-start;align-items:center}.template-back-btn{display:flex;align-items:center;gap:8px;padding:10px 16px;background:none;border:1px solid var(--border-color);border-radius:6px;font-size:14px;font-weight:500;color:var(--text-secondary);cursor:pointer;transition:all .2s ease}.template-back-btn:hover{background-color:var(--hover-bg-color);color:var(--text-primary);border-color:var(--text-secondary)}@media (max-width: 768px){.choose-start-options{grid-template-columns:1fr;gap:16px}.template-modal{width:95%;height:95%}.template-modal-content{flex-direction:column}.template-sidebar{width:100%;max-height:250px;border-right:none;border-bottom:1px solid var(--border-color)}.template-search-section{padding:16px}.category-list{flex-direction:row;overflow-x:auto;padding:0 16px 16px;gap:8px}.category-btn{white-space:nowrap;min-width:fit-content}.template-grid-modal{grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:20px}.template-modal-footer{padding:16px}}.notification{position:fixed;top:20px;right:20px;min-width:250px;max-width:350px;padding:16px;border-radius:8px;display:flex;align-items:center;justify-content:space-between;z-index:2000;animation:slide-in .3s ease-out forwards;box-shadow:0 4px 12px #00000026}.notification.success{background-color:#e8f5e9;border-left:4px solid #4caf50;color:#2e7d32}.notification.error{background-color:#ffebee;border-left:4px solid #f44336;color:#c62828}.notification.warning{background-color:#fff8e1;border-left:4px solid #ffc107;color:#ff8f00}.notification-message{flex:1;font-size:14px}.notification-close{background:none;border:none;color:inherit;font-size:18px;cursor:pointer;margin-left:12px;opacity:.7}.notification-close:hover{opacity:1}@keyframes slide-in{0%{transform:translate(100%);opacity:0}to{transform:translate(0);opacity:1}}.workspace-submenu{position:absolute;background-color:#fff;border-radius:8px;box-shadow:0 2px 8px #00000026;z-index:1010;overflow:hidden;animation:submenu-fade-in .15s ease-in-out;border:1px solid #e0e0e0;width:300px}.submenu-header{padding:12px 16px;display:flex;align-items:center;gap:12px;border-bottom:1px solid #e0e0e0}.back-button{background:none;border:none;cursor:pointer;font-size:18px;color:#333;padding:0;display:flex;align-items:center;justify-content:center}.submenu-title{font-size:16px;font-weight:500;color:#333}.workspace-section-label{padding:12px 16px;font-size:12px;font-weight:500;color:#888;text-transform:uppercase;letter-spacing:.5px}.workspace-list{padding:0}.workspace-item{padding:12px 16px;font-size:14px;color:#333;cursor:pointer}.workspace-item:hover{background-color:#f5f5f5}@keyframes submenu-fade-in{0%{opacity:0;transform:translate(-8px)}to{opacity:1;transform:translate(0)}}.new-workspace{font-weight:500}.empty-message{color:#888;font-style:italic;cursor:default}.empty-message:hover{background-color:transparent}.workspace-menu{position:absolute;background-color:#fff;border-radius:8px;box-shadow:0 2px 8px #00000026;z-index:1010;min-width:150px;overflow:hidden;animation:menu-fade-in .15s ease-in-out;border:1px solid #e0e0e0}.menu-item{padding:12px 16px;font-size:14px;color:#333;cursor:pointer;transition:background-color .2s}.menu-item:hover{background-color:#f5f5f5}.delete-option{color:#d32f2f}.delete-option:hover{background-color:#ffebee}@keyframes menu-fade-in{0%{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:translateY(0)}}.modal-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background-color:#00000080;display:flex;justify-content:center;align-items:center;z-index:1000;animation:fade-in .2s ease-out}.workspace-create-modal{background-color:#fff;border-radius:8px;padding:24px;width:100%;max-width:480px;box-shadow:0 4px 16px #0000001a;position:relative;animation:slide-up .3s ease-out}.modal-close-btn{position:absolute;top:16px;right:16px;background:none;border:none;font-size:24px;cursor:pointer;color:#666;line-height:1}.workspace-create-modal h2{margin-top:0;margin-bottom:24px;font-size:20px;font-weight:600;color:#333}.workspace-name-input{width:100%;padding:12px 16px;font-size:16px;border:1px solid #ddd;border-radius:4px;transition:border-color .2s;background-color:transparent;color:#000}.workspace-name-input:focus{outline:none;border-color:#06f;box-shadow:0 0 0 2px #0066ff1a}.modal-actions{display:flex;justify-content:flex-end;gap:12px}.cancel-btn{padding:10px 16px;background-color:#f5f5f5;border:1px solid #ddd;border-radius:4px;font-size:14px;font-weight:500;color:#666;cursor:pointer;transition:background-color .2s}.cancel-btn:hover{background-color:#e9e9e9}.create-btn{padding:10px 16px;background-color:#06f;border:none;border-radius:4px;font-size:14px;font-weight:500;color:#fff;cursor:pointer;transition:background-color .2s}.create-btn:hover{background-color:#0052cc}.create-btn:disabled{background-color:#99c2ff;cursor:not-allowed}@keyframes fade-in{0%{opacity:0}to{opacity:1}}@keyframes slide-up{0%{transform:translateY(20px);opacity:0}to{transform:translateY(0);opacity:1}}.answer-piping-modal-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:transparent;z-index:10000;pointer-events:all}.answer-piping-modal{background:#fff;border-radius:12px;box-shadow:0 20px 25px -5px #0000001a,0 10px 10px -5px #0000000a;border:1px solid #e2e8f0;min-width:320px;max-width:400px;max-height:400px;z-index:10001;overflow:hidden;animation:answerPipingModalFadeIn .15s ease-out}.answer-piping-modal.with-sidebar{min-width:340px;max-width:400px;max-height:320px;border-radius:8px}.modal-body-with-sidebar{display:flex;height:320px}.modal-sidebar{width:44px;min-width:44px;background:#f8fafc;border-right:1px solid #f1f5f9;display:flex;flex-direction:column;padding:8px 4px;gap:2px}.sidebar-tab{position:relative;display:flex;align-items:center;justify-content:center;width:36px;height:36px;background:transparent;border:none;border-radius:8px;cursor:pointer;transition:all .15s ease;color:#cbd5e1}.sidebar-tab:hover{background:#e2e8f0;color:#94a3b8}.sidebar-tab.selected{background:#dbeafe;color:#3b82f6}.sidebar-tab-icon{width:18px;height:18px;stroke-width:2;flex-shrink:0;display:block}.sidebar-tab-tooltip{position:absolute;left:calc(100% + 10px);top:50%;transform:translateY(-50%);background:#1e293b;color:#fff;padding:6px 10px;border-radius:6px;font-size:12px;font-weight:500;white-space:nowrap;opacity:0;visibility:hidden;pointer-events:none;transition:opacity .15s ease,visibility .15s ease;z-index:10010;box-shadow:0 4px 12px #00000026}.sidebar-tab-tooltip:before{content:"";position:absolute;right:100%;top:50%;transform:translateY(-50%);border:5px solid transparent;border-right-color:#1e293b}.sidebar-tab:hover .sidebar-tab-tooltip{opacity:1;visibility:visible}.modal-main-content{flex:1;display:flex;flex-direction:column;min-width:0;overflow:hidden;background:#fff}@keyframes answerPipingModalFadeIn{0%{opacity:0;transform:translate(-50%,-100%) scale(.95)}to{opacity:1;transform:translate(-50%,-100%) scale(1)}}.modal-header{display:flex;align-items:center;justify-content:space-between;padding:16px 20px;border-bottom:1px solid #e2e8f0;background:#f8fafc}.modal-title{display:flex;align-items:center;gap:8px;font-weight:600;font-size:14px;color:#1e293b}.modal-icon{width:18px;height:18px;color:#64748b}.modal-close-btn{background:none;border:none;padding:4px;border-radius:6px;cursor:pointer;color:#64748b;transition:all .15s ease}.modal-close-btn:hover{background:#e2e8f0;color:#475569}.modal-content{display:flex;flex-direction:column;max-height:340px}.modal-main-content .search-container{padding:12px;border-bottom:none;flex-shrink:0}.search-container{padding:12px;border-bottom:none}.modal-main-content .search-input{width:100%!important;max-width:100%;box-sizing:border-box;padding:8px 12px;border:1px solid #e2e8f0;border-radius:6px;font-size:13px;outline:none;transition:border-color .15s ease,box-shadow .15s ease;background:#fff;color:#334155}.search-input{width:100%;max-width:100%;box-sizing:border-box;padding:8px 12px;border:1px solid #e2e8f0;border-radius:6px;font-size:13px;outline:none;transition:border-color .15s ease,box-shadow .15s ease;background:#fff;color:#334155}.search-input::placeholder{color:#94a3b8}.search-input:focus{border-color:#3b82f6;box-shadow:0 0 0 2px #3b82f61a}.questions-list{flex:1;overflow-y:auto;max-height:240px;padding:0 8px}.modal-main-content .questions-list{max-height:none;flex:1;padding:0 8px}.question-item{display:flex;align-items:center;padding:8px 10px;cursor:pointer;transition:background-color .15s ease;border-radius:6px;margin-bottom:2px}.modal-main-content .question-item{padding:8px 10px}.question-item:hover{background:#f8fafc}.question-item:last-child{margin-bottom:12px}.question-icon{display:flex;align-items:center;justify-content:center;margin-right:10px;width:28px;height:28px;background:#f1f5f9;border-radius:6px;color:#94a3b8;flex-shrink:0}.field-type-icon{width:14px;height:14px;stroke-width:2;color:inherit;flex-shrink:0;display:block}.question-content{flex:1;min-width:0}.question-label{font-size:13px;font-weight:500;color:#1e293b;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.question-type{font-size:11px;color:#64748b;margin-top:1px}.question-position{display:none}.no-questions{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:32px 20px;text-align:center}.modal-main-content .no-questions{padding:32px 20px}.no-questions-icon{display:flex;align-items:center;justify-content:center;width:44px;height:44px;background:#f1f5f9;border-radius:10px;margin-bottom:12px;color:#cbd5e1}.empty-state-icon{width:22px;height:22px;stroke-width:1.5;color:inherit;flex-shrink:0;display:block}.no-questions p{font-size:13px;font-weight:500;color:#475569;margin:0 0 4px}.no-questions-hint{font-size:12px;color:#94a3b8;line-height:1.4;max-width:240px}.modal-footer{padding:12px 20px;border-top:1px solid #e2e8f0;background:#f8fafc}.help-text{font-size:12px;color:#64748b;line-height:1.4}.help-text strong{color:#475569}.empty-state-example{margin-top:12px;padding:12px;background:#f0f9ff;border:1px solid #dbeafe;border-radius:6px;font-size:12px;line-height:1.4}.empty-state-example strong{color:#3b82f6}.clear-search-btn{background:none;border:none;color:#3b82f6;text-decoration:underline;cursor:pointer;font-size:inherit;padding:0;margin:0 4px}.clear-search-btn:hover{color:#2563eb}.calculation-item .question-icon{background:#fef3c7;color:#d97706}.calc-prefix{color:#d97706;font-weight:500;margin-right:1px}.calc-badge{display:none}.url-parameter-item .question-icon{background:#dbeafe;color:#2563eb}.url-param-badge{display:none}.loading-state{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:40px 20px;text-align:center}.loading-spinner{font-size:24px;margin-bottom:12px;animation:spin 1s linear infinite}.loading-state p{font-size:14px;color:#64748b;margin:0}@media (max-width: 480px){.answer-piping-modal{min-width:280px;max-width:90vw}.answer-piping-modal.with-sidebar{min-width:300px;max-width:95vw;max-height:300px}.modal-body-with-sidebar{height:300px}.modal-sidebar{width:40px;min-width:40px;padding:6px 2px}.sidebar-tab{width:32px;height:32px}.sidebar-tab-icon{width:16px;height:16px}.modal-main-content .search-container{padding:8px 10px}.questions-list,.modal-main-content .questions-list{padding:0 6px}.question-item{padding:6px 8px}}.answer-piping-input-wrapper{position:relative;display:block;width:100%;min-height:fit-content;z-index:auto}.answer-piping-input{position:relative;width:100%;background:transparent;line-height:1.5;box-sizing:border-box}textarea.answer-piping-input{resize:none;overflow:hidden;min-height:1.5em;field-sizing:content}.answer-piping-input.has-tokens{color:transparent!important;caret-color:#374151;text-shadow:none}.answer-piping-input.has-tokens:focus{color:transparent!important;caret-color:#374151}.answer-piping-input:focus+.piping-indicator{opacity:.3}.answer-piping-input-wrapper:has(.answer-piping-input:focus) .answer-piping-overlay{opacity:1}.answer-piping-overlay{position:absolute;top:0;left:0;right:0;pointer-events:none;white-space:pre-wrap;word-break:break-word;color:#374151;overflow:visible;z-index:0;font-size:inherit;line-height:inherit;box-sizing:border-box;border:transparent solid;border-width:inherit;margin:0;height:auto;min-height:fit-content}.answer-piping-overlay .answer-token.calculation.clickable{pointer-events:auto!important;z-index:1000;position:relative}.answer-piping-overlay-focused{position:absolute;top:0;left:0;right:0;pointer-events:none;white-space:pre-wrap;word-break:break-word;color:#374151;overflow:visible;z-index:100;font-size:inherit;line-height:inherit;box-sizing:border-box;border:transparent solid;border-width:inherit;margin:0;height:auto;min-height:fit-content}.answer-piping-overlay-focused .answer-token.calculation.clickable{pointer-events:auto!important;z-index:1000;position:relative}.answer-piping-overlay .answer-token-highlight{color:#374151;font-size:inherit;line-height:inherit}.answer-piping-overlay .answer-token-highlight>span:not(.answer-token){color:#374151!important}.answer-piping-overlay .answer-token{pointer-events:auto;background:#e0f2ff!important;color:#0b6bb3!important;border-color:#7ac3ff!important;opacity:1!important;visibility:visible!important;line-height:1;transform:translateY(.5px)}.answer-piping-overlay .answer-token *,.answer-piping-overlay .answer-token .answer-token-text,.answer-piping-overlay .answer-token .answer-token-remove{color:#0b6bb3!important}.answer-piping-overlay .answer-token.legacy{background:linear-gradient(135deg,#fef3c7,#fde68a)!important;color:#92400e!important;border-color:#fbbf24!important}.answer-piping-overlay .answer-token.legacy *,.answer-piping-overlay .answer-token.legacy .answer-token-text,.answer-piping-overlay .answer-token.legacy .answer-token-remove{color:#92400e!important}.answer-piping-overlay .answer-token.at-reference{background:linear-gradient(135deg,#f3e8ff,#e9d5ff)!important;color:#7c3aed!important;border-color:#c4b5fd!important}.answer-piping-overlay .answer-token.at-reference *,.answer-piping-overlay .answer-token.at-reference .answer-token-text,.answer-piping-overlay .answer-token.at-reference .answer-token-remove{color:#7c3aed!important}.answer-token-syntax-highlight{color:#0b6bb3!important;font-weight:500}.answer-piping-input:focus{outline:none}.answer-token{background:#eff6ff;color:#1d4ed8;padding:2px 6px;border-radius:4px;font-weight:500;border:1px solid #bfdbfe;display:inline-block;margin:0 2px}.answer-token:hover{background:#dbeafe;border-color:#93c5fd}.answer-piping-input::placeholder{color:#9ca3af;font-style:normal}.answer-piping-input:focus::placeholder{color:#d1d5db}.piping-indicator{position:absolute;top:50%;right:8px;transform:translateY(-50%);background:#eff6ff;border:1px solid #bfdbfe;border-radius:4px;padding:2px 6px;font-size:12px;color:#1e40af;pointer-events:none;opacity:.7;transition:opacity .2s ease}.answer-piping-input:focus+.piping-indicator,.answer-piping-input.has-piping-support:hover+.piping-indicator{opacity:1}.at-symbol{font-weight:600;font-family:monospace}.answer-piping-input:not(:placeholder-shown)+.piping-indicator,.answer-piping-input:focus+.piping-indicator{opacity:0;pointer-events:none}@media (max-width: 768px){.answer-token{font-size:.875rem;padding:1px 4px}.piping-indicator{font-size:10px;padding:1px 4px;right:6px}}.piping-help-tooltip{position:absolute;top:100%;right:0;margin-top:8px;background:#fff;border:1px solid #e5e7eb;border-radius:8px;padding:12px;box-shadow:0 4px 6px -1px #0000001a;z-index:1000;min-width:250px;opacity:0;visibility:hidden;transition:all .2s ease;pointer-events:none}.answer-piping-input-wrapper:hover .piping-help-tooltip{opacity:1;visibility:visible}.tooltip-content{font-size:12px;line-height:1.4}.tooltip-content strong{display:block;margin-bottom:6px;color:#374151}.tooltip-content p{margin:4px 0;color:#6b7280}.tooltip-content code{background:#f3f4f6;padding:1px 4px;border-radius:3px;font-family:monospace;color:#374151}.answer-token-highlight{display:inline-block;width:100%;line-height:inherit;vertical-align:baseline;box-sizing:border-box;display:block;pointer-events:none}.answer-token-highlight .answer-token-remove,.answer-token-highlight .answer-token.calculation.clickable{pointer-events:auto}.answer-token{background:#e0f2ff;color:#0b6bb3;padding:2px 8px;border-radius:12px;font-weight:600;border:1px solid #7ac3ff;display:inline-flex;align-items:center;gap:6px;margin:0 2px;position:relative;transition:background .2s ease,border-color .2s ease,transform .1s ease;cursor:default;vertical-align:baseline;line-height:1}.answer-token:hover{background:#cfeaff;border-color:#66baff}.answer-token.legacy{background:linear-gradient(135deg,#fef3c7,#fde68a);color:#92400e;border-color:#fbbf24}.answer-token.legacy:hover{background:linear-gradient(135deg,#fde68a,#fbbf24);border-color:#f59e0b}.legacy-indicator{font-size:10px;opacity:.8}.answer-token-text{line-height:1}.answer-token-remove{-webkit-appearance:none;-moz-appearance:none;appearance:none;border:none;background:transparent;color:#0b6bb3;font-size:14px;line-height:1;padding:0 2px;cursor:pointer}.answer-token-remove:hover{color:#084e82}.answer-token.at-reference{background:linear-gradient(135deg,#f3e8ff,#e9d5ff);color:#7c3aed;border-color:#c4b5fd}.answer-token.at-reference:hover{background:linear-gradient(135deg,#e9d5ff,#c4b5fd);border-color:#a78bfa}.answer-token.new-token{animation:tokenAppear .3s ease-out}@keyframes tokenAppear{0%{opacity:0;transform:scale(.8)}to{opacity:1;transform:scale(1)}}.answer-token.calculation{background:linear-gradient(135deg,#fef3c7,#fde68a);color:#92400e;border-color:#fbbf24}.answer-token.calculation:hover{background:linear-gradient(135deg,#fde68a,#fcd34d);border-color:#f59e0b}.answer-token.calculation.clickable{cursor:pointer!important;transition:all .2s ease;position:relative;z-index:1000;pointer-events:auto!important}.answer-token.calculation.clickable:hover{background:linear-gradient(135deg,#fcd34d,#fbbf24);border-color:#d97706;transform:translateY(-1px);box-shadow:0 2px 8px #d977064d;z-index:1001}.answer-token.calculation.clickable:active{transform:translateY(0);box-shadow:0 1px 4px #d9770633}.calc-indicator{font-size:12px;opacity:.9}.answer-token-syntax-highlight.calculation{color:#f59e0b;font-weight:600}.answer-token.param{background:linear-gradient(135deg,#dbeafe,#bfdbfe);color:#1e40af;border-color:#93c5fd}.answer-token.param:hover{background:linear-gradient(135deg,#bfdbfe,#93c5fd);border-color:#60a5fa}.param-indicator{font-size:12px;opacity:.9}.answer-token-syntax-highlight.param{color:#3b82f6;font-weight:600}@media (max-width: 768px){.answer-token{font-size:.875rem;padding:1px 4px}.legacy-indicator{font-size:8px}.calc-indicator{font-size:10px}}@media (prefers-color-scheme: dark){.answer-token{background:#143a66;color:#cfeaff;border-color:#2a5c92}.answer-token:hover{background:#194a82;border-color:#3577bf}.answer-token.legacy{background:linear-gradient(135deg,#92400e,#b45309);color:#fde68a;border-color:#b45309}.answer-token.calculation{background:linear-gradient(135deg,#78350f,#92400e);color:#fde68a;border-color:#b45309}.answer-token.calculation:hover{background:linear-gradient(135deg,#92400e,#a85a0e);border-color:#d97706}}.paragraph-field-textarea{width:100%;border:none;padding:0;margin:0;font-family:inherit;font-size:inherit;line-height:inherit;color:inherit;background-color:transparent;resize:none;overflow:hidden;box-shadow:none;outline:none}.paragraph-field-textarea::placeholder{color:#9ca3af}.paragraph-field-textarea:focus{box-shadow:none;outline:none}body{background-color:#fafafa;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji",Segoe UI Symbol;color:#111827;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.form-share-page{max-width:1280px;margin:0 auto;padding:1.5rem 2rem 2rem;min-height:100vh}.share-page-header{margin-bottom:1.5rem}.share-page-header .share-title{display:flex;align-items:center;gap:.625rem;margin-bottom:.375rem}.share-icon-svg{color:#6366f1;width:24px;height:24px;flex-shrink:0}.share-page-header h1{font-size:18px;font-weight:600;color:#111827;margin:0;line-height:1.2}.status-badge{background-color:#d1fae5;color:#059669;padding:.25rem .75rem;border-radius:9999px;font-size:11px;font-weight:600;display:inline-flex;align-items:center;gap:.25rem;letter-spacing:.01em;line-height:1.2}.share-subtitle{color:#6b7280;margin:0;font-size:13px;text-align:left;font-weight:400;line-height:1.4}.share-body{display:grid;grid-template-columns:1fr 400px;gap:2rem;margin-top:0}@media (max-width: 1024px){.share-body{grid-template-columns:1fr}}.main-card,.settings-section,.other-section{background-color:#fff;border:1px solid #E5E7EB;border-radius:.75rem;padding:1.5rem;box-shadow:0 1px 2px #00000008}.share-main>.main-card{padding:1.75rem}.domain-selector-section{display:flex;align-items:center;gap:1rem;margin-bottom:1rem;padding:.75rem;background-color:#f9fafb;border-radius:.5rem}.domain-selector-label{font-size:.9rem;font-weight:500;color:#374151;margin:0}.domain-selector{flex:1;padding:.5rem .75rem;border:1px solid #d1d5db;border-radius:.375rem;font-size:.9rem;background-color:#fff;cursor:pointer;transition:border-color .2s}.domain-selector:hover{border-color:#9ca3af}.domain-selector:focus{outline:none;border-color:#4f46e5;box-shadow:0 0 0 3px #4f46e51a}.share-link-section{display:flex;align-items:center;gap:.75rem;background-color:#f9fafb;border:1px solid #E5E7EB;border-radius:.5rem;padding:.5rem .75rem;flex-direction:row;flex-wrap:wrap}.external-link-icon-btn{color:#6b7280;padding:.375rem;border-radius:.375rem;display:inline-flex;align-items:center;justify-content:center;text-decoration:none;transition:all .15s ease;flex-shrink:0}.external-link-icon-btn:hover{background-color:#e5e7eb;color:#111827}.share-link-actions{display:flex;gap:.5rem;margin-left:auto;flex-shrink:0}.share-url-input{flex:1;min-width:250px;border:none;background:transparent;padding:.5rem .25rem;font-size:14px;color:#111827;font-weight:400}.share-url-input:focus{outline:none}.copy-button{border:1px solid transparent;background-color:#111827;color:#fff;padding:.5rem 1rem;border-radius:.375rem;font-weight:600;font-size:14px;cursor:pointer;transition:all .2s ease;box-shadow:0 1px 2px #0000000d}.copy-button:hover{background-color:#000;box-shadow:0 1px 3px #0000001a}.customize-button,.upload-button{border:1px solid #E5E7EB;background-color:#fff;padding:.5rem 1rem;border-radius:.375rem;font-weight:500;font-size:14px;cursor:pointer;transition:all .15s ease;display:inline-flex;align-items:center;gap:.5rem}.customize-button{background:#fff;border-color:#e5e7eb;color:#374151}.customize-button:hover,.upload-button:hover{background-color:#f9fafb;border-color:#d1d5db}.social-icons{display:flex;gap:1rem;margin-top:1.5rem;align-items:center}.social-icon-btn{width:auto;height:auto;padding:0;background:none;border:none;display:flex;align-items:center;justify-content:center;color:#6b7280;cursor:pointer;transition:color .2s ease}.social-icon-btn:hover{color:#374151}.social-icon-btn svg{width:20px;height:20px;display:block}.other-section{margin-top:2rem;padding:1.75rem}.other-section h2,.settings-section h2{font-size:16px;font-weight:600;margin:0 0 1.25rem;color:#111827}.tabs{display:inline-flex;gap:.25rem;margin-bottom:1.25rem;background-color:#f3f4f6;padding:.25rem;border-radius:.5rem;border-bottom:none}.tab{border:1px solid transparent;background:none;padding:.5rem .875rem;margin-bottom:0;font-weight:500;color:#6b7280;border-radius:.375rem;transition:all .15s ease;display:inline-flex;align-items:center;gap:.5rem;cursor:pointer;font-size:13px}.tab:hover:not(.active){color:#374151;background-color:#ffffff80}.tab.active{background-color:#fff;color:#111827;border-color:transparent;box-shadow:0 1px 3px #00000014;font-weight:600}.other-section>p{color:#6b7280;font-size:14px;margin:0 0 1rem;line-height:1.5}.embed-types-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:1rem;margin-top:1.25rem}.embed-type{border:2px solid #E5E7EB;border-radius:.5rem;font-weight:500;color:#374151;transition:all .2s ease;background-color:#fff;overflow:hidden;box-shadow:0 1px 2px #0000000d}.embed-type-label{padding:.875rem 1rem;text-align:center;border-top:1px solid #E5E7EB;font-weight:500;font-size:14px;background-color:#fff}.embed-type:hover{border-color:#a5b4fc;box-shadow:0 4px 6px -1px #00000014,0 2px 4px -2px #0000000d;transform:translateY(-2px)}.embed-type.selected{border-color:#6366f1;box-shadow:0 0 0 3px #6366f11f;background-color:#fafafa}.embed-type.selected .embed-type-label{background-color:#f8f8ff;color:#4338ca;font-weight:600}.embed-preview{height:130px;background:linear-gradient(135deg,#f9fafb,#f3f4f6);padding:1rem;display:flex;align-items:center;justify-content:center}.window{width:100%;height:100%;background:#fff;border-radius:.375rem;border:1px solid #D1D5DB;position:relative;padding:1.25rem .875rem .875rem;box-shadow:0 1px 2px #0000000d}.header-dots{position:absolute;top:.5rem;left:.5rem;display:flex;gap:.25rem;z-index:1}.header-dots span{display:block;width:.375rem;height:.375rem;border-radius:9999px}.header-dots span:nth-child(1){background-color:#fca5a5}.header-dots span:nth-child(2){background-color:#fcd34d}.header-dots span:nth-child(3){background-color:#6ee7b7}.line{background:#e5e7eb;height:5px;border-radius:2.5px;margin-top:6px}.line.short{width:35%}.line.long{width:85%}.content-box-small{background:linear-gradient(135deg,#e0e7ff,#c7d2fe);height:22px;width:55%;margin-top:6px;border-radius:3px}.content-box-full{background:linear-gradient(135deg,#e0e7ff,#c7d2fe);height:100%;width:100%;border-radius:3px}.popup .content-box.inner{width:75%;height:70%;background:linear-gradient(135deg,#e0e7ff,#c7d2fe);border:none;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);box-shadow:0 8px 12px -2px #0000001f,0 4px 6px -4px #00000014;border-radius:.375rem}.slider .content-box.side{position:absolute;right:10%;top:15%;bottom:15%;width:42%;height:70%;background:linear-gradient(135deg,#e0e7ff,#c7d2fe);border-radius:.25rem;box-shadow:0 4px 6px -1px #00000014}.settings-section{padding:1.75rem}.share-sidebar .setting-block{margin-top:1.5rem}.share-sidebar .setting-block:first-of-type{margin-top:0}.share-sidebar h3{font-size:14px;font-weight:600;display:flex;justify-content:space-between;align-items:center;margin:0 0 1rem;color:#111827}.pro-tag{background-color:#eef2ff;color:#4f46e5;padding:.25rem .625rem;border-radius:.375rem;font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.025em}.upload-area{border:2px dashed #D1D5DB;border-radius:.625rem;padding:2rem 1.5rem;text-align:center;background-color:#fafafa;transition:all .2s ease}.upload-area:hover{border-color:#a5b4fc;background-color:#f8f9fa}.upload-icon-container{margin-bottom:.75rem}.upload-area strong{display:block;margin-bottom:.375rem;font-size:14px;font-weight:600;color:#111827}.upload-area p{color:#6b7280;font-size:13px;margin:0 0 1.25rem}.upload-button{width:100%;padding:.625rem 1rem;font-weight:600;font-size:13px}.link-preview-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:.75rem}.link-preview-header h3{font-size:14px;font-weight:600;margin:0;color:#111827}.link-preview-actions{display:flex;align-items:center;gap:.75rem}.link-customize-button{background:none;border:none;color:#6366f1;font-size:14px;font-weight:500;cursor:pointer;padding:0;text-decoration:underline;text-underline-offset:2px;transition:color .15s ease}.link-customize-button:hover{color:#4f46e5}.link-preview-description{color:#6b7280;font-size:13px;line-height:1.5;margin:0 0 1rem}.link-preview-box{border:1px solid #E5E7EB;border-radius:.5rem;background-color:#fff;overflow:hidden;margin-top:1rem}.link-preview-content{padding:1rem}.link-preview-header-row{display:flex;align-items:center;gap:.5rem;margin-bottom:.5rem}.link-preview-favicon{width:16px;height:16px;display:flex;align-items:center;justify-content:center;font-size:14px;color:#111827;font-weight:700}.link-preview-site-name{font-size:12px;font-weight:600;color:#111827}.link-preview-title{font-size:14px;font-weight:500;color:#2563eb;margin-bottom:.25rem;line-height:1.4}.link-preview-description-text{font-size:13px;color:#6b7280;line-height:1.4}.link-preview-thumbnail{width:100%;height:200px;background-color:#fff;border-top:1px solid #E5E7EB;display:flex;align-items:center;justify-content:center;position:relative}.link-preview-thumbnail-content{padding:1.5rem;text-align:center}.link-preview-thumbnail-text{display:flex;flex-direction:column;align-items:center;gap:.25rem}.link-preview-thumbnail-brand{font-size:18px;font-weight:600;color:#ec4899}.link-preview-thumbnail-tagline{font-size:14px;color:#111827}.link-preview-modal-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background-color:#00000080;z-index:10000;display:flex;align-items:center;justify-content:center;padding:2rem}.link-preview-modal{background:#fff;border-radius:12px;width:100%;max-width:1200px;max-height:90vh;display:flex;flex-direction:column;box-shadow:0 20px 25px -5px #0000001a,0 10px 10px -5px #0000000a;overflow:hidden}.link-preview-modal-header{display:flex;justify-content:space-between;align-items:flex-start;padding:2rem;border-bottom:1px solid #E5E7EB}.link-preview-modal-title{font-size:24px;font-weight:700;color:#111827;margin:0 0 .5rem}.link-preview-modal-subtitle{font-size:14px;color:#6b7280;margin:0;line-height:1.5}.link-preview-modal-close{background:none;border:none;cursor:pointer;color:#6b7280;padding:.5rem;border-radius:6px;display:flex;align-items:center;justify-content:center;transition:background-color .2s;flex-shrink:0}.link-preview-modal-close:hover{background-color:#f3f4f6;color:#374151}.link-preview-pro-banner{background-color:#fef3c7;border-bottom:1px solid #E5E7EB;padding:1rem 2rem;font-size:14px;color:#92400e;line-height:1.5}.link-preview-upgrade-link{background:none;border:none;color:#92400e;text-decoration:underline;cursor:pointer;padding:0;font-size:14px;font-weight:500}.link-preview-upgrade-link:hover{color:#78350f}.link-preview-modal-content{display:grid;grid-template-columns:1fr 1fr;flex:1;overflow:hidden;gap:2rem}.link-preview-form-section{padding:2rem;overflow-y:auto;border-right:1px solid #E5E7EB}.link-preview-preview-section{padding:2rem;overflow-y:auto;background-color:#f9fafb}.link-preview-preview-title{font-size:16px;font-weight:600;color:#111827;margin:0 0 1.5rem}.link-preview-form-group{margin-bottom:1.5rem}.link-preview-form-label{display:block;font-size:14px;font-weight:600;color:#374151;margin-bottom:.5rem}.link-preview-form-input{width:100%;padding:.625rem .75rem;border:1px solid #D1D5DB;border-radius:6px;font-size:14px;color:#111827;background-color:#fff}.link-preview-form-input:focus{outline:none;border-color:#6366f1;box-shadow:0 0 0 3px #6366f11a}.link-preview-form-textarea{width:100%;padding:.625rem .75rem;border:1px solid #D1D5DB;border-radius:6px;font-size:14px;color:#111827;background-color:#fff;resize:vertical;font-family:inherit}.link-preview-form-textarea:focus{outline:none;border-color:#6366f1;box-shadow:0 0 0 3px #6366f11a}.link-preview-icon-upload{display:flex;flex-direction:column;align-items:center;gap:.5rem}.link-preview-icon-display{width:64px;height:64px;border:1px solid #D1D5DB;border-radius:6px;display:flex;align-items:center;justify-content:center;font-size:24px;background-color:#fff}.link-preview-image-upload{display:flex;flex-direction:column;gap:.75rem}.link-preview-image-preview{width:100%;height:auto;max-height:300px;object-fit:contain;border:1px solid #D1D5DB;border-radius:6px;background-color:#fff}.link-preview-image-placeholder{width:100%;height:200px;background-color:#fff;border:1px solid #E5E7EB;border-radius:6px;display:flex;align-items:center;justify-content:center}.link-preview-image-placeholder-content{padding:1.5rem;text-align:center}.link-preview-file-input{display:none}.link-preview-upload-button{padding:.625rem 1rem;background-color:#fff;border:1px solid #E5E7EB;border-radius:6px;font-size:14px;font-weight:500;color:#374151;cursor:pointer;transition:all .15s ease;text-align:center;display:inline-block}.link-preview-upload-button:hover{background-color:#f9fafb;border-color:#d1d5db}.link-preview-hint{font-size:12px;color:#6b7280;margin:0}.link-preview-thumbnail-image{width:100%;height:100%;object-fit:cover}.link-preview-modal-footer{padding:1.5rem 2rem;border-top:1px solid #E5E7EB;display:flex;justify-content:flex-end}.link-preview-update-button{padding:.75rem 1.5rem;background-color:#111827;color:#fff;border:none;border-radius:6px;font-size:14px;font-weight:600;cursor:pointer;transition:background-color .2s}.link-preview-update-button:hover{background-color:#374151}.form-meta{margin-top:1.75rem;border-top:1px solid #E5E7EB;padding-top:1.75rem}.form-title-header{display:flex;justify-content:space-between;align-items:flex-start;gap:.5rem}.form-title-header h3{font-size:14px;margin:0}.form-meta p{color:#6b7280;font-size:13px;line-height:1.5;margin:.625rem 0 0}.edit-button{background:none;border:none;cursor:pointer;color:#9ca3af;padding:.375rem;border-radius:.375rem;display:flex;align-items:center;justify-content:center;transition:all .15s ease;flex-shrink:0}.edit-button:hover{background-color:#f3f4f6;color:#374151}.embed-settings-modal-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background-color:#00000080;z-index:10000;display:flex;align-items:center;justify-content:center;padding:2rem}.embed-settings-modal{background:#fff;border-radius:12px;width:100%;max-width:1200px;max-height:90vh;display:flex;flex-direction:column;box-shadow:0 20px 25px -5px #0000001a,0 10px 10px -5px #0000000a;overflow:hidden}.embed-settings-header{display:flex;justify-content:space-between;align-items:center;padding:1.5rem 2rem;border-bottom:1px solid #E5E7EB}.embed-settings-header h2{font-size:24px;font-weight:700;color:#111827;margin:0}.embed-settings-close{background:none;border:none;cursor:pointer;color:#6b7280;padding:.5rem;border-radius:6px;display:flex;align-items:center;justify-content:center;transition:background-color .2s}.embed-settings-close:hover{background-color:#f3f4f6}.embed-settings-close .close-icon{width:24px;height:24px}.embed-preview-popup-container button,.embed-preview-slider-container button{min-width:32px;min-height:32px}.embed-preview-popup-container button svg,.embed-preview-slider-container button svg{width:18px!important;height:18px!important;display:block!important;flex-shrink:0!important;stroke:#fff!important;color:#fff!important}.embed-preview-popup-container button svg line,.embed-preview-slider-container button svg line{stroke:#fff!important;stroke-width:2.5!important}.embed-settings-content{display:grid;grid-template-columns:400px 1fr;flex:1;overflow:hidden}.embed-settings-panel{padding:2rem;border-right:1px solid #E5E7EB;overflow-y:auto}.embed-setting-group{margin-bottom:1.5rem}.embed-setting-label{display:block;font-size:13px;font-weight:600;color:#374151;margin-bottom:.5rem;letter-spacing:.01em}.embed-setting-label-row{display:flex;align-items:center;gap:.5rem;margin-bottom:.5rem}.embed-setting-help{width:18px;height:18px;border-radius:50%;background-color:#e5e7eb;color:#6b7280;display:flex;align-items:center;justify-content:center;font-size:12px;font-weight:600;cursor:help}.embed-setting-select{width:100%;padding:.625rem 2.5rem .625rem .75rem;border:1px solid #D1D5DB;border-radius:6px;font-size:14px;color:#111827;background-color:#fff;cursor:pointer;-webkit-appearance:none;-moz-appearance:none;appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='%236B7280' d='M6 9L1 4h10z'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right .75rem center;transition:border-color .15s ease,box-shadow .15s ease}.embed-setting-select:hover{border-color:#9ca3af}.embed-setting-select:focus{outline:none;border-color:#6366f1;box-shadow:0 0 0 3px #6366f11a}.embed-setting-toggle{display:flex;align-items:center}.toggle-switch{position:relative;width:48px;height:24px;background-color:#e5e7eb;border-radius:12px;border:none;cursor:pointer;transition:background-color .2s ease;padding:0;outline:none}.toggle-switch:hover:not(.on){background-color:#d1d5db}.toggle-switch.on{background-color:#3b82f6}.toggle-switch.on:hover{background-color:#2563eb}.toggle-slider{position:absolute;cursor:pointer;top:2px;left:3px;right:0;bottom:0;background-color:#fff;transition:.3s;border-radius:24px;width:20px;height:20px;box-shadow:0 1px 3px #0000001a}.toggle-switch.on .toggle-slider{position:absolute;cursor:pointer;top:2px;left:21px;right:0;bottom:0;background-color:#fff;transition:.3s;border-radius:24px;width:20px;height:auto;box-shadow:0 1px 3px #0000001a;height:20px}.toggle-switch:focus{box-shadow:0 0 0 2px #3b82f633;outline:none}.embed-setting-input-group{display:flex;align-items:center;gap:.5rem}.embed-setting-input{flex:1;padding:.625rem .75rem;border:1px solid #D1D5DB;border-radius:6px;font-size:14px;color:#111827;background-color:#fff;min-width:0}.embed-setting-input:focus{outline:none;border-color:#6366f1;box-shadow:0 0 0 3px #6366f11a;background-color:#fff}.embed-setting-input-buttons{display:flex;flex-direction:column;gap:0}.embed-setting-input-btn{background:#fff;border:1px solid #D1D5DB;padding:.25rem;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .15s ease;width:28px;height:18px}.embed-setting-input-btn:first-child{border-top-left-radius:4px;border-top-right-radius:4px;border-bottom:none}.embed-setting-input-btn:last-child{border-bottom-left-radius:4px;border-bottom-right-radius:4px}.embed-setting-input-btn:hover{background-color:#f3f4f6;border-color:#9ca3af}.embed-setting-input-btn:active{background-color:#e5e7eb}.embed-setting-input-btn .chevron-icon{width:12px;height:12px;color:#6b7280}.embed-setting-unit{font-size:14px;color:#6b7280;white-space:nowrap}.embed-setting-unit-select{padding:.625rem 2rem .625rem .75rem;border:1px solid #D1D5DB;border-radius:6px;font-size:14px;color:#111827;background-color:#fff;cursor:pointer;-webkit-appearance:none;-moz-appearance:none;appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='%236B7280' d='M6 9L1 4h10z'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right .5rem center;min-width:60px;transition:border-color .15s ease,box-shadow .15s ease}.embed-setting-unit-select:hover{border-color:#9ca3af}.embed-setting-unit-select:focus{outline:none;border-color:#6366f1;box-shadow:0 0 0 3px #6366f11a}.embed-get-code-btn{width:100%;padding:.75rem 1rem;background-color:#111827;color:#fff;border:none;border-radius:6px;font-size:14px;font-weight:600;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:.5rem;margin-top:1.5rem;transition:background-color .2s}.embed-get-code-btn:hover:not(.copied){background-color:#374151}.embed-get-code-btn.copied{background-color:#10b981;color:#fff}.embed-get-code-btn.copied:hover{background-color:#059669}.embed-react-link{text-align:center;color:#6b7280;font-size:13px;margin-top:.75rem;cursor:pointer}.embed-react-link:hover{color:#4f46e5;text-decoration:underline}.embed-preview-panel{display:flex;flex-direction:column;overflow:hidden}.embed-preview-header{display:flex;justify-content:space-between;align-items:center;padding:1.5rem 2rem;border-bottom:1px solid #E5E7EB}.embed-preview-view-toggle{display:flex;gap:.25rem;background-color:#f3f4f6;padding:.25rem;border-radius:6px}.view-toggle-btn{padding:.5rem 1rem;border:none;background:transparent;border-radius:4px;font-size:14px;font-weight:500;color:#6b7280;cursor:pointer;transition:all .2s}.view-toggle-btn.active{background-color:#fff;color:#111827;box-shadow:0 1px 2px #0000000d}.embed-preview-btn{padding:.5rem 1rem;background-color:#3b82f6;color:#fff;border:none;border-radius:6px;font-size:14px;font-weight:500;cursor:pointer;transition:background-color .2s}.embed-preview-btn:hover{background-color:#2563eb}.embed-preview-content{flex:1;padding:2rem;overflow-y:auto;display:flex;align-items:flex-start;justify-content:center}.embed-preview-container{transition:width .3s ease,height .3s ease;min-height:400px}.embed-preview-floating-button{transition:all .2s ease}.embed-preview-floating-button:hover{transform:scale(1.05);box-shadow:0 6px 12px -2px #00000026,0 4px 8px -4px #0000001a!important}.embed-setting-input-full{width:100%;padding:.625rem .75rem;border:1px solid #D1D5DB;border-radius:6px;font-size:14px;color:#111827;background-color:#fff}.embed-setting-input-full:focus{outline:none;border-color:#6366f1;box-shadow:0 0 0 3px #6366f11a;background-color:#fff}.embed-color-picker-group{display:flex;align-items:center;gap:.75rem}.embed-color-picker{width:48px;height:32px;border:1px solid #D1D5DB;border-radius:6px;cursor:pointer;padding:0;background:none;transition:border-color .15s ease}.embed-color-picker:hover{border-color:#9ca3af}.embed-color-picker::-webkit-color-swatch-wrapper{padding:0}.embed-color-picker::-webkit-color-swatch{border:none;border-radius:4px}.embed-color-picker::-moz-color-swatch{border:none;border-radius:4px}.embed-color-display{width:32px;height:32px;border-radius:6px;border:1px solid #D1D5DB;flex-shrink:0;box-shadow:inset 0 1px 2px #0000000d}@keyframes scaleIn{0%{transform:scale(.95);opacity:0}to{transform:scale(1);opacity:1}}@keyframes slideInRight{0%{transform:translate(100%)}to{transform:translate(0)}}@keyframes slideInLeft{0%{transform:translate(-100%)}to{transform:translate(0)}}.results-container{font-family:Inter,system-ui,sans-serif;width:100%;height:100%;display:flex;flex-direction:column;background-color:#fff;overflow:hidden}.results-header{display:flex;justify-content:space-between;align-items:center;padding:0;background-color:#f5f3ff;border-bottom:none;flex-shrink:0}.view-tabs{display:flex;gap:0}.view-tabs button{padding:16px 20px;border:none;background:none;border-radius:0;font-size:14px;color:#6b7280;cursor:pointer;position:relative;display:flex;align-items:center;gap:6px;transition:all .2s ease;border-bottom:2px solid transparent}.view-tabs button .tab-count{display:inline-flex;align-items:center;justify-content:center;background-color:#8b5cf6;color:#fff;font-size:12px;font-weight:500;height:20px;min-width:20px;padding:0 6px;border-radius:10px;line-height:1}.view-tabs button.active{background-color:transparent;color:#8b5cf6;font-weight:500;border-bottom:2px solid #8b5cf6}.view-tabs button:hover:not(.active){color:#8b5cf6;background-color:#8b5cf60d}.view-tabs button svg{width:16px;height:16px;margin-right:6px;opacity:.7}.view-tabs button.active svg{opacity:1}.add-view-btn{padding:8px 16px;background-color:#fff;border:1px solid #e5e7eb;border-radius:4px;font-size:14px;color:#4b5563;cursor:pointer;display:flex;align-items:center;gap:8px;margin-right:16px;transition:all .2s ease}.add-view-btn:hover{background-color:#f9fafb;border-color:#d1d5db}.add-view-btn:before{content:"+";font-weight:700}.results-filters{display:flex;align-items:center;padding:12px 16px;background-color:#fff;border-bottom:1px solid #f3f4f6;gap:8px;flex-shrink:0;box-shadow:0 1px 2px #00000008}.filter-btn{padding:8px 12px;background-color:#fff;border:1px solid #e5e7eb;border-radius:4px;font-size:14px;color:#4b5563;cursor:pointer;display:flex;align-items:center;gap:6px;transition:all .2s ease}.filter-btn:hover{background-color:#f9fafb;border-color:#d1d5db}.filter-btn svg{width:16px;height:16px;opacity:.7}.results-count{margin-left:auto;font-size:14px;color:#6b7280;font-weight:500}.results-actions{display:flex;gap:12px;margin-left:16px}.action-btn{background:none;border:none;cursor:pointer;color:#6b7280;font-size:14px;display:flex;align-items:center;gap:4px;padding:6px 8px;border-radius:4px;transition:all .2s ease}.action-btn:hover{background-color:#f9fafb;color:#4b5563}.action-btn svg{width:18px;height:18px;opacity:.7}.no-submissions-container{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:60px 20px;background-color:#fff;border-radius:8px;margin:20px;text-align:center;box-shadow:0 1px 3px #0000000d;flex:1}.no-submissions-icon{font-size:48px;margin-bottom:16px}.no-submissions-container h3{font-size:18px;color:#111827;margin-bottom:8px;font-weight:500}.no-submissions-container p{color:#6b7280;margin-bottom:24px;max-width:400px}.no-submissions-actions{display:flex;gap:12px}.no-submissions-actions .action-btn{padding:8px 16px;border-radius:4px;font-size:14px;font-weight:500}.action-btn.share-form{background-color:#8b5cf6;color:#fff}.action-btn.preview-form{background-color:#fff;border:1px solid #e5e7eb;color:#4b5563}.results-table-wrapper{overflow:auto;flex:1;min-height:0;background-color:#fff;border-radius:4px}.results-table{width:100%;border-collapse:collapse;font-size:14px;table-layout:fixed}.results-table th{background-color:#fff;padding:14px 16px;text-align:left;font-weight:500;color:#4b5563;border-bottom:1px solid #f3f4f6;white-space:nowrap;position:sticky;top:0;z-index:1}.results-table th.select-all{width:48px;padding-left:16px;padding-right:8px}.results-table th.last-updated{width:180px}.results-table th.sorted-asc:after{content:"↑";margin-left:4px;color:#8b5cf6}.results-table th.sorted-desc:after{content:"↓";margin-left:4px;color:#8b5cf6}.results-table th.actions-column{width:50px}.results-table td{padding:14px 16px;border-bottom:1px solid #f3f4f6;color:#374151;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.results-table tr:hover{background-color:#faf5ff}.no-results{text-align:center;color:#6b7280;padding:32px 0}.loading,.error{display:flex;justify-content:center;align-items:center;height:400px;font-size:16px;color:#6b7280}.error{color:#ef4444}.debug-info{display:none;padding:20px;background-color:#fff;border:1px solid #e5e7eb;border-radius:4px;margin:20px;overflow:auto;max-height:500px;box-shadow:0 2px 5px #0000001a}.debug-info.show{display:block}.debug-info pre{background-color:#f9fafb;padding:12px;border-radius:4px;overflow-x:auto;font-size:12px;line-height:1.5}.debug-info h3{margin-bottom:8px;color:#4b5563;font-size:16px}.debug-toggle{border:1px solid #e5e7eb;background-color:#f9fafb;border-radius:4px;padding:8px 16px;font-size:14px;cursor:pointer;align-self:flex-start;margin:16px;color:#4b5563}.export-dropdown-container{position:relative;display:inline-block}.export-dropdown{position:absolute;top:100%;right:0;background-color:#fff;box-shadow:0 2px 10px #0000001a;border-radius:4px;z-index:10;min-width:150px;margin-top:5px}.export-dropdown button{display:block;width:100%;text-align:left;padding:10px 15px;border:none;background:none;cursor:pointer;font-size:14px;color:#1f2937}.export-dropdown button:hover{background-color:#f5f3ff}.analytics-container{display:flex;flex-direction:column;padding:32px;flex:1;background-color:#fff}.analytics-cards{display:flex;gap:24px;flex-wrap:wrap}.analytics-card{background-color:#fff;border-radius:12px;padding:24px;min-width:240px;flex:1;box-shadow:0 1px 3px #0000000d;border:1px solid #f3f4f6}.analytics-card-content{display:flex;align-items:center;gap:16px}.analytics-card-icon{width:40px;height:40px;display:flex;align-items:center;justify-content:center;border-radius:8px;color:#fff}.visitors-icon,.started-icon,.finished-icon,.rate-icon,.time-icon{background-color:#8b5cf6}.analytics-card-info h3{font-size:14px;font-weight:400;color:#6b7280;margin:0 0 8px}.analytics-card-value{display:flex;align-items:baseline;gap:4px}.primary-value{font-size:24px;font-weight:600;color:#111827}.secondary-value{font-size:14px;color:#6b7280}.row-actions{opacity:0;transition:opacity .2s ease;text-align:center}.results-table tr:hover .row-actions{opacity:1}.row-action-btn{background:none;border:none;cursor:pointer;color:#6b7280;padding:4px;border-radius:4px;display:inline-flex;align-items:center;justify-content:center}.row-action-btn:hover{background-color:#f3f4f6;color:#8b5cf6}.checkbox-wrapper{display:flex;align-items:center;justify-content:center}input[type=checkbox]{cursor:pointer;width:18px;height:18px;border-radius:4px;border:1.5px solid #e5e7eb;position:relative;-webkit-appearance:none;-moz-appearance:none;appearance:none;background-color:#fff;transition:all .2s ease;margin:0;padding:0}input[type=checkbox]:checked{background-color:#8b5cf6;border-color:#8b5cf6}input[type=checkbox]:checked:after{content:"";position:absolute;top:3px;left:4px;width:3px;height:6px;border:solid white;border-width:0 2px 2px 0;transform:rotate(45deg)}input[type=checkbox]:hover:not(:checked){border-color:#9ca3af;background-color:#f9fafb}.indeterminate-checkbox{cursor:pointer;width:18px;height:18px;display:inline-flex;align-items:center;justify-content:center}.indeterminate-checkbox svg{margin:0;padding:0}.selected-row{background-color:#f5f3ff}.selected-row:hover{background-color:#ede9fe!important}.results-table tr:first-child td{border-top:none}.analytics-chart-container{background-color:#fff;border-radius:12px;box-shadow:0 1px 3px #0000000d;margin:24px 0;padding:24px;width:100%;border:1px solid #f3f4f6}.analytics-chart{height:320px;position:relative;margin-top:16px}.timeframe-selector{display:flex;align-items:center;gap:12px;margin-bottom:20px}.timeframe-selector span{font-size:14px;color:#6b7280}.timeframe-selector button{padding:6px 12px;background-color:#fff;border:1px solid #e5e7eb;border-radius:6px;font-size:14px;color:#4b5563;cursor:pointer;transition:all .2s ease}.timeframe-selector button:hover{background-color:#f9fafb;border-color:#d1d5db}.timeframe-selector button.active{background-color:#8b5cf6;color:#fff;border-color:#8b5cf6}.chart-loading{display:flex;align-items:center;justify-content:center;height:100%;color:#6b7280;font-size:14px;position:absolute;top:0;left:0;right:0;bottom:0;background-color:#ffffffb3;border-radius:8px}.form-settings-modal-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:#00000080;display:flex;align-items:center;justify-content:center;z-index:10000;padding:20px}.form-settings-modal{background:#fff;border-radius:12px;box-shadow:0 25px 50px #00000040;width:90vw;height:85vh;max-width:1200px;max-height:800px;display:flex;flex-direction:column;overflow:hidden;position:relative}.form-settings-modal-close-btn{position:absolute;top:16px;right:16px;background:none;border:none;padding:8px;border-radius:6px;cursor:pointer;color:#64748b;transition:all .2s ease;z-index:10001;display:flex;align-items:center;justify-content:center}.form-settings-modal-close-btn:hover{background:#f1f5f9;color:#1e293b}.form-settings-close-icon{width:20px;height:20px}.form-settings-modal-help-btn{width:36px;height:36px;border-radius:50%;background:transparent;border:1px solid #e2e8f0;cursor:pointer;display:flex;align-items:center;justify-content:center;color:#64748b;transition:all .2s ease}.form-settings-modal-help-btn:hover{background:#f1f5f9;color:#1e293b;border-color:#cbd5e1}.form-settings-help-icon{width:20px;height:20px;flex-shrink:0}.form-settings-modal-container{display:flex;flex:1;overflow:hidden;min-width:0}.form-settings-sidebar{width:280px;min-width:250px;max-width:280px;background:#fafafa;border-right:1px solid #e5e5e5;display:flex;flex-direction:column;padding:24px 0;overflow-y:auto;flex-shrink:0}.form-settings-sidebar-header{display:flex;align-items:center;gap:12px;padding:0 24px 24px;border-bottom:1px solid #e5e5e5;margin-bottom:16px}.form-settings-header-icon{width:24px;height:24px;color:#3b82f6}.form-settings-sidebar-title{font-size:20px;font-weight:700;color:#1f2937;margin:0}.form-settings-nav{display:flex;flex-direction:column;gap:4px;padding:0 12px;flex:1}.form-settings-nav-item{display:flex;align-items:center;gap:12px;padding:10px 12px;border:none;background:transparent;border-radius:8px;cursor:pointer;transition:all .2s ease;text-align:left;color:#374151;font-size:14px;font-weight:500}.form-settings-nav-item:hover{background:#f3f4f6}.form-settings-nav-item.active{background:#f3f4f6;color:#1f2937}.form-settings-nav-icon{width:20px;height:20px;flex-shrink:0}.form-settings-nav-label{flex:1}.form-settings-nav-tag{font-size:11px;font-weight:600;padding:2px 6px;border-radius:4px;text-transform:uppercase;letter-spacing:.5px}.form-settings-nav-tag.grey{background:#e5e7eb;color:#6b7280}.form-settings-nav-tag.green{background:#d1fae5;color:#065f46}.form-settings-upgrade-btn{display:flex;align-items:center;justify-content:center;gap:8px;margin:16px 12px 0;padding:12px 16px;background:#1f2937;color:#fff;border:none;border-radius:8px;font-size:14px;font-weight:600;cursor:pointer;transition:all .2s ease}.form-settings-upgrade-btn:hover{background:#111827}.form-settings-upgrade-icon{width:18px;height:18px;color:#fbbf24}.form-settings-main-content{flex:1;overflow-y:auto;overflow-x:hidden;padding:32px 40px 100px;background:#fff;min-width:0}.form-settings-content{max-width:700px;width:100%}.form-settings-content-title{font-size:28px;font-weight:700;color:#1f2937;margin:0 0 24px}.form-settings-tabs{display:flex;gap:0;border-bottom:2px solid #e5e7eb;margin-bottom:32px}.form-settings-tab{padding:12px 0;margin-right:32px;border:none;background:transparent;font-size:15px;font-weight:500;color:#6b7280;cursor:pointer;border-bottom:2px solid transparent;margin-bottom:-2px;transition:all .2s ease;border-radius:0!important}.form-settings-tab:hover{color:#374151}.form-settings-tab.active{color:#1f2937;border-bottom-color:#1f2937;font-weight:600}.form-settings-section-content{display:flex;flex-direction:column;gap:0}.form-settings-item{display:grid;grid-template-columns:1fr auto;gap:24px;align-items:flex-start;padding:20px 0;border-bottom:1px solid #f1f5f9}.setting-item:last-child{border-bottom:none}.form-settings-item-full-width{grid-template-columns:1fr}.form-settings-item-full-width .form-settings-control-full-width{margin-top:12px;width:100%}.form-settings-info{display:flex;flex-direction:column;gap:4px;min-width:0;overflow-wrap:break-word}.form-settings-label{font-size:15px;font-weight:600;color:#1f2937;margin:0;display:flex;align-items:center;flex-wrap:wrap;gap:8px}.form-settings-description{font-size:14px;color:#6b7280;line-height:1.5;margin:0;word-wrap:break-word;overflow-wrap:break-word}.form-settings-control{display:flex;align-items:flex-start;justify-content:flex-end;flex-shrink:0}.form-settings-control-full-width{width:100%}.form-settings-pro-badge,.form-settings-business-badge{display:inline-flex;align-items:center;padding:2px 6px;border-radius:4px;font-size:11px;font-weight:600;text-transform:uppercase;letter-spacing:.3px;line-height:1}.form-settings-pro-badge{background-color:#e0e7ff;color:#4f46e5}.form-settings-business-badge{background-color:#dcfce7;color:#16a34a}.form-settings-dropdown,.form-settings-textarea{width:100%;min-width:200px;padding:8px 12px;border:1px solid #e2e8f0;border-radius:6px;font-size:14px;color:#334155;background-color:#fff;transition:all .2s ease}.form-settings-dropdown:focus,.form-settings-textarea:focus{outline:none;border-color:#3b82f6;box-shadow:0 0 0 3px #3b82f61a}.form-settings-textarea{resize:vertical;min-height:80px;font-family:inherit;line-height:1.5}.form-settings-notification-card{display:flex;align-items:flex-start;gap:16px;padding:20px;background:#fafafa;border-radius:8px;border:1px solid #e5e5e5}.form-settings-notification-icon{width:40px;height:40px;display:flex;align-items:center;justify-content:center;color:#9ca3af;flex-shrink:0}.form-settings-notification-icon svg{width:24px;height:24px}.form-settings-notification-info{flex:1;min-width:0}.form-settings-notification-title{font-size:16px;font-weight:600;color:#1f2937;margin:0 0 4px}.form-settings-notification-description{font-size:14px;color:#6b7280;margin:0;line-height:1.5}.form-settings-toggle-switch{position:relative;display:inline-block;width:44px;height:24px;flex-shrink:0}.form-settings-toggle-switch input{opacity:0;width:0;height:0}.form-settings-toggle-slider{position:absolute;cursor:pointer;top:0;left:0;right:0;bottom:0;background-color:#d1d5db;transition:.3s;border-radius:24px}.form-settings-toggle-slider:before{position:absolute;content:"";height:18px;width:18px;left:3px;bottom:3px;background-color:#fff;transition:.3s;border-radius:50%}.form-settings-toggle-switch input:checked+.form-settings-toggle-slider{background-color:#3b82f6}.form-settings-toggle-switch input:checked+.form-settings-toggle-slider:before{transform:translate(20px)}.form-settings-toggle-switch input:focus+.form-settings-toggle-slider{box-shadow:0 0 1px #3b82f6}.form-settings-empty-state-text{color:#9ca3af;font-size:14px;margin:32px 0}.dark-mode .form-settings-modal{background:#1f2937;color:#f9fafb}.dark-mode .form-settings-sidebar{background:#111827;border-right-color:#374151}.dark-mode .form-settings-sidebar-header{border-bottom-color:#374151}.dark-mode .form-settings-sidebar-title{color:#f9fafb}.dark-mode .form-settings-nav-item{color:#d1d5db}.dark-mode .form-settings-nav-item:hover{background:#1f2937}.dark-mode .form-settings-nav-item.active{background:#1f2937;color:#f9fafb}.dark-mode .form-settings-nav-tag.grey{background:#374151;color:#9ca3af}.dark-mode .form-settings-upgrade-btn{background:#374151}.dark-mode .form-settings-upgrade-btn:hover{background:#4b5563}.dark-mode .form-settings-main-content{background:#1f2937}.dark-mode .form-settings-content-title{color:#f9fafb}.dark-mode .form-settings-tabs{border-bottom-color:#374151}.dark-mode .form-settings-tab{color:#9ca3af}.dark-mode .form-settings-tab:hover{color:#d1d5db}.dark-mode .form-settings-tab.active{color:#f9fafb;border-bottom-color:#f9fafb}.dark-mode .form-settings-notification-card{background:#111827;border-color:#374151}.dark-mode .form-settings-notification-title{color:#f9fafb}.dark-mode .form-settings-notification-description{color:#9ca3af}.dark-mode .form-settings-notification-icon{color:#6b7280}.dark-mode .form-settings-modal-close-btn{color:#9ca3af}.dark-mode .form-settings-modal-close-btn:hover{background:#374151;color:#f9fafb}.dark-mode .form-settings-modal-help-btn{background:transparent;border-color:#374151;color:#9ca3af}.dark-mode .form-settings-modal-help-btn:hover{background:#374151;color:#f9fafb;border-color:#4b5563}.dark-mode .form-settings-item{border-bottom-color:#374151}.dark-mode .form-settings-label{color:#f9fafb}.dark-mode .form-settings-description{color:#9ca3af}.dark-mode .form-settings-pro-badge{background-color:#312e81;color:#a5b4fc}.dark-mode .form-settings-business-badge{background-color:#14532d;color:#86efac}.dark-mode .form-settings-dropdown,.dark-mode .form-settings-textarea{background-color:#1f2937;border-color:#374151;color:#f9fafb}.dark-mode .form-settings-dropdown:focus,.dark-mode .form-settings-textarea:focus{border-color:#3b82f6;box-shadow:0 0 0 3px #3b82f633}.form-settings-modal-footer{position:absolute;bottom:0;left:280px;right:0;background:#fff;border-top:1px solid #e5e7eb;padding:16px 24px;display:flex;align-items:center;justify-content:space-between;gap:12px;box-shadow:0 -4px 6px -1px #0000000d;z-index:10}.form-settings-footer-left,.form-settings-footer-right{display:flex;align-items:center;gap:12px}.form-settings-modal-footer-save-btn{padding:12px 24px;border:1px solid #e5e7eb;background:#fff;color:#6b7280;border-radius:8px;font-size:14px;font-weight:600;cursor:pointer;transition:all .2s ease;box-shadow:0 1px 2px #0000000d}.form-settings-modal-footer-save-btn:hover{background:#f9fafb;border-color:#d1d5db}.form-settings-modal-footer-save-btn.has-changes{background:#3b82f6;color:#fff;border-color:#3b82f6;box-shadow:0 2px 8px #3b82f64d}.form-settings-modal-footer-save-btn.has-changes:hover{background:#2563eb;border-color:#2563eb;box-shadow:0 4px 12px #3b82f666;transform:translateY(-1px)}.form-settings-modal-footer-save-btn:disabled{background:#9ca3af;color:#fff;cursor:not-allowed;border-color:#9ca3af;opacity:.7}.form-settings-modal-footer-save-btn.has-changes:disabled{background:#9ca3af;border-color:#9ca3af;transform:none}.form-settings-save-success{padding:8px 16px;background:#10b981;color:#fff;border-radius:6px;font-size:13px;font-weight:500;box-shadow:0 2px 8px #10b9814d;animation:fadeIn .2s ease}.form-settings-save-error{padding:8px 16px;background:#ef4444;color:#fff;border-radius:6px;font-size:13px;font-weight:500;box-shadow:0 2px 8px #ef44444d;animation:fadeIn .2s ease;max-width:400px}@keyframes fadeIn{0%{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:translateY(0)}}.dark-mode .form-settings-modal-footer{background:#1f2937;border-top-color:#374151}.dark-mode .form-settings-modal-footer-save-btn{background:#374151;color:#9ca3af;border-color:#4b5563}.dark-mode .form-settings-modal-footer-save-btn:hover{background:#4b5563;border-color:#6b7280}.dark-mode .form-settings-modal-footer-save-btn.has-changes{background:#3b82f6;color:#fff;border-color:#3b82f6}.dark-mode .form-settings-modal-footer-save-btn.has-changes:hover{background:#2563eb;border-color:#2563eb}.email-preview-box{margin-top:16px;padding:20px;background:#f9fafb;border:1px solid #e5e7eb;border-radius:8px;font-size:14px}.email-preview-field{display:flex;margin-bottom:12px;gap:12px}.email-preview-field:last-of-type{margin-bottom:16px}.email-preview-label{min-width:100px;color:#6b7280;font-weight:400}.email-preview-value{color:#111827;font-weight:400;flex:1}.email-preview-footer{padding-top:16px;border-top:1px solid #e5e7eb;display:flex;align-items:flex-start;gap:12px}.email-preview-footer-text{flex:1;margin:0;font-size:13px;color:#6b7280;line-height:1.5}.email-preview-footer-link{color:#3b82f6;text-decoration:underline;cursor:pointer}.email-preview-footer-link:hover{color:#2563eb}.email-preview-pro-badge{padding:4px 8px;background:#ede9fe;color:#7c3aed;border-radius:4px;font-size:11px;font-weight:600;text-transform:uppercase;letter-spacing:.5px;white-space:nowrap}.form-builder-design{display:flex;width:100%;height:calc(100vh - 56px);background:#fafafa;overflow:hidden;position:relative;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,system-ui,sans-serif;color:#1a1a1a;--primary-color: #2563eb;--primary-hover: #1d4ed8;--secondary-color: #f8fafc;--border-color: #e2e8f0;--text-primary: #0f172a;--text-secondary: #64748b;--text-muted: #94a3b8;--shadow-sm: 0 1px 2px 0 rgb(0 0 0 / .05);--shadow-md: 0 4px 6px -1px rgb(0 0 0 / .1), 0 2px 4px -2px rgb(0 0 0 / .1);--shadow-lg: 0 10px 15px -3px rgb(0 0 0 / .1), 0 4px 6px -4px rgb(0 0 0 / .1);--radius-sm: 6px;--radius-md: 8px;--radius-lg: 12px}.form-builder-design .sidebar-container{display:flex;position:relative;z-index:100;flex-shrink:0;transition:all .3s cubic-bezier(.4,0,.2,1)}.form-builder-design .design-sidebar.compact-sidebar{width:80px;background:#fff;border-right:1px solid var(--border-color);display:flex;flex-direction:column;box-shadow:var(--shadow-sm);z-index:100;transition:all .3s cubic-bezier(.4,0,.2,1);position:relative}.form-builder-design .design-sidebar.compact-sidebar.expanded{width:280px;box-shadow:var(--shadow-md)}.form-builder-design .sidebar-header{padding:20px;border-bottom:1px solid var(--border-color);display:flex;align-items:center;justify-content:space-between;min-height:80px;background:#fff}.form-builder-design .logo-icon{font-size:20px;font-weight:600;color:var(--primary-color);cursor:pointer;transition:all .2s ease}.form-builder-design .logo-icon:hover{transform:scale(1.05)}.form-builder-design .sidebar-toggle{background:var(--secondary-color);border:1px solid var(--border-color);color:var(--text-secondary);font-size:14px;font-weight:500;cursor:pointer;padding:8px;border-radius:var(--radius-md);transition:all .2s ease;width:32px;height:32px;display:flex;align-items:center;justify-content:center;box-shadow:var(--shadow-sm)}.form-builder-design .sidebar-toggle:hover{background:#fff;border-color:var(--primary-color);color:var(--primary-color);box-shadow:var(--shadow-md)}.form-builder-design .tool-groups{flex:1;padding:16px 12px;display:flex;flex-direction:column;gap:24px;overflow-y:auto}.form-builder-design .tool-group{display:flex;flex-direction:column}.form-builder-design .tool-group:first-child .group-separator{display:none}.form-builder-design .tool-buttons{display:flex;flex-direction:column;gap:4px}.form-builder-design .tool-btn{display:flex;align-items:center;gap:12px;padding:12px 16px;border:none;background:transparent;border-radius:var(--radius-md);cursor:pointer;transition:all .2s ease;color:var(--text-secondary);font-size:14px;font-weight:500;justify-content:flex-start;min-height:44px;position:relative}.form-builder-design .tool-btn:hover{background:var(--secondary-color);color:var(--text-primary)}.form-builder-design .tool-btn.active{background:var(--primary-color);color:#fff;font-weight:600;box-shadow:var(--shadow-md)}.form-builder-design .tool-icon{width:20px;height:20px;flex-shrink:0;stroke-width:1.5}.form-builder-design .tool-btn.active .tool-icon{stroke-width:2}.form-builder-design .tool-label{font-size:14px;opacity:0;transition:all .3s ease;white-space:nowrap;overflow:hidden;width:0}.form-builder-design .design-sidebar.compact-sidebar.expanded .tool-label{opacity:1;width:auto}.form-builder-design .design-sidebar.compact-sidebar:not(.expanded) .tool-btn{justify-content:center;padding:12px}.form-builder-design .design-sidebar.compact-sidebar:not(.expanded) .tool-btn{position:relative}.form-builder-design .design-sidebar.compact-sidebar:not(.expanded) .tool-btn:hover:after{content:attr(title);position:absolute;left:calc(100% + 12px);top:50%;transform:translateY(-50%);background:var(--text-primary);color:#fff;padding:8px 12px;border-radius:var(--radius-md);font-size:12px;font-weight:500;white-space:nowrap;z-index:1000;box-shadow:var(--shadow-lg);animation:fadeInTooltip .2s ease-out}.form-builder-design .design-sidebar.compact-sidebar:not(.expanded) .tool-btn:hover:before{content:"";position:absolute;left:calc(100% + 4px);top:50%;transform:translateY(-50%);border:4px solid transparent;border-right-color:var(--text-primary);z-index:1000;animation:fadeInTooltip .2s ease-out}@keyframes fadeInTooltip{0%{opacity:0;transform:translateY(-50%) translate(-8px)}to{opacity:1;transform:translateY(-50%) translate(0)}}.form-builder-design .expandable-panel{width:380px;background:#fff;border-right:1px solid var(--border-color);display:flex;flex-direction:column;box-shadow:var(--shadow-md);z-index:90;animation:slideInPanel .3s ease-out;overflow:hidden}@keyframes slideInPanel{0%{transform:translate(-100%)}to{transform:translate(0)}}.form-builder-design .panel-header{padding:24px;border-bottom:1px solid var(--border-color);display:flex;align-items:center;justify-content:space-between;background:#fff;position:sticky;top:0;z-index:10}.form-builder-design .panel-header-content{display:flex;align-items:center;gap:16px;flex:1}.form-builder-design .panel-icon{width:40px;height:40px;border-radius:var(--radius-md);background:var(--primary-color);display:flex;align-items:center;justify-content:center;box-shadow:var(--shadow-sm)}.form-builder-design .header-icon{width:20px;height:20px;color:#fff;stroke-width:2}.form-builder-design .panel-title-container{display:flex;flex-direction:column;gap:2px}.form-builder-design .panel-header h3{margin:0;font-size:18px;font-weight:700;color:var(--text-primary);line-height:1.2}.form-builder-design .panel-subtitle{font-size:12px;font-weight:500;color:var(--text-muted);text-transform:uppercase;letter-spacing:.05em}.form-builder-design .panel-close{background:var(--secondary-color);border:1px solid var(--border-color);color:var(--text-secondary);cursor:pointer;padding:8px;border-radius:var(--radius-md);transition:all .2s ease;width:32px;height:32px;display:flex;align-items:center;justify-content:center;box-shadow:var(--shadow-sm)}.form-builder-design .close-icon{width:16px;height:16px;stroke-width:2}.form-builder-design .panel-close:hover{background:#fff;border-color:var(--primary-color);color:var(--primary-color);box-shadow:var(--shadow-md)}.form-builder-design .panel-content{flex:1;overflow-y:auto;background:#fff}.form-builder-design .panel-content::-webkit-scrollbar{width:6px}.form-builder-design .panel-content::-webkit-scrollbar-track{background:transparent}.form-builder-design .panel-content::-webkit-scrollbar-thumb{background:var(--border-color);border-radius:3px}.form-builder-design .panel-content::-webkit-scrollbar-thumb:hover{background:var(--text-muted)}.form-builder-design .design-panel-content{padding:0}.form-builder-design .panel-section{padding:24px;border-bottom:1px solid var(--border-color)}.form-builder-design .panel-section:last-child{border-bottom:none}.form-builder-design .section-header{display:flex;align-items:center;gap:12px;margin-bottom:20px}.form-builder-design .section-icon{font-size:18px}.form-builder-design .section-title-container{flex:1}.form-builder-design .panel-section h4{margin:0 0 4px;font-size:16px;font-weight:600;color:var(--text-primary)}.form-builder-design .section-subtitle{font-size:13px;color:var(--text-secondary);margin:0}.form-builder-design .template-categories{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:20px}.form-builder-design .category-tab{display:flex;align-items:center;gap:8px;padding:8px 16px;background:var(--secondary-color);border:1px solid var(--border-color);border-radius:var(--radius-lg);cursor:pointer;transition:all .2s ease;font-size:13px;font-weight:500;color:var(--text-secondary)}.form-builder-design .category-tab:hover{border-color:var(--primary-color);color:var(--primary-color)}.form-builder-design .category-tab.active{background:var(--primary-color);border-color:var(--primary-color);color:#fff}.form-builder-design .category-icon{font-size:14px}.form-builder-design .theme-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:16px}.form-builder-design .theme-card{background:#fff;border:1px solid var(--border-color);border-radius:var(--radius-md);padding:16px;cursor:pointer;transition:all .2s ease;text-align:center}.form-builder-design .theme-card:hover{border-color:var(--primary-color);box-shadow:var(--shadow-md);transform:translateY(-2px)}.form-builder-design .theme-card.selected{border-color:var(--primary-color);box-shadow:0 0 0 3px #2563eb1a}.form-builder-design .theme-preview{display:flex;gap:4px;justify-content:center;margin-bottom:12px}.form-builder-design .color-swatch{width:16px;height:16px;border-radius:50%;border:2px solid #ffffff;box-shadow:var(--shadow-sm)}.form-builder-design .theme-name{font-size:12px;font-weight:500;color:var(--text-primary)}.form-builder-design .template-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:16px}.form-builder-design .template-card{background:#fff;border:1px solid var(--border-color);border-radius:var(--radius-md);padding:20px;cursor:pointer;transition:all .2s ease}.form-builder-design .template-card:hover{border-color:var(--primary-color);box-shadow:var(--shadow-md);transform:translateY(-2px)}.form-builder-design .template-card.selected{border-color:var(--primary-color);box-shadow:0 0 0 3px #2563eb1a}.form-builder-design .template-preview{display:flex;align-items:center;gap:16px;margin-bottom:16px}.form-builder-design .template-icon{width:40px;height:40px;border-radius:var(--radius-md);display:flex;align-items:center;justify-content:center;font-size:18px;color:#fff;font-weight:600}.form-builder-design .template-fields{display:flex;gap:4px;align-items:center}.form-builder-design .field-indicator{width:6px;height:6px;border-radius:50%;opacity:.6}.form-builder-design .field-count{font-size:11px;color:var(--text-muted);margin-left:8px}.form-builder-design .template-info{flex:1}.form-builder-design .template-name{font-size:14px;font-weight:600;color:var(--text-primary);margin-bottom:4px}.form-builder-design .template-description{font-size:13px;color:var(--text-secondary);line-height:1.4;margin-bottom:12px}.form-builder-design .template-meta{display:flex;align-items:center;justify-content:space-between;gap:12px}.form-builder-design .field-count-badge{font-size:11px;color:var(--text-muted);background:var(--secondary-color);padding:4px 8px;border-radius:var(--radius-sm);font-weight:500}.form-builder-design .btn-use-template{background:var(--primary-color);color:#fff;border:none;padding:6px 12px;border-radius:var(--radius-sm);font-size:12px;font-weight:500;cursor:pointer;transition:all .2s ease}.form-builder-design .btn-use-template:hover{background:var(--primary-hover);transform:translateY(-1px);box-shadow:var(--shadow-md)}.form-builder-design .color-controls{display:grid;grid-template-columns:repeat(auto-fit,minmax(100px,1fr));gap:16px;margin-bottom:20px}.form-builder-design .color-input-group{display:flex;flex-direction:column;gap:8px}.form-builder-design .color-input-group label{font-size:13px;font-weight:500;color:var(--text-primary)}.form-builder-design .color-input-group input[type=color]{width:100%;height:40px;border:1px solid var(--border-color);border-radius:var(--radius-md);cursor:pointer;background:none}.form-builder-design .btn-generate-palette,.form-builder-design .btn-upload,.form-builder-design .btn-extract,.form-builder-design .btn-import{background:var(--secondary-color);border:1px solid var(--border-color);color:var(--text-primary);padding:10px 16px;border-radius:var(--radius-md);font-size:13px;font-weight:500;cursor:pointer;transition:all .2s ease;display:flex;align-items:center;gap:8px;margin-right:8px;margin-bottom:8px}.form-builder-design .btn-generate-palette:hover,.form-builder-design .btn-upload:hover,.form-builder-design .btn-extract:hover,.form-builder-design .btn-import:hover{background:#fff;border-color:var(--primary-color);color:var(--primary-color);box-shadow:var(--shadow-md)}.form-builder-design .toggle-switch{display:flex;align-items:center;gap:12px;padding:12px 0}.form-builder-design .toggle-switch input[type=checkbox]{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:44px;height:24px;background:var(--border-color);border-radius:12px;position:relative;cursor:pointer;transition:all .2s ease}.form-builder-design .toggle-switch input[type=checkbox]:checked{background:var(--primary-color)}.form-builder-design .toggle-switch input[type=checkbox]:before{content:"";position:absolute;top:2px;left:2px;width:20px;height:20px;background:#fff;border-radius:50%;transition:all .2s ease;box-shadow:var(--shadow-sm)}.form-builder-design .toggle-switch input[type=checkbox]:checked:before{transform:translate(20px)}.form-builder-design .toggle-switch label{font-size:14px;font-weight:500;color:var(--text-primary);cursor:pointer}.form-builder-design .animation-controls{margin-top:20px}.form-builder-design .animation-preview-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:20px}.form-builder-design .btn-play-pause{background:var(--primary-color);color:#fff;border:none;padding:8px;border-radius:var(--radius-md);cursor:pointer;transition:all .2s ease;display:flex;align-items:center;justify-content:center;width:32px;height:32px}.form-builder-design .btn-play-pause:hover{background:var(--primary-hover);box-shadow:var(--shadow-md)}.form-builder-design .btn-play-pause .icon{width:16px;height:16px}.form-builder-design .animation-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:12px}.form-builder-design .animation-card{background:#fff;border:1px solid var(--border-color);border-radius:var(--radius-md);padding:16px;cursor:pointer;transition:all .2s ease;text-align:center}.form-builder-design .animation-card:hover{border-color:var(--primary-color);box-shadow:var(--shadow-md)}.form-builder-design .animation-card.selected{border-color:var(--primary-color);box-shadow:0 0 0 3px #2563eb1a}.form-builder-design .animation-preview-box{width:100%;height:60px;background:var(--secondary-color);border-radius:var(--radius-sm);margin-bottom:12px;display:flex;align-items:center;justify-content:center;overflow:hidden}.form-builder-design .animation-demo{width:20px;height:20px;background:var(--primary-color);border-radius:50%}.form-builder-design .animation-info{text-align:center}.form-builder-design .animation-name{font-size:12px;font-weight:600;color:var(--text-primary);margin-bottom:4px}.form-builder-design .animation-description{font-size:11px;color:var(--text-secondary)}.form-builder-design .control-group{display:flex;align-items:center;gap:12px;margin-bottom:16px}.form-builder-design .control-group label{font-size:13px;font-weight:500;color:var(--text-primary);min-width:60px}.form-builder-design .control-group input[type=range]{flex:1;accent-color:var(--primary-color)}.form-builder-design .control-group span{font-size:12px;color:var(--text-secondary);min-width:40px;text-align:right}.form-builder-design .control-group select{flex:1;padding:6px 12px;border:1px solid var(--border-color);border-radius:var(--radius-sm);font-size:13px;background:#fff}.form-builder-design .background-type-selector{display:flex;gap:12px;margin-bottom:20px}.form-builder-design .type-btn{display:flex;align-items:center;gap:8px;padding:12px 16px;background:var(--secondary-color);border:1px solid var(--border-color);border-radius:var(--radius-md);cursor:pointer;transition:all .2s ease;font-size:13px;font-weight:500;color:var(--text-secondary);flex:1;justify-content:center}.form-builder-design .type-btn:hover{border-color:var(--primary-color);color:var(--primary-color)}.form-builder-design .type-btn.active{background:var(--primary-color);border-color:var(--primary-color);color:#fff}.form-builder-design .type-btn .icon{width:16px;height:16px}.form-builder-design .background-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:16px}.form-builder-design .background-card{background:#fff;border:1px solid var(--border-color);border-radius:var(--radius-md);overflow:hidden;cursor:pointer;transition:all .2s ease}.form-builder-design .background-card:hover{border-color:var(--primary-color);box-shadow:var(--shadow-md);transform:translateY(-2px)}.form-builder-design .background-card.selected{border-color:var(--primary-color);box-shadow:0 0 0 3px #2563eb1a}.form-builder-design .background-preview{width:100%;height:80px;position:relative}.form-builder-design .animated-indicator{position:absolute;top:8px;right:8px;font-size:12px;background:#000000b3;color:#fff;padding:2px 6px;border-radius:var(--radius-sm)}.form-builder-design .background-name{padding:12px;font-size:12px;font-weight:500;color:var(--text-primary);text-align:center}.form-builder-design .background-description{padding:0 12px 12px;font-size:11px;color:var(--text-secondary);text-align:center}@media (max-width: 1200px){.form-builder-design .sidebar-container{max-width:400px}.form-builder-design .expandable-panel{width:320px}}@media (max-width: 768px){.form-builder-design .design-sidebar.compact-sidebar{width:60px}.form-builder-design .design-sidebar.compact-sidebar.expanded{width:240px}.form-builder-design .expandable-panel{width:280px}}.form-builder-design .design-canvas{flex:1;display:flex;flex-direction:column;background:#fff;position:relative;overflow:hidden;min-width:0}.form-builder-design .canvas-viewport{flex:1;padding:32px;display:flex;align-items:flex-start;justify-content:center;background:#fafafa;overflow:auto;min-height:0}.form-builder-design .design-canvas.full-width .canvas-viewport{padding:40px}.form-builder-design .canvas-viewport.desktop .form-preview{width:100%;max-width:800px;min-width:600px}.form-builder-design .design-canvas.with-inspector .canvas-viewport.desktop .form-preview{max-width:700px}.form-builder-design .design-canvas.full-width .canvas-viewport.desktop .form-preview{max-width:900px}.form-builder-design .form-preview{background:#fff;border-radius:var(--radius-lg);box-shadow:var(--shadow-lg);transition:all .3s ease;min-height:600px;position:relative;overflow:hidden}.form-builder-design .form-preview-content{padding:40px;max-width:600px;margin:0 auto;width:100%}.form-builder-design .design-canvas.full-width .form-preview-content{max-width:700px}.form-builder-design .form-header{text-align:center;margin-bottom:32px}.form-builder-design .form-header h2{margin:0 0 8px;font-size:28px;font-weight:700;color:var(--text-primary);line-height:1.2}.form-builder-design .form-header p{margin:0;color:var(--text-secondary);font-size:16px;line-height:1.5}.form-builder-design .form-fields{display:flex;flex-direction:column;gap:24px}.form-builder-design .form-actions{margin-top:32px;text-align:center}.form-builder-design .submit-btn{padding:12px 32px;background:var(--primary-color);color:#fff;border:none;border-radius:var(--radius-md);font-size:16px;font-weight:600;cursor:pointer;transition:all .2s ease;box-shadow:var(--shadow-md)}.form-builder-design .submit-btn:hover{background:var(--primary-hover);transform:translateY(-2px);box-shadow:var(--shadow-lg)}.form-builder-design .empty-form-message{text-align:center;padding:60px 20px;color:var(--text-secondary)}.form-builder-design .empty-icon{font-size:48px;margin-bottom:16px;opacity:.6}.form-builder-design .empty-form-message h3{margin:0 0 8px;color:var(--text-primary);font-size:20px;font-weight:600}.form-builder-design .empty-form-message p{margin:0;font-size:14px;line-height:1.5}.form-builder-design .form-field{position:relative;transition:all .2s ease;cursor:pointer;border-radius:var(--radius-md);padding:16px;margin:-16px -16px 8px}.form-builder-design .form-field:hover{background:#2563eb0d;transform:translateY(-1px)}.form-builder-design .form-field.selected{background:#2563eb1a;outline:2px solid var(--primary-color);outline-offset:2px}.form-builder-design .field-label{display:block;margin-bottom:8px;font-size:14px;font-weight:600;color:var(--text-primary)}.form-builder-design .field-description{margin-top:4px;font-size:12px;color:var(--text-secondary)}.form-builder-design .form-input,.form-builder-design .form-textarea{width:100%;padding:12px 16px;border:1px solid var(--border-color);border-radius:var(--radius-md);font-size:14px;background:#fff;transition:all .2s ease;box-sizing:border-box}.form-builder-design .form-input:focus,.form-builder-design .form-textarea:focus{outline:none;border-color:var(--primary-color);box-shadow:0 0 0 3px #2563eb1a}.form-builder-design .light-input{background:var(--secondary-color);border-color:var(--border-color)}.form-builder-design .full-width{width:100%}.form-builder-design .contact-row{margin-bottom:12px}.form-builder-design .contact-row:last-child{margin-bottom:0}.form-builder-design .error-field{padding:16px;background:#fef2f2;border:1px solid #fecaca;border-radius:var(--radius-md);color:#dc2626;text-align:center}.form-builder-design .field-placeholder{padding:20px;background:var(--secondary-color);border:2px dashed var(--border-color);border-radius:var(--radius-md);text-align:center;color:var(--text-secondary);font-size:14px}.form-builder-design .block-inspector{width:320px;background:#fff;border-left:1px solid var(--border-color);display:flex;flex-direction:column;box-shadow:var(--shadow-md);z-index:10}.form-builder-design .inspector-header{padding:24px;border-bottom:1px solid var(--border-color);background:var(--primary-color);color:#fff;display:flex;align-items:center;justify-content:space-between}.form-builder-design .inspector-header h3{margin:0;font-size:18px;font-weight:600}.form-builder-design .btn-close{display:flex;align-items:center;justify-content:center;width:32px;height:32px;border:none;background:#fff3;border-radius:var(--radius-md);cursor:pointer;color:#fff;transition:all .2s ease}.form-builder-design .btn-close:hover{background:#ffffff4d}.form-builder-design .btn-close .icon{width:16px;height:16px}.form-builder-design .inspector-content{flex:1;overflow-y:auto;padding:20px}.form-builder-design .block-info{background:var(--secondary-color);border:1px solid var(--border-color);border-radius:var(--radius-md);padding:16px;margin-bottom:20px;text-align:center}.form-builder-design .block-info h4{margin:0 0 4px;font-size:16px;font-weight:600;color:var(--text-primary)}.form-builder-design .block-id{margin:4px 0 0;font-size:11px;color:var(--text-muted);font-family:monospace}.form-builder-design .inspector-section{margin-bottom:20px;background:#fff;border:1px solid var(--border-color);border-radius:var(--radius-md);padding:16px}.form-builder-design .inspector-section h5{margin:0 0 12px;font-size:14px;font-weight:600;color:var(--text-primary)}.form-builder-design .animation-selectors{display:flex;flex-direction:column;gap:12px}.form-builder-design .animation-select{display:flex;flex-direction:column;gap:4px}.form-builder-design .animation-select label{font-size:12px;font-weight:500;color:var(--text-secondary);text-transform:uppercase;letter-spacing:.05em}.form-builder-design .animation-select select{padding:8px 12px;border:1px solid var(--border-color);border-radius:var(--radius-sm);font-size:13px;background:#fff}.form-builder-design .timing-controls,.form-builder-design .block-styling{display:flex;flex-direction:column;gap:12px}.form-builder-design .inspector-actions{display:flex;flex-direction:column;gap:8px;margin-top:20px}.form-builder-design .btn-preview-animation,.form-builder-design .btn-reset-block{background:var(--secondary-color);border:1px solid var(--border-color);color:var(--text-primary);padding:10px 16px;border-radius:var(--radius-md);font-size:13px;font-weight:500;cursor:pointer;transition:all .2s ease}.form-builder-design .btn-preview-animation:hover,.form-builder-design .btn-reset-block:hover{background:#fff;border-color:var(--primary-color);color:var(--primary-color);box-shadow:var(--shadow-md)}.form-builder-design .ai-assistant{display:flex;flex-direction:column;gap:16px}.form-builder-design .btn-toggle-ai{padding:12px 16px;border:1px solid var(--border-color);background:var(--secondary-color);border-radius:var(--radius-md);cursor:pointer;transition:all .2s ease;font-size:13px;font-weight:500;color:var(--text-secondary)}.form-builder-design .btn-toggle-ai:hover{border-color:var(--primary-color);color:var(--primary-color)}.form-builder-design .btn-toggle-ai.active{border-color:var(--primary-color);background:#2563eb1a;color:var(--primary-color)}.form-builder-design .ai-suggestions{display:flex;flex-direction:column;gap:12px}.form-builder-design .suggestion-item{display:flex;align-items:flex-start;gap:12px;padding:12px;background:var(--secondary-color);border:1px solid var(--border-color);border-radius:var(--radius-md);font-size:13px}.form-builder-design .suggestion-item span{flex:1;color:var(--text-primary)}.form-builder-design .suggestion-item .btn-apply{flex-shrink:0;padding:4px 12px;margin:0;font-size:11px;background:var(--primary-color);color:#fff;border:none;border-radius:var(--radius-sm);cursor:pointer;transition:all .2s ease}.form-builder-design .suggestion-item .btn-apply:hover{background:var(--primary-hover)}.form-builder-design .advanced-graphics{display:flex;flex-direction:column;gap:12px}.form-builder-design .ab-testing{display:flex;flex-direction:column;gap:16px}.form-builder-design .btn-create-variant{background:var(--primary-color);color:#fff;border:none;padding:10px 16px;border-radius:var(--radius-md);font-size:13px;font-weight:500;cursor:pointer;transition:all .2s ease}.form-builder-design .btn-create-variant:hover{background:var(--primary-hover);box-shadow:var(--shadow-md)}.form-builder-design .variant-list{display:flex;flex-direction:column;gap:8px}.form-builder-design .variant-item{display:flex;justify-content:space-between;align-items:center;padding:12px;background:var(--secondary-color);border:1px solid var(--border-color);border-radius:var(--radius-md);font-size:13px}.form-builder-design .conversion-rate{font-size:12px;color:#10b981;font-weight:500}.form-builder-design .performance-monitor{position:absolute;top:20px;right:20px;width:280px;background:#fff;border:1px solid var(--border-color);border-radius:var(--radius-lg);box-shadow:var(--shadow-lg);z-index:20}.form-builder-design .monitor-header{display:flex;align-items:center;justify-content:space-between;padding:16px;border-bottom:1px solid var(--border-color);background:#f59e0b;color:#fff;border-radius:var(--radius-lg) var(--radius-lg) 0 0}.form-builder-design .monitor-header h4{margin:0;font-size:14px;font-weight:600}.form-builder-design .monitor-header button{display:flex;align-items:center;justify-content:center;width:24px;height:24px;border:none;background:#fff3;border-radius:50%;cursor:pointer;color:#fff;transition:all .2s ease}.form-builder-design .monitor-header button:hover{background:#ffffff4d}.form-builder-design .monitor-header .icon{width:12px;height:12px}.form-builder-design .performance-metrics{padding:16px;display:flex;flex-direction:column;gap:12px}.form-builder-design .metric{display:flex;align-items:center;gap:12px}.form-builder-design .metric-label{font-size:12px;color:var(--text-secondary);min-width:80px}.form-builder-design .metric-bar{flex:1;height:8px;background:var(--border-color);border-radius:4px;overflow:hidden}.form-builder-design .metric-fill{height:100%;background:linear-gradient(90deg,#10b981,#059669);transition:width .3s ease}.form-builder-design .metric-value{font-size:12px;font-weight:600;color:var(--text-primary);min-width:40px;text-align:right}.form-builder-design .floating-actions{position:absolute;bottom:32px;right:32px;display:flex;flex-direction:column;gap:12px;z-index:15}.form-builder-design .fab{width:48px;height:48px;border:none;border-radius:50%;background:var(--primary-color);color:#fff;cursor:pointer;transition:all .2s ease;box-shadow:var(--shadow-lg);display:flex;align-items:center;justify-content:center}.form-builder-design .fab:hover{background:var(--primary-hover);transform:translateY(-2px);box-shadow:0 8px 24px #2563eb66}.form-builder-design .fab .icon{width:20px;height:20px}.form-builder-design .skeleton{background:linear-gradient(90deg,#f0f0f0 25%,#e0e0e0,#f0f0f0 75%);background-size:200% 100%;animation:skeleton-loading 1.5s infinite;border-radius:var(--radius-sm)}.form-builder-design .skeleton-field{padding:20px;margin-bottom:16px;border:1px solid var(--border-color);border-radius:var(--radius-md);background:#fff}.form-builder-design .skeleton-label{height:16px;width:120px;margin-bottom:8px}.form-builder-design .skeleton-input{height:40px;width:100%}.form-builder-design .skeleton-template-card{border:1px solid var(--border-color);border-radius:var(--radius-md);padding:16px;background:#fff;margin-bottom:12px}.form-builder-design .skeleton-template-preview{display:flex;align-items:center;justify-content:space-between;margin-bottom:12px}.form-builder-design .skeleton-template-icon{width:40px;height:40px;border-radius:var(--radius-md)}.form-builder-design .skeleton-template-fields{display:flex;align-items:center;gap:4px}.form-builder-design .skeleton-field-indicator{width:6px;height:6px;border-radius:50%}.form-builder-design .skeleton-template-info{display:flex;flex-direction:column;gap:8px}.form-builder-design .skeleton-template-name{height:16px;width:140px}.form-builder-design .skeleton-template-description{height:14px;width:100%}.form-builder-design .skeleton-template-meta{display:flex;align-items:center;justify-content:space-between;margin-top:8px}.form-builder-design .skeleton-field-count{height:20px;width:60px;border-radius:var(--radius-sm)}.form-builder-design .skeleton-use-button{height:24px;width:80px;border-radius:var(--radius-sm)}.form-builder-design .skeleton-theme-card{border:1px solid var(--border-color);border-radius:var(--radius-md);padding:16px;background:#fff;text-align:center;margin-bottom:12px}.form-builder-design .skeleton-theme-preview{display:flex;justify-content:center;gap:4px;margin-bottom:12px}.form-builder-design .skeleton-color-swatch{width:16px;height:16px;border-radius:50%}.form-builder-design .skeleton-theme-name{height:14px;width:80px;margin:0 auto}.form-builder-design .skeleton-animation-card{border:1px solid var(--border-color);border-radius:var(--radius-md);padding:16px;background:#fff;margin-bottom:12px}.form-builder-design .skeleton-animation-preview{height:60px;width:100%;border-radius:var(--radius-sm);margin-bottom:12px}.form-builder-design .skeleton-animation-info{display:flex;flex-direction:column;gap:6px}.form-builder-design .skeleton-animation-name{height:14px;width:100px}.form-builder-design .skeleton-animation-description{height:12px;width:80%}.form-builder-design .skeleton-background-card{border:1px solid var(--border-color);border-radius:var(--radius-md);background:#fff;text-align:center;margin-bottom:12px;overflow:hidden}.form-builder-design .skeleton-background-preview{height:80px;width:100%}.form-builder-design .skeleton-background-name{height:14px;width:120px;margin:12px auto}.form-builder-design .tool-btn:focus-visible{outline:2px solid var(--primary-color);outline-offset:2px}.form-builder-design .panel-close:focus-visible{outline:2px solid var(--primary-color);outline-offset:2px}.form-builder-design .category-tab:focus-visible{outline:2px solid var(--primary-color);outline-offset:2px}.form-builder-design .template-panel{padding:0}.form-builder-design .template-search-container{padding:16px 24px;border-bottom:1px solid var(--border-color)}.form-builder-design .template-search-bar{display:flex;align-items:center;background:#f8fafc;border:1px solid var(--border-color);border-radius:var(--radius-lg);padding:12px 16px;gap:12px;transition:all .2s ease}.form-builder-design .template-search-bar:focus-within{border-color:var(--primary-color);box-shadow:0 0 0 3px #2563eb1a}.form-builder-design .search-icon{font-size:16px;color:var(--text-muted)}.form-builder-design .template-search-input{flex:1;border:none;background:transparent;font-size:14px;color:var(--text-primary);outline:none}.form-builder-design .template-search-input::placeholder{color:var(--text-muted)}.form-builder-design .search-filter-btn{background:transparent;border:none;color:var(--text-muted);cursor:pointer;padding:4px;border-radius:var(--radius-sm);transition:all .2s ease}.form-builder-design .search-filter-btn:hover{color:var(--primary-color);background:#fff}.form-builder-design .filter-icon{width:18px;height:18px}.form-builder-design .template-tabs{display:flex;padding:0 24px;border-bottom:1px solid var(--border-color);background:#fff}.form-builder-design .template-tab{background:transparent;border:none;padding:16px 0;margin-right:32px;font-size:14px;font-weight:500;color:var(--text-secondary);cursor:pointer;position:relative;transition:all .2s ease}.form-builder-design .template-tab:hover{color:var(--text-primary)}.form-builder-design .template-tab.active{color:var(--primary-color);font-weight:600}.form-builder-design .template-tab.active:after{content:"";position:absolute;bottom:0;left:0;right:0;height:2px;background:var(--primary-color);border-radius:1px}.form-builder-design .template-categories-horizontal{padding:16px 24px;border-bottom:1px solid var(--border-color)}.form-builder-design .category-buttons-container{display:flex;gap:12px;align-items:center}.form-builder-design .category-btn{background:#fff;border:1px solid var(--border-color);border-radius:var(--radius-lg);padding:8px 16px;font-size:13px;font-weight:500;color:var(--text-secondary);cursor:pointer;transition:all .2s ease;white-space:nowrap}.form-builder-design .category-btn:hover{border-color:var(--primary-color);color:var(--primary-color)}.form-builder-design .category-btn.active{background:var(--primary-color);border-color:var(--primary-color);color:#fff}.form-builder-design .template-section{padding:24px;border-bottom:1px solid var(--border-color)}.form-builder-design .template-section:last-child{border-bottom:none}.form-builder-design .section-header-horizontal{display:flex;justify-content:space-between;align-items:center;margin-bottom:16px}.form-builder-design .section-header-horizontal h4{font-size:16px;font-weight:600;color:var(--text-primary);margin:0}.form-builder-design .premium-title{display:flex;align-items:center;gap:8px;font-size:16px;font-weight:600;color:var(--text-primary)}.form-builder-design .crown-icon{font-size:14px}.form-builder-design .see-all-btn{background:transparent;border:none;color:var(--text-muted);font-size:13px;font-weight:500;cursor:pointer;transition:all .2s ease}.form-builder-design .see-all-btn:hover{color:var(--primary-color)}.form-builder-design .template-grid-horizontal{display:flex;gap:16px;overflow-x:auto;padding-bottom:8px}.form-builder-design .template-grid-horizontal::-webkit-scrollbar{height:6px}.form-builder-design .template-grid-horizontal::-webkit-scrollbar-track{background:transparent}.form-builder-design .template-grid-horizontal::-webkit-scrollbar-thumb{background:var(--border-color);border-radius:3px}.form-builder-design .template-card-large{min-width:280px;background:#fff;border:1px solid var(--border-color);border-radius:var(--radius-lg);overflow:hidden;cursor:pointer;transition:all .2s ease;position:relative}.form-builder-design .template-card-large:hover{border-color:var(--primary-color);box-shadow:var(--shadow-lg);transform:translateY(-2px)}.form-builder-design .template-card-large.premium{border-color:#f59e0b}.form-builder-design .template-card-large.premium:hover{border-color:#f59e0b;box-shadow:0 10px 15px -3px #f59e0b1a,0 4px 6px -4px #f59e0b1a}.form-builder-design .template-preview-large{height:200px;background:#f8fafc;padding:16px;position:relative;overflow:hidden}.form-builder-design .premium-badge{position:absolute;top:12px;right:12px;background:#f59e0b;color:#fff;font-size:10px;font-weight:600;padding:4px 8px;border-radius:4px;z-index:10}.form-builder-design .template-mock-content{background:#fff;border-radius:var(--radius-md);padding:16px;height:100%;box-shadow:var(--shadow-sm);display:flex;flex-direction:column;gap:12px}.form-builder-design .mock-header{text-align:left}.form-builder-design .mock-title{font-size:14px;font-weight:600;color:var(--text-primary);margin-bottom:4px}.form-builder-design .mock-subtitle{font-size:11px;color:var(--text-muted)}.form-builder-design .mock-fields{display:flex;flex-direction:column;gap:8px;flex:1}.form-builder-design .mock-field{height:8px;background:var(--border-color);border-radius:4px;animation:mockFieldPulse 2s ease-in-out infinite}.form-builder-design .mock-field.large{height:20px}.form-builder-design .mock-field.rating{height:8px;width:60%;background:#f59e0b}.form-builder-design .mock-field.upload{height:12px;background:#10b981}@keyframes mockFieldPulse{0%,to{opacity:1}50%{opacity:.6}}.form-builder-design .styles-content{padding:24px}.form-builder-design .coming-soon{text-align:center;padding:40px 20px}.form-builder-design .coming-soon h4{font-size:18px;font-weight:600;color:var(--text-primary);margin:0 0 8px}.form-builder-design .coming-soon p{font-size:14px;color:var(--text-muted);margin:0}.form-builder-design .premium-section{background:linear-gradient(135deg,#fffbeb,#fef3c7);border-color:#f59e0b}@media (max-width: 768px){.form-builder-design .template-grid-horizontal{flex-direction:column}.form-builder-design .template-card-large{min-width:unset}.form-builder-design .category-buttons-container{overflow-x:auto;gap:8px}.form-builder-design .category-btn{flex-shrink:0}}.form-builder-design .template-modal-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:#0009;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);display:flex;align-items:center;justify-content:center;z-index:1000;padding:20px;animation:fadeInOverlay .3s ease-out}.form-builder-design .template-modal{background:#fff;border-radius:var(--radius-lg);box-shadow:var(--shadow-lg);width:100%;max-width:1200px;height:90vh;max-height:900px;display:flex;flex-direction:column;animation:slideInModal .3s ease-out}@keyframes slideInModal{0%{opacity:0;transform:translateY(20px) scale(.95)}to{opacity:1;transform:translateY(0) scale(1)}}.form-builder-design .template-modal-header{padding:24px 24px 16px;border-bottom:1px solid var(--border-color)}.form-builder-design .modal-title-section{display:flex;align-items:center;justify-content:space-between}.form-builder-design .template-modal-header h2{margin:0;font-size:24px;font-weight:700;color:var(--text-primary)}.form-builder-design .modal-close-btn{background:var(--secondary-color);border:1px solid var(--border-color);color:var(--text-secondary);cursor:pointer;padding:8px;border-radius:var(--radius-md);transition:all .2s ease;width:40px;height:40px;display:flex;align-items:center;justify-content:center}.form-builder-design .modal-close-btn:hover{background:#fff;border-color:#ef4444;color:#ef4444}.form-builder-design .template-search-section{margin-bottom:0}.form-builder-design .search-input-container{position:relative;display:flex;align-items:center;background:var(--secondary-color);border:1px solid var(--border-color);border-radius:var(--radius-md);padding:0 16px;transition:all .2s ease}.form-builder-design .search-input-container:focus-within{border-color:var(--primary-color);box-shadow:0 0 0 3px #2563eb1a}.form-builder-design .search-input-container .search-icon{color:var(--text-muted);font-size:16px;margin-right:12px}.form-builder-design .template-search-input-modal{background:transparent;border:none;outline:none;flex:1;padding:14px 0;font-size:16px;color:var(--text-primary)}.form-builder-design .template-search-input-modal::placeholder{color:var(--text-muted)}.form-builder-design .template-modal-content{display:flex;flex:1;overflow:hidden}.form-builder-design .template-sidebar{width:280px;background:var(--secondary-color);border-right:1px solid var(--border-color);overflow-y:auto;flex-shrink:0}.form-builder-design .category-list{padding:16px}.form-builder-design .template-modal .category-btn{display:flex;align-items:center;gap:12px;width:100%;padding:12px 16px;background:transparent;border:none;border-radius:var(--radius-md);cursor:pointer;transition:all .2s ease;font-size:14px;font-weight:500;color:var(--text-secondary);margin-bottom:4px;text-align:left}.form-builder-design .template-modal .category-btn:hover{background:#fff;color:var(--text-primary)}.form-builder-design .template-modal .category-btn.active{background:var(--primary-color);color:#fff}.form-builder-design .template-modal .category-icon{font-size:16px;flex-shrink:0}.form-builder-design .template-modal .category-name{flex:1}.form-builder-design .template-modal .category-count{background:#fff3;padding:2px 8px;border-radius:12px;font-size:12px;font-weight:600}.form-builder-design .template-modal .category-btn.active .category-count{background:#ffffff4d}.form-builder-design .template-modal .category-btn:not(.active) .category-count{background:var(--border-color);color:var(--text-muted)}.form-builder-design .template-grid-container{flex:1;overflow-y:auto;padding:24px}.form-builder-design .template-category-section{margin-bottom:40px}.form-builder-design .template-category-section:last-child{margin-bottom:0}.form-builder-design .category-header{display:flex;align-items:center;gap:12px;margin-bottom:20px;padding-bottom:12px;border-bottom:1px solid var(--border-color)}.form-builder-design .category-icon-large{font-size:24px}.form-builder-design .category-header h3{margin:0;font-size:20px;font-weight:600;color:var(--text-primary);flex:1}.form-builder-design .template-count{font-size:13px;color:var(--text-muted);background:var(--secondary-color);padding:4px 12px;border-radius:20px}.form-builder-design .template-grid-modal{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:20px}.form-builder-design .template-card-modal{background:#fff;border:1px solid var(--border-color);border-radius:var(--radius-lg);overflow:hidden;cursor:pointer;transition:all .2s ease}.form-builder-design .template-card-modal:hover{border-color:var(--primary-color);box-shadow:var(--shadow-md);transform:translateY(-2px)}.form-builder-design .template-preview-modal{height:160px;position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:16px;padding:20px}.form-builder-design .template-preview-icon{font-size:48px;opacity:.8}.form-builder-design .template-preview-fields{display:flex;gap:6px;align-items:center}.form-builder-design .template-modal .field-indicator{width:20px;height:12px;border-radius:2px;opacity:.6}.form-builder-design .template-modal .field-indicator.more{width:auto;padding:0 6px;font-size:10px;font-weight:600;display:flex;align-items:center;justify-content:center;color:inherit}.form-builder-design .template-info-modal{padding:20px;border-top:1px solid var(--border-color)}.form-builder-design .template-modal .template-name{margin:0 0 8px;font-size:16px;font-weight:600;color:var(--text-primary)}.form-builder-design .template-modal .template-description{margin:0 0 16px;font-size:14px;color:var(--text-secondary);line-height:1.4}.form-builder-design .template-modal .template-meta{display:flex;align-items:center;justify-content:space-between}.form-builder-design .template-modal .field-count{font-size:12px;color:var(--text-muted);background:var(--secondary-color);padding:4px 8px;border-radius:12px}.form-builder-design .template-modal .btn-use-template{background:var(--primary-color);color:#fff;border:none;padding:8px 16px;border-radius:var(--radius-md);font-size:13px;font-weight:600;cursor:pointer;transition:all .2s ease}.form-builder-design .template-modal .btn-use-template:hover{background:var(--primary-hover);transform:translateY(-1px)}.form-builder-design .no-templates-found{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:60px 20px;text-align:center}.form-builder-design .no-results-icon{font-size:48px;margin-bottom:16px;opacity:.6}.form-builder-design .no-templates-found h3{margin:0 0 8px;font-size:20px;font-weight:600;color:var(--text-primary)}.form-builder-design .no-templates-found p{margin:0;font-size:14px;color:var(--text-secondary);max-width:400px}@media (max-width: 1024px){.form-builder-design .template-modal{max-width:95vw;height:95vh}.form-builder-design .template-sidebar{width:240px}.form-builder-design .template-grid-modal{grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:16px}}@media (max-width: 768px){.form-builder-design .template-modal{height:100vh;max-height:100vh;border-radius:0}.form-builder-design .template-modal-overlay{padding:0}.form-builder-design .template-modal-content{flex-direction:column}.form-builder-design .template-sidebar{width:100%;height:auto;border-right:none;border-bottom:1px solid var(--border-color)}.form-builder-design .category-list{display:flex;gap:8px;overflow-x:auto;padding:16px}.form-builder-design .template-modal .category-btn{white-space:nowrap;margin-bottom:0;flex-shrink:0}.form-builder-design .template-grid-modal{grid-template-columns:1fr;gap:16px}}.form-editor{display:flex;flex-direction:column;height:100vh;font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,sans-serif;background-color:#f8f9fa}.top-bar{display:flex;justify-content:space-between;align-items:center;padding:.5rem 1rem;background-color:#fff;z-index:100;height:56px}.top-bar-left{display:flex;align-items:center;gap:12px}.home-icon{display:flex;align-items:center;justify-content:center;width:32px;height:32px;color:#6b7280}.home-nav-icon{width:20px;height:20px}.top-bar-left h2{font-weight:500;font-size:15px;color:#111827;margin:0}.breadcrumbs{display:flex;align-items:center;gap:8px;font-size:14px;color:#6b7280}.breadcrumb-item{color:#6b7280;text-decoration:none;font-weight:500}.breadcrumb-item:hover{color:#111827}.breadcrumb-item.current{color:#111827;font-weight:600}.breadcrumb-title-container{position:relative;display:inline-block}.breadcrumb-item.current.editable-title{cursor:text;padding:2px 4px;border-radius:4px;transition:background-color .2s;min-width:100px}.breadcrumb-item.current.editable-title:hover{background-color:#0000000d}.breadcrumb-item.current.editable-title:focus{outline:none;background-color:#0000000d;box-shadow:0 0 0 2px #3b82f680}.breadcrumb-chevron{width:16px;height:16px;color:#9ca3af}.tabs-container{display:flex;gap:1px;background-color:#ececec!important;padding:2px;border-radius:8px}.tab-item{padding:7px 16px;font-size:13px;font-weight:500;color:#4b5563;cursor:pointer;border-radius:6px;transition:all .15s ease;-webkit-user-select:none;user-select:none}.tab-item:hover{color:#111827}.tab-item.active{background-color:#fff;color:#111827;box-shadow:0 1px 2px #0000000d;border:1px solid var(--navbar-border)!important}.top-bar-actions{display:flex;align-items:center;gap:8px}.button{padding:7px 16px;border:none;border-radius:6px;cursor:pointer;font-size:13px;font-weight:500;transition:all .15s ease;display:flex;align-items:center;gap:6px}.button-icon{width:16px;height:16px}.preview-button{background-color:#f3f4f6;color:#4b5563}.preview-button:hover{background-color:#e5e7eb;color:#111827}.publish-button-container{position:relative}.publish-button{background-color:#3b82f6;color:#fff}.publish-button:hover{background-color:#2563eb}.publish-button:disabled{background-color:#93c5fd;cursor:not-allowed;opacity:.7}.debug-button{background-color:#6366f1;color:#fff;margin-left:8px}.debug-button:hover{background-color:#4f46e5}.editor-layout{display:flex;flex:1;overflow:hidden}.left-sidebar{width:340px;height:100%;overflow-y:auto;background-color:#f9fafb;border-right:1px solid #e5e7eb;padding:0;transition:all .3s ease;flex-shrink:0}.left-sidebar.closed{width:0;padding:0}.right-sidebar{width:340px;height:100%;overflow-y:auto;background-color:#f9fafb;border-left:1px solid #e5e7eb;padding:16px 0;transition:all .3s ease;flex-shrink:0}.sidebar-header{padding:0;background-color:#f5f5f5!important;border-bottom:none;margin-bottom:0;display:flex;flex-direction:column;align-items:stretch}.sidebar-header-content{flex:1;margin-bottom:20px}.sidebar-header h3{font-size:18px;font-weight:700;color:#1f2937;margin:0 0 8px;letter-spacing:-.02em}.selected-field-type{font-size:12px;color:#6b7280;text-transform:capitalize}.sidebar-close-button{background:none;border:none;padding:4px;cursor:pointer;border-radius:4px;color:#6b7280;transition:all .2s ease;flex-shrink:0;margin-left:8px}.sidebar-close-button:hover{background-color:#f3f4f6;color:#374151}.sidebar-close-button:active{background-color:#e5e7eb}.close-icon{width:16px;height:16px}.blocks-sidebar{height:100%;display:flex;flex-direction:column;background-color:#fff}.blocks-sidebar-inner{display:flex;flex-direction:column;gap:24px;padding:20px 20px 24px;flex:1;overflow-y:auto;background-color:#f5f5f5!important}.sidebar-help-text{font-size:13px;color:#9ca3af;margin:0;line-height:1.5;font-weight:400}.sidebar-search-container{margin:0;padding:14px 20px;border-bottom:1px solid #f1f5f9}.sidebar-search-input-wrapper{position:relative;display:flex;align-items:center}.sidebar-search-icon{position:absolute;left:14px;width:18px;height:18px;color:#64748b;z-index:1;pointer-events:none}.sidebar-search-input{width:100%;padding:14px 16px 14px 44px;border:1px solid #e2e8f0;border-radius:12px;font-size:14px;font-weight:400;background-color:#f8fafc;color:#1e293b;transition:all .3s ease;box-sizing:border-box}.sidebar-search-input:focus{outline:none;border-color:#3b82f6;background-color:#fff;box-shadow:0 0 0 4px #3b82f61a}.sidebar-search-input:hover:not(:focus){border-color:#cbd5e1;background-color:#fff}.sidebar-search-input::placeholder{color:#94a3b8;font-weight:400}.sidebar-no-results{text-align:center;padding:32px 20px;color:#64748b;font-size:14px}.sidebar-no-results p{margin:0;font-weight:400;line-height:1.5}.empty-form-state{display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:60px 20px;border:2px dashed #d1d5db;border-radius:12px;background-color:#f9fafb;margin:20px;min-height:300px;transition:all .3s ease;position:relative}.empty-form-state:hover{border-color:#9ca3af;background-color:#f3f4f6}.empty-form-state.drag-over{border-color:#3b82f6;background-color:#eff6ff;border-style:solid;transform:scale(1.02)}.empty-drag-preview{width:100%;max-width:600px;margin:0 auto;padding:20px}.empty-drag-preview .form-field-wrapper.preview-field,.form-field-wrapper.preview-field{opacity:.5;transform:scale(1.02);border:2px dashed #3b82f6;border-radius:8px;background-color:#3b82f60d;transition:all .2s ease;animation:preview-pulse 1.5s ease-in-out infinite;pointer-events:auto;margin-bottom:16px}.empty-drag-preview .form-field-wrapper.preview-field .drag-handle,.form-field-wrapper.preview-field .drag-handle,.empty-drag-preview .form-field-wrapper.preview-field .block-actions,.form-field-wrapper.preview-field .block-actions{display:none}@keyframes preview-pulse{0%,to{opacity:.5}50%{opacity:.7}}.empty-state-content{display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:40px 20px;height:100%}.empty-form-state h3{font-size:18px;font-weight:600;color:#374151;margin:0 0 8px}.empty-form-state p{color:#6b7280;margin:4px 0;font-size:14px}.drop-hint{font-weight:500;color:#3b82f6!important;font-size:13px!important}.form-field-wrapper.drag-over-before:before{content:"";position:absolute;top:-4px;left:0;right:0;height:4px;background-color:#3b82f6;border-radius:2px;z-index:10;box-shadow:0 0 0 1px #3b82f64d}.form-field-wrapper.drag-over-after:after{content:"";position:absolute;bottom:-4px;left:0;right:0;height:4px;background-color:#3b82f6;border-radius:2px;z-index:10;box-shadow:0 0 0 1px #3b82f64d}.form-field-wrapper.drag-over{background-color:#3b82f60d;border-radius:8px;transform:scale(1.01);transition:all .2s ease}.form-field-wrapper.sidebar-drag-over:before{content:"+ Insert here";position:absolute;top:-20px;left:50%;transform:translate(-50%);background-color:#3b82f6;color:#fff;padding:4px 12px;border-radius:12px;font-size:12px;font-weight:500;z-index:20;white-space:nowrap}.form-field-wrapper.sidebar-drag-over-after:after{content:"+ Insert here";position:absolute;bottom:-20px;left:50%;transform:translate(-50%);background-color:#3b82f6;color:#fff;padding:4px 12px;border-radius:12px;font-size:12px;font-weight:500;z-index:20;white-space:nowrap}.properties-sidebar{height:100%;display:flex;flex-direction:column}.properties-sidebar-inner{display:flex;flex-direction:column;gap:16px;padding:0 16px;flex:1}.no-field-selected{text-align:center;color:#6b7280;font-size:14px;padding:20px 0}.field-properties-editor{padding:0}.field-properties-editor h3{font-size:16px;font-weight:600;color:#111827;margin:0 0 20px;padding-bottom:0}.property-group{display:flex;flex-direction:column;gap:8px;margin-bottom:20px;padding-bottom:0;padding-top:16px;min-width:0;overflow:visible}.property-group label{font-size:13px;font-weight:500;color:#374151;margin-bottom:4px}.property-group input[type=text],.property-group input[type=number],.property-group textarea,.property-group select{padding:8px 12px;border:1px solid #d1d5db;border-radius:6px;font-size:14px;background-color:#fff;color:#111827;transition:border-color .2s ease,box-shadow .2s ease}.property-group input[type=text]:focus,.property-group input[type=number]:focus,.property-group textarea:focus,.property-group select:focus{outline:none;border-color:#3b82f6;box-shadow:0 0 0 2px #3b82f61a}.property-group input[type=text]::placeholder,.property-group textarea::placeholder{color:#9ca3af;font-style:italic}.property-group textarea{resize:vertical;min-height:60px}.property-group select{cursor:pointer;background-image:url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 20 20'%3e%3cpath stroke='%236b7280' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.5' d='m6 8 4 4 4-4'/%3e%3c/svg%3e");background-position:right 8px center;background-repeat:no-repeat;background-size:16px;padding-right:32px;-webkit-appearance:none;-moz-appearance:none;appearance:none}.property-group input[type=checkbox]{width:16px;height:16px;border:2px solid #d1d5db;border-radius:4px;background-color:#fff;cursor:pointer;position:relative;margin:0;flex-shrink:0}.property-group input[type=checkbox]:checked{background-color:#3b82f6;border-color:#3b82f6}.property-group input[type=checkbox]:checked:after{content:"";position:absolute;top:1px;left:4px;width:6px;height:10px;border:solid white;border-width:0 2px 2px 0;transform:rotate(45deg)}.property-group input[type=checkbox]:focus{outline:none;box-shadow:0 0 0 2px #3b82f633}.property-group.checkbox-group{flex-direction:row;align-items:center;gap:8px;margin-bottom:16px}.property-group.checkbox-group label{margin-bottom:0;order:2;cursor:pointer}.property-group.checkbox-group input[type=checkbox]{order:1}.editor-sidebar{width:340px;height:100%;overflow-y:auto;background-color:#f9fafb;border-right:1px solid #e5e7eb;padding:16px 0;transition:all .3s ease;flex-shrink:0}.editor-sidebar.closed{width:0;padding:0}.editor-sidebar-inner{display:flex;flex-direction:column;gap:16px;padding:0 16px}.sidebar-category-section{display:flex;flex-direction:column;gap:12px;padding-bottom:0;border-bottom:none}.sidebar-category-section:last-child{border-bottom:none}.sidebar-category-header{font-size:13px;font-weight:600;color:#374151;text-transform:uppercase;letter-spacing:.06em;padding:0 0 8px;margin-bottom:4px}.sidebar-items-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.sidebar-item{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:16px 8px;border-radius:12px;background-color:#fff;border:1px solid #e0e0e0;cursor:pointer;transition:all .3s ease;text-align:center;height:96px;width:100%;margin:0;-webkit-user-select:none;user-select:none;position:relative;box-shadow:0 1px 3px #0000000d}.sidebar-item:hover{background-color:#f8fafc;border-color:#e2e8f0;box-shadow:0 4px 12px #0000001a;transform:translateY(-2px)}.sidebar-item:active{transform:scale(.97) translateY(-1px)}.sidebar-item[draggable=true]{cursor:grab}.sidebar-item[draggable=true]:active{cursor:grabbing}.sidebar-item-icon{display:flex;align-items:center;justify-content:center;width:40px;height:40px;border-radius:10px;background-color:#f1f5f9;margin-bottom:8px;border:none;padding:0}.sidebar-item-icon .icon{width:20px;height:20px;color:#64748b}.sidebar-item-label{font-size:12px;font-weight:500;color:#334155;line-height:1.3}.sidebar-category-section:nth-child(1) .sidebar-item-icon{background-color:#f1f5f9}.sidebar-category-section:nth-child(1) .sidebar-item-icon .icon{color:#475569}.sidebar-category-section:nth-child(2) .sidebar-item-icon{background-color:#fef3f2}.sidebar-category-section:nth-child(2) .sidebar-item-icon .icon{color:#dc2626}.sidebar-category-section:nth-child(3) .sidebar-item-icon{background-color:#fdf4ff}.sidebar-category-section:nth-child(3) .sidebar-item-icon .icon{color:#a855f7}.sidebar-category-section:nth-child(4) .sidebar-item-icon{background-color:#f0fdf4}.sidebar-category-section:nth-child(4) .sidebar-item-icon .icon{color:#16a34a}.sidebar-category-section:nth-child(5) .sidebar-item-icon{background-color:#fef2f2}.sidebar-category-section:nth-child(5) .sidebar-item-icon .icon{color:#ef4444}.sidebar-category-section:nth-child(6) .sidebar-item-icon{background-color:#ecfdf5}.sidebar-category-section:nth-child(6) .sidebar-item-icon .icon{color:#059669}.sidebar-category-section:nth-child(7) .sidebar-item-icon{background-color:#f0f9ff}.sidebar-category-section:nth-child(7) .sidebar-item-icon .icon{color:#0284c7}.main-content{flex:1;height:100%;overflow-y:auto;padding:0;background-color:#fff;display:flex}.main-content.with-sidebars,.main-content.with-sidebar{flex-direction:column;margin-left:0}.form-container-primary{flex:1;padding:2rem;display:flex;justify-content:center;background-color:#f1f1f1}.form-container-secondary{max-width:800px;width:100%;background-color:#fff;border-radius:8px;box-shadow:0 1px 3px #0000001a;padding:0;height:fit-content;transition:background .3s ease,color .3s ease;color:var(--text-color, #1f2937);font-family:var(--font-family, inherit)}.form-container-secondary *,.form-container-secondary h1,.form-container-secondary h2,.form-container-secondary h3,.form-container-secondary h4,.form-container-secondary h5,.form-container-secondary h6,.form-container-secondary p,.form-container-secondary span,.form-container-secondary div,.form-container-secondary label{color:inherit;font-family:inherit}.form-container-secondary input,.form-container-secondary textarea,.form-container-secondary select,.form-container-secondary button{font-family:inherit}.form-editor-canvas{width:100%;background-color:transparent;border-radius:inherit;padding:0px 0px 2rem;height:fit-content}.form-question-area{padding:1rem 0}.form-question-area h3{font-size:1.25rem;font-weight:500;color:#333;margin-bottom:1rem;text-align:center}.add-button-container{display:flex;justify-content:center;margin-bottom:1rem}.add-option-button{padding:8px 16px;background-color:#f0f2f5;border:none;border-radius:4px;color:#555;font-size:.875rem;cursor:pointer}.placeholder-text{color:#888;text-align:center;margin-bottom:1.5rem;font-size:.875rem}div.choice-value-input .placeholder-text{margin-bottom:0}.form-options{display:flex;flex-direction:column;gap:8px;margin-bottom:2rem}.form-option{padding:.75rem 1rem;background-color:#f0f2f5;border-radius:4px;color:#333;font-size:.875rem}.checkbox-options{display:flex;flex-direction:column;gap:12px;margin-bottom:2rem}.checkbox-option{display:flex;align-items:center;gap:10px}.checkbox-option input{width:18px;height:18px}.checkbox-option span{font-size:.875rem;color:#333}.next-button-container{display:flex;justify-content:center;margin-top:2rem}.next-button{padding:.75rem 1.5rem;background-color:#4f46e5;color:#fff;border:none;border-radius:4px;font-weight:500;cursor:pointer}.form-pages-footer{margin:auto 0 0;width:100%;background-color:#f8fafccc;padding:0 18px;border-top:1px solid #e5e7eb}.add-page-btn{background-color:#f9fafb;border:1px solid #e5e7eb;color:#4b5563;padding:6px 12px;border-radius:6px;font-size:13px;font-weight:500;cursor:pointer;display:flex;align-items:center;gap:5px;transition:all .15s ease}.add-page-btn:hover{background-color:#f3f4f6;color:#111827;border-color:#d1d5db}.add-page-btn .add-icon{color:#4b5563}.add-icon{width:14px;height:14px}.page-indicator{padding:8px 12px;border-radius:4px;font-size:.875rem;background-color:#f5f7fa;color:#555;cursor:pointer;transition:all .2s ease}.page-indicator:hover{background-color:#ebedf0}.page-indicator.active{background-color:#e0e7ff;color:#4338ca;font-weight:500}.page-indicator.special{background-color:#fff0f0;color:#e11d48}.page-indicator.special.active{background-color:#ffe0e0;color:#e11d48;font-weight:500}.sidebar-category-icon.creative{background-color:#f3e8ff;color:#7c3aed}.sidebar-category-icon.media{background-color:#fce7f3;color:#ec4899}.sidebar-category-icon.forms{background-color:#fff7ed;color:#f97316}.sidebar-category-icon.icons{background-color:#fef9c3;color:#eab308}.sidebar-category-icon.interactive{background-color:#e0f2fe;color:#06b6d4}.sidebar-category-icon.social{background-color:#dbeafe;color:#3b82f6}.sidebar-category-icon.utility{background-color:#ede9fe;color:#4f46e5}.form-fields-container{display:flex;flex-direction:column;gap:16px;width:100%;max-width:650px;margin:0 auto}.column-drop-indicator{position:absolute;top:0;bottom:0;width:3px;background:#3b82f6;border-radius:2px;z-index:10;pointer-events:none}.column-drop-indicator.left{left:-8px}.column-drop-indicator.right{right:-8px}.column-drop-preview{position:relative;height:100%;display:flex;align-items:center}.drop-zone-line{width:3px;height:100%;background:#3b82f6;border-radius:2px}.drop-zone-label{position:absolute;top:50%;transform:translateY(-50%);background:#3b82f6;color:#fff;padding:4px 8px;border-radius:4px;font-size:12px;font-weight:500;white-space:nowrap;box-shadow:0 2px 4px #0000001a}.column-drop-indicator.left .drop-zone-label{left:-80px}.column-drop-indicator.right .drop-zone-label{right:-80px}.form-column-layout{margin:8px 0}.form-field-wrapper:hover .column-drop-indicator{opacity:.7}.form-field-wrapper.column-drag-over-left{border-left:3px solid #3b82f6;background:#3b82f60d}.form-field-wrapper.column-drag-over-right{border-right:3px solid #3b82f6;background:#3b82f60d}.form-field-wrapper{position:relative;transition:all .2s ease}.form-field{padding:1rem;background-color:#fff;border-radius:6px;transition:border-color .2s,box-shadow .2s}.form-field:hover{border-color:#d1d5db}.form-field.selected{border-color:#4f46e5;box-shadow:0 0 0 2px #4f46e533}.field-label{font-size:1.25rem;font-weight:600;color:#111827;margin-top:0;margin-bottom:4px}.form-input{display:block;width:100%;padding:10px 12px;border:1px solid #d1d5db;border-radius:6px;font-size:14px;background-color:#fff;color:#111827;transition:border-color .2s ease,box-shadow .2s ease}.form-input:focus{outline:none;border-color:#3b82f6;box-shadow:0 0 0 2px #3b82f61a}.field-description{font-size:13px;color:#6b7280;margin-top:4px;margin-bottom:4px}.contact-row,.address-row{margin-bottom:10px}.address-row{display:flex;gap:10px}.address-row .city{flex:2}.address-row .state,.address-row .zip{flex:1}.full-width{width:100%}.field-actions{position:absolute;right:-120px;top:50%;transform:translateY(-50%);display:flex;flex-direction:column;gap:8px;background:#fff;padding:8px;border-radius:6px;border:1px solid #e5e7eb;box-shadow:0 2px 5px #0000001a}.field-action-btn{padding:6px 12px;background:#fff;border:1px solid #e5e7eb;border-radius:4px;font-size:12px;font-weight:500;color:#6b7280;cursor:pointer;transition:all .2s ease}.field-action-btn:hover{background-color:#f9fafb;color:#111827}.field-action-btn.delete{color:#ef4444;border-color:#fee2e2}.field-action-btn.delete:hover{background-color:#fee2e2}.field-action-btn.move-up,.field-action-btn.move-down{color:#3b82f6;border-color:#dbeafe}.field-action-btn.move-up:hover,.field-action-btn.move-down:hover{background-color:#dbeafe}.empty-form-state{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:40px 20px;text-align:center;background-color:#fff;border-radius:8px;border:1px dashed #d1d5db;margin:20px auto;max-width:600px}.empty-form-state h3{font-size:18px;font-weight:600;color:#111827;margin-bottom:8px}.empty-form-state p{font-size:14px;color:#6b7280;margin-bottom:24px}.example-field-preview{padding:16px;border:1px solid #e5e7eb;border-radius:6px;width:100%;max-width:400px;background-color:#f9fafb}.add-field-button-container{display:flex;justify-content:center;margin-top:20px;margin-bottom:40px}.add-field-button{display:flex;align-items:center;gap:8px;padding:10px 16px;background-color:#3b82f6;color:#fff;border:none;border-radius:6px;font-size:14px;font-weight:500;cursor:pointer;transition:all .2s ease}.add-field-button:hover{background-color:#2563eb;box-shadow:0 2px 4px #0000001a}.add-field-button .add-icon{width:16px;height:16px}.publish-modal-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background-color:#00000080;display:flex;justify-content:center;align-items:center;z-index:2000;animation:fadeIn .2s ease}.publish-modal{background:#fff;border-radius:12px;width:560px;max-width:90vw;max-height:90vh;overflow-y:auto;box-shadow:0 20px 25px -5px #0000001a,0 10px 10px -5px #0000000a;animation:slideUp .3s ease}.publish-modal-header{display:flex;justify-content:space-between;align-items:flex-start;padding:24px 24px 16px}.publish-modal-title{display:flex;flex-direction:column;gap:8px;flex:1}.publish-status{display:flex;align-items:center;gap:8px;font-weight:600;font-size:16px;color:#1f2937;line-height:1.5}.publish-status svg{flex-shrink:0}.ready-status{display:inline-flex;align-items:center;gap:6px;font-size:13px;color:#10b981;font-weight:500;background:#ecfdf5;padding:4px 10px;border-radius:12px;width:fit-content}.ready-status svg{flex-shrink:0}.publish-modal .customize-link-btn{display:flex!important;align-items:center!important;gap:6px;background:none!important;border:none!important;color:#374151!important;font-size:14px!important;font-weight:400!important;cursor:pointer!important;padding:6px 8px!important;border-radius:6px!important;transition:all .2s!important;box-shadow:none!important;text-decoration:none!important;outline:none!important;margin:-2px 0 0!important}.publish-modal .customize-link-btn svg{width:14px!important;height:14px!important}.publish-modal .customize-link-btn:hover{background-color:#f9fafb!important;color:#1f2937!important}.share-link-section{padding:20px 24px;border-bottom:1px solid #e5e7eb}.share-link-container{display:flex;gap:12px;margin-bottom:16px}.link-input-container{flex:1;position:relative;border:1px solid #e5e7eb;border-radius:8px;background:#fff;overflow:hidden}.share-link-input{width:100%;padding:12px 40px 12px 14px;border:none;outline:none;font-size:14px;color:#374151;background:transparent;box-sizing:border-box;font-family:inherit}.publish-modal .link-open-btn{position:absolute;right:10px;top:50%;transform:translateY(-50%);display:flex;align-items:center;justify-content:center;width:20px;height:20px;background:none!important;border:none!important;color:#9ca3af!important;cursor:pointer;transition:color .2s;box-shadow:none!important;text-decoration:none!important;outline:none!important;padding:0!important}.publish-modal .link-open-btn svg{width:16px;height:16px}.publish-modal .link-open-btn:hover{color:#374151!important;background:none!important}.publish-modal .copy-btn{display:flex!important;align-items:center!important;gap:6px;background:#374151!important;border:none!important;border-radius:8px!important;padding:12px 16px!important;font-size:14px!important;font-weight:500!important;color:#fff!important;cursor:pointer!important;transition:all .2s!important;white-space:nowrap;box-shadow:none!important;text-decoration:none!important;outline:none!important;margin:0!important}.publish-modal .copy-btn svg{width:16px;height:16px;flex-shrink:0}.publish-modal .copy-btn:hover{background:#1f2937!important;color:#fff!important}.publish-modal .copy-btn.copied{background:#10b981!important;color:#fff!important}.publish-modal .social-share-icons{display:flex;gap:8px;margin-top:0}.publish-modal .social-icon{width:32px!important;height:32px!important;border-radius:6px!important;display:flex!important;align-items:center!important;justify-content:center!important;background:transparent!important;border:none!important;color:#374151!important;cursor:pointer!important;transition:all .2s!important;box-shadow:none!important;text-decoration:none!important;outline:none!important;margin:0!important;padding:0!important;font-size:14px!important}.publish-modal .social-icon:hover{background:#f9fafb!important;color:#1f2937!important}.publish-modal .social-icon svg{width:18px!important;height:18px!important}.send-email-section{padding:20px 24px;border-bottom:1px solid #e5e7eb}.send-email-section h3{margin:0 0 12px;font-size:16px;font-weight:600;color:#1f2937;line-height:1.5}.publish-modal .send-form-btn{display:flex!important;align-items:center!important;gap:8px;background:#fff!important;border:1px solid #e5e7eb!important;border-radius:8px!important;padding:10px 16px!important;font-size:14px!important;font-weight:500!important;color:#374151!important;cursor:pointer!important;transition:all .2s!important;box-shadow:none!important;text-decoration:none!important;outline:none!important;margin:0!important}.publish-modal .send-form-btn svg{width:16px;height:16px;flex-shrink:0}.publish-modal .send-form-btn:hover{background:#f9fafb!important;border-color:#d1d5db!important;color:#1f2937!important}.embed-form-section{padding:20px 24px 24px}.embed-form-section h3{margin:0 0 16px;font-size:16px;font-weight:600;color:#1f2937;line-height:1.5}.embed-options-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}.embed-option{display:flex;flex-direction:column;align-items:center;gap:8px;cursor:pointer;transition:all .2s}.embed-option:hover .embed-preview{transform:translateY(-2px);box-shadow:0 4px 12px #0000001a}.embed-preview{width:100%;height:70px;border-radius:8px;background:#fff;border:1px solid #e5e7eb;padding:6px;transition:all .2s;position:relative;overflow:hidden}.embed-mockup{width:100%;height:100%;display:flex;flex-direction:column;background:#fff;border-radius:4px;overflow:hidden}.embed-header{height:10px;background:#f3f4f6;margin-bottom:4px;display:flex;align-items:center;padding:0 4px}.traffic-lights{display:flex;gap:3px;align-items:center}.traffic-light{width:6px;height:6px;border-radius:50%;flex-shrink:0}.traffic-light.red{background:#ef4444}.traffic-light.yellow{background:#f59e0b}.traffic-light.green{background:#10b981}.embed-content{flex:1;display:flex;flex-direction:column;gap:4px;padding:4px;background:#f9fafb}.embed-field{height:5px;background:#e5e7eb;border-radius:2px}.embed-field:last-child{width:70%}.embed-mockup.popup-style{position:relative;background:#f9fafb}.embed-mockup.popup-style .embed-content{position:relative}.embed-mockup.popup-style:before{content:"";position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:65%;height:65%;background:#fff;border-radius:4px;box-shadow:0 2px 4px #0000001a;z-index:1}.embed-mockup.popup-style .embed-content{opacity:.3}.embed-mockup.fullscreen-style{background:#3b82f6}.embed-mockup.fullscreen-style .embed-header{background:#fff3}.embed-mockup.fullscreen-style .embed-content{background:#ffffff26;border-radius:0}.embed-mockup.fullscreen-style .embed-field{background:#fff6}.embed-mockup.slider-style{position:relative;background:#f9fafb}.embed-mockup.slider-style:after{content:"";position:absolute;right:0;top:0;bottom:0;width:25%;background:#6366f1;border-radius:0 4px 4px 0;z-index:1}.embed-label{font-size:13px;font-weight:400;color:#374151;text-align:center;line-height:1.4}.preview-modal{display:flex;flex-direction:column;align-items:center;margin:auto;padding:40px;background-color:#fff;border-radius:8px;box-shadow:0 4px 6px #0000001a;width:90%;max-width:700px;max-height:85vh;overflow-y:auto}.preview-modal-header{display:flex;justify-content:space-between;align-items:center;width:100%;margin-bottom:1.5rem}.preview-modal-title{font-size:1.25rem;font-weight:600;color:#111827}.preview-modal-close{background:none;border:none;cursor:pointer;font-size:1.5rem;color:#6b7280}.preview-form{width:100%;display:flex;flex-direction:column;gap:1.5rem}.preview-question{padding:1.5rem;background-color:#fff;border-radius:8px;box-shadow:0 1px 3px #0000001a}.preview-heading{font-size:1rem;font-weight:500;color:#111827;margin-bottom:.5rem}@media (max-width: 768px){.publish-modal{width:95vw;margin:20px}.publish-modal .share-link-container{flex-direction:column;gap:8px}.publish-modal .copy-btn{align-self:flex-end!important;padding:12px 16px!important}.publish-modal .embed-options-grid{grid-template-columns:repeat(2,1fr);gap:8px}.publish-modal .embed-preview{height:50px}.publish-modal .social-share-icons{gap:6px}.publish-modal .social-icon{width:28px!important;height:28px!important}}.title-change-confirmation{position:absolute;top:calc(100% + 4px);left:50%;transform:translate(-50%);background-color:#10b981;color:#fff;padding:6px 12px;border-radius:6px;font-size:13px;font-weight:500;white-space:nowrap;box-shadow:0 2px 5px #0000001a;animation:fadeInOut 2s ease-in-out;z-index:1000}@keyframes fadeInOut{0%{opacity:0;transform:translate(-50%) translateY(-5px)}10%{opacity:1;transform:translate(-50%) translateY(0)}90%{opacity:1;transform:translate(-50%) translateY(0)}to{opacity:0;transform:translate(-50%) translateY(5px)}}.date-picker-container{position:relative;width:280px;max-width:100%}.date-picker-input{position:relative;display:flex;align-items:center;background:#fff;border:1px solid #d1d5db;border-radius:6px;padding:12px 16px;cursor:pointer;transition:border-color .2s,box-shadow .2s;height:48px;box-sizing:border-box}.date-picker-input:hover{border-color:#9ca3af}.date-picker-input.active{border-color:#3b82f6;box-shadow:0 0 0 3px #3b82f633}.date-picker-input.disabled{background-color:#f3f4f6;cursor:not-allowed;color:#9ca3af}.date-input{flex-grow:1;border:none;outline:none;background:transparent;font-size:1rem;color:#111827;cursor:pointer}.date-input::placeholder{color:#9ca3af}.date-picker-icon{width:1.25rem;height:1.25rem;color:#6b7280}.date-picker-dropdown{position:absolute;top:calc(100% + 8px);left:0;z-index:100;width:320px;background:#fff;border-radius:8px;box-shadow:0 10px 15px -3px #0000001a,0 4px 6px -2px #0000000d;border:1px solid #e5e7eb;padding:16px;animation:fadeIn .15s ease-out}.date-picker-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:16px}.month-year{font-weight:600;font-size:1rem;color:#111827;flex-grow:1;text-align:center}.nav-button{display:flex;align-items:center;justify-content:center;background:none;border:none;cursor:pointer;padding:8px;border-radius:50%;color:#6b7280;transition:background-color .2s}.nav-button:hover{background-color:#f3f4f6;color:#111827}.nav-icon{width:1.25rem;height:1.25rem}.date-picker-calendar{width:100%}.weekdays{display:grid;grid-template-columns:repeat(7,1fr);margin-bottom:8px}.weekday{text-align:center;font-size:.875rem;font-weight:500;color:#6b7280;padding:8px 0}.days-grid{display:grid;grid-template-columns:repeat(7,1fr)}.day{display:flex;align-items:center;justify-content:center;height:40px;text-align:center;border-radius:50%;transition:background-color .2s,color .2s,border-color .2s;font-size:.875rem;position:relative}.day.clickable{cursor:pointer;color:#374151}.day.clickable:hover{background-color:#f3f4f6}.day.other-month{color:#9ca3af;cursor:pointer}.day.other-month:hover{background-color:#f3f4f6}.day.today{font-weight:600;color:#3b82f6}.day.selected{background-color:#3b82f6;color:#fff;font-weight:600}.day.selected:hover{background-color:#2563eb}.day.selected{background-color:transparent;color:#111827;border:1px solid #3b82f6;box-shadow:0 0 0 1px #3b82f6}.day.selected.today{background-color:#3b82f6;color:#fff;border:1px solid transparent}.date-picker-footer{text-align:center;margin-top:16px;border-top:1px solid #e5e7eb;padding-top:16px}.today-button{background:none;border:none;color:#3b82f6;font-size:.875rem;font-weight:600;cursor:pointer;padding:8px 16px;border-radius:6px;transition:background-color .2s}.today-button:hover{background-color:#eff6ff}@keyframes fadeIn{0%{opacity:0;transform:translateY(-5px)}to{opacity:1;transform:translateY(0)}}.time-picker-container{position:relative;width:280px;max-width:100%}.time-picker-input{position:relative;display:flex;align-items:center;background:#fff;border:1px solid #d1d5db;border-radius:6px;padding:12px 16px;cursor:pointer;transition:border-color .2s,box-shadow .2s;height:48px;box-sizing:border-box}.time-picker-input:hover{border-color:#9ca3af}.time-picker-input.active{border-color:#3b82f6;box-shadow:0 0 0 3px #3b82f633}.time-picker-input.disabled{background-color:#f3f4f6;cursor:not-allowed;color:#9ca3af}.time-input{flex-grow:1;border:none;outline:none;background:transparent;font-size:1rem;color:#111827;cursor:pointer}.time-input::placeholder{color:#9ca3af}.time-picker-icon{width:1.25rem;height:1.25rem;color:#6b7280}.time-picker-dropdown{position:absolute;top:calc(100% + 8px);left:0;z-index:100;width:280px;background:#fff;border-radius:8px;box-shadow:0 10px 15px -3px #0000001a,0 4px 6px -2px #0000000d;border:1px solid #e5e7eb;animation:fadeIn .15s ease-out;max-height:320px;display:flex;flex-direction:column;overflow:hidden}.time-picker-header{font-weight:600;font-size:.875rem;color:#374151;padding:16px;text-align:center;border-bottom:1px solid #e5e7eb;background:#f9fafb;flex-shrink:0}.time-options-container{flex:1;overflow-y:auto;scrollbar-width:thin;padding:8px}.time-options-container::-webkit-scrollbar{width:6px}.time-options-container::-webkit-scrollbar-track{background:#f3f4f6;border-radius:3px}.time-options-container::-webkit-scrollbar-thumb{background:#d1d5db;border-radius:3px}.time-options-container::-webkit-scrollbar-thumb:hover{background:#9ca3af}.time-option{padding:8px 12px;cursor:pointer;border-radius:6px;margin-bottom:2px;font-size:.875rem;color:#374151;transition:all .15s ease;text-align:center}.time-option:hover{background:#e5e7eb}.time-option.selected{background:#3b82f6;color:#fff}.time-picker-footer{border-top:1px solid #e5e7eb;padding:12px 16px;background:#f9fafb;display:flex;justify-content:center;flex-shrink:0}.now-button{background:none;border:none;color:#3b82f6;font-size:.875rem;font-weight:600;cursor:pointer;padding:8px 16px;border-radius:6px;transition:background-color .2s}.now-button:hover{background-color:#eff6ff}.options-list{width:100%;margin-top:8px}.option-item{display:flex;align-items:center;margin-bottom:8px;width:100%}.option-item input{flex:1;padding:8px;border:1px solid #ddd;border-radius:4px;margin-right:8px}.option-remove-btn{background:#f44336;color:#fff;border:none;border-radius:50%;width:24px;height:24px;display:flex;align-items:center;justify-content:center;cursor:pointer;font-size:16px}.option-remove-btn:disabled{background:#ddd;cursor:not-allowed}.option-add-btn{background:#4285f4;color:#fff;border:none;border-radius:4px;padding:8px 16px;margin-top:8px;cursor:pointer;width:100%}.dropdown-wrapper{width:100%;position:relative}.dropdown-options{position:absolute;top:100%;left:0;width:100%;background:#fff;border:1px solid #ddd;border-radius:4px;box-shadow:0 4px 8px #0000001a;z-index:1000}.form-field-wrapper{position:relative;transition:all .15s ease-in-out;border:2px solid transparent;border-radius:8px;margin-bottom:0}.form-field-wrapper:hover{border-color:#3b82f6;box-shadow:0 0 0 1px #3b82f6}.form-field.selected{border-color:transparent!important;box-shadow:none!important}.form-field-wrapper .drag-handle{position:absolute;left:-12px;top:50%;transform:translateY(-50%);width:24px;height:24px;background:#3b82f6;border-radius:4px;display:flex;align-items:center;justify-content:center;cursor:grab;opacity:0;transition:opacity .15s ease-in-out,transform .1s ease-in-out;z-index:10}.form-field-wrapper:hover .drag-handle{opacity:1}.form-field-wrapper .drag-handle:active{cursor:grabbing}.drag-handle svg{width:16px;height:16px;color:#fff}.drag-dots{display:flex;flex-direction:column;gap:2px}.drag-dots:before,.drag-dots:after{content:"";width:4px;height:4px;background:currentColor;border-radius:50%}.drag-dots{position:relative}.drag-dots:before{position:absolute;top:-3px}.drag-dots:after{position:absolute;top:3px}.form-editor-canvas{padding-left:0;padding-right:0}.form-field-wrapper.being-dragged{opacity:.5;transform:rotate(2deg);z-index:1000}.form-field-wrapper.drag-over{border-color:transparent!important;box-shadow:none!important;background-color:#eff6ff}.form-field-wrapper.drag-over:before,.form-field-wrapper.drag-over:after{content:"";position:absolute;z-index:10;left:0;right:0;margin:0 auto;background-repeat:no-repeat}.form-field-wrapper.drag-over:before{height:3px;background-image:linear-gradient(to right,#3b82f6 0%,#3b82f6 calc(50% - 14px),transparent calc(50% - 14px),transparent calc(50% + 14px),#3b82f6 calc(50% + 14px),#3b82f6 100%);box-shadow:0 1px 2px #0000001a}.form-field-wrapper.drag-over:after{width:24px;height:24px;background-color:#3b82f6;border-radius:50%;background-image:url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='white'%3e%3cpath d='M8.5 2.75V8h5.25v1H8.5v5.25h-1V9H2.25V8H7.5V2.75h1z'/%3e%3c/svg%3e");background-position:center;background-size:16px 16px;box-shadow:0 1px 3px #0003}.form-field-wrapper.drag-over-before:before{top:-6px}.form-field-wrapper.drag-over-before:after{top:-16px}.form-field-wrapper.drag-over-after:before{bottom:-5px}.form-field-wrapper.drag-over-after:after{bottom:-15px}.drag-handle{user-select:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none}.drag-handle:hover{background-color:#2563eb!important;transform:translateY(-50%) scale(1.05)}.drag-handle:active{cursor:grabbing!important;transform:translateY(-50%) scale(.95)}.form-field-wrapper{transition:all .15s ease-in-out,opacity .1s ease-in-out}.form-field-wrapper.being-dragged{transition:none}.block-actions{position:absolute;top:4px;right:4px;left:auto;bottom:auto;transform:none;display:flex;gap:8px;opacity:0;transition:opacity .15s ease-in-out;z-index:20;pointer-events:none}.form-field-wrapper:hover .block-actions{opacity:1}.block-action-button{width:32px;height:32px;border-radius:6px;border:1px solid #e5e7eb;background:#fff;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:all .15s ease-in-out;box-shadow:0 2px 4px #0000001a;pointer-events:auto}.block-action-button:hover{transform:translateY(-1px);box-shadow:0 4px 8px #00000026}.block-action-button.duplicate-button{color:#3b82f6;border-color:#3b82f6}.block-action-button.duplicate-button:hover{background-color:#3b82f6;color:#fff}.block-action-button.delete-button{color:#ef4444;border-color:#ef4444}.block-action-button.delete-button:hover{background-color:#ef4444;color:#fff}.block-action-button svg,.block-action-icon{width:16px;height:16px;flex-shrink:0}.field-label[contenteditable]:empty:before{content:attr(data-placeholder);color:#9ca3af;pointer-events:none}.checkbox-label[contenteditable]:empty:before{content:attr(data-placeholder);color:#9ca3af;pointer-events:none}.currency-input-container{display:flex;align-items:stretch;margin-top:8px;border-radius:.375rem;overflow:hidden;background-color:transparent}.currency-symbol{display:inline-flex;align-items:center;justify-content:center;padding:.5rem .75rem;background-color:transparent;color:var(--text-color, #4b5563);font-size:1rem}.currency-input-container .form-input{flex-grow:1;padding:.5rem .75rem;line-height:1.5rem;height:auto;border:none;outline:none;background-color:transparent}.currency-input-container .form-input::placeholder{color:#9ca3af}input[type=number]::-webkit-inner-spin-button,input[type=number]::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}input[type=number]{-moz-appearance:textfield}.url-input-container{position:relative;width:100%}.url-input-container .form-input{padding-left:48px}.url-input-icon{position:absolute;left:16px;top:50%;transform:translateY(-50%);width:20px;height:20px;color:#6b7280;pointer-events:none}.choice-matrix-container{width:100%;overflow-x:auto;margin-top:0;padding-top:10px}.choice-matrix-table{width:100%;border-collapse:separate;border-spacing:0 8px;border:none}.choice-matrix-table th,.choice-matrix-table td{padding:16px 12px;text-align:center;border:none;vertical-align:middle;width:auto;min-width:120px}.choice-matrix-table th{background-color:transparent;font-weight:400;color:#9ca3af;font-style:italic;padding-bottom:8px}.choice-matrix-table tbody tr{background-color:#f3f4f6;border-radius:8px}.choice-matrix-table tbody td{background-color:#f3f4f6}.choice-matrix-table tbody tr td:first-child{border-top-left-radius:8px;border-bottom-left-radius:8px}.choice-matrix-table tbody tr td:last-child{border-top-right-radius:8px;border-bottom-right-radius:8px}.choice-matrix-table .row-header{text-align:left;font-weight:400;color:#6b7280;padding-left:16px}.choice-matrix-table .empty-cell{background-color:transparent}.column-header-cell{position:relative;text-align:center;vertical-align:middle}.column-delete-button{position:absolute;top:-16px;left:50%;transform:translate(-50%);width:28px;height:28px;border-radius:6px;border:1px solid #e5e7eb;background:#fff;display:flex;align-items:center;justify-content:center;cursor:pointer;opacity:0;visibility:hidden;transition:all .2s ease-in-out;z-index:10;box-shadow:0 2px 8px #00000014;color:#6b7280}.column-header-cell:hover .column-delete-button{opacity:1;visibility:visible}.column-delete-button:hover{transform:translate(-50%) translateY(-2px);box-shadow:0 4px 12px #0000001f;background-color:#f9fafb;color:#374151;border-color:#d1d5db}.column-delete-button:disabled{background:#f9fafb;color:#d1d5db;border-color:#f3f4f6;cursor:not-allowed}.column-delete-button:disabled:hover{transform:translate(-50%);box-shadow:0 2px 8px #00000014;background:#f9fafb;color:#d1d5db}.column-delete-button svg{width:16px;height:16px;flex-shrink:0}.row-delete-cell{position:relative;text-align:center;vertical-align:middle}.row-delete-button{width:28px;height:28px;border-radius:6px;border:1px solid #e5e7eb;background:#fff;display:flex;align-items:center;justify-content:center;cursor:pointer;opacity:0;visibility:hidden;transition:all .2s ease-in-out;box-shadow:0 2px 8px #00000014;color:#6b7280;margin:0 auto}.choice-matrix-table tbody tr:hover .row-delete-button{opacity:1;visibility:visible}.row-delete-button:hover{transform:translateY(-1px);box-shadow:0 4px 12px #0000001f;background-color:#f9fafb;color:#374151;border-color:#d1d5db}.row-delete-button:disabled{background:#f9fafb;color:#d1d5db;border-color:#f3f4f6;cursor:not-allowed}.row-delete-button:disabled:hover{transform:none;box-shadow:0 2px 8px #00000014;background:#f9fafb;color:#d1d5db}.row-delete-button svg{width:16px;height:16px;flex-shrink:0}.choice-matrix-radio{margin:0 auto;width:18px;height:18px;cursor:pointer;-webkit-appearance:none;-moz-appearance:none;appearance:none;background-color:#fff;border:2px solid #d1d5db;border-radius:50%;position:relative;transition:all .15s ease-in-out;display:block}.choice-matrix-radio:hover{border-color:#3b82f6;box-shadow:0 0 0 2px #3b82f61a}.choice-matrix-radio:checked{background-color:#fff;border-color:#3b82f6;box-shadow:0 0 0 2px #3b82f633}.choice-matrix-radio:checked:after{content:"";position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:8px;height:8px;background-color:#3b82f6;border-radius:50%}.choice-matrix-radio:focus{outline:none;border-color:#3b82f6;box-shadow:0 0 0 2px #3b82f633}.choice-matrix-controls{display:flex;gap:8px;margin-top:12px;flex-wrap:wrap}.choice-matrix-control-button{background:#3b82f6;color:#fff;border:none;border-radius:4px;padding:6px 12px;font-size:14px;cursor:pointer;display:flex;align-items:center;gap:4px;transition:background-color .15s ease-in-out}.choice-matrix-control-button:hover{background:#2563eb}.choice-matrix-control-button.remove-button{background:#ef4444}.choice-matrix-control-button.remove-button:hover{background:#dc2626}.choice-matrix-control-button:disabled{background:#d1d5db;cursor:not-allowed}.choice-matrix-control-button.small{padding:4px 8px;font-size:12px;min-width:24px}.choice-matrix-label-input{background:transparent;border:none;padding:4px 8px;border-radius:4px;font-size:14px;width:100%;min-width:80px;max-width:120px;color:#6b7280;font-weight:400;text-align:center;display:block;margin:0 auto}.choice-matrix-label-input::placeholder{color:#9ca3af;font-style:italic}.choice-matrix-label-input:hover{background:#ffffff80}.choice-matrix-label-input:focus{outline:none;background:#fff;color:#111827;font-weight:500;border:1px solid #3b82f6;box-shadow:0 0 0 1px #3b82f6}.choice-matrix-label-input:not(:placeholder-shown){color:#111827;font-weight:500}.choice-matrix-placeholder{padding:40px;text-align:center;color:#6b7280;font-style:italic}.preview-choice-matrix-container{width:100%;overflow-x:auto;margin-top:16px}.preview-choice-matrix-table{width:100%;border-collapse:separate;border-spacing:0;border:1px solid #e5e7eb;border-radius:8px;overflow:hidden}.preview-choice-matrix-table th,.preview-choice-matrix-table td{padding:12px;text-align:center;border-right:1px solid #e5e7eb;border-bottom:1px solid #e5e7eb;background-color:#fff}.preview-choice-matrix-table th:last-child,.preview-choice-matrix-table td:last-child{border-right:none}.preview-choice-matrix-table tr:last-child th,.preview-choice-matrix-table tr:last-child td{border-bottom:none}.preview-choice-matrix-table th{background-color:#f9fafb;font-weight:600;color:#374151}.preview-choice-matrix-table .row-header{background-color:#f9fafb;text-align:left;font-weight:500}.preview-choice-matrix-table .empty-cell{background-color:#f9fafb}.ranking-field-container{width:100%;margin-top:16px}.ranking-drop-zone{transition:all .2s ease-in-out;border-bottom:none!important}.ranking-drop-zone.drag-over{background-color:#eff6ff!important;border-top:2px solid #3b82f6!important}.ranking-options-list{list-style:none;padding:0;margin:0;border:1px solid #e5e7eb;border-radius:8px;background-color:#fff;overflow:hidden}.ranking-option-item{display:flex;align-items:center;padding:12px 16px;border-bottom:1px solid #f3f4f6;background-color:#fff;transition:all .2s ease-in-out;cursor:move;position:relative}.ranking-option-item:last-child{border-bottom:none}.ranking-option-item:hover{background-color:#f9fafb}.ranking-option-item.dragging{opacity:.5;transform:rotate(2deg);z-index:1000;box-shadow:0 4px 12px #00000026}.ranking-option-item.drag-over:before{content:"";position:absolute;top:-2px;left:0;right:0;height:3px;background-color:#3b82f6;z-index:10}.ranking-option-item.drag-over{background-color:#eff6ff}.ranking-drag-handle{display:flex;align-items:center;justify-content:center;width:24px;height:24px;margin-right:12px;color:#9ca3af;cursor:grab;flex-shrink:0}.ranking-drag-handle:active{cursor:grabbing}.ranking-drag-handle:hover{color:#6b7280}.ranking-option-number{display:flex;align-items:center;justify-content:center;width:24px;height:24px;margin-right:12px;background-color:#f3f4f6;color:#6b7280;border-radius:50%;font-size:14px;font-weight:600;flex-shrink:0}.ranking-option-input{flex:1;border:none;background:transparent;font-size:16px;color:#111827;outline:none;padding:4px 8px;border-radius:4px;transition:background-color .15s ease-in-out}.ranking-option-input:hover{background-color:#f3f4f680}.ranking-option-input:focus{background-color:#fff;box-shadow:0 0 0 2px #3b82f6}.ranking-option-input::placeholder{color:#9ca3af}.ranking-option-delete{width:28px;height:28px;border:none;background:none;color:#ef4444;border-radius:4px;display:flex;align-items:center;justify-content:center;cursor:pointer;opacity:.3;transition:all .15s ease-in-out;flex-shrink:0}.ranking-option-item:hover .ranking-option-delete{opacity:1;background-color:#fef2f2}.ranking-option-delete:hover{background-color:#fef2f2;color:#dc2626}.ranking-option-delete svg{width:16px;height:16px;flex-shrink:0}.ranking-controls{display:flex;gap:8px;margin-top:12px;flex-wrap:wrap}.ranking-control-button{background:#3b82f6;color:#fff;border:none;border-radius:6px;padding:8px 16px;font-size:14px;font-weight:500;cursor:pointer;display:flex;align-items:center;gap:6px;transition:background-color .15s ease-in-out}.ranking-control-button:hover{background:#2563eb}.ranking-control-button.bulk-button{background:#6b7280}.ranking-control-button.bulk-button:hover{background:#4b5563}.ranking-control-button svg{width:16px;height:16px}.ranking-placeholder{padding:40px;text-align:center;color:#6b7280;font-style:italic;border:2px dashed #e5e7eb;border-radius:8px;margin-top:12px}.preview-ranking-container{width:100%;margin-top:16px}.preview-ranking-list{list-style:none;padding:0;margin:0;border:1px solid #e5e7eb;border-radius:8px;background-color:#fff;overflow:hidden}.preview-ranking-item{display:flex;align-items:center;padding:12px 16px;border-bottom:1px solid #f3f4f6;background-color:#fff;cursor:move}.preview-ranking-item:last-child{border-bottom:none}.preview-ranking-item:hover{background-color:#f9fafb}.preview-ranking-handle{display:flex;align-items:center;justify-content:center;width:24px;height:24px;margin-right:12px;color:#9ca3af;cursor:grab}.preview-ranking-number{display:flex;align-items:center;justify-content:center;width:24px;height:24px;margin-right:12px;background-color:#3b82f6;color:#fff;border-radius:50%;font-size:14px;font-weight:600}.preview-ranking-text{flex:1;font-size:16px;color:#111827}.preview-ranking-text{color:#374151;font-weight:500;font-size:14px;line-height:1.5}.sidebar-container{display:flex;height:100%;position:relative;z-index:10}.design-sidebar{background:#f5f5f5!important;border-right:1px solid #e0e0e0!important;height:100%;display:flex;flex-direction:column;transition:all .3s cubic-bezier(.4,0,.2,1);box-shadow:0 1px 3px #0000001a}.compact-sidebar,.compact-sidebar.expanded{width:64px;min-width:64px}.tool-groups{display:flex;flex-direction:column;gap:4px;padding:12px 8px;flex:1}.tool-group{display:flex;flex-direction:column;gap:4px}.group-separator{height:1px;background:#f3f4f6;margin:8px 4px}.tool-group:first-child .group-separator{display:none}.tool-buttons{display:flex;flex-direction:column;gap:2px}.tool-btn{display:flex;align-items:center;gap:12px;padding:10px 8px;background:none;border:none;border-radius:8px;cursor:pointer;transition:all .2s ease;color:#6b7280;font-size:13px;font-weight:500;text-align:left;min-height:40px;position:relative;overflow:hidden;white-space:nowrap}.tool-btn:hover{background:#f9fafb;color:#374151}.tool-btn.active{background:#eff6ff;color:#2563eb;border:1px solid #dbeafe}.tool-icon{width:20px;height:20px;flex-shrink:0}.tool-label{opacity:0;transform:translate(-8px);transition:all .3s cubic-bezier(.4,0,.2,1);font-weight:500}.compact-sidebar.expanded .tool-label{opacity:0;transform:translate(-8px)}.expandable-panel{width:380px;min-width:380px;background:#fff;border-right:1px solid #e5e7eb;height:100%;overflow:hidden;box-shadow:0 1px 3px #0000001a;animation:slideInFromLeft .3s cubic-bezier(.4,0,.2,1)}@keyframes slideInFromLeft{0%{transform:translate(-100%);opacity:0}to{transform:translate(0);opacity:1}}.panel-content{height:100%;overflow-y:auto;overflow-x:hidden}.panel-content-wrapper{height:100%;display:flex;flex-direction:column}.panel-header{padding:20px 20px 16px;border-bottom:1px solid #f1f5f9;background:#fff;flex-shrink:0}.panel-header h3{margin:0 0 4px;font-size:16px;font-weight:600;color:#111827}.panel-header p{margin:0;font-size:14px;color:#6b7280;line-height:1.4}.coming-soon{flex:1;display:flex;align-items:center;justify-content:center;padding:40px 20px;text-align:center}.coming-soon p{color:#9ca3af;font-size:14px;margin:0}@media (max-width: 1024px){.compact-sidebar,.compact-sidebar.expanded{width:56px;min-width:56px}.expandable-panel{width:340px;min-width:340px}.tool-btn{padding:8px 6px;min-height:36px}.tool-icon{width:18px;height:18px}}.sidebar-container:hover .compact-sidebar,.sidebar-container:hover .expandable-panel{box-shadow:0 4px 6px #00000012}.panel-content>*{transition:opacity .2s ease}.expandable-panel[data-loading=true] .panel-content>*{opacity:.6}.tool-btn:focus{outline:none;box-shadow:0 0 0 2px #3b82f680}.tool-btn:focus:not(:focus-visible){box-shadow:none}.expandable-panel .blocks-sidebar{height:auto;flex:1;border:none;background:transparent}.expandable-panel .blocks-sidebar-inner{padding:20px 20px 24px}.expandable-panel .sidebar-search-container{margin:0;padding:16px 20px;border-bottom:1px solid #f1f5f9}.main-content.with-expandable-sidebar{margin-left:444px}.main-content.with-compact-sidebar{margin-left:64px}.template-panel{height:100%}.template-search-container{padding:16px 20px;border-bottom:1px solid #f1f5f9}.template-search-bar{position:relative;display:flex;align-items:center;background:#f8fafc;border:1px solid #e2e8f0;border-radius:12px;transition:all .2s ease}.template-search-bar:focus-within{border-color:#3b82f6;box-shadow:0 0 0 3px #3b82f61a}.search-icon{position:absolute;left:12px;font-size:14px;color:#64748b}.template-search-input{width:100%;padding:12px 44px 12px 36px;border:none;background:transparent;font-size:14px;color:#1e293b}.template-search-input::placeholder{color:#94a3b8}.search-filter-btn{position:absolute;right:8px;background:none;border:none;padding:4px;cursor:pointer;border-radius:6px;color:#64748b}.search-filter-btn:hover{background:#e2e8f0;color:#1e293b}.filter-icon{width:16px;height:16px}.template-tabs{display:flex;border-bottom:1px solid #f1f5f9;padding:0 20px}.template-tab{padding:12px 16px;background:none;border:none;cursor:pointer;font-size:14px;font-weight:500;color:#64748b;border-bottom:2px solid transparent;transition:all .2s ease;position:relative}.template-tab:hover{color:#1e293b}.template-tab.active{color:#3b82f6;border-bottom-color:#3b82f6}.template-categories-horizontal{padding:16px 20px;border-bottom:1px solid #f1f5f9}.category-buttons-container{display:flex;gap:8px;flex-wrap:wrap}.category-btn{padding:8px 16px;background:#f8fafc;border:1px solid #e2e8f0;border-radius:20px;cursor:pointer;font-size:13px;font-weight:500;color:#64748b;transition:all .2s ease}.category-btn:hover{border-color:#3b82f6;color:#3b82f6}.category-btn.active{background:#3b82f6;border-color:#3b82f6;color:#fff}.template-section{padding:20px;border-bottom:1px solid #f1f5f9}.template-section:last-child{border-bottom:none}.section-header-horizontal{display:flex;justify-content:space-between;align-items:center;margin-bottom:16px}.section-header-horizontal h4{margin:0;font-size:16px;font-weight:600;color:#1e293b}.premium-title{display:flex;align-items:center;gap:8px;font-size:16px;font-weight:600;color:#1e293b}.crown-icon{font-size:14px}.see-all-btn{background:none;border:none;color:#3b82f6;font-size:13px;font-weight:500;cursor:pointer;padding:4px 8px;border-radius:6px}.see-all-btn:hover{background:#eff6ff;color:#2563eb}.template-grid-horizontal{display:flex;gap:12px;overflow-x:auto;padding-bottom:4px}.template-grid-horizontal::-webkit-scrollbar{height:4px}.template-grid-horizontal::-webkit-scrollbar-track{background:#f1f5f9}.template-grid-horizontal::-webkit-scrollbar-thumb{background:#cbd5e1;border-radius:2px}.template-card-large{min-width:240px;max-width:240px;background:#fff;border:1px solid #e2e8f0;border-radius:12px;overflow:hidden;cursor:pointer;transition:all .2s ease;box-shadow:0 1px 3px #0000001a}.template-card-large:hover{border-color:#3b82f6;box-shadow:0 4px 12px #3b82f626;transform:translateY(-2px)}.template-card-large.premium{background:linear-gradient(135deg,#f59e0b,#f97316)}.template-card-large.premium:hover{transform:translateY(-2px);box-shadow:0 8px 25px #f59e0b40}.template-preview-large{height:120px;background:#f8fafc;display:flex;align-items:center;justify-content:center;position:relative;overflow:hidden}.premium-badge{position:absolute;top:8px;right:8px;background:#000c;color:#fff;padding:4px 8px;border-radius:12px;font-size:10px;font-weight:600;letter-spacing:.5px}.template-mock-content{width:80%;height:80%;background:#fff;border-radius:8px;padding:12px;box-shadow:0 2px 8px #0000001a;display:flex;flex-direction:column;gap:8px}.mock-header{border-bottom:1px solid #f1f5f9;padding-bottom:8px}.mock-title{font-size:12px;font-weight:600;color:#1e293b;margin-bottom:2px}.mock-subtitle{font-size:10px;color:#64748b}.mock-fields{display:flex;flex-direction:column;gap:6px;flex:1}.mock-field{height:12px;background:#f1f5f9;border-radius:4px;animation:mockFieldPulse 2s ease-in-out infinite}.mock-field.large{height:24px}.mock-field.rating{height:16px;background:linear-gradient(90deg,#fbbf24,#f59e0b)}.mock-field.upload{height:20px;background:linear-gradient(90deg,#e5e7eb,#d1d5db);border:1px dashed #9ca3af}@keyframes mockFieldPulse{0%,to{opacity:1}50%{opacity:.7}}.styles-content{flex:1}.coming-soon{text-align:center;padding:40px 20px}.coming-soon h4{margin:0 0 8px;font-size:16px;font-weight:600;color:#1e293b}.coming-soon p{margin:0;font-size:14px;color:#64748b}.premium-section{background:linear-gradient(135deg,#f59e0b0d,#f973160d);border:1px solid rgba(245,158,11,.2);border-radius:12px;margin:0 -20px;padding:20px}.template-modal-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:#00000080;display:flex;align-items:center;justify-content:center;z-index:1000;animation:fadeInOverlay .3s ease-out;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}@keyframes fadeInOverlay{0%{opacity:0}to{opacity:1}}.template-modal{background:#fff;border-radius:8px;box-shadow:0 25px 50px #00000040;max-width:1200px;width:90vw;max-height:90vh;display:flex;flex-direction:column;overflow:hidden;animation:slideInModal .3s ease-out}@keyframes slideInModal{0%{opacity:0;transform:scale(.95) translateY(20px)}to{opacity:1;transform:scale(1) translateY(0)}}.template-modal-header{padding:20px 32px;border-bottom:1px solid var(--border-color)}.modal-title-section{display:flex;justify-content:space-between;align-items:center}.template-modal-header h2{margin:0;font-size:20px;font-weight:700;color:var(--text-primary)}.modal-close-btn{background:#f8fafc;border:1px solid #e2e8f0;border-radius:8px;padding:8px;cursor:pointer;transition:all .2s ease;display:flex;align-items:center;justify-content:center}.modal-close-btn:hover{background:#e2e8f0;border-color:#cbd5e1}.template-search-section{margin-top:16px}.search-input-container{position:relative;display:flex;align-items:center;background:#f8fafc;border:1px solid #e2e8f0;border-radius:12px;transition:all .2s ease}.search-input-container:focus-within{border-color:#3b82f6;box-shadow:0 0 0 3px #3b82f61a}.search-input-container .search-icon{position:absolute;left:16px;font-size:16px;color:#64748b}.template-search-input-modal{width:100%;padding:16px 20px 16px 48px;border:none;background:transparent;font-size:16px;color:#1e293b}.template-search-input-modal::placeholder{color:#94a3b8}.template-modal-content{display:flex;flex:1;overflow:hidden}.template-sidebar{width:280px;background:#f8fafc;border-right:1px solid #e2e8f0;overflow-y:auto;flex-shrink:0}.category-list{padding:16px}.template-modal .category-btn{width:100%;display:flex;align-items:center;gap:12px;padding:12px 16px;background:transparent;border:none;border-radius:8px;cursor:pointer;transition:all .2s ease;text-align:left;margin-bottom:4px;justify-content:space-between}.template-modal .category-btn:hover{background:#e2e8f0}.template-modal .category-btn.active{background:#3b82f6;color:#fff}.template-modal .category-icon{font-size:16px}.template-modal .category-name{flex:1;font-size:14px;font-weight:500}.template-modal .category-count{background:#e2e8f0;color:#64748b;padding:2px 8px;border-radius:12px;font-size:12px;font-weight:500}.template-modal .category-btn.active .category-count{background:#fff3;color:#fff}.template-modal .category-btn:not(.active) .category-count{background:#e2e8f0;color:#64748b}.template-grid-container{flex:1;overflow-y:auto;padding:24px}.template-category-section{margin-bottom:40px}.template-category-section:last-child{margin-bottom:0}.category-header{display:flex;align-items:center;gap:12px;margin-bottom:20px;padding-bottom:12px;border-bottom:1px solid #f1f5f9}.category-icon-large{font-size:24px}.category-header h3{margin:0;font-size:20px;font-weight:600;color:#1e293b;flex:1}.template-count{background:#f1f5f9;color:#64748b;padding:4px 12px;border-radius:16px;font-size:12px;font-weight:500}.template-card-modal{background:#fff;border:1px solid #e2e8f0;border-radius:12px;overflow:hidden;cursor:pointer;transition:all .2s ease;box-shadow:0 1px 3px #0000001a}.template-card-modal:hover{border-color:#3b82f6;box-shadow:0 8px 25px #3b82f626;transform:translateY(-2px)}.template-preview-modal{height:120px;display:flex;align-items:center;justify-content:center;position:relative;padding:16px}.template-preview-icon{font-size:32px;margin-bottom:8px}.template-preview-fields{display:flex;gap:4px;justify-content:center;margin-top:8px}.template-modal .field-indicator{width:20px;height:4px;border-radius:2px;background:#e2e8f0}.template-modal .field-indicator.more{display:flex;align-items:center;justify-content:center;width:24px;height:16px;border-radius:8px;font-size:10px;font-weight:600;color:#fff}.template-info-modal{padding:16px}.template-modal .template-name{margin:0 0 8px;font-size:16px;font-weight:600;color:#1e293b}.template-modal .template-description{margin:0 0 16px;font-size:14px;color:#64748b;line-height:1.5}.template-modal .template-meta{display:flex;justify-content:space-between;align-items:center}.template-modal .field-count{background:#f1f5f9;color:#64748b;padding:4px 8px;border-radius:8px;font-size:12px;font-weight:500}.template-modal .btn-use-template{background:#3b82f6;color:#fff;border:none;padding:8px 16px;border-radius:8px;font-size:13px;font-weight:500;cursor:pointer;transition:all .2s ease}.template-modal .btn-use-template:hover{background:#2563eb;transform:translateY(-1px);box-shadow:0 4px 12px #3b82f666}.no-templates-found{text-align:center;padding:60px 20px;color:#64748b}.no-results-icon{font-size:48px;margin-bottom:16px;opacity:.5}.no-templates-found h3{margin:0 0 8px;font-size:18px;font-weight:600;color:#1e293b}.no-templates-found p{margin:0;font-size:14px;color:#64748b}.skeleton{background:linear-gradient(90deg,#f0f0f0 25%,#e0e0e0,#f0f0f0 75%);background-size:200% 100%;animation:skeleton-loading 1.5s infinite}@keyframes skeleton-loading{0%{background-position:200% 0}to{background-position:-200% 0}}.skeleton-template-card{min-width:240px;max-width:240px;background:#fff;border:1px solid #e2e8f0;border-radius:12px;overflow:hidden;box-shadow:0 1px 3px #0000001a}.skeleton-template-preview{height:120px;background:#f8fafc;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:8px;padding:16px}.skeleton-template-icon{width:32px;height:32px;border-radius:50%}.skeleton-template-fields{display:flex;gap:4px;justify-content:center}.skeleton-field-indicator{width:20px;height:4px;border-radius:2px}.skeleton-template-info{padding:16px;display:flex;flex-direction:column;gap:8px}.skeleton-template-name{height:16px;border-radius:4px}.skeleton-template-description{height:12px;border-radius:4px;width:80%}.skeleton-template-meta{display:flex;justify-content:space-between;align-items:center;margin-top:8px}.skeleton-field-count{width:60px;height:20px;border-radius:8px}.skeleton-use-button{width:80px;height:32px;border-radius:8px}@media (max-width: 1024px){.template-modal{width:95vw;max-height:85vh}.template-sidebar{width:240px}.template-grid-modal{grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:16px}}@media (max-width: 768px){.template-modal{width:100vw;height:100vh;border-radius:0}.template-modal-overlay{padding:0}.template-modal-content{flex-direction:column}.template-sidebar{width:100%;max-height:200px;border-right:none;border-bottom:1px solid #e2e8f0}.category-list{display:flex;overflow-x:auto;padding:16px;gap:8px}.template-modal .category-btn{flex-shrink:0;margin-bottom:0;margin-right:8px;min-width:120px}.template-grid-modal{grid-template-columns:1fr;gap:12px}}.no-field-selected{text-align:center;padding:40px 20px;color:#64748b}.no-field-icon{font-size:48px;margin-bottom:16px;opacity:.5}.no-field-selected h4{margin:0 0 8px;font-size:16px;font-weight:600;color:#1e293b}.no-field-selected p{margin:0;font-size:14px;color:#64748b}.style-panel{display:flex;flex-direction:column;height:100%;background:#fff;border-radius:8px;overflow:hidden}.style-tabs{display:flex;flex-wrap:nowrap;background:#f8f9fa;border-bottom:1px solid #e9ecef;padding:10px;gap:2px;overflow-x:auto;overflow-y:hidden;scrollbar-width:none;-ms-overflow-style:none}.style-tabs::-webkit-scrollbar{display:none}.style-tab{flex:0 0 auto;display:flex;align-items:center;justify-content:center;gap:6px;padding:8px 12px;background:transparent;border:none;border-radius:6px;cursor:pointer;font-size:13px;font-weight:500;color:#64748b;transition:all .2s ease;-webkit-user-select:none;user-select:none;white-space:nowrap;min-width:fit-content}.style-tab:hover{background:#fff;color:#374151}.style-tab.active{background:#fff;color:#1f2937;box-shadow:0 1px 3px #0000001a}.style-tab .tab-icon{width:16px;height:16px;flex-shrink:0}.style-tab .tab-label{font-size:12px;font-weight:500;flex-shrink:0}@media (max-width: 1200px){.style-tab{padding:6px 8px;gap:4px}.style-tab .tab-icon{width:14px;height:14px}.style-tab .tab-label{font-size:11px}}@media (max-width: 900px){.style-tab .tab-label{display:none}.style-tab{padding:8px;min-width:36px}}.style-content{flex:1;overflow-y:auto;padding:0}.style-section{padding:20px}.section-header{margin-bottom:16px}.section-header h4{font-size:16px;font-weight:600;color:#1f2937;margin:0 0 4px}.section-header p{font-size:13px;color:#64748b;margin:0}.background-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}.background-option{display:flex;flex-direction:column;align-items:center;cursor:pointer;transition:transform .2s ease}.background-option:hover{transform:translateY(-2px)}.background-preview{width:100%;height:60px;border-radius:8px;border:2px solid #e5e7eb;position:relative;overflow:hidden;transition:all .2s ease}.background-option:hover .background-preview{border-color:#3b82f6;box-shadow:0 4px 12px #3b82f626}.gradient-overlay{position:absolute;top:0;right:0;bottom:0;left:0;background:linear-gradient(45deg,rgba(255,255,255,.1) 25%,transparent 25%,transparent 75%,rgba(255,255,255,.1) 75%);background-size:8px 8px}.background-name{font-size:12px;font-weight:500;color:#374151;margin-top:8px;text-align:center}.themes-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}.theme-option{cursor:pointer;transition:transform .2s ease;border-radius:10px;overflow:hidden;border:2px solid #e5e7eb}.theme-option:hover{transform:translateY(-2px);border-color:#3b82f6;box-shadow:0 4px 12px #3b82f626}.theme-preview{padding:12px;background:#f8f9fa;position:relative}.theme-color-primary,.theme-color-accent{position:absolute;width:16px;height:16px;border-radius:50%;border:2px solid #ffffff;box-shadow:0 1px 3px #0003}.theme-color-primary{top:8px;right:8px}.theme-color-accent{top:8px;right:28px}.theme-preview-form{background:#fff;border-radius:6px;padding:12px;box-shadow:0 1px 3px #0000001a}.preview-header{height:8px;border-radius:4px;margin-bottom:8px}.preview-field{height:6px;background:#e5e7eb;border-radius:3px;margin-bottom:6px}.preview-button{height:12px;border-radius:4px;margin-top:8px}.theme-name{display:block;font-size:12px;font-weight:500;color:#374151;text-align:center;padding:8px;background:#fff}.typography-list{display:flex;flex-direction:column;gap:8px}.typography-option{display:flex;align-items:center;justify-content:space-between;padding:12px;border:2px solid #e5e7eb;border-radius:8px;cursor:pointer;transition:all .2s ease;background:#fff}.typography-option:hover{border-color:#3b82f6;box-shadow:0 2px 8px #3b82f61a}.font-preview{flex:1}.font-sample{font-size:14px;color:#1f2937;margin-bottom:4px;font-weight:400}.font-details{display:flex;align-items:center;gap:8px}.font-name{font-size:12px;font-weight:600;color:#374151}.font-category{font-size:11px;color:#64748b;background:#f1f5f9;padding:2px 6px;border-radius:4px}.font-sizes{display:flex;align-items:center;gap:4px}.font-sizes .size-lg{font-size:20px;color:#1f2937}.font-sizes .size-md{font-size:16px;color:#374151}.font-sizes .size-sm{font-size:12px;color:#64748b}.animations-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}.animation-option{display:flex;flex-direction:column;padding:16px;border:2px solid #e5e7eb;border-radius:8px;cursor:pointer;transition:all .2s ease;background:#fff}.animation-option:hover{border-color:#3b82f6;box-shadow:0 2px 8px #3b82f61a}.animation-preview{height:40px;display:flex;align-items:center;justify-content:center;margin-bottom:12px;background:#f8f9fa;border-radius:6px;overflow:hidden}.preview-element{width:20px;height:20px;position:relative}.preview-box{width:100%;height:100%;background:#3b82f6;border-radius:3px}.preview-element.entrance .preview-box{animation:fadeInUp 1.5s ease-in-out infinite}.preview-element.interaction .preview-box{animation:pulse 2s ease-in-out infinite}.preview-element.static .preview-box{background:#9ca3af}@keyframes fadeInUp{0%,to{opacity:0;transform:translateY(10px)}50%{opacity:1;transform:translateY(0)}}@keyframes pulse{0%,to{transform:scale(1)}50%{transform:scale(1.1)}}.animation-info{text-align:center}.animation-name{font-size:12px;font-weight:500;color:#374151;display:block;margin-bottom:2px}.animation-description{font-size:11px;color:#64748b}@media (max-width: 768px){.style-tabs{flex-wrap:nowrap;overflow-x:auto;gap:2px}.style-tab{flex-shrink:0;padding:8px 12px;min-width:fit-content}.background-grid,.themes-grid,.animations-grid{grid-template-columns:1fr}.typography-option{flex-direction:column;align-items:flex-start;gap:8px}.font-sizes{align-self:flex-end}}.colors-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}.color-option{display:flex;flex-direction:column;align-items:center;cursor:pointer;transition:transform .2s ease;padding:12px;border:2px solid #e5e7eb;border-radius:10px;background:#fff}.color-option:hover{transform:translateY(-2px);border-color:#3b82f6;box-shadow:0 4px 12px #3b82f626}.color-preview{display:flex;gap:4px;margin-bottom:8px}.color-swatch{width:20px;height:20px;border-radius:50%;border:2px solid #ffffff;box-shadow:0 1px 3px #0003}.color-swatch.primary{width:24px;height:24px}.color-name{font-size:12px;font-weight:500;color:#374151;text-align:center}.layout-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}.layout-option{display:flex;flex-direction:column;padding:16px;border:2px solid #e5e7eb;border-radius:8px;cursor:pointer;transition:all .2s ease;background:#fff}.layout-option:hover{border-color:#3b82f6;box-shadow:0 2px 8px #3b82f61a}.layout-preview{height:80px;display:flex;align-items:center;justify-content:center;margin-bottom:12px;background:#f8f9fa;border-radius:6px;padding:12px}.layout-mockup{width:100%;height:100%;display:flex;flex-direction:column;gap:4px}.layout-row{display:flex;gap:4px}.layout-field{background:#cbd5e1;border-radius:3px;height:12px}.layout-field.full{width:100%}.layout-field.half{width:48%}.layout-card{background:#fff;border:1px solid #e5e7eb;border-radius:4px;padding:8px;display:flex;flex-direction:column;gap:4px}.layout-progress{height:4px;background:#3b82f6;border-radius:2px;width:60%;margin-bottom:4px}.layout-mockup.compact .layout-field{height:8px}.layout-mockup.spacious .layout-field{height:16px}.layout-info{text-align:center}.layout-name{font-size:12px;font-weight:500;color:#374151;display:block;margin-bottom:2px}.layout-description{font-size:11px;color:#64748b}.layout-cover-icon{width:100%;height:100%;display:flex;align-items:center;justify-content:center}.cover-icon-preview-image{width:100%;height:100%;object-fit:contain;border-radius:4px}.layout-mockup.cover-icon{background:#fff;border-radius:6px;overflow:hidden;border:1px solid #e5e7eb}.cover-image-container{width:100%;margin-bottom:4rem}.cover-image-section{position:relative;width:100%;height:200px;background:#f5e6d3;border-radius:8px;overflow:visible}.cover-image-area{position:relative;width:100%;height:100%;overflow:hidden}.cover-image-area:hover .cover-hover-overlay{opacity:1}.cover-image-placeholder{width:100%;height:100%;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,#f5e6d3,#e8d5c4);cursor:pointer;transition:background .3s ease;border-top-right-radius:8px;border-top-left-radius:8px}.cover-image-placeholder:hover{background:linear-gradient(135deg,#e8d5c4,#dcc5b0)}.cover-placeholder-content p{color:#8b7355;font-size:14px;font-weight:500;margin:0}.cover-image{width:100%;height:100%;object-fit:cover;border-radius:8px;display:block}.cover-hover-overlay{position:absolute;top:0;left:0;right:0;bottom:0;background:#0006;display:flex;align-items:center;justify-content:center;opacity:0;transition:opacity .2s ease;border-radius:8px}.cover-hover-buttons{display:flex;gap:12px;align-items:center}.cover-hover-button{display:flex;align-items:center;gap:8px;padding:10px 16px;background:#fff;border:none;border-radius:8px;font-size:14px;font-weight:600;color:#374151;cursor:pointer;transition:all .2s cubic-bezier(.4,0,.2,1);box-shadow:0 1px 3px #0000001a,0 1px 2px #0000000f;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);position:relative;overflow:hidden}.cover-hover-button:before{content:"";position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.4),transparent);transition:left .5s}.cover-hover-button:hover:before{left:100%}.cover-hover-button:hover{background:#fff;box-shadow:0 4px 6px #0000001a,0 2px 4px #0000000f;transform:translateY(-2px);color:#111827}.cover-hover-button:active{transform:translateY(-1px);box-shadow:0 2px 4px #0000001a,0 1px 2px #0000000f}.cover-hover-button svg{color:#6366f1;flex-shrink:0;width:18px;height:18px;z-index:1;position:relative}.cover-hover-button:hover svg{color:#4f46e5}.cover-image-area.repositioning{overflow:hidden;cursor:grab;border:3px dashed #3b82f6;border-radius:8px;position:relative}.cover-image.repositioning{transition:none;user-select:none;-webkit-user-drag:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;pointer-events:none;position:relative;z-index:1;height:100%;width:100%;object-fit:cover}.cover-image.dragging{cursor:grabbing!important}.cover-image-area.repositioning .cover-image{will-change:transform;max-height:none}.reposition-controls-overlay{position:absolute;top:0;left:0;right:0;bottom:0;background:#00000080;display:flex;flex-direction:column;align-items:center;justify-content:center;border-radius:8px;z-index:10}.reposition-mini-preview{position:absolute;top:16px;left:16px;display:flex;flex-direction:column;align-items:center;gap:8px}.mini-preview-container{position:relative;width:120px;height:80px;border:2px solid #ffffff;border-radius:6px;overflow:hidden;background:#fff;box-shadow:0 4px 12px #0000004d}.mini-preview-image{width:100%;height:100%;object-fit:cover;object-position:center center}.mini-preview-crop-indicator{position:absolute;left:0;right:0;height:33.33%;background:#3b82f64d;border:2px solid #3b82f6;border-left:none;border-right:none;transform:translateY(-50%);transition:top .1s ease}.mini-preview-label{color:#fff;font-size:12px;font-weight:500;text-align:center;text-shadow:0 1px 2px rgba(0,0,0,.5);background:#0000004d;padding:4px 8px;border-radius:4px;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}.logo-overlay.repositioning{z-index:15}.logo-container.repositioning{transition:none;user-select:none;-webkit-user-drag:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;border:3px dashed #f59e0b;border-radius:50%;padding:4px;position:relative}.logo-image.repositioning{transition:none;-webkit-user-select:none;user-select:none;-webkit-user-drag:none;pointer-events:none}.logo-reposition-controls-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:#00000080;display:flex;flex-direction:column;align-items:center;justify-content:center;z-index:20}.logo-reposition-mini-preview{position:absolute;top:16px;right:16px;display:flex;flex-direction:column;align-items:center;gap:8px}.logo-hover-overlay{position:absolute;top:0;left:0;right:0;bottom:0;background:#0009;display:flex;flex-direction:column;align-items:center;justify-content:center;opacity:0;transition:opacity .2s ease;border-radius:50%;gap:8px}.logo-container:hover .logo-hover-overlay{opacity:1}.logo-hover-button{padding:6px 12px;background:#fff;border:none;border-radius:6px;font-size:12px;font-weight:600;color:#374151;cursor:pointer;transition:all .2s ease;box-shadow:0 2px 4px #0000001a}.logo-hover-button:hover{background:#f9fafb;transform:translateY(-1px)}.reposition-instructions{margin-bottom:20px}.reposition-instructions p{color:#fff;font-size:16px;font-weight:500;margin:0;text-align:center;text-shadow:0 1px 2px rgba(0,0,0,.5)}.reposition-buttons{display:flex;gap:12px;align-items:center}.reposition-button{padding:12px 24px;border:none;border-radius:8px;font-size:14px;font-weight:600;cursor:pointer;transition:all .2s cubic-bezier(.4,0,.2,1);box-shadow:0 2px 4px #0000001a;min-width:120px}.reposition-button.cancel{background:#fff;color:#374151;border:1px solid #d1d5db}.reposition-button.cancel:hover{background:#f9fafb;box-shadow:0 4px 6px #0000001a;transform:translateY(-1px)}.reposition-button.save{background:#3b82f6;color:#fff}.reposition-button.save:hover{background:#2563eb;box-shadow:0 4px 6px #3b82f64d;transform:translateY(-1px)}.reposition-button:active{transform:translateY(0);box-shadow:0 1px 2px #0000001a}.logo-overlay{position:relative;top:-40px;z-index:10;width:100%;max-width:650px;margin:0 auto}.logo-wrapper{position:relative;display:inline-flex;align-items:center;gap:12px}.logo-placeholder{position:relative;width:80px;height:80px}.logo-placeholder-circle{width:80px;height:80px;border-radius:50%;background:#fff;border:4px solid #E5E7EB;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:all .3s ease;box-shadow:0 4px 12px #0000001a}.logo-placeholder-circle:hover{border-color:#3b82f6;box-shadow:0 4px 16px #3b82f64d}.logo-placeholder-icon{width:32px;height:32px;color:#6b7280;display:flex;align-items:center;justify-content:center}.logo-container{position:relative;width:80px;height:80px;border-radius:50%;overflow:hidden;border:4px solid #FFFFFF;box-shadow:0 4px 12px #00000026}.logo-image{width:100%;height:100%;border-radius:0;object-fit:cover;object-position:center center;border:none;box-shadow:none;transition:object-position .1s ease}.logo-hover-overlay{position:absolute;top:0;right:0;bottom:0;left:0;background:#000000b3;border-radius:50%;display:flex;align-items:center;justify-content:center;opacity:0;transition:opacity .2s ease;z-index:5}.logo-container:hover .logo-hover-overlay,.logo-placeholder:hover .logo-hover-overlay,.logo-wrapper:hover .logo-hover-overlay.outside{opacity:1;pointer-events:auto}.logo-hover-overlay.outside{position:absolute;top:50%;left:96px;transform:translateY(-50%);border-radius:8px;background:transparent;opacity:0;pointer-events:none;display:flex;gap:8px}.logo-hover-button{background:#fffffff2;border:none;border-radius:6px;padding:8px 12px;font-size:12px;font-weight:500;color:#374151;cursor:pointer;transition:all .2s ease;white-space:nowrap;box-shadow:0 2px 8px #00000026}.logo-hover-button:hover{background:#fff;transform:translateY(-1px);box-shadow:0 4px 12px #0003}.effects-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}.effect-option{display:flex;flex-direction:column;padding:16px;border:2px solid #e5e7eb;border-radius:8px;cursor:pointer;transition:all .2s ease;background:#fff}.effect-option:hover{border-color:#3b82f6;box-shadow:0 2px 8px #3b82f61a}.effect-preview{height:60px;display:flex;align-items:center;justify-content:center;margin-bottom:12px;background:#f8f9fa;border-radius:6px;overflow:hidden;position:relative}.effect-demo{width:40px;height:40px;display:flex;align-items:center;justify-content:center}.effect-element{width:24px;height:24px;background:#3b82f6;border-radius:4px}.effect-demo.shadow .effect-element{box-shadow:0 4px 12px #3b82f666}.effect-demo.glow .effect-element{box-shadow:0 0 20px #3b82f699}.effect-demo.blur:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background:linear-gradient(45deg,#3b82f6,#8b5cf6);filter:blur(8px);opacity:.3}.effect-demo.gradient-border .effect-element{background:linear-gradient(45deg,#3b82f6,#8b5cf6,#ec4899);padding:2px;border-radius:6px}.effect-demo.gradient-border .effect-element:after{content:"";display:block;width:20px;height:20px;background:#fff;border-radius:2px}.effect-demo.glass .effect-element{background:#ffffff40;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border:1px solid rgba(255,255,255,.18)}.effect-demo.neuro .effect-element{background:#f8f9fa;box-shadow:9px 9px 16px #e5e7eb,-9px -9px 16px #fff}.effect-info{text-align:center}.effect-name{font-size:12px;font-weight:500;color:#374151;display:block;margin-bottom:2px}.effect-intensity{font-size:11px;color:#64748b;background:#f1f5f9;padding:2px 6px;border-radius:4px}.spacing-list{display:flex;flex-direction:column;gap:8px}.spacing-option{display:flex;align-items:center;padding:12px;border:2px solid #e5e7eb;border-radius:8px;cursor:pointer;transition:all .2s ease;background:#fff}.spacing-option:hover{border-color:#3b82f6;box-shadow:0 2px 8px #3b82f61a}.spacing-preview{width:80px;height:40px;display:flex;align-items:center;justify-content:center;background:#f8f9fa;border-radius:6px;margin-right:16px}.spacing-demo{display:flex;flex-direction:column;align-items:center}.spacing-block{width:20px;height:4px;background:#cbd5e1;border-radius:2px}.spacing-demo[data-spacing="8px"] .spacing-block+.spacing-block{margin-top:2px}.spacing-demo[data-spacing="16px"] .spacing-block+.spacing-block{margin-top:4px}.spacing-demo[data-spacing="24px"] .spacing-block+.spacing-block{margin-top:6px}.spacing-demo[data-spacing="32px"] .spacing-block+.spacing-block{margin-top:8px}.spacing-demo[data-spacing=custom] .spacing-block+.spacing-block{margin-top:4px}.spacing-demo[data-spacing=custom] .spacing-block:nth-child(2){background:#3b82f6}.spacing-info{flex:1}.spacing-name{font-size:14px;font-weight:500;color:#374151;display:block;margin-bottom:2px}.spacing-value{font-size:12px;color:#3b82f6;font-weight:500;margin-right:8px}.spacing-description{font-size:11px;color:#64748b}.preview-element.entrance .preview-box{animation:slideRight 1.5s ease-in-out infinite}@keyframes slideRight{0%,to{opacity:0;transform:translate(-10px)}50%{opacity:1;transform:translate(0)}}.preview-element.interaction .preview-box{animation:shake 2s ease-in-out infinite}@keyframes shake{0%,to{transform:translate(0)}25%{transform:translate(-2px)}75%{transform:translate(2px)}}@media (max-width: 768px){.colors-grid,.layout-grid,.effects-grid{grid-template-columns:1fr}.spacing-option{flex-direction:column;align-items:flex-start;gap:8px}.spacing-preview{margin-right:0;margin-bottom:8px}}.style-content::-webkit-scrollbar{width:6px}.style-content::-webkit-scrollbar-track{background:#f1f5f9}.style-content::-webkit-scrollbar-thumb{background:#cbd5e1;border-radius:3px}.style-content::-webkit-scrollbar-thumb:hover{background:#94a3b8}.integrations-panel{display:flex;flex-direction:column;gap:20px;padding:8px 0;height:100%}.integration-tabs{display:flex;gap:2px;background-color:#f1f5f9;padding:3px;border-radius:8px;margin:0 16px}.integration-tab{flex:1;padding:8px 16px;background:none;border:none;border-radius:6px;font-size:13px;font-weight:500;color:#64748b;cursor:pointer;text-align:center}.integration-tab:hover{color:#334155;background-color:#ffffff80}.integration-tab.active{background-color:#fff;color:#1e293b;box-shadow:0 1px 3px #0000001a}.category-filter{padding:0 16px}.category-buttons{display:flex;gap:8px;flex-wrap:wrap}.category-filter-btn{padding:6px 12px;background:none;border:1px solid #e2e8f0;border-radius:16px;font-size:12px;font-weight:500;color:#64748b;cursor:pointer;white-space:nowrap}.category-filter-btn:hover{border-color:#cbd5e1;color:#475569;background-color:#f8fafc}.category-filter-btn.active{background-color:#3b82f6;color:#fff;border-color:#3b82f6}.integrations-grid{display:flex;flex-direction:column;gap:12px;padding:0 16px;overflow-y:auto;flex:1}.integrations-grid::-webkit-scrollbar{width:4px}.integrations-grid::-webkit-scrollbar-track{background:transparent}.integrations-grid::-webkit-scrollbar-thumb{background:#cbd5e1;border-radius:2px}.integrations-grid::-webkit-scrollbar-thumb:hover{background:#94a3b8}.integration-card{background:#fff!important;border:1px solid #e2e8f0;border-radius:12px;padding:16px;cursor:pointer}.integration-card:hover{border-color:#cbd5e1;box-shadow:0 4px 12px #0000000d}.integration-header{display:flex;align-items:flex-start;gap:12px;margin-bottom:12px}.integration-icon{width:40px;height:40px;border-radius:8px;display:flex;align-items:center;justify-content:center;flex-shrink:0}.icon-symbol{font-size:20px;font-weight:600}.integration-info{flex:1;min-width:0}.integration-name{font-size:14px;font-weight:600;color:#1e293b!important;margin:0 0 2px}.integration-category{font-size:11px;font-weight:500;color:#64748b!important;text-transform:uppercase;letter-spacing:.5px}.integration-status{flex-shrink:0}.status-badge{padding:4px 8px;border-radius:12px;font-size:11px;font-weight:500;text-transform:uppercase;letter-spacing:.5px}.status-badge.available{background-color:#f1f5f9;color:#64748b}.status-badge.connected{background-color:#dcfce7;color:#16a34a}.integration-description{margin-bottom:12px}.integration-description p{font-size:13px;color:#64748b!important;line-height:1.4;margin:0}.integration-features{margin-bottom:16px}.features-list{list-style:none;padding:0;margin:0}.feature-item{display:flex;align-items:center;gap:8px;font-size:12px;color:#64748b!important;margin-bottom:4px}.feature-item:last-child{margin-bottom:0}.feature-bullet{color:#94a3b8;font-weight:600}.integration-actions{display:flex;gap:8px}.btn-connect{flex:1;padding:8px 16px;border:none;border-radius:6px;font-size:12px;font-weight:600;color:#fff;cursor:pointer;text-transform:uppercase;letter-spacing:.5px}.btn-connect:hover{opacity:.9}.btn-configure{flex:1;padding:8px 16px;border:1px solid #e2e8f0;border-radius:6px;font-size:12px;font-weight:600;color:#64748b;background:#fff;cursor:pointer;text-transform:uppercase;letter-spacing:.5px}.btn-configure:hover{border-color:#cbd5e1;color:#475569;background-color:#f8fafc}.btn-disconnect{padding:8px 12px;border:1px solid #fecaca;border-radius:6px;font-size:11px;font-weight:600;color:#dc2626;background:#fef2f2;cursor:pointer;text-transform:uppercase;letter-spacing:.5px}.btn-disconnect:hover{border-color:#fca5a5;background-color:#fee2e2}.no-integrations{display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:40px 20px;color:#64748b;flex:1}.no-integrations-icon{font-size:32px;margin-bottom:12px;opacity:.6}.no-integrations h4{font-size:16px;font-weight:600;color:#334155;margin:0 0 6px}.no-integrations p{font-size:13px;line-height:1.5;margin:0;max-width:280px}.integrations-help{padding:0 16px 16px;margin-top:auto}.help-card{background:linear-gradient(135deg,#667eea,#764ba2);border-radius:12px;padding:16px;text-align:center;color:#fff}.help-card h4{font-size:14px;font-weight:600;margin:0 0 6px}.help-card p{font-size:12px;line-height:1.4;margin:0 0 12px;opacity:.9}.btn-contact-support{padding:8px 16px;border:1px solid rgba(255,255,255,.3);border-radius:6px;font-size:11px;font-weight:600;color:#fff;background:#ffffff1a;cursor:pointer;transition:all .2s ease;text-transform:uppercase;letter-spacing:.5px}.btn-contact-support:hover{background:#fff3;border-color:#fff6}.integrations-grid .integration-card{opacity:1;transform:none}@media (max-width: 768px){.integrations-panel{gap:16px}.integration-tabs{margin:0 12px}.category-buttons{gap:6px}.category-filter-btn{padding:5px 10px;font-size:11px}.integrations-grid{padding:0 12px}.integration-card{padding:12px}.integration-header{gap:10px;margin-bottom:10px}.integration-icon{width:36px;height:36px}.icon-symbol{font-size:18px}.integration-name{font-size:13px}.integration-category{font-size:10px}.integration-actions{flex-direction:column;gap:6px}.integrations-help{padding:0 12px 12px}}.form-area-style-button{position:relative;left:-30px;z-index:50;animation:fadeIn .3s ease;top:0}.form-area-style-button .style-button{background-color:#fff!important;border:1px solid #e5e7eb!important;box-shadow:0 1px 3px #0000001a,0 1px 2px #0000000f!important;border-radius:8px!important;padding:8px 12px!important;font-size:13px!important;font-weight:500!important;color:#374151!important;transition:all .2s ease!important;display:flex!important;align-items:center!important;gap:8px!important}.form-area-style-button .style-button:hover{background-color:#f9fafb;border-color:#d1d5db;box-shadow:0 4px 6px #0000001a,0 2px 4px #0000000f;transform:translateY(-1px)}.form-area-style-button .style-button.active{background-color:#3b82f6;border-color:#3b82f6;color:#fff;box-shadow:0 4px 6px #3b82f640}.form-area-style-button .style-button.active:hover{background-color:#2563eb;border-color:#2563eb;transform:translateY(-1px)}.form-area-style-button .button-icon{width:16px;height:16px;flex-shrink:0}@media (max-width: 768px){.form-area-style-button{top:16px;left:16px}.form-area-style-button .style-button{padding:6px 10px;font-size:12px;gap:6px}.form-area-style-button .button-icon{width:14px;height:14px}}.themes-grid-enhanced{display:flex;flex-direction:column;gap:8px}.theme-card-enhanced{cursor:pointer;border-radius:6px;overflow:hidden;transition:transform .1s ease,box-shadow .1s ease;box-shadow:0 1px 2px #0000000a;border:1px solid #e0e0e0!important}.theme-card-enhanced:hover{transform:translateY(-1px);box-shadow:0 2px 4px #0000000f}.theme-card-enhanced.selected{border:2px solid #3b82f6;box-shadow:0 4px 12px #3b82f626;transform:translateY(-1px);position:relative}.theme-card-enhanced.selected:after{content:"✓";position:absolute;top:8px;right:8px;background:#3b82f6;color:#fff;border-radius:50%;width:20px;height:20px;display:flex;align-items:center;justify-content:center;font-size:12px;font-weight:700;z-index:1}.theme-preview-enhanced{display:flex;flex-direction:column;height:90px}.theme-mockup{flex:1;display:flex;flex-direction:column;justify-content:space-between;padding:12px;box-sizing:border-box}.mockup-header{font-weight:600;font-size:14px;line-height:1.2;margin-bottom:6px}.mockup-content{display:flex;align-items:center;gap:6px}.mockup-field{flex:1;display:flex;align-items:center;gap:4px;padding:4px 8px;border-radius:4px;border:1px solid rgba(100,116,139,.2);font-size:11px;color:#94a3b8;background-color:#fff}.mockup-field.dark{background-color:#ffffff0d;border-color:#ffffff26;color:#ffffffb3}.mockup-icon{width:10px;height:10px;flex-shrink:0}.mockup-button{flex-shrink:0;width:20px;height:20px;border-radius:3px}.theme-info-enhanced{display:flex;justify-content:space-between;align-items:center;padding:8px 12px;background-color:#fff}.theme-name-enhanced{font-weight:500;font-size:12px;color:#334155}.theme-colors{display:flex;gap:3px}.color-dot{width:8px;height:8px;border-radius:50%;box-shadow:inset 0 0 0 1px #0000000f}.theme-card-enhanced.eco .mockup-field{background-color:#fff;border-color:#10b9814d;color:#6b7280}.theme-card-enhanced.eco .mockup-button{background-color:#064e3b}.theme-card-enhanced.dark .theme-info-enhanced{background-color:#0f172a}.theme-card-enhanced.dark .theme-name-enhanced,.theme-card-enhanced.dark .mockup-header{color:#f1f5f9}.theme-card-enhanced.dark .mockup-field{background-color:#ffffff12;border-color:#ffffff26;color:#fffc}.theme-card-enhanced.dark .mockup-button,.theme-card-enhanced.light .mockup-button{background-color:#3b82f6}.theme-card-enhanced.light,.theme-card-enhanced.eco{border:1px solid #e2e8f0}.themes-loading{display:flex;flex-direction:column;align-items:center;padding:40px 20px;color:#64748b;font-size:14px}.loading-spinner{width:24px;height:24px;border:2px solid #e2e8f0;border-top:2px solid #3b82f6;border-radius:50%;animation:spin 1s linear infinite;margin-bottom:12px}.error-message{font-size:12px;color:#f59e0b;margin-top:4px;font-style:italic}.form-builder-container,.form-preview,.form-editor-main{transition:background-color .3s ease,color .3s ease}.form-container-secondary .form-field,.form-editor-canvas .form-field,.form-builder-container .form-field,.form-preview .form-field,.form-editor-main .form-field{background-color:var(--input-background, transparent);color:var(--text-color, #1f2937);border-color:var(--border-color, #e5e7eb);transition:all .3s ease}.form-container-secondary .form-field input,.form-container-secondary .form-field textarea,.form-container-secondary .form-field select,.form-container-secondary .form-input,.form-editor-canvas .form-field input,.form-editor-canvas .form-field textarea,.form-editor-canvas .form-field select,.form-editor-canvas .form-input,.form-builder-container .form-field input,.form-preview .form-field input,.form-editor-main .form-field input,.form-builder-container .form-field textarea,.form-preview .form-field textarea,.form-editor-main .form-field textarea,.form-builder-container .form-field select,.form-preview .form-field select,.form-editor-main .form-field select{background-color:var(--input-background, transparent);color:var(--text-color, #1f2937);border-color:var(--border-color, #e5e7eb);font-family:var(--font-family, inherit)}.form-container-secondary .form-field label,.form-container-secondary .field-label,.form-editor-canvas .form-field label,.form-editor-canvas .field-label,.form-builder-container .form-field label,.form-preview .form-field label,.form-editor-main .form-field label,.form-container-secondary .form-title,.form-editor-canvas .form-title,.form-builder-container .form-title,.form-preview .form-title,.form-editor-main .form-title{color:var(--text-color, #1f2937);font-family:var(--font-family, inherit)}.form-container-secondary .form-description,.form-container-secondary .field-description,.form-editor-canvas .form-description,.form-editor-canvas .field-description,.form-builder-container .form-description,.form-preview .form-description,.form-editor-main .form-description{color:var(--text-color, #6b7280);font-family:var(--font-family, inherit)}.form-container-secondary .btn-primary,.form-container-secondary .submit-button,.form-editor-canvas .btn-primary,.form-editor-canvas .submit-button,.form-builder-container .btn-primary,.form-preview .btn-primary,.form-editor-main .btn-primary,.form-builder-container .submit-button,.form-preview .submit-button,.form-editor-main .submit-button{background-color:var(--primary-color, #3b82f6);border-color:var(--primary-color, #3b82f6);color:#fff;font-family:var(--font-family, inherit);border-radius:var(--border-radius, 8px)}.form-container-secondary .btn-primary:hover,.form-container-secondary .submit-button:hover,.form-editor-canvas .btn-primary:hover,.form-editor-canvas .submit-button:hover,.form-builder-container .btn-primary:hover,.form-preview .btn-primary:hover,.form-editor-main .btn-primary:hover,.form-builder-container .submit-button:hover,.form-preview .submit-button:hover,.form-editor-main .submit-button:hover{background-color:var(--primary-color, #2563eb);border-color:var(--primary-color, #2563eb)}.form-editor-canvas .form-field.selected,.form-editor-canvas .form-field-wrapper.selected{border-color:var(--primary-color, #3b82f6)}.form-editor-canvas .form-field h3,.form-editor-canvas h3.field-label{color:var(--text-color, #1f2937);font-family:var(--font-family, inherit)}.form-editor-canvas .form-field .field-description{color:var(--text-color, #6b7280);font-family:var(--font-family, inherit)}.form-container-secondary input[type=text],.form-container-secondary input[type=email],.form-container-secondary input[type=number],.form-container-secondary input[type=tel],.form-container-secondary textarea,.form-container-secondary select,.form-editor-canvas input[type=text],.form-editor-canvas input[type=email],.form-editor-canvas input[type=number],.form-editor-canvas input[type=tel],.form-editor-canvas textarea,.form-editor-canvas select{background-color:var(--input-background, transparent);color:var(--text-color, #1f2937);border:1px solid var(--border-color, #e5e7eb);border-radius:var(--border-radius, 6px);font-family:var(--font-family, inherit)}.form-container-secondary input[type=text]:focus,.form-container-secondary input[type=email]:focus,.form-container-secondary input[type=number]:focus,.form-container-secondary input[type=tel]:focus,.form-container-secondary textarea:focus,.form-container-secondary select:focus,.form-editor-canvas input[type=text]:focus,.form-editor-canvas input[type=email]:focus,.form-editor-canvas input[type=number]:focus,.form-editor-canvas input[type=tel]:focus,.form-editor-canvas textarea:focus,.form-editor-canvas select:focus{border-color:var(--primary-color, #3b82f6);box-shadow:0 0 0 3px #3b82f61a}.form-editor-canvas .choice-option,.form-editor-canvas .radio-option,.form-editor-canvas .checkbox-option{color:var(--text-color, #1f2937);font-family:var(--font-family, inherit)}.form-editor-canvas .choice-option:hover,.form-editor-canvas .radio-option:hover,.form-editor-canvas .checkbox-option:hover{background-color:var(--hover-color, #f3f4f6)}.form-editor-canvas .rating-star,.form-editor-canvas .opinion-scale-option{color:var(--primary-color, #3b82f6)}.form-editor-canvas .dropdown-select{background-color:var(--input-background, transparent);color:var(--text-color, #1f2937);border-color:var(--border-color, #e5e7eb);font-family:var(--font-family, inherit)}.form-container-secondary input::placeholder,.form-container-secondary textarea::placeholder,.form-editor-canvas input::placeholder,.form-editor-canvas textarea::placeholder{color:var(--placeholder-color, #9ca3af)}.form-container-secondary .heading-field h1,.form-container-secondary .heading-field h2,.form-container-secondary .heading-field h3,.form-editor-canvas .heading-field h1,.form-editor-canvas .heading-field h2,.form-editor-canvas .heading-field h3{color:var(--text-color, #1f2937);font-family:var(--font-family, inherit)}.form-container-secondary .paragraph-field p,.form-container-secondary .paragraph-field div,.form-editor-canvas .paragraph-field p,.form-editor-canvas .paragraph-field div{color:var(--text-color, #6b7280);font-family:var(--font-family, inherit)}.progress-bar-container{display:flex;align-items:center;justify-content:center;padding:12px 0;width:100%}.progress-bar-steps{display:flex;align-items:center;gap:0;width:100%}.progress-bar-step{display:flex;flex-direction:row;align-items:center;gap:8px;flex:0 0 auto}.progress-bar-indicator{width:28px;height:28px;border-radius:50%;border:3px solid #d1d5db;background-color:#fff;display:flex;align-items:center;justify-content:center;transition:all .2s ease;position:relative;z-index:2;flex-shrink:0}.progress-bar-indicator.active{border-color:#3b82f6;background-color:#fff}.progress-bar-indicator.active:after{content:"";width:14px;height:14px;border-radius:50%;background-color:#3b82f6}.progress-bar-indicator.completed{border-color:#3b82f6;background-color:#3b82f6}.progress-bar-step-label{font-size:14px;font-weight:400;color:#9ca3af;transition:color .2s ease;white-space:nowrap;flex-shrink:0}.progress-bar-step-label.active{color:#3b82f6;font-weight:600}.progress-bar-connector{flex:1;height:2px;background-color:#e5e7eb;margin:0 24px;transition:background-color .2s ease;min-width:60px}.progress-bar-modern{background:none;padding:0;border-radius:0;margin:16px 0}.progress-bar-modern .progress-bar-steps{background:none;border-radius:0;padding:0;box-shadow:none;display:flex;align-items:flex-start;gap:0}.progress-bar-modern .progress-bar-step{display:flex;flex-direction:column;align-items:center;gap:12px;flex:1;position:relative}.progress-bar-modern .progress-bar-indicator{width:40px;height:40px;border-radius:12px;border:2px solid #D0D0D0;background-color:#fff;display:flex;align-items:center;justify-content:center;transition:all .2s ease;position:relative;z-index:2;flex-shrink:0}.progress-bar-modern .progress-bar-indicator:after{content:"";width:15px;height:15px;border-radius:4px;background-color:#e0e0e0;position:absolute}.progress-bar-modern .progress-bar-indicator.active{background-color:#20c997;border-radius:12px;width:40px;height:40px;border:none;box-shadow:0 0 0 4px #20c99733}.progress-bar-modern .progress-bar-indicator.active:after{width:15px;height:15px;border-radius:4px;background-color:#fff}.progress-bar-modern .progress-bar-indicator.completed{background-color:#20c997;border-radius:12px;border:none}.progress-bar-modern .progress-bar-indicator.completed:after{content:"";width:20px;height:20px;background-color:transparent;background-image:url("data:image/svg+xml,%3Csvg width='20' height='20' viewBox='0 0 20 20' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M16.6667 5L7.5 14.1667L3.33333 10' stroke='%23FFFFFF' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");background-size:contain;background-repeat:no-repeat;background-position:center;border-radius:0}.progress-bar-modern .progress-bar-step-label{font-size:14px;font-weight:700;color:#000;transition:color .2s ease;white-space:nowrap;text-align:center;line-height:1.4}.progress-bar-modern .progress-bar-step-label.active{color:#000;font-weight:700}.progress-bar-modern .progress-bar-connector{flex:1;height:2px;background-color:#d0d0d0;background-image:repeating-linear-gradient(to right,#D0D0D0 0px,#D0D0D0 4px,transparent 4px,transparent 8px);margin:20px 12px auto;align-self:flex-start;transition:background-color .2s ease;z-index:1;position:relative;min-width:40px}.progress-bar-modern .progress-bar-step{position:relative}.progress-bar-modern .progress-bar-step.completed+.progress-bar-connector{background-color:#20c997;background-image:none}.progress-bar-wrapper{position:relative}.progress-bar-wrapper .drag-handle,.progress-bar-wrapper .block-actions{display:none}.progress-bar-editor .property-editor-header{display:flex;align-items:center;gap:12px;padding:16px;border-bottom:1px solid #e5e7eb}.progress-bar-editor .property-editor-icon{width:32px;height:32px;border-radius:6px;background-color:#8b5cf61a;display:flex;align-items:center;justify-content:center;color:#8b5cf6}.progress-bar-editor .property-editor-header h3{flex:1;margin:0;font-size:16px;font-weight:600;color:#111827}.progress-bar-editor .property-editor-close{width:24px;height:24px;border:none;background:none;cursor:pointer;color:#6b7280;padding:0;display:flex;align-items:center;justify-content:center}.progress-bar-editor .property-editor-close:hover{color:#111827}.progress-bar-editor .required-asterisk{color:#ef4444;margin-left:4px}.progress-bar-steps-input{display:flex;flex-direction:column;gap:12px;margin-bottom:16px}.progress-bar-step-input-row{position:relative;display:flex;align-items:center;gap:8px;transition:all .15s ease;cursor:default}.progress-bar-step-input-row[draggable=true]{cursor:move}.progress-bar-step-input-row.dragging{opacity:.4}.progress-bar-step-input-row.drag-over .progress-bar-step-input{border-color:#3b82f6;box-shadow:0 0 0 3px #3b82f614}.progress-step-reorder-btn{display:flex;align-items:center;justify-content:center;width:36px;height:36px;min-width:36px;color:#9ca3af;cursor:grab;flex-shrink:0;transition:all .15s ease;border-radius:8px;background:transparent;border:none;padding:0;user-select:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;pointer-events:auto}.progress-step-reorder-btn:active{cursor:grabbing}.progress-step-reorder-btn:hover{color:#6b7280;cursor:grab;background:#f3f4f6}.progress-bar-step-input-row.dragging .progress-step-reorder-btn{cursor:grabbing;color:#6b7280;background:#f3f4f6}.progress-step-reorder-btn svg{width:14px;height:14px;pointer-events:none}.progress-bar-step-input{flex:1;padding:10px 14px;border:1px solid #e5e7eb;border-radius:8px;font-size:14px;transition:all .15s ease;background:#fff;color:#111827;cursor:text;font-weight:400}.progress-bar-step-input:hover{border-color:#d1d5db}.progress-bar-step-input:focus{outline:none;border-color:#3b82f6;box-shadow:0 0 0 3px #3b82f614}.progress-bar-step-delete-btn{width:36px;height:36px;min-width:36px;border:none;border-radius:8px;background:transparent;color:#9ca3af;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .15s ease;flex-shrink:0;padding:0}.progress-bar-step-delete-btn:hover{background:#fef2f2;color:#ef4444}.progress-bar-step-delete-btn .delete-icon{width:18px;height:18px}.progress-bar-add-step-btn{display:inline-flex;align-items:center;gap:6px;padding:0;border:none;border-radius:6px;background:none;color:#3b82f6;font-size:14px;font-weight:500;cursor:pointer;transition:all .15s ease;margin-top:4px}.progress-bar-add-step-btn:hover{color:#2563eb}.progress-bar-add-step-btn .add-icon{width:16px;height:16px}.progress-bar-current-progress-select,.progress-bar-style-select{width:100%;padding:10px 14px;border:1px solid #e5e7eb;border-radius:8px;font-size:14px;background:#fff;color:#111827;transition:all .15s ease;font-weight:400}.progress-bar-current-progress-select:hover,.progress-bar-style-select:hover{border-color:#d1d5db}.progress-bar-current-progress-select:focus,.progress-bar-style-select:focus{outline:none;border-color:#3b82f6;box-shadow:0 0 0 3px #3b82f614}.property-help-icon{margin-left:4px;display:inline-flex;align-items:center;color:#9ca3af;cursor:help}.color-input-group{display:flex;align-items:center;gap:12px}.color-picker-input{width:52px;height:40px;border:1px solid #e5e7eb;border-radius:8px;cursor:pointer;padding:4px;transition:all .15s ease}.color-picker-input:hover{border-color:#d1d5db}.color-display{width:28px;height:28px;border-radius:6px;border:1px solid #e5e7eb}.remove-progress-bar-btn{width:100%;padding:10px 16px;border:1px solid #e5e7eb;border-radius:8px;background:#fff;color:#6b7280;font-size:14px;font-weight:500;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:8px;transition:all .15s ease;margin-top:8px}.remove-progress-bar-btn:hover{background:#fef2f2;border-color:#fca5a5;color:#ef4444}.remove-progress-bar-btn .delete-icon{width:18px;height:18px}.progress-bar-page-mapping-simple{display:flex;flex-direction:column;gap:12px;margin-top:8px}.step-page-mapping-row{display:flex;align-items:center;gap:12px;padding:12px;background:#f9fafb;border:1px solid #e5e7eb;border-radius:8px;transition:all .15s ease}.step-page-mapping-row:hover{background:#f3f4f6;border-color:#d1d5db}.step-mapping-label{display:flex;align-items:center;gap:10px;min-width:180px;flex-shrink:0}.step-number-badge{display:flex;align-items:center;justify-content:center;width:28px;height:28px;border-radius:6px;background:#3b82f6;color:#fff;font-size:13px;font-weight:600;flex-shrink:0}.step-name-text{font-size:14px;font-weight:500;color:#111827;flex:1}.step-page-select{flex:1;padding:8px 12px;border:1px solid #d1d5db;border-radius:6px;font-size:14px;background:#fff;color:#111827;cursor:pointer;transition:all .15s ease;min-width:125px}.step-page-select:hover{border-color:#9ca3af}.step-page-select:focus{outline:none;border-color:#3b82f6;box-shadow:0 0 0 3px #3b82f61a}.form-container-secondary .banner-field,.form-editor-canvas .banner-field{background-color:var(--input-background, transparent);border-color:var(--border-color, #e5e7eb);color:var(--text-color, #1f2937);font-family:var(--font-family, inherit)}.form-container-secondary .email-field input,.form-container-secondary .short-answer-field input,.form-container-secondary .long-answer-field textarea,.form-container-secondary .number-field input,.form-container-secondary .currency-field input,.form-container-secondary .phone-field input,.form-editor-canvas .email-field input,.form-editor-canvas .short-answer-field input,.form-editor-canvas .long-answer-field textarea,.form-editor-canvas .number-field input,.form-editor-canvas .currency-field input,.form-editor-canvas .phone-field input{background-color:var(--input-background, transparent);color:var(--text-color, #1f2937);border-color:var(--border-color, #e5e7eb);font-family:var(--font-family, inherit)}.form-container-secondary .checkbox-field .checkbox-option,.form-container-secondary .radio-field .radio-option,.form-editor-canvas .checkbox-field .checkbox-option,.form-editor-canvas .radio-field .radio-option{color:var(--text-color, #1f2937);font-family:var(--font-family, inherit)}.form-container-secondary .checkbox-field .checkbox-option:hover,.form-container-secondary .radio-field .radio-option:hover,.form-editor-canvas .checkbox-field .checkbox-option:hover,.form-editor-canvas .radio-field .radio-option:hover{background-color:var(--hover-color, #f3f4f6)}.form-container-secondary .dropdown-field select,.form-container-secondary .dropdown-field .dropdown-select,.form-editor-canvas .dropdown-field select,.form-editor-canvas .dropdown-field .dropdown-select{background-color:var(--input-background, transparent);color:var(--text-color, #1f2937);border-color:var(--border-color, #e5e7eb);font-family:var(--font-family, inherit)}.multiselect-field,.switch-field{position:relative}.switch-field-container{display:flex;flex-direction:column;gap:8px}.switch-container{display:flex;align-items:center;margin-top:8px}.switch-label{display:flex;align-items:center;cursor:pointer;-webkit-user-select:none;user-select:none}.switch-input{position:absolute;opacity:0;width:0;height:0}.switch-slider{position:relative;width:48px;height:24px;background-color:#e5e7eb;border-radius:12px;transition:background-color .2s ease;cursor:pointer}.switch-slider:before{content:"";position:absolute;top:2px;left:2px;width:20px;height:20px;background-color:#fff;border-radius:50%;transition:transform .2s ease;box-shadow:0 1px 3px #0000001a}.switch-input:checked+.switch-slider{background-color:#3b82f6}.switch-input:checked+.switch-slider:before{transform:translate(24px)}.switch-input:focus+.switch-slider{box-shadow:0 0 0 2px #3b82f633}.switch-default-container{margin-top:8px}.switch-default-label{display:flex;align-items:center;cursor:pointer;-webkit-user-select:none;user-select:none}.switch-default-label input[type=checkbox]{margin-right:8px}.switch-default-text{font-size:14px;color:#374151}.multiselect-container{position:relative;width:100%}.multiselect-input-wrapper{display:flex;flex-wrap:wrap;align-items:center;min-height:40px;padding:8px 12px;border:1px solid #d1d5db;border-radius:6px;background-color:#fff;transition:border-color .2s ease,box-shadow .2s ease;cursor:text}.multiselect-input-wrapper:focus-within{border-color:#3b82f6;box-shadow:0 0 0 2px #3b82f61a}.selected-badges{display:flex;flex-wrap:wrap;gap:4px;margin-right:8px}.selected-badge{display:flex;align-items:center;background-color:#3b82f6;color:#fff;padding:4px 8px;border-radius:4px;font-size:12px;font-weight:500}.badge-text{margin-right:4px}.remove-badge-btn{background:none;border:none;color:#fff;cursor:pointer;padding:0;margin:0;display:flex;align-items:center;justify-content:center;width:16px;height:16px;border-radius:50%;transition:background-color .2s ease}.remove-badge-btn:hover{background-color:#fff3}.remove-icon{width:12px;height:12px}.multiselect-input{flex:1;border:none;outline:none;background:transparent;font-size:14px;color:#111827;min-width:120px}.multiselect-input::placeholder{color:#9ca3af}.dropdown-arrow{background:none;border:none;cursor:pointer;padding:4px;display:flex;align-items:center;justify-content:center;color:#6b7280;transition:color .2s ease}.dropdown-arrow:hover{color:#374151}.arrow-icon{width:16px;height:16px;transition:transform .2s ease}.arrow-icon.open{transform:rotate(180deg)}.multiselect-dropdown{position:absolute;top:100%;left:0;right:0;background:#fff;border:1px solid #d1d5db;border-top:none;border-radius:0 0 6px 6px;box-shadow:0 4px 6px -1px #0000001a;max-height:200px;overflow-y:auto;z-index:1000}.multiselect-option{padding:8px 12px;cursor:pointer;font-size:14px;color:#111827;transition:background-color .2s ease}.multiselect-option:hover{background-color:#f3f4f6}.no-options-message{padding:8px 12px;font-size:14px;color:#6b7280;text-align:center;font-style:italic}.multiselect-options.editable{margin-top:8px;background:transparent}.multiselect-option.editable{display:flex;align-items:center;padding:12px 16px;background-color:#fff;border:1px solid #e0e0e0;border-radius:6px;margin-bottom:8px;cursor:default;transition:background-color .2s}.multiselect-option.editable:hover{background-color:#f7fafc}.multiselect-option.editable .option-input{flex:1;border:none;background:transparent;font-size:14px;color:#1a202c;padding:0;margin:0 8px;outline:none;width:100%}.checkbox-button{margin-right:8px;flex-shrink:0}.checkbox-button input[type=checkbox]{width:16px;height:16px;cursor:default}.multiselect-add-option,.multiselect-add-bulk-option{padding:10px 16px;text-align:center;color:#4f46e5;font-size:14px;font-weight:500;cursor:pointer;background-color:#f3f4f6;border-radius:6px;margin-bottom:8px;transition:background-color .2s}.multiselect-add-bulk-option{margin-bottom:0}.multiselect-add-option:hover,.multiselect-add-bulk-option:hover{background-color:#e5e7eb}.modal-content{background:#fff;border-radius:8px;width:90%;max-width:500px;max-height:80vh;overflow:hidden;box-shadow:0 20px 25px -5px #0000001a}.modal-header{display:flex;justify-content:space-between;align-items:center;padding:16px 20px;border-bottom:1px solid #e5e7eb}.modal-header h3{margin:0;font-size:18px;font-weight:600}.modal-close-btn{background:none;border:none;font-size:24px;cursor:pointer;color:#6b7280;padding:4px;border-radius:4px;transition:color .2s ease}.modal-close-btn:hover{color:#374151}.modal-body{padding:20px}.modal-body p{margin:0 0 12px;color:#374151;font-size:14px}.bulk-options-textarea{width:100%;min-height:200px;padding:12px;border:1px solid #d1d5db;border-radius:6px;font-family:inherit;font-size:14px;resize:vertical;outline:none;transition:border-color .2s ease}.bulk-options-textarea:focus{border-color:#3b82f6;box-shadow:0 0 0 2px #3b82f61a}.modal-footer{display:flex;justify-content:flex-end;gap:12px;padding:16px 20px;border-top:1px solid #e5e7eb;background-color:#f9fafb}.btn-secondary{background:#fff;border:1px solid #d1d5db;color:#374151;padding:8px 16px;border-radius:6px;font-size:14px;cursor:pointer;transition:all .2s ease}.btn-secondary:hover{background-color:#f9fafb;border-color:#9ca3af}.btn-primary{background:#3b82f6;border:1px solid #3b82f6;color:#fff;padding:8px 16px;border-radius:6px;font-size:14px;cursor:pointer;transition:all .2s ease}.btn-primary:hover{background:#2563eb;border-color:#2563eb}.preview-multiselect{width:100%}.preview-multiselect .multiselect-container{border:1px solid #d1d5db;border-radius:6px;background:#fff}.preview-multiselect .multiselect-input-wrapper{border:none;padding:8px 12px}.preview-multiselect .selected-badge{background-color:#3b82f6;color:#fff}.preview-multiselect .multiselect-input{color:#111827}.preview-multiselect .multiselect-input::placeholder{color:#9ca3af}.option-input-group{display:flex;gap:8px;margin-bottom:12px}.option-input{flex:1;padding:8px 12px;border:1px solid #d1d5db;border-radius:6px;font-size:14px}.option-input:focus{outline:none;border-color:#3b82f6;box-shadow:0 0 0 2px #3b82f61a}.add-option-btn{padding:8px 12px;background-color:#3b82f6;color:#fff;border:none;border-radius:6px;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:background-color .2s ease}.add-option-btn:hover:not(:disabled){background-color:#2563eb}.add-option-btn:disabled{background-color:#9ca3af;cursor:not-allowed}.add-icon{width:16px;height:16px}.bulk-options-group{margin-bottom:16px}.bulk-options-textarea{width:100%;padding:8px 12px;border:1px solid #d1d5db;border-radius:6px;font-size:14px;resize:vertical;margin-bottom:8px}.bulk-options-textarea:focus{outline:none;border-color:#3b82f6;box-shadow:0 0 0 2px #3b82f61a}.bulk-add-btn{padding:8px 16px;background-color:#10b981;color:#fff;border:none;border-radius:6px;cursor:pointer;font-size:14px;transition:background-color .2s ease}.bulk-add-btn:hover:not(:disabled){background-color:#059669}.bulk-add-btn:disabled{background-color:#9ca3af;cursor:not-allowed}.options-list{max-height:200px;overflow-y:auto;border:1px solid #e5e7eb;border-radius:6px;padding:8px}.option-item{display:flex;align-items:center;gap:8px;padding:4px 0}.option-value-input{flex:1;padding:4px 8px;border:1px solid #d1d5db;border-radius:4px;font-size:14px}.option-value-input:focus{outline:none;border-color:#3b82f6;box-shadow:0 0 0 1px #3b82f61a}.remove-option-btn{background:none;border:none;color:#ef4444;cursor:pointer;padding:4px;display:flex;align-items:center;justify-content:center;border-radius:4px;transition:background-color .2s ease}.remove-option-btn:hover{background-color:#fef2f2}.remove-icon{width:14px;height:14px}.no-options-message{text-align:center;color:#6b7280;font-style:italic;padding:16px;font-size:14px}.form-editor-canvas .opinion-scale-field .scale-option{color:var(--text-color, #1f2937);font-family:var(--font-family, inherit)}.form-editor-canvas .opinion-scale-field .scale-option.selected,.form-editor-canvas .opinion-scale-field .scale-option:hover{background-color:var(--primary-color, #3b82f6);color:#fff}.form-editor-canvas .star-rating-field .star{color:var(--primary-color, #3b82f6)}.form-editor-canvas .slider-field .slider-track{background-color:var(--border-color, #e5e7eb)}.form-editor-canvas .slider-field .slider-thumb{background-color:var(--primary-color, #3b82f6)}.form-editor-canvas .date-picker-field input,.form-editor-canvas .time-picker-field input,.form-editor-canvas .datetime-picker-field input,.form-editor-canvas .legal-field{background-color:var(--input-background, transparent);color:var(--text-color, #1f2937);border-color:var(--border-color, #e5e7eb);font-family:var(--font-family, inherit)}.form-editor-canvas .file-upload-field{background-color:var(--input-background, transparent);border-color:var(--border-color, #e5e7eb);color:var(--text-color, #1f2937);font-family:var(--font-family, inherit)}.form-editor-canvas .signature-field{background-color:var(--input-background, transparent);border-color:var(--border-color, #e5e7eb);font-family:var(--font-family, inherit)}.form-editor-canvas .address-field input,.form-editor-canvas .address-field select{background-color:var(--input-background, transparent);color:var(--text-color, #1f2937);border-color:var(--border-color, #e5e7eb);font-family:var(--font-family, inherit)}.form-editor-canvas .picture-choice-field .picture-option{border-color:var(--border-color, #e5e7eb);font-family:var(--font-family, inherit)}.form-editor-canvas .picture-choice-field .picture-option:hover{border-color:var(--primary-color, #3b82f6)}.form-editor-canvas .picture-choice-field .picture-option.selected{border-color:var(--primary-color, #3b82f6);background-color:#3b82f61a}.form-editor-canvas .ranking-field .ranking-item{background-color:var(--input-background, transparent);color:var(--text-color, #1f2937);border-color:var(--border-color, #e5e7eb);font-family:var(--font-family, inherit)}.form-editor-canvas .ranking-field .ranking-item:hover{background-color:var(--hover-color, #f3f4f6)}.form-editor-canvas .choice-matrix-field .matrix-cell{border-color:var(--border-color, #e5e7eb);color:var(--text-color, #1f2937);font-family:var(--font-family, inherit)}.form-editor-canvas .choice-matrix-field .matrix-cell:hover{background-color:var(--hover-color, #f3f4f6)}.form-editor-canvas .choice-matrix-field .matrix-cell.selected{background-color:var(--primary-color, #3b82f6);color:#fff}.form-container-secondary{transition:background .3s ease,color .3s ease}.form-container-secondary input,.form-container-secondary textarea,.form-container-secondary select,.form-container-secondary .form-field{transition:background-color .3s ease,color .3s ease,border-color .3s ease}.form-container-secondary.theme-changing{opacity:.8;transform:scale(.99);transition:opacity .15s ease,transform .15s ease}.theme-card-enhanced.selected{border:2px solid var(--primary-color, #3b82f6)!important;box-shadow:0 0 0 4px #3b82f61a!important}.theme-card-enhanced.selected:after{content:"✓";position:absolute;top:8px;right:8px;background:var(--primary-color, #3b82f6);color:#fff;width:20px;height:20px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:12px;font-weight:700}.form-container-secondary,.form-builder-container,.form-preview,.form-editor-main{background-color:var(--background-color, transparent);color:var(--text-color, #1f2937);font-family:var(--font-family, inherit);transition:all .3s ease}.navbar-button-group{display:flex;align-items:center;gap:8px}.navbar-icon-btn{display:flex;align-items:center;justify-content:center;width:40px;height:40px;padding:0;background:transparent;border:none;border-radius:8px;cursor:pointer;color:#666;transition:all .2s ease}.navbar-icon-btn:hover{background-color:#e8e8e8;color:#333;border-color:#b0b0b0}.navbar-icon-btn:active{background-color:#f5f5f5;color:#333}.navbar-icon-btn:disabled{opacity:.5;cursor:not-allowed}.navbar-icon{width:20px;height:20px}.navbar-avatar-btn{display:flex;align-items:center;justify-content:center;width:40px;height:40px;padding:0;background:transparent;border:none;border-radius:8px;cursor:pointer;position:relative;transition:all .2s ease}.navbar-avatar-btn:hover{background-color:#e8e8e8;border-color:#b0b0b0}.navbar-avatar-btn:active{background-color:#f5f5f5}.avatar-container{position:relative;width:32px;height:32px}.user-avatar{width:32px;height:32px;border-radius:50%;overflow:hidden;background-color:#e5e7eb;border:1px solid #f3f4f6}.avatar-img{width:100%;height:100%;object-fit:cover}.plus-icon-overlay{position:absolute;bottom:-2px;right:-2px;width:16px;height:16px;background:#fff;border:1.5px solid #ffffff;border-radius:50%;display:flex;align-items:center;justify-content:center;box-shadow:0 1px 3px #0000001a}.plus-icon{width:10px;height:10px;color:#9ca3af}.navbar-preview-btn{display:flex;align-items:center;justify-content:center;height:40px;padding:0 16px;background:#fff;border:1px solid #d0d0d0;border-radius:8px;cursor:pointer;font-size:14px;font-weight:500;color:#333;transition:all .2s ease;box-shadow:0 1px 2px #0000000d;margin-left:8px}.navbar-preview-btn:hover{background-color:#e8e8e8;border-color:#b0b0b0;color:#333;box-shadow:0 1px 3px #0000001a}.navbar-preview-btn:active{background-color:#f5f5f5;border-color:#b0b0b0;box-shadow:0 1px 2px #0000000d}.navbar-publish-btn{display:flex;align-items:center;justify-content:center;height:40px;padding:0 16px;background:#1f2937;border:none;border-radius:8px;cursor:pointer;font-size:14px;font-weight:500;color:#fff;transition:all .2s ease;box-shadow:0 1px 3px #1f29374d;gap:8px;margin-left:4px}.navbar-publish-btn:hover{background:#111827;box-shadow:0 2px 4px #1f293766;transform:translateY(-.5px)}.navbar-publish-btn:active{background:#0f172a;transform:translateY(0);box-shadow:0 1px 2px #1f29374d}.navbar-publish-btn:disabled{background:#9ca3af;cursor:not-allowed;transform:none;box-shadow:0 1px 2px #0000000d}.navbar-publish-btn.shared-state{background:#3b82f6;box-shadow:0 1px 3px #3b82f64d}.navbar-publish-btn.shared-state:hover{background:#3b82f6;box-shadow:0 1px 3px #3b82f64d;transform:none}.navbar-publish-btn.shared-state:disabled{background:#3b82f6;cursor:not-allowed;opacity:1;box-shadow:0 1px 3px #3b82f64d}.publish-icon{width:16px;height:16px}.navbar-save-indicator{display:flex;align-items:center;justify-content:center;width:40px;height:40px;padding:0;background:#fff;border:1px solid #d0d0d0;border-radius:8px;cursor:pointer;transition:all .2s ease}.navbar-save-indicator:hover{background-color:#e8e8e8;border-color:#b0b0b0}.navbar-save-indicator:active{background-color:#f5f5f5}.save-dot{width:8px;height:8px;border-radius:50%;transition:all .2s ease}.save-dot.unsaved{background-color:#f59e0b;animation:pulse-dot 2s ease-in-out infinite}.save-dot.error{background-color:#ef4444;animation:pulse-dot 2s ease-in-out infinite}@keyframes pulse-dot{0%,to{opacity:1;transform:scale(1)}50%{opacity:.5;transform:scale(1.2)}}@media (max-width: 1024px){.navbar-button-group{gap:6px}.navbar-icon-btn,.navbar-avatar-btn{width:36px;height:36px}.navbar-preview-btn,.navbar-share-btn{height:36px;padding:0 12px;font-size:13px}.avatar-container,.user-avatar{width:28px;height:28px}}@media (max-width: 768px){.navbar-button-group{gap:4px}.navbar-icon-btn,.navbar-avatar-btn{width:32px;height:32px}.navbar-preview-btn,.navbar-share-btn{height:32px;padding:0 10px;font-size:12px}.navbar-icon{width:18px;height:18px}.share-icon{width:14px;height:14px}}.block-sets-grid-canva{display:grid;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));gap:20px;padding:0;margin:0}.block-set-card-canva{background:#fff;border-radius:16px;border:1px solid #e5e7eb;padding:0;cursor:pointer;transition:all .3s cubic-bezier(.4,0,.2,1);overflow:hidden;box-shadow:0 1px 3px #0000000d;position:relative}.block-set-card-canva:hover{transform:translateY(-2px);box-shadow:0 8px 32px #0000001f;border-color:#d1d5db}.block-set-card-canva:active{transform:translateY(0);transition:all .15s cubic-bezier(.4,0,.2,1)}.block-set-preview-canva{display:flex;align-items:center;justify-content:space-between;padding:24px 24px 16px;background:linear-gradient(135deg,#f8fafc,#f1f5f9);border-bottom:1px solid #f1f5f9}.block-set-icon-container-canva{width:48px;height:48px;border-radius:12px;display:flex;align-items:center;justify-content:center;transition:all .2s ease}.block-set-card-canva:hover .block-set-icon-container-canva{transform:scale(1.05)}.block-set-icon-canva{width:24px;height:24px;stroke-width:1.5}.block-indicators-canva{display:flex;gap:6px;align-items:center}.block-dot-canva{width:8px;height:8px;border-radius:50%;background:#cbd5e1;transition:all .2s ease}.block-set-card-canva:hover .block-dot-canva{background:#94a3b8;transform:scale(1.1)}.block-set-card-canva:hover .block-dot-canva:nth-child(1){animation-delay:0ms}.block-set-card-canva:hover .block-dot-canva:nth-child(2){animation-delay:50ms}.block-set-card-canva:hover .block-dot-canva:nth-child(3){animation-delay:.1s}.block-set-card-canva:hover .block-dot-canva:nth-child(4){animation-delay:.15s}.block-set-card-canva:hover .block-dot-canva:nth-child(5){animation-delay:.2s}.block-set-content-canva{padding:20px 24px 24px}.block-set-header-canva{display:flex;align-items:flex-start;justify-content:space-between;margin-bottom:12px;gap:12px}.block-set-title-canva{font-size:16px;font-weight:600;color:#1f2937;margin:0;line-height:1.3;letter-spacing:-.01em}.block-count-badge-canva{background:#f3f4f6;color:#6b7280;font-size:12px;font-weight:500;padding:4px 8px;border-radius:6px;white-space:nowrap;flex-shrink:0}.block-set-description-canva{font-size:14px;color:#6b7280;line-height:1.5;margin:0 0 20px;font-weight:400}.btn-use-block-set-canva{display:inline-flex;align-items:center;gap:8px;background:#1f2937;color:#fff;border:none;border-radius:10px;padding:10px 16px;font-size:14px;font-weight:500;cursor:pointer;transition:all .2s cubic-bezier(.4,0,.2,1);position:relative;overflow:hidden;min-height:40px}.btn-use-block-set-canva:before{content:"";position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.2),transparent);transition:left .5s ease}.btn-use-block-set-canva:hover{background:#111827;transform:translateY(-1px);box-shadow:0 4px 12px #00000026}.btn-use-block-set-canva:hover:before{left:100%}.btn-use-block-set-canva:active{transform:translateY(0);transition:all .1s ease}.btn-text-canva{font-weight:500;letter-spacing:-.01em}.btn-icon-canva{width:16px;height:16px;stroke-width:2;transition:transform .2s ease}.btn-use-block-set-canva:hover .btn-icon-canva{transform:translate(2px)}@media (max-width: 1200px){.block-sets-grid-canva{grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:16px}}@media (max-width: 768px){.block-sets-grid-canva{grid-template-columns:1fr;gap:12px}.block-set-card-canva{border-radius:12px}.block-set-preview-canva{padding:20px 20px 14px}.block-set-content-canva{padding:16px 20px 20px}.block-set-title-canva{font-size:15px}.block-set-description-canva{font-size:13px;margin-bottom:16px}.btn-use-block-set-canva{width:100%;justify-content:center}}@keyframes blockDotPulse{0%,to{opacity:1;transform:scale(1)}50%{opacity:.7;transform:scale(1.1)}}.block-set-card-canva:hover .block-dot-canva{animation:blockDotPulse .6s ease-in-out}.coming-soon-message{text-align:center;padding:32px 20px;margin-top:24px;background:linear-gradient(135deg,#fef3c7,#fde68a);border-radius:12px;border:1px solid #f59e0b20}.coming-soon-message p{margin:0;font-size:14px;color:#92400e;font-weight:500}.fields-panel{height:100%;display:flex;flex-direction:column}.fields-panel .style-content{flex:1;overflow-y:auto;padding:0}.fields-panel .style-section{margin-top:0}.fields-panel .section-header{padding:20px 0 16px;border-bottom:1px solid #f1f5f9;margin-bottom:20px}.fields-panel .section-description{font-size:13px;color:#64748b;margin:4px 0 0;font-weight:400}.contact-preview{background:linear-gradient(135deg,#667eea,#764ba2);position:relative;overflow:hidden}.contact-preview:before{content:"";position:absolute;top:0;right:0;width:100%;height:100%;background:radial-gradient(circle at 70% 20%,rgba(255,255,255,.1) 0%,transparent 50%);pointer-events:none}.dashboard-visual{position:relative;width:100%;height:100%;display:flex;align-items:center;justify-content:center;padding:16px}.chart-container{position:relative;width:60%;height:100%;display:flex;align-items:center;justify-content:center}.contact-chart{display:flex;align-items:end;justify-content:space-between;width:100%;height:70%;gap:4px}.chart-bar{width:16px;border-radius:2px 2px 0 0;transition:all .3s ease;opacity:.9}.block-set-card-canva:hover .chart-bar{opacity:1;transform:scaleY(1.1)}.dashboard-info{position:absolute;right:16px;top:50%;transform:translateY(-50%);display:flex;flex-direction:column;align-items:center;gap:8px}.info-dot{width:8px;height:8px;border-radius:50%;background:#fffc}.info-dot.primary{background:#fff;box-shadow:0 0 8px #ffffff80}.info-line{width:2px;height:24px;background:#fff6;border-radius:1px}.lead-preview{background:linear-gradient(135deg,#11998e,#38ef7d);position:relative;overflow:hidden}.lead-preview:before{content:"";position:absolute;top:0;left:0;width:100%;height:100%;background:radial-gradient(circle at 30% 80%,rgba(255,255,255,.1) 0%,transparent 50%);pointer-events:none}.funnel-chart{position:relative;width:80%;height:60%;display:flex;flex-direction:column;justify-content:center;gap:3px}.funnel-level{height:8px;border-radius:4px;transition:all .3s ease;opacity:.9;margin:0 auto}.block-set-card-canva:hover .funnel-level{opacity:1;transform:scaleX(1.05)}.growth-arrow{position:absolute;right:10px;top:50%;transform:translateY(-50%);width:20px;height:20px}.arrow-path{width:100%;height:2px;background:#fffc;position:relative;border-radius:1px}.arrow-path:after{content:"";position:absolute;right:-4px;top:-3px;width:0;height:0;border-left:8px solid rgba(255,255,255,.8);border-top:4px solid transparent;border-bottom:4px solid transparent}.feedback-preview{background:linear-gradient(135deg,#667eea,#764ba2);position:relative;overflow:hidden}.feedback-preview:before{content:"";position:absolute;top:0;right:0;width:100%;height:100%;background:radial-gradient(circle at 80% 30%,rgba(255,255,255,.1) 0%,transparent 50%);pointer-events:none}.rating-display{display:flex;flex-direction:column;align-items:center;gap:8px;width:70%}.star-rating{display:flex;gap:2px}.star{font-size:16px;color:#fff6;transition:all .3s ease}.star.filled{color:gold;text-shadow:0 0 8px rgba(255,215,0,.5)}.rating-score{font-size:18px;font-weight:600;color:#fff;text-shadow:0 2px 4px rgba(0,0,0,.2)}.feedback-waves{position:absolute;right:12px;top:50%;transform:translateY(-50%);display:flex;gap:3px}.wave{width:3px;height:16px;background:#fff9;border-radius:2px;animation:wave-pulse 2s ease-in-out infinite}.wave:nth-child(2){animation-delay:.2s;height:20px}.wave:nth-child(3){animation-delay:.4s;height:12px}@keyframes wave-pulse{0%,to{opacity:.6;transform:scaleY(1)}50%{opacity:1;transform:scaleY(1.2)}}.newsletter-preview{background:linear-gradient(135deg,#4facfe,#00f2fe);position:relative;overflow:hidden}.newsletter-preview:before{content:"";position:absolute;top:0;left:0;width:100%;height:100%;background:radial-gradient(circle at 20% 70%,rgba(255,255,255,.1) 0%,transparent 50%);pointer-events:none}.growth-chart{position:relative;width:60%;height:70%;display:flex;align-items:center;justify-content:center}.growth-line{position:relative;width:100%;height:2px;display:flex;align-items:center}.line-segment{flex:1;height:2px;background:#fffc;margin:0 1px;border-radius:1px;transform-origin:left;animation:grow-line 2s ease-in-out infinite}.line-segment:nth-child(2){animation-delay:.2s}.line-segment:nth-child(3){animation-delay:.4s}.line-segment:nth-child(4){animation-delay:.6s}@keyframes grow-line{0%,to{transform:scaleX(1);opacity:.8}50%{transform:scaleX(1.1);opacity:1}}.growth-points{position:absolute;top:-4px;left:0;width:100%;display:flex;justify-content:space-between}.point{width:8px;height:8px;border-radius:50%;background:#fff;box-shadow:0 0 6px #ffffff80;animation:pulse-point 2s ease-in-out infinite}.point:nth-child(2){animation-delay:.2s}.point:nth-child(3){animation-delay:.4s}.point:nth-child(4){animation-delay:.6s}@keyframes pulse-point{0%,to{transform:scale(1);opacity:.8}50%{transform:scale(1.2);opacity:1}}.email-icon{position:absolute;right:16px;top:50%;transform:translateY(-50%)}.envelope{width:20px;height:14px;border:2px solid rgba(255,255,255,.8);border-radius:2px;position:relative;background:#ffffff1a}.envelope:before{content:"";position:absolute;top:-2px;left:0;width:0;height:0;border-left:10px solid transparent;border-right:10px solid transparent;border-bottom:8px solid rgba(255,255,255,.8)}.event-preview{background:linear-gradient(135deg,#fa709a,#fee140);position:relative;overflow:hidden}.event-preview:before{content:"";position:absolute;top:0;right:0;width:100%;height:100%;background:radial-gradient(circle at 60% 40%,rgba(255,255,255,.1) 0%,transparent 50%);pointer-events:none}.calendar-view{width:50%;height:70%;background:#fff3;border-radius:4px;padding:6px;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.calendar-header{width:100%;height:20%;background:#ffffff4d;border-radius:2px;margin-bottom:4px}.calendar-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:2px;height:70%}.calendar-cell{background:#fff3;border-radius:2px;transition:all .3s ease}.calendar-cell.active{background:#fffc;box-shadow:0 0 6px #ffffff80}.block-set-card-canva:hover .calendar-cell{background:#ffffff4d}.event-stats{position:absolute;right:12px;top:50%;transform:translateY(-50%);display:flex;flex-direction:column;align-items:center;gap:8px}.stat-circle{width:24px;height:24px;border-radius:50%;border:2px solid rgba(255,255,255,.6);position:relative;display:flex;align-items:center;justify-content:center}.circle-progress{width:12px;height:12px;border-radius:50%;background:#fffc;animation:pulse-circle 2s ease-in-out infinite}@keyframes pulse-circle{0%,to{transform:scale(1);opacity:.8}50%{transform:scale(1.2);opacity:1}}.stat-bars{display:flex;gap:2px;align-items:end}.stat-bar{width:4px;background:#ffffffb3;border-radius:2px;animation:stat-bar-grow 2s ease-in-out infinite}.stat-bar:nth-child(1){height:12px;animation-delay:.1s}.stat-bar:nth-child(2){height:18px;animation-delay:.3s}@keyframes stat-bar-grow{0%,to{transform:scaleY(1);opacity:.7}50%{transform:scaleY(1.1);opacity:1}}.block-set-card-canva:hover .dashboard-visual{transform:scale(1.02);transition:transform .3s ease}.block-set-card-canva:hover .star.filled{animation:star-twinkle 1s ease-in-out infinite}@keyframes star-twinkle{0%,to{opacity:1}50%{opacity:.7}}@media (max-width: 768px){.dashboard-visual{padding:12px}.chart-bar{width:12px}.star{font-size:14px}.rating-score{font-size:16px}.calendar-view{width:60%}}.skeleton-preview{background:linear-gradient(90deg,#f0f0f0 25%,#e0e0e0,#f0f0f0 75%);background-size:200% 100%;animation:loading 1.5s infinite}.skeleton-animation{width:100%;height:100%;background:linear-gradient(90deg,#f0f0f0 25%,#e0e0e0,#f0f0f0 75%);background-size:200% 100%;animation:loading 1.5s infinite}.skeleton-title{height:16px;background:linear-gradient(90deg,#f0f0f0 25%,#e0e0e0,#f0f0f0 75%);background-size:200% 100%;animation:loading 1.5s infinite;border-radius:4px;width:70%;margin-bottom:8px}.skeleton-badge{height:14px;background:linear-gradient(90deg,#f0f0f0 25%,#e0e0e0,#f0f0f0 75%);background-size:200% 100%;animation:loading 1.5s infinite;border-radius:4px;width:40%}.skeleton-description{height:12px;background:linear-gradient(90deg,#f0f0f0 25%,#e0e0e0,#f0f0f0 75%);background-size:200% 100%;animation:loading 1.5s infinite;border-radius:4px;width:90%;margin:8px 0}.skeleton-button{height:32px;background:linear-gradient(90deg,#f0f0f0 25%,#e0e0e0,#f0f0f0 75%);background-size:200% 100%;animation:loading 1.5s infinite;border-radius:6px;width:100%}@keyframes loading{0%{background-position:200% 0}to{background-position:-200% 0}}.no-block-sets{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:40px 20px;text-align:center;color:#6b7280;grid-column:1 / -1}.no-block-sets .no-results-icon{font-size:48px;margin-bottom:16px;opacity:.6}.no-block-sets h4{margin:0 0 8px;font-size:16px;font-weight:600;color:#374151}.no-block-sets p{margin:0;font-size:14px;color:#6b7280}.category-icon-large{font-size:32px;margin-bottom:8px}.preview-indicators{display:flex;gap:4px;flex-wrap:wrap;justify-content:center}.field-indicator{width:8px;height:8px;border-radius:2px;opacity:.8}.field-indicator.more{width:auto;height:auto;padding:2px 4px;font-size:10px;font-weight:500;border-radius:4px;color:#fff;display:flex;align-items:center;justify-content:center;min-width:16px}.error-message{background:#fef2f2;border:1px solid #fecaca;color:#dc2626;padding:8px 12px;border-radius:6px;font-size:14px;margin-top:8px}.page-indicator{position:relative;display:flex;align-items:center;gap:4px;padding:8px 12px;border-radius:6px;background:#ffffffb3;border:1px solid rgba(0,0,0,.1);cursor:pointer;transition:all .2s ease;min-width:60px;justify-content:center}.page-indicator:hover{background:#ffffffe6;box-shadow:0 2px 4px #0000001a}.page-indicator.active{background:#3b82f6;color:#fff;border-color:#2563eb}.page-indicator.special{background:#f973161a;border-color:#f973164d;color:#ea580c}.page-indicator.special.active{background:#ea580c;color:#fff}.page-title{flex:1;text-align:center;font-size:14px;font-weight:500;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:120px}.page-title-input{flex:1;background:#fff;border:2px solid #3b82f6;border-radius:4px;padding:2px 6px;font-size:14px;font-weight:500;text-align:center;outline:none;min-width:60px;max-width:120px}.delete-page-btn{display:none;width:18px;height:18px;min-width:18px;min-height:18px;border-radius:50%;background:#ef4444e6;color:#fff;border:none;cursor:pointer;font-size:12px;font-weight:700;line-height:1;padding:0;flex-shrink:0;transition:all .2s ease;position:absolute;top:-6px;right:-6px;z-index:10}.delete-page-btn:hover{background:#dc2626;transform:scale(1.1)}.page-indicator:hover .delete-page-btn{display:flex;align-items:center;justify-content:center}.page-indicator.special .delete-page-btn{display:none!important}.page-indicator{cursor:grab;-webkit-user-select:none;user-select:none;transition:all .2s ease,transform .15s ease}.page-indicator:active{cursor:grabbing}.page-indicator.dragging{opacity:.4;cursor:grabbing;transform:scale(.95) rotate(2deg);box-shadow:0 8px 16px #00000040;z-index:1000}.page-indicator.drag-over{position:relative;transform:scale(1.05);background:linear-gradient(90deg,rgba(59,130,246,.15) 0%,transparent 100%)!important;border-left:4px solid #3b82f6;padding-left:12px;box-shadow:0 0 0 2px #3b82f64d,0 8px 20px #3b82f633,inset 0 0 20px #3b82f61a;animation:pulse-drag-enhanced .8s ease-in-out infinite}.page-indicator.drag-over:before{content:"";position:absolute;left:-12px;top:50%;transform:translateY(-50%);width:8px;height:8px;background:#3b82f6;border-radius:50%;box-shadow:0 0 8px #3b82f6cc;animation:pulse-dot .8s ease-in-out infinite}.page-indicator.drag-over:after{content:"";position:absolute;left:-8px;top:0;bottom:0;width:4px;background:linear-gradient(to bottom,transparent,rgba(59,130,246,.8) 20%,rgba(59,130,246,.8) 80%,transparent);animation:slide-indicator .8s ease-in-out infinite}@keyframes pulse-drag-enhanced{0%,to{border-left-color:#3b82f6;box-shadow:0 0 0 2px #3b82f64d,0 8px 20px #3b82f633,inset 0 0 20px #3b82f61a}50%{border-left-color:#60a5fa;box-shadow:0 0 0 3px #60a5fa66,0 12px 24px #3b82f64d,inset 0 0 30px #3b82f626}}@keyframes pulse-dot{0%,to{transform:translateY(-50%) scale(1);box-shadow:0 0 8px #3b82f6cc}50%{transform:translateY(-50%) scale(1.3);box-shadow:0 0 16px #3b82f6}}@keyframes slide-indicator{0%{opacity:.5;transform:translateY(-10px)}50%{opacity:1;transform:translateY(0)}to{opacity:.5;transform:translateY(10px)}}.page-indicator.dragging *{cursor:grabbing!important}.pages-navigation:has(.page-indicator.dragging) .page-indicator:not(.dragging){transition:all .2s ease}.pages-navigation:has(.page-indicator.dragging) .page-indicator:not(.dragging):hover{transform:translateY(-2px)}.add-page-btn{display:flex;align-items:center;gap:6px;padding:8px 12px;background:#ffffffb3;border:1px solid rgba(0,0,0,.1);border-radius:6px;color:#4b5563;font-size:14px;font-weight:500;cursor:pointer;transition:all .2s ease}.add-page-btn:hover{background:#ffffffe6;box-shadow:0 2px 4px #0000001a}.add-page-btn .add-icon{width:16px;height:16px}.logic-btn{display:flex;align-items:center;gap:6px;padding:8px 12px;background:#ffffffb3;border:1px solid rgba(0,0,0,.1);border-radius:6px;color:#4b5563;font-size:14px;font-weight:500;cursor:pointer;transition:all .2s ease;margin-left:auto}.logic-btn:hover{background:#ffffffe6;box-shadow:0 2px 4px #0000001a}.logic-btn .logic-icon{width:16px;height:16px}.pages-navigation{display:flex;align-items:center;gap:8px;padding:16px 24px;width:100%;overflow-x:auto;min-height:60px;transition:all .3s ease}.page-indicator.drag-over{margin-left:16px!important}.form-pages-footer:has(.page-indicator.dragging) .pages-navigation{box-shadow:0 4px 16px #3b82f626,0 0 0 2px #3b82f61a;background:#fffffffa}.form-pages-footer{position:sticky;bottom:0;z-index:0;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);transition:all .3s ease}@media (max-width: 768px){.pages-navigation{padding:12px 16px;gap:6px}.page-indicator{padding:6px 8px;min-width:50px}.page-title{font-size:12px;max-width:80px}.add-page-btn{padding:6px 8px;font-size:12px}.add-page-btn .add-icon{width:14px;height:14px}}:root{--navbar-text-primary: #333333;--navbar-text-secondary: #666666;--navbar-text-muted: #999999;--navbar-bg-hover: #e8e8e8;--navbar-bg-active: #f5f5f5;--navbar-border: #d0d0d0;--navbar-font-size: 14px;--navbar-font-weight: 500;--navbar-font-weight-bold: 600;--navbar-border-radius: 8px;--navbar-spacing: 8px;--navbar-transition: all .2s ease;--navbar-button-height: 36px;--navbar-button-padding-y: 8px;--navbar-button-padding-x: 16px}.top-bar{background:#f5f5f5!important;border-bottom:1px solid #e0e0e0!important;display:flex;align-items:center;justify-content:space-between;padding:0 24px!important;height:64px!important;position:relative;z-index:40}.auto-save-status{display:flex;align-items:center;gap:8px}.auto-save-message{font-size:12px;font-weight:500;transition:color .2s ease}.save-dot{width:8px;height:8px;border-radius:50%;transition:background-color .2s ease}.save-dot.unsaved{background-color:#f59e0b}.save-dot.saving{background-color:#3b82f6;animation:pulse 1.5s ease-in-out infinite}.save-dot.error{background-color:#ef4444}.save-dot.saved{background-color:#10b981}.top-bar-left{display:flex;align-items:center;gap:16px;flex:1;min-width:0}.home-icon{display:flex;align-items:center;justify-content:center;width:var(--navbar-button-height)!important;height:var(--navbar-button-height)!important;background:#fff;border-radius:var(--navbar-border-radius);border:1px solid var(--navbar-border);transition:var(--navbar-transition);box-sizing:border-box}.home-icon:hover{background:var(--navbar-bg-hover);border-color:#b0b0b0}.home-nav-icon{width:18px!important;height:18px!important;color:var(--navbar-text-primary)}.breadcrumbs{display:flex;align-items:center;gap:var(--navbar-spacing);min-width:0}.breadcrumb-item{color:var(--navbar-text-secondary)!important;text-decoration:none;font-size:var(--navbar-font-size)!important;font-weight:var(--navbar-font-weight)!important;transition:var(--navbar-transition);white-space:nowrap}.breadcrumb-item:hover{color:var(--navbar-text-primary)!important}.breadcrumb-separator{display:flex;align-items:center}.breadcrumb-chevron{width:16px!important;height:16px!important;color:var(--navbar-text-muted)}.breadcrumb-title-container{position:relative;min-width:0}.editable-title{color:var(--navbar-text-primary)!important;font-weight:var(--navbar-font-weight-bold)!important;font-size:var(--navbar-font-size)!important;outline:none;padding:6px 10px!important;border-radius:var(--navbar-border-radius)!important;transition:var(--navbar-transition)!important;max-width:300px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.editable-title:hover{background:var(--navbar-bg-hover)!important}.editable-title:focus{background:#fff!important;box-shadow:0 0 0 2px #3333!important;border:1px solid var(--navbar-border)}.tabs-container{display:flex!important;align-items:center;background:#ececec!important;border-radius:12px!important;padding:4px!important;border:1px solid var(--navbar-border)}.tab-item{padding:var(--navbar-button-padding-y) var(--navbar-button-padding-x)!important;height:var(--navbar-button-height)!important;display:flex;align-items:center;font-size:var(--navbar-font-size)!important;font-weight:var(--navbar-font-weight)!important;color:var(--navbar-text-secondary)!important;cursor:pointer;border-radius:var(--navbar-border-radius)!important;transition:var(--navbar-transition)!important;white-space:nowrap;box-sizing:border-box}.tab-item:hover{color:var(--navbar-text-primary)!important;background:var(--navbar-bg-hover)!important}.tab-item.active{color:#1f2937!important;background:#fff!important;box-shadow:0 2px 8px #0000001a!important;font-weight:var(--navbar-font-weight-bold)!important;border:1px solid var(--navbar-border)!important}.top-bar-actions{display:flex;align-items:center;gap:12px!important;flex:1;justify-content:flex-end}.secondary-actions{display:flex;align-items:center;gap:4px;background:#fff;border-radius:10px;padding:4px;border:1px solid var(--navbar-border)}.primary-actions{display:flex;align-items:center;gap:var(--navbar-spacing)}.button{display:flex!important;align-items:center!important;gap:6px!important;padding:var(--navbar-button-padding-y) var(--navbar-button-padding-x)!important;height:var(--navbar-button-height)!important;font-size:var(--navbar-font-size)!important;font-weight:var(--navbar-font-weight)!important;border-radius:var(--navbar-border-radius)!important;border:1px solid transparent!important;cursor:pointer;transition:var(--navbar-transition)!important;text-decoration:none;white-space:nowrap;box-sizing:border-box!important}.button-icon{width:16px!important;height:16px!important;flex-shrink:0}.button-icon-only{padding:var(--navbar-button-padding-y)!important;width:var(--navbar-button-height)!important;height:var(--navbar-button-height)!important;justify-content:center;box-sizing:border-box}.button-secondary{background:transparent!important;color:var(--navbar-text-secondary)!important;border-color:transparent!important;font-weight:var(--navbar-font-weight)!important}.button-secondary:hover{background:var(--navbar-bg-hover)!important;color:var(--navbar-text-primary)!important}.version-history-button{background:transparent!important;color:var(--navbar-text-secondary)!important;border-color:transparent!important;font-weight:var(--navbar-font-weight)!important}.version-history-button:hover{background:var(--navbar-bg-hover)!important;color:var(--navbar-text-primary)!important}.view-live-button{background:#10b98133!important;color:#10b981!important;border-color:#10b9814d!important;font-weight:var(--navbar-font-weight)!important;font-size:var(--navbar-font-size)!important}.view-live-button:hover{background:#10b981!important;color:#fff!important;transform:translateY(-1px);box-shadow:0 4px 12px #10b9814d}.preview-button{background:#ffffffe6!important;color:#374151!important;border-color:#ffffffe6!important;font-weight:var(--navbar-font-weight)!important;font-size:var(--navbar-font-size)!important}.preview-button:hover{background:#fff!important;color:#1f2937!important;transform:translateY(-1px);box-shadow:0 4px 12px #ffffff4d}.save-button{background:var(--navbar-bg-active)!important;color:var(--navbar-text-secondary)!important;border-color:var(--navbar-border)!important;font-size:var(--navbar-font-size)!important;font-weight:var(--navbar-font-weight)!important;padding:var(--navbar-button-padding-y) var(--navbar-button-padding-x)!important;height:var(--navbar-button-height)!important;box-sizing:border-box}.save-button:hover:not(:disabled){background:var(--navbar-bg-hover)!important;color:var(--navbar-text-primary)!important;border-color:#b0b0b0}.save-button:disabled{opacity:.6;cursor:not-allowed;transform:none}.publish-button{background:#3b82f6!important;color:#fff!important;border-color:#2563eb!important;font-weight:var(--navbar-font-weight-bold)!important;font-size:var(--navbar-font-size)!important;box-shadow:0 2px 8px #3b82f633!important}.publish-button:hover:not(:disabled){background:#2563eb!important;transform:translateY(-1px);box-shadow:0 6px 16px #3b82f666!important}.publish-button:disabled{opacity:.6;cursor:not-allowed;transform:none;box-shadow:0 2px 8px #3b82f61a!important}.title-change-confirmation{position:absolute;top:calc(100% + 8px)!important;left:0!important;background:#10b981!important;color:#fff!important;padding:6px 12px!important;border-radius:6px!important;font-size:12px!important;font-weight:500!important;white-space:nowrap;box-shadow:0 4px 12px #00000026!important;z-index:50}.version-history-wrapper{position:relative;display:inline-block}.version-history-panel{position:absolute;top:calc(100% + 8px);right:0;width:380px;max-height:450px;overflow-y:auto;background:#fff;border:1px solid #e5e7eb;border-radius:12px;box-shadow:0 20px 40px #0000001a;z-index:50;color:#374151}.version-history-header{display:flex;justify-content:space-between;align-items:center;padding:16px 20px;border-bottom:1px solid #f3f4f6;background:#f9fafb;border-radius:12px 12px 0 0}.version-history-header h3{margin:0;font-size:16px;font-weight:600;color:#1f2937}.close-panel-button{background:none;border:none;font-size:20px;line-height:1;color:#6b7280;cursor:pointer;padding:4px;border-radius:var(--navbar-border-radius);transition:var(--navbar-transition)}.close-panel-button:hover{color:#1f2937;background:#f3f4f6}.version-history-list{list-style:none;padding:0;margin:0}.version-item{display:flex;justify-content:space-between;align-items:center;padding:16px 20px;border-bottom:1px solid #f3f4f6;transition:background-color .15s ease-in-out}.version-item:last-child{border-bottom:none;border-radius:0 0 12px 12px}.version-item:hover{background-color:#f9fafb}.version-item.current-viewed-version{background-color:#eff6ff;border-left:4px solid #3b82f6;padding-left:16px}.version-item-details{display:flex;flex-direction:column;gap:4px}.version-number{font-size:14px;font-weight:600;color:#4b5563}.version-title{font-size:14px;color:#1f2937;font-weight:500}.version-status-badge{font-size:12px;font-weight:500;padding:4px 8px;border-radius:12px;display:inline-block;line-height:1.2}.status-live{background-color:#d1fae5;color:#065f46}.status-latest-draft{background-color:#dbeafe;color:#1e40af}.status-draft{background-color:#e0e7ff;color:#3730a3}.status-published,.status-archived-published{background-color:#e5e7eb;color:#4b5563}.status-unknown{background-color:#f3f4f6;color:#4b5563}.view-version-button{font-size:12px;padding:6px 12px;border:1px solid #d1d5db;background-color:#fff;color:#374151;border-radius:var(--navbar-border-radius);cursor:pointer;transition:var(--navbar-transition);font-weight:var(--navbar-font-weight)}.view-version-button:hover{background-color:#f9fafb;border-color:#9ca3af;transform:translateY(-1px);box-shadow:0 2px 8px #0000001a}.view-version-button:disabled{opacity:.7;cursor:not-allowed;transform:none}.version-history-loading,.version-history-empty{padding:24px;text-align:center;font-size:14px;color:#6b7280}.create-draft-from-version-button{margin-top:var(--navbar-spacing);margin-left:var(--navbar-spacing);font-size:var(--navbar-font-size);font-weight:var(--navbar-font-weight);padding:8px 16px;border-radius:var(--navbar-border-radius);transition:var(--navbar-transition)}.info-banner p{display:flex;align-items:center;flex-wrap:wrap}.loading-version-overlay{position:absolute;top:0;left:0;right:0;bottom:0;background-color:#ffffffe6;display:flex;justify-content:center;align-items:center;z-index:100;font-size:18px;color:#1f2937;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px)}.save-notification{position:fixed;top:20px;right:20px;background:linear-gradient(135deg,#10b981,#059669);color:#fff;padding:12px 16px;border-radius:10px;box-shadow:0 8px 24px #10b9814d;display:flex;align-items:center;gap:8px;font-size:14px;font-weight:500;z-index:1000;animation:slideInFade .3s ease-out;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.save-notification-icon{width:18px;height:18px;flex-shrink:0}.delete-notification{position:fixed;top:20px;right:20px;background:#fff;border:1px solid #e5e7eb;padding:12px 16px;border-radius:10px;box-shadow:0 8px 24px #0000001a;display:flex;align-items:center;gap:8px;font-size:14px;font-weight:500;z-index:1000;animation:slideInFade .3s ease-out;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.delete-notification-content{display:flex;align-items:center;gap:8px;flex:1}.delete-notification-icon{width:18px;height:18px;flex-shrink:0}.delete-notification-text{font-weight:500;color:#1f2937}.delete-notification-shortcut{color:#6b7280;font-size:12px}.delete-notification-undo{background:#3b82f6;color:#fff;border:none;border-radius:6px;padding:6px 12px;font-size:14px;font-weight:500;cursor:pointer;transition:all .2s ease}.delete-notification-undo:hover{background:#2563eb;transform:translateY(-1px)}.delete-notification-close{background:none;border:none;font-size:18px;line-height:1;color:#6b7280;cursor:pointer;padding:0;margin-left:4px;border-radius:4px;transition:all .2s ease}.delete-notification-close:hover{color:#1f2937;background:#f3f4f6}@keyframes slideInFade{0%{opacity:0;transform:translate(100%) translateY(-10px)}to{opacity:1;transform:translate(0) translateY(0)}}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}@media (max-width: 768px){:root{--navbar-font-size: 13px;--navbar-spacing: 6px;--navbar-button-height: 32px;--navbar-button-padding-y: 6px;--navbar-button-padding-x: 12px}.top-bar{padding:0 16px!important;height:56px!important;flex-wrap:wrap;gap:var(--navbar-spacing)}.top-bar-left{gap:12px}.breadcrumb-item{font-size:var(--navbar-font-size)!important}.editable-title{font-size:var(--navbar-font-size)!important;max-width:200px}.tabs-container{order:3;width:100%;justify-content:center;margin-top:var(--navbar-spacing)}.top-bar-actions{gap:var(--navbar-spacing)!important}.secondary-actions{gap:2px;padding:2px}.button-icon,.home-nav-icon{width:14px!important;height:14px!important}}.cover-image-modal{background:#fff;border-radius:12px;width:90vw;max-width:800px;max-height:85vh;box-shadow:0 25px 50px #00000040;display:flex;flex-direction:column;overflow:hidden;animation:modalSlideIn .3s ease-out}@keyframes modalSlideIn{0%{opacity:0;transform:scale(.95) translateY(-20px)}to{opacity:1;transform:scale(1) translateY(0)}}.cover-modal-header{display:flex;align-items:center;justify-content:space-between;padding:20px 24px 0;flex-shrink:0}.cover-modal-tabs{display:flex;gap:2px;background:#f3f4f6;border-radius:8px;padding:4px}.cover-tab{display:flex;align-items:center;gap:8px;padding:10px 16px;border:none;background:transparent;border-radius:6px;font-size:14px;font-weight:500;color:#6b7280;cursor:pointer;transition:all .2s ease}.cover-tab:hover{background:#e5e7eb;color:#374151}.cover-tab.active{background:#3b82f6;color:#fff;box-shadow:0 1px 3px #3b82f64d}.cover-tab svg{width:16px;height:16px}.modal-close-btn{background:none;border:none;padding:8px;border-radius:6px;cursor:pointer;color:#6b7280;transition:all .2s ease}.modal-close-btn:hover{background:#f3f4f6;color:#374151}.cover-modal-content{flex:1;padding:24px;overflow-y:auto;display:flex;flex-direction:column;gap:24px}.drag-drop-area{border:2px dashed #d1d5db;border-radius:12px;padding:48px 24px;text-align:center;background:#fafbfc;transition:all .2s ease;cursor:pointer}.drag-drop-area:hover,.drag-drop-area.dragging{border-color:#3b82f6;background:#eff6ff}.drag-drop-content{display:flex;flex-direction:column;align-items:center;gap:16px}.drag-drop-icon{color:#9ca3af}.drag-drop-area.dragging .drag-drop-icon{color:#3b82f6}.drag-drop-area.uploading{border-color:#3b82f6;background:#eff6ff;pointer-events:none}.upload-spinner{color:#3b82f6;animation:spin 1s linear infinite}.upload-progress-bar{width:200px;height:4px;background:#e5e7eb;border-radius:2px;overflow:hidden;margin-top:16px}.upload-progress-fill{height:100%;background:#3b82f6;border-radius:2px;transition:width .3s ease}.drag-drop-content p{font-size:16px;color:#6b7280;margin:0}.browse-link{background:none;border:none;color:#3b82f6;text-decoration:underline;cursor:pointer;font-size:inherit;padding:0}.browse-link:hover{color:#2563eb}.divider{display:flex;align-items:center;text-align:center;margin:16px 0}.divider:before,.divider:after{content:"";flex:1;height:1px;background:#e5e7eb}.divider span{padding:0 16px;color:#9ca3af;font-size:14px;font-weight:500;background:#fff}.gallery-section{flex:1;display:flex;flex-direction:column;gap:16px}.gallery-header{display:flex;align-items:center;justify-content:space-between;gap:16px}.gallery-header h3{font-size:18px;font-weight:600;color:#374151;margin:0}.search-container{position:relative;display:flex;align-items:center}.search-icon{position:absolute;left:12px;color:#9ca3af;pointer-events:none}.search-input{padding:10px 12px 10px 40px;border:1px solid #d1d5db;border-radius:8px;font-size:14px;color:#374151;background:#fff;outline:none;transition:border-color .2s ease;width:200px}.search-input:focus{border-color:#3b82f6;box-shadow:0 0 0 3px #3b82f61a}.image-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:16px;max-height:320px;overflow-y:auto;padding:12px;box-sizing:border-box}.image-item{position:relative;width:100%;height:0;padding-bottom:66.67%;border-radius:8px;overflow:hidden;cursor:pointer;border:2px solid transparent;background:#f8fafc;box-sizing:border-box;transition:all .2s ease}.image-item:hover{border-color:#3b82f6;box-shadow:0 4px 12px #00000026}.image-item img{position:absolute;top:0;left:0;width:100%;height:100%;object-fit:cover;display:block;transition:transform .2s ease;cursor:pointer}.image-remove-btn{position:absolute;top:8px;right:8px;width:28px;height:28px;background:#000000b3;border:none;border-radius:50%;color:#fff;cursor:pointer;display:flex;align-items:center;justify-content:center;opacity:0;transform:scale(.8);transition:all .2s ease;z-index:10;padding:0}.image-item:hover .image-remove-btn{opacity:1;transform:scale(1)}.image-remove-btn:hover{background:#ef4444e6;transform:scale(1.1)}.image-remove-btn svg{width:14px;height:14px}.tab-content{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:48px 24px;text-align:center;color:#6b7280}.link-input-container{display:flex;gap:12px;width:100%;max-width:500px}.link-input{flex:1;padding:12px 16px;border:1px solid #d1d5db;border-radius:8px;font-size:14px;color:#374151;background:#fff;outline:none;transition:border-color .2s ease}.link-input:focus{border-color:#3b82f6;box-shadow:0 0 0 3px #3b82f61a}.add-link-btn{padding:12px 20px;background:#3b82f6;border:none;border-radius:8px;color:#fff;font-size:14px;font-weight:600;cursor:pointer;transition:all .2s ease;white-space:nowrap}.add-link-btn:hover{background:#2563eb;transform:translateY(-1px);box-shadow:0 4px 12px #3b82f64d}.cover-modal-content::-webkit-scrollbar,.image-grid::-webkit-scrollbar{width:6px}.cover-modal-content::-webkit-scrollbar-track,.image-grid::-webkit-scrollbar-track{background:#f1f5f9;border-radius:3px}.cover-modal-content::-webkit-scrollbar-thumb,.image-grid::-webkit-scrollbar-thumb{background:#cbd5e1;border-radius:3px}.cover-modal-content::-webkit-scrollbar-thumb:hover,.image-grid::-webkit-scrollbar-thumb:hover{background:#94a3b8}@media (max-width: 768px){.cover-image-modal{width:95vw;max-height:90vh}.cover-modal-header{padding:16px 20px 0}.cover-modal-content{padding:20px}.gallery-header{flex-direction:column;align-items:stretch;gap:12px}.search-input{width:100%}.image-grid{grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:12px;max-height:280px;padding:8px;box-sizing:border-box}.link-input-container{flex-direction:column}.drag-drop-area{padding:32px 16px}}@keyframes imageLoad{0%{opacity:0;transform:scale(.95)}to{opacity:1;transform:scale(1)}}.logo-preview-section{display:flex;flex-direction:column;gap:24px;padding:20px 0}.preview-header{text-align:center}.preview-header h3{margin:0 0 8px;font-size:20px;font-weight:600;color:#1f2937}.preview-header p{margin:0;font-size:14px;color:#6b7280}.logo-preview-container{display:flex;gap:32px;align-items:flex-start;justify-content:center}.logo-preview-square{position:relative;width:200px;height:200px;border:2px solid #e5e7eb;border-radius:12px;overflow:hidden;background:#f9fafb}.logo-preview-image{width:100%;height:100%;object-fit:cover;-webkit-user-select:none;user-select:none;-webkit-user-drag:none;transition:none}.logo-preview-circle-indicator{position:absolute;top:50%;left:50%;pointer-events:auto;-webkit-user-select:none;user-select:none}.circle-frame{width:120px;height:120px;border:3px solid #3b82f6;border-radius:50%;background:#3b82f61a;box-shadow:0 0 0 2px #3b82f633}.logo-final-preview{display:flex;flex-direction:column;align-items:center;gap:12px}.final-preview-label{font-size:14px;font-weight:500;color:#6b7280}.logo-circular-preview{width:80px;height:80px;border-radius:50%;overflow:hidden;border:4px solid #ffffff;box-shadow:0 4px 12px #00000026;position:relative}.circular-crop-container{width:120px;height:120px;position:absolute;top:50%;left:50%;margin-left:-60px;margin-top:-60px;overflow:hidden;display:flex;align-items:center;justify-content:center}.logo-circular-image{position:absolute;top:50%;left:50%;margin-left:-100px;margin-top:-100px;object-fit:cover;flex-shrink:0}.preview-actions{display:flex;gap:16px;justify-content:center;align-items:center;padding-top:8px}.cancel-button,.save-button{display:inline-flex;align-items:center;justify-content:center;padding:12px 24px;min-height:44px;line-height:1;border-radius:12px;font-size:16px!important;font-weight:600!important;font-family:inherit;cursor:pointer;transition:all .2s ease;border:none;box-sizing:border-box}.cancel-button{background:var(--button-secondary-bg, var(--hover-color, #f3f4f6));color:var(--button-secondary-text, var(--text-color, #475569));border:1px solid var(--button-secondary-border, var(--border-color, #e2e8f0));font-size:16px!important;font-weight:600!important;font-family:inherit}.cancel-button:hover{background:var(--button-secondary-bg-hover, #e5e7eb);color:var(--button-secondary-text-hover, #374151);border-color:var(--button-secondary-border-hover, var(--border-color, #cbd5e1))}.save-button{background:var(--button-primary-bg, var(--primary-color, #3b82f6));color:var(--button-primary-text, #ffffff);border:1px solid var(--button-primary-border, var(--primary-color, #3b82f6));box-shadow:0 1px #00000005,inset 0 -1px #ffffff26;font-size:16px!important;font-weight:600!important;font-family:inherit}.save-button:hover{background:var(--button-primary-bg-hover, #2563eb);border-color:var(--button-primary-border-hover, #2563eb);transform:translateY(-1px);box-shadow:0 4px 12px #3b82f64d}.zoom-controls{display:flex;align-items:center;justify-content:center;gap:12px;margin-bottom:8px;padding:12px 16px;background:#f8fafc;border-radius:12px;border:1px solid #e2e8f0}.zoom-btn{display:flex;align-items:center;justify-content:center;width:40px;height:40px;border:1px solid #d1d5db;border-radius:8px;background:#fff;color:#334155;cursor:pointer;transition:all .2s ease;padding:0}.zoom-btn svg{width:18px;height:18px;display:block}.zoom-btn:hover:not(:disabled){background:#f3f4f6;border-color:#9ca3af;transform:translateY(-1px)}.zoom-btn:disabled{opacity:.5;cursor:not-allowed}.zoom-slider-container{display:flex;flex-direction:row;align-items:center;gap:10px}.zoom-slider{width:220px;height:6px;border-radius:2px;background:#e2e8f0;outline:none;-webkit-appearance:none;-moz-appearance:none;appearance:none;cursor:pointer}.zoom-slider::-webkit-slider-thumb{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:16px;height:16px;border-radius:50%;background:#3b82f6;cursor:pointer;box-shadow:0 2px 4px #0000001a;transition:all .2s ease}.zoom-slider::-webkit-slider-thumb:hover{background:#2563eb;transform:scale(1.1)}.zoom-slider::-moz-range-thumb{width:16px;height:16px;border-radius:50%;background:#3b82f6;cursor:pointer;border:none;box-shadow:0 2px 4px #0000001a}.zoom-level-display{font-size:13px;font-weight:500;color:#6b7280;min-width:56px;text-align:center;font-variant-numeric:tabular-nums}.zoom-reset-btn{padding:8px 12px;border:1px solid #d1d5db;border-radius:8px;background:#fff;color:#374151;font-size:12px;font-weight:500;cursor:pointer;transition:all .2s ease}.zoom-reset-btn:hover{background:#f3f4f6;border-color:#9ca3af;transform:translateY(-1px)}.circle-frame{width:120px;height:120px;border:3px solid #3b82f6;border-radius:50%;background:#3b82f61a;box-shadow:0 0 0 2px #3b82f633;transition:all .2s ease}.logo-preview-circle-indicator:hover .circle-frame{border-color:#2563eb;background:#2563eb26;box-shadow:0 0 0 3px #2563eb4d}@media (max-width: 768px){.logo-preview-container{flex-direction:column;gap:20px}.logo-preview-square{width:160px;height:160px}.zoom-slider{width:160px}.circle-frame{width:100px;height:100px}.zoom-controls{flex-direction:column;gap:12px}.zoom-level-display{min-width:48px}}.gallery-error{color:#ef4444;background-color:#fef2f2;padding:12px;border-radius:8px;border:1px solid #fecaca;margin-bottom:16px;font-size:14px}.gallery-loading{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:40px 20px;color:#6b7280;font-size:14px}.gallery-loading .loading-spinner{font-size:24px;margin-bottom:8px;animation:pulse 2s infinite}.gallery-empty{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:40px 20px;color:#6b7280;text-align:center}.gallery-empty-icon{font-size:48px;margin-bottom:16px;opacity:.5}.gallery-empty-text{font-size:16px;font-weight:500;margin-bottom:4px;color:#374151}.gallery-empty-subtext{font-size:14px;color:#6b7280}.image-overlay{position:absolute;bottom:0;left:0;right:0;background:linear-gradient(transparent,#000000b3);color:#fff;padding:12px 8px 8px;opacity:0;transition:opacity .2s ease}.image-item:hover .image-overlay{opacity:1}.image-filename{font-size:12px;font-weight:500;margin-bottom:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:#fff!important}.image-meta{font-size:10px;opacity:.8;color:#fff!important}@keyframes pulse{0%,to{opacity:1}50%{opacity:.5}}.no-logo-message{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:60px 20px;text-align:center}.no-logo-message h3{font-size:18px;font-weight:600;color:#374151;margin-bottom:8px}.no-logo-message p{font-size:14px;color:#6b7280;margin-bottom:24px;max-width:300px}.column-layout{position:relative;width:100%;border-radius:8px;transition:all .2s ease}.column-layout:hover{box-shadow:0 2px 8px #0000001a}.layout-controls{position:absolute;top:-40px;left:0;right:0;display:flex;align-items:center;justify-content:space-between;padding:8px 12px;background:#fff;border:1px solid #e5e7eb;border-radius:6px 6px 0 0;box-shadow:0 -2px 4px #0000000d;z-index:10}.layout-control-btn{display:flex;align-items:center;gap:6px;padding:4px 8px;background:#f3f4f6;border:1px solid #d1d5db;border-radius:4px;font-size:12px;font-weight:500;color:#374151;cursor:pointer;transition:all .2s ease}.layout-control-btn:hover{background:#e5e7eb;border-color:#9ca3af}.layout-control-btn .control-icon{width:14px;height:14px}.layout-info{font-size:12px;color:#6b7280;font-weight:500}.columns-container{display:flex;width:100%;min-height:100px;position:relative}.column{position:relative;display:flex;flex-direction:column;background:#fff;border:1px solid #e5e7eb;border-radius:6px;transition:all .2s ease;min-height:100px}.column:hover{border-color:#d1d5db;box-shadow:0 2px 4px #0000000d}.column.drag-over{border-color:#3b82f6;background:#3b82f60d;box-shadow:0 0 0 2px #3b82f633}.column-header{position:absolute;top:-35px;left:0;right:0;z-index:5}.column-controls{display:flex;gap:4px;padding:4px;background:#fff;border:1px solid #e5e7eb;border-radius:4px;box-shadow:0 -2px 4px #0000000d}.column-control-btn{display:flex;align-items:center;justify-content:center;width:24px;height:24px;background:#f9fafb;border:1px solid #e5e7eb;border-radius:3px;cursor:pointer;transition:all .2s ease}.column-control-btn:hover{background:#f3f4f6;border-color:#d1d5db}.column-control-btn.delete{background:#fef2f2;border-color:#fecaca;color:#dc2626}.column-control-btn.delete:hover{background:#fee2e2;border-color:#fca5a5}.column-control-btn .control-icon{width:12px;height:12px}.column-content{flex:1;padding:12px;display:flex;flex-direction:column;gap:12px}.column-empty-state{flex:1;display:flex;align-items:center;justify-content:center;min-height:80px;border:2px dashed #d1d5db;border-radius:4px;background:#f9fafb;transition:all .2s ease}.column:hover .column-empty-state{border-color:#9ca3af;background:#f3f4f6}.column.drag-over .column-empty-state{border-color:#3b82f6;background:#3b82f61a}.empty-column-message{text-align:center;color:#6b7280}.empty-icon{font-size:24px;margin-bottom:8px;opacity:.6}.empty-column-message p{margin:0;font-size:14px;font-weight:500}.column-block-wrapper{position:relative;padding:8px;border-radius:4px;transition:all .2s ease;cursor:pointer}.column-block-wrapper:hover{background:#4f46e50d;transform:translateY(-1px)}.column-block-wrapper.selected{background:#4f46e51a;border:2px solid #4f46e5;box-shadow:0 2px 4px #4f46e533}.column-block-wrapper:hover .block-actions{opacity:1}.block-actions{position:absolute;top:4px;right:4px;display:flex;gap:4px;opacity:0;transition:opacity .2s ease;z-index:2;pointer-events:none}.block-action-button{display:flex;align-items:center;justify-content:center;width:24px;height:24px;background:#fffffff2;border:1px solid #e5e7eb;border-radius:3px;cursor:pointer;transition:all .2s ease;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);pointer-events:auto}.block-action-button:hover{background:#fff;border-color:#d1d5db;transform:scale(1.05)}.block-action-button.duplicate-button{color:#059669}.block-action-button.duplicate-button:hover{background:#ecfdf5;border-color:#a7f3d0}.block-action-button.delete-button{color:#dc2626}.block-action-button.delete-button:hover{background:#fef2f2;border-color:#fecaca}.block-action-icon{width:14px;height:14px}.resize-handle{position:absolute;top:0;right:-8px;width:16px;height:100%;display:flex;align-items:center;justify-content:center;cursor:col-resize;background:#3b82f61a;border-radius:2px;opacity:0;transition:all .2s ease;z-index:3}.column:hover .resize-handle{opacity:1}.resize-handle:hover{background:#3b82f633;width:20px;right:-10px}.resize-handle.resizing{opacity:1;background:#3b82f64d;width:20px;right:-10px}.resize-icon{width:12px;height:12px;color:#3b82f6;transform:rotate(90deg)}.drop-indicator{position:absolute;background:#3b82f6;border-radius:2px;opacity:.8;pointer-events:none;z-index:10}.drop-indicator.before{top:-2px;left:0;right:0;height:4px}.drop-indicator.after{bottom:-2px;left:0;right:0;height:4px}.drop-indicator.left{top:0;bottom:0;left:-2px;width:4px}.drop-indicator.right{top:0;bottom:0;right:-2px;width:4px}.drop-indicator.center{top:0;left:0;right:0;bottom:0;background:#3b82f61a;border:2px dashed #3b82f6}.default-block{padding:12px;background:#f9fafb;border:1px solid #e5e7eb;border-radius:4px;font-size:14px;color:#374151;text-align:center}@media (max-width: 768px){.columns-container{flex-direction:column}.column{width:100%!important;margin-bottom:16px}.resize-handle{display:none}.layout-controls{position:relative;top:0;margin-bottom:16px}.column-header{position:relative;top:0;margin-bottom:8px}}.column{animation:columnSlideIn .3s ease-out}@keyframes columnSlideIn{0%{opacity:0;transform:scale(.95)}to{opacity:1;transform:scale(1)}}.layout-control-btn:focus,.column-control-btn:focus,.block-action-button:focus{outline:2px solid #3b82f6;outline-offset:2px}.column-layout.dragging .column{pointer-events:none}.column-layout.dragging .column.drag-over{pointer-events:auto}@media (prefers-contrast: high){.column{border-width:2px}.drop-indicator{background:#000}.column.drag-over{border-color:#000}}.react-flow{direction:ltr;--xy-edge-stroke-default: #b1b1b7;--xy-edge-stroke-width-default: 1;--xy-edge-stroke-selected-default: #555;--xy-connectionline-stroke-default: #b1b1b7;--xy-connectionline-stroke-width-default: 1;--xy-attribution-background-color-default: rgba(255, 255, 255, .5);--xy-minimap-background-color-default: #fff;--xy-minimap-mask-background-color-default: rgba(240, 240, 240, .6);--xy-minimap-mask-stroke-color-default: transparent;--xy-minimap-mask-stroke-width-default: 1;--xy-minimap-node-background-color-default: #e2e2e2;--xy-minimap-node-stroke-color-default: transparent;--xy-minimap-node-stroke-width-default: 2;--xy-background-color-default: transparent;--xy-background-pattern-dots-color-default: #91919a;--xy-background-pattern-lines-color-default: #eee;--xy-background-pattern-cross-color-default: #e2e2e2;background-color:var(--xy-background-color, var(--xy-background-color-default));--xy-node-color-default: inherit;--xy-node-border-default: 1px solid #1a192b;--xy-node-background-color-default: #fff;--xy-node-group-background-color-default: rgba(240, 240, 240, .25);--xy-node-boxshadow-hover-default: 0 1px 4px 1px rgba(0, 0, 0, .08);--xy-node-boxshadow-selected-default: 0 0 0 .5px #1a192b;--xy-node-border-radius-default: 3px;--xy-handle-background-color-default: #1a192b;--xy-handle-border-color-default: #fff;--xy-selection-background-color-default: rgba(0, 89, 220, .08);--xy-selection-border-default: 1px dotted rgba(0, 89, 220, .8);--xy-controls-button-background-color-default: #fefefe;--xy-controls-button-background-color-hover-default: #f4f4f4;--xy-controls-button-color-default: inherit;--xy-controls-button-color-hover-default: inherit;--xy-controls-button-border-color-default: #eee;--xy-controls-box-shadow-default: 0 0 2px 1px rgba(0, 0, 0, .08);--xy-edge-label-background-color-default: #ffffff;--xy-edge-label-color-default: inherit;--xy-resize-background-color-default: #3367d9}.react-flow.dark{--xy-edge-stroke-default: #3e3e3e;--xy-edge-stroke-width-default: 1;--xy-edge-stroke-selected-default: #727272;--xy-connectionline-stroke-default: #b1b1b7;--xy-connectionline-stroke-width-default: 1;--xy-attribution-background-color-default: rgba(150, 150, 150, .25);--xy-minimap-background-color-default: #141414;--xy-minimap-mask-background-color-default: rgba(60, 60, 60, .6);--xy-minimap-mask-stroke-color-default: transparent;--xy-minimap-mask-stroke-width-default: 1;--xy-minimap-node-background-color-default: #2b2b2b;--xy-minimap-node-stroke-color-default: transparent;--xy-minimap-node-stroke-width-default: 2;--xy-background-color-default: #141414;--xy-background-pattern-dots-color-default: #777;--xy-background-pattern-lines-color-default: #777;--xy-background-pattern-cross-color-default: #777;--xy-node-color-default: #f8f8f8;--xy-node-border-default: 1px solid #3c3c3c;--xy-node-background-color-default: #1e1e1e;--xy-node-group-background-color-default: rgba(240, 240, 240, .25);--xy-node-boxshadow-hover-default: 0 1px 4px 1px rgba(255, 255, 255, .08);--xy-node-boxshadow-selected-default: 0 0 0 .5px #999;--xy-handle-background-color-default: #bebebe;--xy-handle-border-color-default: #1e1e1e;--xy-selection-background-color-default: rgba(200, 200, 220, .08);--xy-selection-border-default: 1px dotted rgba(200, 200, 220, .8);--xy-controls-button-background-color-default: #2b2b2b;--xy-controls-button-background-color-hover-default: #3e3e3e;--xy-controls-button-color-default: #f8f8f8;--xy-controls-button-color-hover-default: #fff;--xy-controls-button-border-color-default: #5b5b5b;--xy-controls-box-shadow-default: 0 0 2px 1px rgba(0, 0, 0, .08);--xy-edge-label-background-color-default: #141414;--xy-edge-label-color-default: #f8f8f8}.react-flow__background{background-color:var(--xy-background-color-props, var(--xy-background-color, var(--xy-background-color-default)));pointer-events:none;z-index:-1}.react-flow__container{position:absolute;width:100%;height:100%;top:0;left:0}.react-flow__pane{z-index:1}.react-flow__pane.draggable{cursor:grab}.react-flow__pane.dragging{cursor:grabbing}.react-flow__pane.selection{cursor:pointer}.react-flow__viewport{transform-origin:0 0;z-index:2;pointer-events:none}.react-flow__renderer{z-index:4}.react-flow__selection{z-index:6}.react-flow__nodesselection-rect:focus,.react-flow__nodesselection-rect:focus-visible{outline:none}.react-flow__edge-path{stroke:var(--xy-edge-stroke, var(--xy-edge-stroke-default));stroke-width:var(--xy-edge-stroke-width, var(--xy-edge-stroke-width-default));fill:none}.react-flow__connection-path{stroke:var(--xy-connectionline-stroke, var(--xy-connectionline-stroke-default));stroke-width:var(--xy-connectionline-stroke-width, var(--xy-connectionline-stroke-width-default));fill:none}.react-flow .react-flow__edges{position:absolute}.react-flow .react-flow__edges svg{overflow:visible;position:absolute;pointer-events:none}.react-flow__edge{pointer-events:visibleStroke}.react-flow__edge.selectable{cursor:pointer}.react-flow__edge.animated path{stroke-dasharray:5;animation:dashdraw .5s linear infinite}.react-flow__edge.animated path.react-flow__edge-interaction{stroke-dasharray:none;animation:none}.react-flow__edge.inactive{pointer-events:none}.react-flow__edge.selected,.react-flow__edge:focus,.react-flow__edge:focus-visible{outline:none}.react-flow__edge.selected .react-flow__edge-path,.react-flow__edge.selectable:focus .react-flow__edge-path,.react-flow__edge.selectable:focus-visible .react-flow__edge-path{stroke:var(--xy-edge-stroke-selected, var(--xy-edge-stroke-selected-default))}.react-flow__edge-textwrapper{pointer-events:all}.react-flow__edge .react-flow__edge-text{pointer-events:none;-webkit-user-select:none;-moz-user-select:none;user-select:none}.react-flow__connection{pointer-events:none}.react-flow__connection .animated{stroke-dasharray:5;animation:dashdraw .5s linear infinite}svg.react-flow__connectionline{z-index:1001;overflow:visible;position:absolute}.react-flow__nodes{pointer-events:none;transform-origin:0 0}.react-flow__node{position:absolute;-webkit-user-select:none;-moz-user-select:none;user-select:none;pointer-events:all;transform-origin:0 0;box-sizing:border-box;cursor:default}.react-flow__node.selectable{cursor:pointer}.react-flow__node.draggable{cursor:grab;pointer-events:all}.react-flow__node.draggable.dragging{cursor:grabbing}.react-flow__nodesselection{z-index:3;transform-origin:left top;pointer-events:none}.react-flow__nodesselection-rect{position:absolute;pointer-events:all;cursor:grab}.react-flow__handle{position:absolute;pointer-events:none;min-width:5px;min-height:5px;width:6px;height:6px;background-color:var(--xy-handle-background-color, var(--xy-handle-background-color-default));border:1px solid var(--xy-handle-border-color, var(--xy-handle-border-color-default));border-radius:100%}.react-flow__handle.connectingfrom{pointer-events:all}.react-flow__handle.connectionindicator{pointer-events:all;cursor:crosshair}.react-flow__handle-bottom{top:auto;left:50%;bottom:0;transform:translate(-50%,50%)}.react-flow__handle-top{top:0;left:50%;transform:translate(-50%,-50%)}.react-flow__handle-left{top:50%;left:0;transform:translate(-50%,-50%)}.react-flow__handle-right{top:50%;right:0;transform:translate(50%,-50%)}.react-flow__edgeupdater{cursor:move;pointer-events:all}.react-flow__pane.selection .react-flow__panel{pointer-events:none}.react-flow__panel{position:absolute;z-index:5;margin:15px}.react-flow__panel.top{top:0}.react-flow__panel.bottom{bottom:0}.react-flow__panel.top.center,.react-flow__panel.bottom.center{left:50%;transform:translate(-15px) translate(-50%)}.react-flow__panel.left{left:0}.react-flow__panel.right{right:0}.react-flow__panel.left.center,.react-flow__panel.right.center{top:50%;transform:translateY(-15px) translateY(-50%)}.react-flow__attribution{font-size:10px;background:var(--xy-attribution-background-color, var(--xy-attribution-background-color-default));padding:2px 3px;margin:0}.react-flow__attribution a{text-decoration:none;color:#999}@keyframes dashdraw{0%{stroke-dashoffset:10}}.react-flow__edgelabel-renderer{position:absolute;width:100%;height:100%;pointer-events:none;-webkit-user-select:none;-moz-user-select:none;user-select:none;left:0;top:0}.react-flow__viewport-portal{position:absolute;width:100%;height:100%;left:0;top:0;-webkit-user-select:none;-moz-user-select:none;user-select:none}.react-flow__minimap{background:var( --xy-minimap-background-color-props, var(--xy-minimap-background-color, var(--xy-minimap-background-color-default)) )}.react-flow__minimap-svg{display:block}.react-flow__minimap-mask{fill:var( --xy-minimap-mask-background-color-props, var(--xy-minimap-mask-background-color, var(--xy-minimap-mask-background-color-default)) );stroke:var( --xy-minimap-mask-stroke-color-props, var(--xy-minimap-mask-stroke-color, var(--xy-minimap-mask-stroke-color-default)) );stroke-width:var( --xy-minimap-mask-stroke-width-props, var(--xy-minimap-mask-stroke-width, var(--xy-minimap-mask-stroke-width-default)) )}.react-flow__minimap-node{fill:var( --xy-minimap-node-background-color-props, var(--xy-minimap-node-background-color, var(--xy-minimap-node-background-color-default)) );stroke:var( --xy-minimap-node-stroke-color-props, var(--xy-minimap-node-stroke-color, var(--xy-minimap-node-stroke-color-default)) );stroke-width:var( --xy-minimap-node-stroke-width-props, var(--xy-minimap-node-stroke-width, var(--xy-minimap-node-stroke-width-default)) )}.react-flow__background-pattern.dots{fill:var( --xy-background-pattern-color-props, var(--xy-background-pattern-color, var(--xy-background-pattern-dots-color-default)) )}.react-flow__background-pattern.lines{stroke:var( --xy-background-pattern-color-props, var(--xy-background-pattern-color, var(--xy-background-pattern-lines-color-default)) )}.react-flow__background-pattern.cross{stroke:var( --xy-background-pattern-color-props, var(--xy-background-pattern-color, var(--xy-background-pattern-cross-color-default)) )}.react-flow__controls{display:flex;flex-direction:column;box-shadow:var(--xy-controls-box-shadow, var(--xy-controls-box-shadow-default))}.react-flow__controls.horizontal{flex-direction:row}.react-flow__controls-button{display:flex;justify-content:center;align-items:center;height:26px;width:26px;padding:4px;border:none;background:var(--xy-controls-button-background-color, var(--xy-controls-button-background-color-default));border-bottom:1px solid var( --xy-controls-button-border-color-props, var(--xy-controls-button-border-color, var(--xy-controls-button-border-color-default)) );color:var( --xy-controls-button-color-props, var(--xy-controls-button-color, var(--xy-controls-button-color-default)) );cursor:pointer;-webkit-user-select:none;-moz-user-select:none;user-select:none}.react-flow__controls-button svg{width:100%;max-width:12px;max-height:12px;fill:currentColor}.react-flow__edge.updating .react-flow__edge-path{stroke:#777}.react-flow__edge-text{font-size:10px}.react-flow__node.selectable:focus,.react-flow__node.selectable:focus-visible{outline:none}.react-flow__node-input,.react-flow__node-default,.react-flow__node-output,.react-flow__node-group{padding:10px;border-radius:var(--xy-node-border-radius, var(--xy-node-border-radius-default));width:150px;font-size:12px;color:var(--xy-node-color, var(--xy-node-color-default));text-align:center;border:var(--xy-node-border, var(--xy-node-border-default));background-color:var(--xy-node-background-color, var(--xy-node-background-color-default))}.react-flow__node-input.selectable:hover,.react-flow__node-default.selectable:hover,.react-flow__node-output.selectable:hover,.react-flow__node-group.selectable:hover{box-shadow:var(--xy-node-boxshadow-hover, var(--xy-node-boxshadow-hover-default))}.react-flow__node-input.selectable.selected,.react-flow__node-input.selectable:focus,.react-flow__node-input.selectable:focus-visible,.react-flow__node-default.selectable.selected,.react-flow__node-default.selectable:focus,.react-flow__node-default.selectable:focus-visible,.react-flow__node-output.selectable.selected,.react-flow__node-output.selectable:focus,.react-flow__node-output.selectable:focus-visible,.react-flow__node-group.selectable.selected,.react-flow__node-group.selectable:focus,.react-flow__node-group.selectable:focus-visible{box-shadow:var(--xy-node-boxshadow-selected, var(--xy-node-boxshadow-selected-default))}.react-flow__node-group{background-color:var(--xy-node-group-background-color, var(--xy-node-group-background-color-default))}.react-flow__nodesselection-rect,.react-flow__selection{background:var(--xy-selection-background-color, var(--xy-selection-background-color-default));border:var(--xy-selection-border, var(--xy-selection-border-default))}.react-flow__nodesselection-rect:focus,.react-flow__nodesselection-rect:focus-visible,.react-flow__selection:focus,.react-flow__selection:focus-visible{outline:none}.react-flow__controls-button:hover{background:var( --xy-controls-button-background-color-hover-props, var(--xy-controls-button-background-color-hover, var(--xy-controls-button-background-color-hover-default)) );color:var( --xy-controls-button-color-hover-props, var(--xy-controls-button-color-hover, var(--xy-controls-button-color-hover-default)) )}.react-flow__controls-button:disabled{pointer-events:none}.react-flow__controls-button:disabled svg{fill-opacity:.4}.react-flow__controls-button:last-child{border-bottom:none}.react-flow__controls.horizontal .react-flow__controls-button{border-bottom:none;border-right:1px solid var( --xy-controls-button-border-color-props, var(--xy-controls-button-border-color, var(--xy-controls-button-border-color-default)) )}.react-flow__controls.horizontal .react-flow__controls-button:last-child{border-right:none}.react-flow__resize-control{position:absolute}.react-flow__resize-control.left,.react-flow__resize-control.right{cursor:ew-resize}.react-flow__resize-control.top,.react-flow__resize-control.bottom{cursor:ns-resize}.react-flow__resize-control.top.left,.react-flow__resize-control.bottom.right{cursor:nwse-resize}.react-flow__resize-control.bottom.left,.react-flow__resize-control.top.right{cursor:nesw-resize}.react-flow__resize-control.handle{width:5px;height:5px;border:1px solid #fff;border-radius:1px;background-color:var(--xy-resize-background-color, var(--xy-resize-background-color-default));translate:-50% -50%}.react-flow__resize-control.handle.left{left:0;top:50%}.react-flow__resize-control.handle.right{left:100%;top:50%}.react-flow__resize-control.handle.top{left:50%;top:0}.react-flow__resize-control.handle.bottom{left:50%;top:100%}.react-flow__resize-control.handle.top.left,.react-flow__resize-control.handle.bottom.left{left:0}.react-flow__resize-control.handle.top.right,.react-flow__resize-control.handle.bottom.right{left:100%}.react-flow__resize-control.line{border-color:var(--xy-resize-background-color, var(--xy-resize-background-color-default));border-width:0;border-style:solid}.react-flow__resize-control.line.left,.react-flow__resize-control.line.right{width:1px;transform:translate(-50%);top:0;height:100%}.react-flow__resize-control.line.left{left:0;border-left-width:1px}.react-flow__resize-control.line.right{left:100%;border-right-width:1px}.react-flow__resize-control.line.top,.react-flow__resize-control.line.bottom{height:1px;transform:translateY(-50%);left:0;width:100%}.react-flow__resize-control.line.top{top:0;border-top-width:1px}.react-flow__resize-control.line.bottom{border-bottom-width:1px;top:100%}.react-flow__edge-textbg{fill:var(--xy-edge-label-background-color, var(--xy-edge-label-background-color-default))}.react-flow__edge-text{fill:var(--xy-edge-label-color, var(--xy-edge-label-color-default))}.logic-modal-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:#0000003b;display:flex;align-items:center;justify-content:center;z-index:10000;padding:20px}.logic-modal{background:#fff;border-radius:8px;box-shadow:0 25px 50px #00000040;width:92vw;height:93vh;max-width:1400px;max-height:900px;display:flex;flex-direction:column;overflow:hidden}.logic-modal-header{background:#f8fafc;border-bottom:1px solid #e2e8f0;padding:20px 24px 0;flex-shrink:0}.modal-title-section{display:flex;align-items:center;gap:12px;margin-bottom:16px}.modal-title-icon{width:24px;height:24px;color:#3b82f6}.logic-modal-header h2{font-size:20px;font-weight:600;color:#1e293b;margin:0;flex:1}.modal-close-btn{background:none;border:none;padding:8px;border-radius:6px;cursor:pointer;color:#64748b;transition:all .2s ease}.modal-close-btn:hover{background:#f1f5f9;color:#1e293b}.close-icon{width:20px;height:20px}.logic-tabs{display:flex;gap:2px;background:#e2e8f0;border-radius:8px;padding:4px;width:fit-content}.logic-tab{padding:8px 16px;border:none;background:transparent;border-radius:6px;font-size:14px;font-weight:500;color:#64748b;cursor:pointer;transition:all .2s ease}.logic-tab.active{background:#3b82f6;color:#fff;box-shadow:0 2px 4px #3b82f64d}.logic-tab:hover:not(.active){background:#f1f5f9;color:#1e293b}.logic-modal-content{flex:1;position:relative;overflow:hidden;transition:all .3s ease}.logic-modal-content.drag-over{background:#3b82f60d}.drop-zone-overlay{position:absolute;top:0;left:0;right:0;bottom:0;background:#3b82f61a;display:flex;align-items:center;justify-content:center;z-index:10000;pointer-events:none;animation:dropZoneFadeIn .3s ease-out}@keyframes dropZoneFadeIn{0%{opacity:0;transform:scale(.95)}to{opacity:1;transform:scale(1)}}.drop-zone-indicator{background:#fff;border:2px dashed #3b82f6;border-radius:12px;padding:24px 32px;display:flex;align-items:center;gap:12px;font-size:18px;font-weight:600;color:#3b82f6;box-shadow:0 8px 25px #3b82f640;animation:dropZonePulse 2s ease-in-out infinite}@keyframes dropZonePulse{0%,to{transform:scale(1)}50%{transform:scale(1.05)}}.drop-icon{width:24px;height:24px}.logic-panel{border-radius:8px;max-width:200px}.logic-panel h3{font-size:16px;font-weight:600;color:#1e293b;margin:0 0 8px}.logic-panel p{font-size:14px;color:#64748b;margin:0}.page-node{background:#fff;border:2px solid #e2e8f0;border-radius:12px;width:180px;min-height:80px;max-height:140px;position:relative;transition:all .2s ease;cursor:pointer;box-shadow:0 2px 8px #0000001a;display:flex;flex-direction:column;overflow:visible}.page-node:hover{border-color:#3b82f6;box-shadow:0 4px 12px #3b82f626}.page-node.selected{border-color:#3b82f6;box-shadow:0 0 0 3px #3b82f61a}.page-node.first-page{border-color:#10b981;background:linear-gradient(135deg,#ecfdf5,#fff)}.page-node.first-page:hover{border-color:#059669}.page-node.ending{border-color:#f59e0b;background:linear-gradient(135deg,#fef3c7,#fff)}.page-node.ending:hover{border-color:#d97706}.page-node.ghost-node{opacity:.7!important;background:#bbdefb99!important;border:2px dashed #3b82f6!important;pointer-events:none!important;box-shadow:none!important}.page-node.ghost-node .page-icon{background:#bbdefbcc!important;border:1px dashed #3b82f6!important}.page-node.ghost-node .page-title{color:#3b82f6!important;font-weight:600!important}.add-page-button{position:absolute;right:-12px;top:50%;transform:translateY(-50%);width:32px;height:32px;background:#3b82f6;border:2px solid #ffffff;border-radius:50%;display:flex;align-items:center;justify-content:center;cursor:grab;transition:all .2s ease;box-shadow:0 4px 12px #3b82f64d;z-index:10002;animation:addButtonFadeIn .3s ease-out;pointer-events:all;user-select:none;-webkit-user-drag:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none}.react-flow__handle.add-page-button-bottom{animation:addButtonFadeIn .3s ease-out!important;transition:all .2s ease!important;user-select:none!important;-webkit-user-drag:none!important;-webkit-user-select:none!important;-moz-user-select:none!important;-ms-user-select:none!important;visibility:visible!important;pointer-events:all!important;opacity:1!important}.add-page-button,.add-page-button *,.react-flow__handle.add-page-button-bottom,.react-flow__handle.add-page-button-bottom *{-webkit-user-drag:none!important;-moz-user-drag:none!important;-ms-user-drag:none!important;user-drag:none!important;draggable:false!important}@keyframes addButtonFadeIn{0%{opacity:0;transform:translate(-50%) scale(.8)}to{opacity:1;transform:translate(-50%) scale(1)}}.add-page-button:hover{background:#2563eb;transform:translateY(-50%) scale(1.1);box-shadow:0 6px 20px #3b82f666}.add-page-button:active,.add-page-button.dragging{cursor:grabbing;transform:translateY(-50%) scale(.95);background:#2563eb;box-shadow:0 8px 25px #2563eb66}.react-flow__handle.add-page-button-bottom:hover{background:#2563eb!important;transform:translate(-50%) scale(1.1)!important;box-shadow:0 6px 20px #3b82f666!important}.react-flow__connecting .react-flow__handle.add-page-button-bottom{background:#10b981!important;box-shadow:0 8px 25px #10b98180!important;animation:connectionDragPulse .6s ease-in-out infinite!important}@keyframes connectionDragPulse{0%,to{transform:translate(-50%) scale(.95)}50%{transform:translate(-50%) scale(1.05)}}body.react-flow__connecting{cursor:grabbing!important}body.react-flow__connecting *{cursor:grabbing!important;-webkit-user-select:none!important;user-select:none!important}.custom-page-node.valid-connection-target{border-color:#10b981!important;box-shadow:0 0 20px #10b98180!important;background:#10b9810d!important;transform:scale(1.05)!important;transition:all .2s ease!important}.custom-page-node.invalid-connection-target{border-color:#ef4444!important;box-shadow:0 0 15px #ef444466!important;background:#ef44440d!important;opacity:.6!important;transition:all .2s ease!important}.add-icon{width:18px;height:18px;color:#fff;stroke-width:2.5}.page-node:has(.add-page-button.dragging){opacity:.7;transform:scale(.98)}body.dragging-new-page,body.dragging-new-page *{cursor:grabbing!important}.custom-page-node.ghost-node{opacity:.8!important;background:#3b82f61a!important;border:2px dashed #3b82f6!important;pointer-events:none!important;box-shadow:0 0 20px #3b82f64d!important;animation:ghostNodeFloat .3s ease-out,ghostNodeGlow 1.5s ease-in-out infinite}.custom-page-node.ghost-node .page-icon{background:#3b82f633!important;border:1px dashed #3b82f6!important}.custom-page-node.ghost-node .page-title{color:#3b82f6!important;font-weight:600!important}@keyframes ghostNodeFloat{0%{opacity:0;transform:scale(.9)}to{opacity:.8;transform:scale(1)}}@keyframes ghostNodeGlow{0%,to{box-shadow:0 0 15px #3b82f64d}50%{box-shadow:0 0 25px #3b82f680}}body.dragging-new-page .page-node.drag-over,body.dragging-new-page .page-node.drag-over *{cursor:copy!important}.connection-highlight{position:absolute;background:#10b98133;border-radius:8px;pointer-events:none;z-index:1;animation:pulseConnection 1s ease-in-out infinite}.connection-highlight.top-connector{top:0;left:0;right:0;height:30%;border-top:3px solid #10b981;border-radius:8px 8px 0 0;background:linear-gradient(180deg,#10b9814d,#10b9811a)}.connection-highlight.top-connector:before{content:"↓";position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);color:#10b981;font-size:16px;font-weight:700;opacity:.8}.connection-highlight.bottom-area{bottom:0;left:0;right:0;height:30%;border-bottom:3px solid #10b981;border-radius:0 0 8px 8px;background:linear-gradient(0deg,#10b9814d,#10b9811a)}.connection-highlight.center-area{top:30%;bottom:30%;left:0;right:0;border-left:3px solid #10b981;border-right:3px solid #10b981;background:linear-gradient(90deg,#10b98133,#10b9811a,#10b98133)}.page-node.drag-over{transition:all .2s ease;transform:scale(1.02)}.page-node.drag-over-top,.page-node.drag-over-bottom,.page-node.drag-over-center{border:3px solid #10b981!important;box-shadow:0 0 25px #10b98180!important;background:#10b9810d!important}.page-node.drag-over-invalid{border:3px solid #ef4444!important;box-shadow:0 0 25px #ef444466!important;background:#ef44440d!important;transform:scale(1.01)!important}.page-node.drag-over-top:after{content:"🔗 Connect Here";position:absolute;top:-35px;left:50%;transform:translate(-50%);background:#10b981;color:#fff;padding:6px 12px;border-radius:20px;font-size:11px;font-weight:600;white-space:nowrap;z-index:1000;box-shadow:0 4px 12px #10b9814d;animation:connectionPulse .8s ease-in-out infinite}.page-node.drag-over-invalid:after{content:"❌ Cannot Connect";position:absolute;top:-35px;left:50%;transform:translate(-50%);background:#ef4444;color:#fff;padding:6px 12px;border-radius:20px;font-size:11px;font-weight:600;white-space:nowrap;z-index:1000;box-shadow:0 4px 12px #ef44444d;animation:invalidConnectionShake .5s ease-in-out}@keyframes invalidConnectionShake{0%,to{transform:translate(-50%) rotate(0)}25%{transform:translate(-50%) rotate(-1deg)}75%{transform:translate(-50%) rotate(1deg)}}.page-node.drag-over .connection-highlight{background:#10b98166;border:2px solid #10b981}.page-node.drag-over-invalid .connection-highlight{background:#ef44444d;border:2px solid #ef4444}body.dragging-connection .page-node.drag-over:not(.drag-over-invalid){cursor:copy!important}body.dragging-connection .page-node.drag-over:not(.drag-over-invalid) *{cursor:copy!important}body.dragging-connection .page-node.drag-over-invalid,body.dragging-connection .page-node.drag-over-invalid *{cursor:not-allowed!important}body.creating-connection,body.creating-connection *{cursor:wait!important}.react-flow__edge[data-temporary=true]{opacity:.7}.react-flow__edge[data-temporary=true] .react-flow__edge-path{stroke:#94a3b8!important;stroke-dasharray:8,4!important;animation:connectionCreating 1.5s ease-in-out infinite}@keyframes connectionCreating{0%{opacity:.5;stroke-dashoffset:0}50%{opacity:1;stroke-dashoffset:12}to{opacity:.5;stroke-dashoffset:24}}.react-flow__edge.connection-success{animation:connectionSuccess .8s ease-out}@keyframes connectionSuccess{0%{filter:drop-shadow(0 0 0 rgba(16,185,129,0));opacity:.7}20%{filter:drop-shadow(0 0 15px rgba(16,185,129,.9));opacity:1}50%{filter:drop-shadow(0 0 20px rgba(16,185,129,.8));opacity:1}to{filter:drop-shadow(0 0 0 rgba(16,185,129,0));opacity:1}}.connection-preview-tooltip{animation:tooltipFadeIn .2s ease-out}.connection-preview-content{background:linear-gradient(135deg,#10b981,#059669);color:#fff;padding:10px 16px;border-radius:8px;font-size:13px;font-weight:500;box-shadow:0 4px 12px #10b9814d,0 2px 4px #0000001a;display:flex;align-items:center;gap:8px;white-space:nowrap;border:1px solid rgba(255,255,255,.2)}.connection-icon{font-size:16px;filter:drop-shadow(0 1px 2px rgba(0,0,0,.1))}.connection-text{letter-spacing:.01em}.connection-text strong{font-weight:700;color:#fff;text-shadow:0 1px 2px rgba(0,0,0,.1)}@keyframes tooltipFadeIn{0%{opacity:0;transform:translateY(5px) scale(.95)}to{opacity:1;transform:translateY(0) scale(1)}}.page-node.drag-over:after{content:"🔗";position:absolute;top:-15px;right:-15px;width:30px;height:30px;background:#10b981;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:12px;color:#fff;box-shadow:0 4px 12px #10b98166;animation:connectionPulse .8s ease-in-out infinite;z-index:10}@keyframes pulseConnection{0%{opacity:.3}50%{opacity:.6}to{opacity:.3}}@keyframes connectionPulse{0%{transform:scale(1);opacity:.8}50%{transform:scale(1.1);opacity:1}to{transform:scale(1);opacity:.8}}.page-node-header{display:flex;align-items:center;justify-content:space-between;padding:12px 16px 8px}.page-icon{font-size:20px;width:32px;height:32px;display:flex;align-items:center;justify-content:center;background:#f8fafc;border-radius:8px;border:1px solid #e2e8f0}.first-page-badge{background:#10b981;color:#fff;border-radius:6px;padding:4px 6px;display:flex;align-items:center;gap:4px;font-size:10px;font-weight:600;text-transform:uppercase;letter-spacing:.5px}.flag-icon{width:12px;height:12px}.child-page-badge{position:absolute;top:-8px;right:-8px;width:20px;height:20px;background:#10b981;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:10px;color:#fff;box-shadow:0 2px 4px #0000001a;z-index:10}.page-node-menu{display:flex;align-items:center;justify-content:center;width:24px;height:24px;border-radius:4px;cursor:pointer;transition:all .2s ease;opacity:.6}.page-node-menu:hover{background:#f1f5f9;opacity:1}.menu-dots{display:flex;flex-direction:column;align-items:center;gap:2px}.menu-dots .dot{width:3px;height:3px;background:#64748b;border-radius:50%;transition:all .2s ease}.page-node-menu:hover .menu-dots .dot{background:#1e293b}.page-node-content{padding:0 16px 16px;flex:1;overflow-y:auto}.page-node .page-title{font-size:16px;font-weight:600;color:#1e293b;line-height:1.4;transition:background-color .2s ease;border-radius:4px;padding:2px 4px;margin:-2px -4px 4px;cursor:pointer}.page-node .page-title.hovered{background-color:#f1f5f9}.custom-page-node .page-title{font-size:16px;font-weight:600;color:#1e293b;line-height:1.4;transition:background-color .2s ease;border-radius:4px;padding:2px 4px;margin:-2px -4px 4px;cursor:pointer}.custom-page-node .page-title.hovered{background-color:#f1f5f9}.page-description{font-size:12px;color:#64748b;line-height:1.4}.page-rename-input{width:100%;padding:6px 8px;border:2px solid #3b82f6;border-radius:4px;font-size:16px;font-weight:600;color:#1e293b;outline:none;background:#fff}.page-context-menu{position:fixed;background:#fff;border:1px solid #e2e8f0;border-radius:8px;box-shadow:0 10px 25px #00000026;padding:8px 0;min-width:180px;z-index:10001;animation:contextMenuFadeIn .15s ease-out}@keyframes contextMenuFadeIn{0%{opacity:0;transform:scale(.95)}to{opacity:1;transform:scale(1)}}.context-menu-item{display:flex;align-items:center;gap:12px;width:100%;padding:10px 16px;border:none;background:none;text-align:left;font-size:14px;color:#374151;cursor:pointer;transition:background-color .15s ease}.context-menu-item:hover{background:#f3f4f6}.context-menu-item.danger{color:#dc2626}.context-menu-item.danger:hover{background:#fef2f2}.menu-icon{width:16px;height:16px;flex-shrink:0;color:currentColor}.context-menu-separator{height:1px;background:#e5e7eb;margin:4px 0}.logic-modal .react-flow{width:100%!important;height:100%!important;min-height:500px!important;background:#fafbfc}.logic-modal .react-flow__node{background:transparent!important;border:none!important;pointer-events:all!important;overflow:visible!important}.logic-modal .react-flow__background{background:#fafbfc}.logic-modal .page-node{pointer-events:all!important;position:relative!important;background:#fff!important;border:2px solid #e2e8f0!important;border-radius:12px!important;width:180px!important;min-height:80px!important;max-height:160px!important;display:flex!important;flex-direction:column!important;visibility:visible!important;opacity:1!important;z-index:1000!important;box-shadow:0 2px 8px #0000001a!important;overflow:visible!important}.logic-modal .react-flow__node{visibility:visible!important;opacity:1!important;z-index:1000!important;pointer-events:all!important;overflow:visible!important}.logic-modal .react-flow__node .add-page-button{pointer-events:all!important;z-index:10002!important}.nopan{cursor:default!important}.nopan:hover{cursor:pointer!important}.add-page-button.nopan,.add-page-button-bottom.nopan{cursor:grab!important}.add-page-button.nopan:active,.add-page-button-bottom.nopan:active{cursor:grabbing!important}.logic-modal .react-flow__handle{background:#3b82f6!important;border:2px solid #ffffff!important;width:12px!important;height:12px!important}.logic-modal .react-flow__edge{pointer-events:none}.logic-modal .react-flow__edge g{pointer-events:all}@media (max-width: 768px){.logic-modal{width:95vw;height:90vh;margin:20px}.logic-modal-header{padding:16px 20px 0}.modal-title-section{margin-bottom:12px}.logic-modal-header h2{font-size:18px}.page-node{width:140px;height:70px}.page-node-header{padding:8px 12px 6px}.page-node-content{padding:0 12px 12px}.page-node .page-title{font-size:14px}.logic-panel{max-width:160px;padding:12px}.page-node-menu{width:20px;height:20px;opacity:1}.menu-dots .dot{width:2.5px;height:2.5px}.add-page-button{width:28px;height:28px;right:-10px}.add-page-button-bottom{width:28px;height:28px;bottom:-10px}.add-page-button .add-icon,.add-page-button-bottom .add-icon{width:16px;height:16px}}.logic-modal .page-conditions{margin-top:8px!important;padding:6px 0!important;border-top:1px solid #e2e8f0!important;visibility:visible!important;opacity:1!important;display:block!important;min-height:30px!important}.logic-modal .condition-label{display:flex!important;align-items:center!important;gap:4px!important;font-size:12px!important;font-weight:600!important;color:#3b82f6!important;margin-bottom:6px!important;cursor:pointer!important;padding:4px 2px!important;border-radius:3px!important;transition:background-color .2s ease!important;visibility:visible!important;opacity:1!important;line-height:1.3!important}.logic-modal .condition-label:hover{background-color:#f1f5f9!important}.logic-modal .condition-icon{width:12px!important;height:12px!important;color:#3b82f6!important;flex-shrink:0!important}.logic-modal .conditions-list{margin-bottom:6px!important;display:block!important;visibility:visible!important}.logic-modal .condition-item{background:#f8fafc!important;border:1px solid #e2e8f0!important;border-radius:4px!important;padding:4px 6px!important;margin-bottom:2px!important;display:block!important;visibility:visible!important}.logic-modal .condition-text{font-size:11px!important;color:#475569!important;font-weight:400!important;line-height:1.2!important;display:block!important;visibility:visible!important}.logic-modal .add-branch-option{margin-top:4px!important;padding:2px 0!important;display:block!important;visibility:visible!important}.logic-modal .add-branch-text{font-size:12px!important;color:#64748b!important;font-weight:500!important;cursor:pointer!important;transition:color .2s ease!important;padding:4px 2px!important;border-radius:3px!important;display:inline-block!important;visibility:visible!important;opacity:1!important;line-height:1.3!important}.logic-modal .add-branch-text:hover{color:#3b82f6!important;background-color:#f1f5f9!important}.condition-modal-overlay{position:fixed;top:0;left:0;right:0;bottom:0;z-index:10002;background:transparent}.condition-builder-modal{position:fixed;z-index:10003}.condition-builder-modal.open-upward .condition-builder-content{box-shadow:0 -10px 25px #00000026}.condition-builder-content{background:#fff;border:1px solid #e2e8f0;border-radius:8px;box-shadow:0 10px 25px #00000026;padding:16px;min-width:500px;animation:conditionModalFadeIn .2s ease-out}@keyframes conditionModalFadeIn{0%{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:translateY(0)}}.condition-row{display:flex;align-items:center;gap:8px;margin-bottom:12px}.condition-select{padding:8px 12px;border:1px solid #d1d5db;border-radius:6px;background:#fff;font-size:14px;color:#374151;cursor:pointer;outline:none;transition:border-color .2s ease}.condition-select:focus{border-color:#3b82f6;box-shadow:0 0 0 3px #3b82f61a}.field-select{flex:1;min-width:150px}.operator-select{flex:1;min-width:120px}.condition-input{padding:8px 12px;border:1px solid #d1d5db;border-radius:6px;font-size:14px;color:#374151;outline:none;transition:border-color .2s ease}.condition-input:focus{border-color:#3b82f6;box-shadow:0 0 0 3px #3b82f61a}.value-input{flex:1;min-width:100px}.condition-delete-btn{padding:8px;border:none;background:#fef2f2;border-radius:6px;cursor:pointer;transition:background-color .2s ease;display:flex;align-items:center;justify-content:center;min-width:36px;height:36px}.condition-delete-btn:hover{background:#fee2e2}.condition-actions{display:flex;align-items:center;justify-content:space-between;margin-top:16px;padding-top:16px;border-top:1px solid #e5e7eb}.condition-action-btn{padding:8px 16px;border:none;background:transparent;color:#64748b;font-size:14px;font-weight:500;cursor:pointer;border-radius:6px;transition:all .2s ease}.condition-action-btn:hover{background:#f1f5f9;color:#3b82f6}.condition-done-btn{padding:8px 20px;border:none;background:#3b82f6;color:#fff;font-size:14px;font-weight:600;border-radius:6px;cursor:pointer;transition:background-color .2s ease}.condition-done-btn:hover{background:#2563eb;transform:translateY(-1px);box-shadow:0 4px 12px #2563eb4d}@keyframes pulse{0%{opacity:.8;transform:scale(1)}50%{opacity:1;transform:scale(1.05)}to{opacity:.8;transform:scale(1)}}body.dragging-connection .page-node.drag-over,body.dragging-connection .page-node.drag-over *{cursor:alias!important}.page-node.drag-over .connection-highlight{animation:pulse .5s ease-in-out infinite alternate}.page-node.drag-over:after{content:"🔗";position:absolute;top:-15px;right:-15px;width:30px;height:30px;background:#10b981;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:14px;color:#fff;box-shadow:0 4px 12px #10b98166;animation:pulse .8s ease-in-out infinite;z-index:10}body.dragging-connection{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.add-page-button-bottom:active,.add-page-button-bottom.dragging{cursor:grabbing!important;transform:translate(-50%) scale(.95);background:#2563eb;box-shadow:0 8px 25px #2563eb66}.react-flow__edge[data-id=drag-edge]{pointer-events:none;z-index:1000}.react-flow__edge[data-id=drag-edge] .react-flow__edge-path{stroke:#3b82f6;stroke-width:2;stroke-dasharray:5,5;animation:dash 1s linear infinite}@keyframes dash{to{stroke-dashoffset:-10}}.add-page-button-bottom:before{content:attr(title);position:absolute;bottom:100%;left:50%;transform:translate(-50%);background:#1e293b;color:#fff;padding:8px 12px;border-radius:6px;font-size:12px;font-weight:500;white-space:nowrap;opacity:0;pointer-events:none;transition:opacity .2s ease;z-index:10003;margin-bottom:8px}.add-page-button-bottom:hover:before{opacity:1}.react-flow.dragging-connection .react-flow__pane{cursor:grabbing!important}.react-flow.dragging-connection .react-flow__node{transition:all .2s ease}.react-flow.dragging-connection .react-flow__node:not(.drag-over){opacity:.6}.drag-preview{position:fixed;z-index:10000;pointer-events:none;-webkit-user-select:none;user-select:none;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;visibility:visible!important;opacity:1!important;max-width:none!important;max-height:none!important;overflow:visible!important;z-index:99999!important}@keyframes dragPreviewPulse{0%{transform:rotate(-2deg) scale(1);box-shadow:0 4px 20px #3b82f666}50%{transform:rotate(-2deg) scale(1.02);box-shadow:0 6px 25px #3b82f680}to{transform:rotate(-2deg) scale(1);box-shadow:0 4px 20px #3b82f666}}.react-flow .drag-preview{position:fixed!important;z-index:99999!important}.react-flow__edge[data-id=drag-edge]{z-index:1000!important;pointer-events:none!important}.react-flow__edge[data-id=drag-edge] path{stroke:#3b82f6!important;stroke-width:3!important;stroke-dasharray:10,5!important;animation:dashMove 1s linear infinite!important}.react-flow__edge[data-id=drag-edge] g{visibility:visible!important;opacity:1!important}.react-flow__edge[data-id=drag-edge] circle{visibility:visible!important;opacity:1!important}@keyframes dashMove{0%{stroke-dashoffset:0}to{stroke-dashoffset:15}}.react-flow__connection-line{stroke:#10b981!important;stroke-width:3!important;stroke-dasharray:8,4!important;animation:dashMove 1s linear infinite!important}@keyframes pulse{0%{transform:scale(1);opacity:.8}50%{transform:scale(1.2);opacity:1}to{transform:scale(1);opacity:.8}}.react-flow__edge[data-id=drag-edge]{z-index:1000}.react-flow__edge[data-id=drag-edge] .react-flow__edge-path{stroke:#3b82f6;stroke-width:3;stroke-dasharray:10,5;animation:dashMove 1s linear infinite;filter:drop-shadow(0 2px 4px rgba(59,130,246,.3))}body.dragging-connection,body.dragging-connection *{cursor:grabbing!important}body.dragging-connection .page-node.drag-over,body.dragging-connection .page-node.drag-over *{cursor:copy!important}.page-node.drag-over{animation:nodeConnectHighlight .6s ease-in-out infinite alternate}@keyframes nodeConnectHighlight{0%{box-shadow:0 0 20px #10b9814d}to{box-shadow:0 0 30px #10b98180}}.drag-preview:after{content:"";position:absolute;bottom:-5px;left:50%;transform:translate(-50%);width:0;height:0;border-left:5px solid transparent;border-right:5px solid transparent;border-top:5px solid rgba(59,130,246,.9)}.react-flow__edge-path{transition:all .3s ease}.react-flow__edge-path:hover{stroke-width:3;filter:drop-shadow(0 2px 6px rgba(59,130,246,.4))}.page-node.drag-over:before{content:"";position:absolute;top:-3px;left:-3px;right:-3px;bottom:-3px;background:linear-gradient(45deg,#10b981,#06b6d4);border-radius:14px;z-index:-1;animation:dragTargetGlow .8s ease-in-out infinite alternate}@keyframes dragTargetGlow{0%{opacity:.3;transform:scale(1)}to{opacity:.6;transform:scale(1.01)}}.custom-page-node{background:#fff;border:2px solid #e2e8f0;border-radius:12px;width:180px;min-height:80px;max-height:160px;position:relative;transition:all .2s ease;cursor:pointer;box-shadow:0 2px 8px #0000001a;display:flex;flex-direction:column;overflow:visible}.custom-page-node:hover{border-color:#3b82f6;box-shadow:0 4px 12px #3b82f626}.custom-page-node.selected{border-color:#3b82f6;box-shadow:0 0 0 3px #3b82f61a}.custom-page-node.first-page{border-color:#10b981;background:linear-gradient(135deg,#ecfdf5,#fff)}.custom-page-node.first-page:hover{border-color:#059669}.custom-page-node.ending{border-color:#f59e0b;background:linear-gradient(135deg,#fef3c7,#fff)}.custom-page-node.ending:hover{border-color:#d97706}.custom-page-node.ghost-node{opacity:.7!important;background:#bbdefb99!important;border:2px dashed #3b82f6!important;pointer-events:none!important;box-shadow:none!important}.custom-page-node.valid-connection-target{border:3px solid #10b981!important;box-shadow:0 0 25px #10b98180!important;background:#10b9810d!important;transform:scale(1.05);animation:validConnectionPulse .8s ease-in-out infinite alternate}.custom-page-node.invalid-connection-target{border:3px solid #ef4444!important;box-shadow:0 0 25px #ef444466!important;background:#ef44440d!important;transform:scale(1.02);animation:invalidConnectionShake .5s ease-in-out}@keyframes validConnectionPulse{0%{box-shadow:0 0 20px #10b98166}to{box-shadow:0 0 30px #10b981b3}}@keyframes invalidConnectionShake{0%,to{transform:scale(1.02) rotate(0)}25%{transform:scale(1.02) rotate(-.5deg)}75%{transform:scale(1.02) rotate(.5deg)}}.connection-feedback{position:absolute;top:-40px;left:50%;transform:translate(-50%);padding:6px 12px;border-radius:20px;font-size:11px;font-weight:600;white-space:nowrap;z-index:1000;box-shadow:0 4px 12px #0003;animation:connectionFeedbackBounce .3s ease-out}.connection-feedback.valid{background:#10b981;color:#fff}.connection-feedback.invalid{background:#ef4444;color:#fff}@keyframes connectionFeedbackBounce{0%{transform:translate(-50%) scale(.8) translateY(10px);opacity:0}to{transform:translate(-50%) scale(1) translateY(0);opacity:1}}.custom-handle{transition:all .2s ease}.custom-handle:hover{transform:scale(1.2);box-shadow:0 0 10px #3b82f680}.custom-handle.source-handle{cursor:crosshair}.custom-handle.target-handle{cursor:pointer}.react-flow__connection-line{stroke:#3b82f6;stroke-width:3;stroke-dasharray:5,5;animation:dashMove 1s linear infinite}.custom-page-node .react-flow__handle.add-page-button-bottom{background:#3b82f6!important;border:2px solid #ffffff!important;border-radius:50%!important;width:32px!important;height:32px!important;display:flex!important;align-items:center!important;justify-content:center!important}.custom-page-node .react-flow__handle.add-page-button-bottom:hover{background:#2563eb!important;transform:translate(-50%) scale(1.1)!important;box-shadow:0 6px 20px #3b82f666!important}.react-flow__node-pageNode{background:transparent!important;border:none!important;padding:0!important;overflow:visible!important}.react-flow.react-flow__connecting *{-webkit-user-select:none!important;user-select:none!important}.calculations-content{flex:1;padding:40px;background:#fff;overflow-y:auto}.calculation-form{max-width:600px;margin:0 auto}.calculation-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:8px}.calculation-header h2{font-size:32px;font-weight:600;color:#1f2937;margin:0}.help-link{background:none;border:none;color:#6b7280;font-size:16px;cursor:pointer;text-decoration:underline;padding:0}.help-link:hover{color:#374151}.calculation-subtitle{font-size:16px;color:#6b7280;margin:0 0 40px;line-height:1.5}.calculation-instructions{margin-bottom:32px;padding:24px;background:#f8fafc;border-radius:8px;border-left:4px solid #3b82f6}.calculation-instructions h3{font-size:18px;font-weight:600;color:#1f2937;margin:0 0 16px}.calculation-instructions p{font-size:14px;color:#4b5563;line-height:1.6;margin:0 0 12px}.calculation-instructions ul{margin:0 0 16px;padding-left:20px}.calculation-instructions li{font-size:14px;color:#4b5563;line-height:1.6;margin-bottom:8px}.calculation-instructions li:last-child{margin-bottom:0}.calculation-instructions strong{color:#1f2937;font-weight:600}.field-description{font-size:13px;color:#6b7280;margin:6px 0 0;line-height:1.4}.form-group{margin-bottom:24px}.form-group label{display:flex;align-items:center;gap:8px;font-size:16px;font-weight:500;color:#1f2937;margin-bottom:8px}.info-icon{display:inline-flex;align-items:center;justify-content:center;width:16px;height:16px;background:#e5e7eb;color:#6b7280;border-radius:50%;font-size:12px;cursor:help}.calculation-input{width:100%;padding:12px 16px;border:2px solid #e5e7eb;border-radius:8px;font-size:16px;color:#1f2937;background:#fff;transition:border-color .2s ease}.calculation-input:focus{outline:none;border-color:#3b82f6}.calculation-input::placeholder{color:#9ca3af}.calculation-select{width:100%;max-width:380px;padding:12px 40px 12px 16px;border:2px solid #e5e7eb;border-radius:8px;font-size:16px;color:#1f2937;background:#fff;cursor:pointer;transition:border-color .2s ease;-webkit-appearance:none;-moz-appearance:none;appearance:none;background-image:url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 20 20'%3e%3cpath stroke='%236b7280' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.5' d='m6 8 4 4 4-4'/%3e%3c/svg%3e");background-position:right 12px center;background-repeat:no-repeat;background-size:16px}.calculation-select:focus{outline:none;border-color:#3b82f6}.form-actions{margin-top:40px;display:flex;justify-content:flex-end}.create-calculation-btn{background:#3b82f6;color:#fff;border:none;border-radius:8px;padding:12px 24px;font-size:16px;font-weight:500;cursor:pointer;transition:background-color .2s ease}.create-calculation-btn:hover:not(:disabled){background:#2563eb}.create-calculation-btn:disabled{background:#9ca3af;cursor:not-allowed}.help-modal-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:#00000080;display:flex;align-items:center;justify-content:center;z-index:1000}.help-modal-content{background:#fff;border-radius:12px;max-width:600px;width:90%;max-height:80vh;overflow-y:auto;box-shadow:0 20px 25px -5px #0000001a,0 10px 10px -5px #0000000a}.help-modal-header{display:flex;align-items:center;justify-content:space-between;padding:24px 24px 16px;border-bottom:1px solid #e5e7eb}.help-modal-header h3{margin:0;font-size:20px;font-weight:600;color:#1f2937}.help-modal-close{background:none;border:none;font-size:32px;color:#6b7280;cursor:pointer;padding:0;width:32px;height:32px;display:flex;align-items:center;justify-content:center;border-radius:6px;transition:background-color .2s ease,color .2s ease}.help-modal-close:hover{background:#f3f4f6;color:#1f2937}.help-modal-body{padding:24px}.help-modal-body p{margin:0 0 16px;font-size:15px;line-height:1.6;color:#4b5563}.help-modal-body ul{margin:0;padding-left:20px}.help-modal-body li{font-size:14px;color:#4b5563;line-height:1.6;margin-bottom:12px}.help-modal-body li:last-child{margin-bottom:0}.help-modal-body strong{color:#1f2937;font-weight:600}.calculation-builder{max-width:800px;margin:0 auto}.calculation-builder-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:8px}.calculation-title{display:flex;align-items:center;gap:8px}.calculate-label{font-size:32px;font-weight:600;color:#1f2937}.calculation-name{font-size:32px;font-weight:600;color:#3b82f6;background:#dbeafe;padding:4px 12px;border-radius:6px;border:1px solid #93c5fd}.calculation-builder-subtitle{font-size:16px;color:#6b7280;margin:0 0 32px;line-height:1.5}.initial-value-section{margin-bottom:32px}.initial-value-section label{display:block;font-size:18px;font-weight:500;color:#6b7280;margin-bottom:12px}.initial-value-input{width:100%;padding:16px 20px;border:2px solid #e5e7eb;border-radius:8px;font-size:16px;color:#1f2937;background:#fff;transition:border-color .2s ease}.initial-value-input:focus{outline:none;border-color:#3b82f6}.rules-section h3{font-size:18px;font-weight:500;color:#6b7280;margin:0 0 16px}.rule-card{border:1px solid #e5e7eb;border-radius:12px;padding:24px;margin-bottom:16px;background:#fff;box-shadow:0 1px 3px #0000001a}.rule-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:20px}.rule-condition{display:flex;align-items:center;gap:16px}.rule-condition>span{font-size:14px;color:#6b7280}.condition-toggle{display:flex;align-items:center;gap:12px}.condition-toggle span{font-size:14px;color:#1f2937;font-weight:500}.toggle-switch{position:relative;display:inline-block;width:44px;height:24px}.toggle-slider{position:absolute;cursor:pointer;top:0;left:0;right:0;bottom:0;background-color:#e5e7eb;transition:.3s;border-radius:24px}input:checked+.toggle-slider{background-color:#3b82f6}input:checked+.toggle-slider:before{transform:translate(20px)}.rule-menu-btn{background:none;border:none;color:#6b7280;font-size:18px;cursor:pointer;padding:4px;border-radius:4px}.rule-menu-btn:hover{background:#f3f4f6;color:#1f2937}.conditional-logic-section{margin-bottom:20px}.edit-conditional-logic-btn{width:100%;padding:16px 20px;border:2px solid #e5e7eb;border-radius:8px;font-size:14px;color:#3b82f6;background:#fff;cursor:pointer;transition:all .2s ease;text-align:left}.edit-conditional-logic-btn:hover{border-color:#3b82f6;background:#f8fafc}.condition-builder-wrapper{border:2px solid #e5e7eb;border-radius:8px;padding:20px;background:#f8fafc}.condition-builder{display:flex;align-items:flex-start;margin-bottom:16px}.logic-operator-container{display:flex;align-items:flex-start;margin-right:16px;margin-top:12px}.logic-operator-select{padding:8px 32px 8px 12px;border:1px solid #d1d5db;border-radius:6px;font-size:14px;font-weight:500;color:#374151;background:#fff;cursor:pointer;-webkit-appearance:none;-moz-appearance:none;appearance:none;background-image:url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 20 20'%3e%3cpath stroke='%236b7280' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.5' d='m6 8 4 4 4-4'/%3e%3c/svg%3e");background-position:right 8px center;background-repeat:no-repeat;background-size:14px;min-width:80px}.logic-operator-select:focus{outline:none;border-color:#3b82f6}.conditions-container{flex:1}.condition-group{margin-top:16px;margin-left:20px;border:1px solid #d1d5db;border-radius:6px;background:#f9fafb;padding:16px}.condition-group-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:12px;padding-bottom:8px;border-bottom:1px solid #e5e7eb}.group-label{font-size:14px;font-weight:500;color:#374151}.group-actions{display:flex;gap:8px;align-items:center}.add-condition-to-group-btn,.add-group-to-group-btn,.delete-group-btn{padding:4px 8px;font-size:12px;border:1px solid #d1d5db;border-radius:4px;background:#fff;color:#6b7280;cursor:pointer;transition:all .2s}.add-condition-to-group-btn:hover,.add-group-to-group-btn:hover{border-color:#3b82f6;color:#3b82f6}.delete-group-btn{color:#ef4444;border-color:#ef4444}.delete-group-btn:hover{background:#ef4444;color:#fff}.condition-group-content{display:flex;align-items:flex-start}.group-logic-operator-container{display:flex;align-items:flex-start;margin-right:16px;margin-top:12px}.group-conditions-container{flex:1}.condition-row{display:flex;align-items:center;gap:12px;margin-bottom:12px}.condition-row:last-child{margin-bottom:16px}.condition-select{flex:1;padding:12px 40px 12px 16px;border:1px solid #d1d5db;border-radius:6px;font-size:14px;color:#6b7280;background:#fff;cursor:pointer;-webkit-appearance:none;-moz-appearance:none;appearance:none;background-image:url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 20 20'%3e%3cpath stroke='%236b7280' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.5' d='m6 8 4 4 4-4'/%3e%3c/svg%3e");background-position:right 12px center;background-repeat:no-repeat;background-size:16px}.condition-select:focus{outline:none;border-color:#3b82f6;color:#1f2937}.condition-value-input{flex:1;padding:12px 16px;border:1px solid #d1d5db;border-radius:6px;font-size:14px;color:#6b7280;background:#fff;transition:border-color .2s ease}.condition-value-input:focus{outline:none;border-color:#3b82f6;color:#1f2937}.delete-condition-btn{background:#f3f4f6;border:1px solid #d1d5db;border-radius:6px;padding:8px 12px;color:#6b7280;cursor:pointer;font-size:16px;transition:all .2s ease}.delete-condition-btn:hover{background:#ef4444;color:#fff;border-color:#ef4444}.condition-actions{display:flex;align-items:center;gap:12px;justify-content:space-between;padding-top:12px;border-top:1px solid #e5e7eb}.add-condition-btn,.add-condition-group-btn{background:none;border:none;color:#6b7280;font-size:14px;cursor:pointer;padding:0;transition:color .2s ease}.add-condition-btn:hover,.add-condition-group-btn:hover{color:#3b82f6}.condition-done-btn{background:#f3f4f6;color:#1f2937;border:1px solid #d1d5db;border-radius:6px;padding:8px 16px;font-size:14px;cursor:pointer;transition:all .2s ease;margin-left:auto}.condition-done-btn:hover{background:#e5e7eb;border-color:#9ca3af}.condition-field-selector{flex:1;padding:12px 16px;border:1px solid #d1d5db;border-radius:6px;font-size:14px;color:#6b7280;background:#fff;cursor:pointer;transition:all .2s ease;display:flex;align-items:center;justify-content:space-between;text-align:left}.condition-field-selector:hover{border-color:#3b82f6;background:#f8fafc}.dropdown-arrow{font-size:10px;color:#9ca3af}.selected-field-badge{display:inline-flex;align-items:center;padding:0 12px;background:#eff6ff;border:1px solid #bfdbfe;border-radius:6px;color:#1e40af;font-size:13px;font-weight:500;max-width:200px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.choice-value-input-container{position:relative;flex:1}.choice-value-input{display:flex;align-items:center;min-height:0px;padding:8px 16px;border:1px solid #d1d5db;border-radius:6px;background:#fff;cursor:pointer;flex-wrap:wrap;gap:4px;font-size:14px}.choice-value-input:hover{border-color:#3b82f6}.choice-value-input:focus-within{outline:none;border-color:#3b82f6;box-shadow:0 0 0 3px #3b82f61a}.value-badges{display:flex;flex-wrap:wrap;gap:4px;flex:1;align-items:center}.value-badge{display:inline-flex;align-items:center;padding:2px 8px;background:#eff6ff;border:1px solid #bfdbfe;border-radius:4px;color:#1e40af;font-size:12px;font-weight:500}.badge-remove{margin-left:4px;background:none;border:none;color:#1e40af;cursor:pointer;font-size:14px;line-height:1;padding:0;width:16px;height:16px;display:flex;align-items:center;justify-content:center}.badge-remove:hover{color:#dc2626}.placeholder-text{color:#9ca3af;font-size:14px;font-style:italic}.overflow-indicator{color:#6b7280;font-size:11px;font-weight:500;padding:1px 4px;background:#f3f4f6;border-radius:3px;flex-shrink:0}.dropdown-toggle{background:none;border:none;color:#08090a;cursor:pointer;font-size:12px;padding:4px;margin-left:auto;width:24px;height:20px}.dropdown-toggle:hover{color:#3b82f6}.choice-dropdown{position:absolute;top:100%;left:0;right:0;background:#fff;border:1px solid #d1d5db;border-radius:6px;box-shadow:0 4px 6px #0000001a;z-index:1000;max-height:200px;overflow-y:auto;margin-top:2px}.choice-option{padding:8px 12px;cursor:pointer;font-size:14px;color:#374151;border-bottom:1px solid #f3f4f6}.choice-option:hover{background:#f3f4f6}.choice-option:last-child{border-bottom:none}.no-options{padding:8px 12px;color:#9ca3af;font-size:14px;font-style:italic}.field-dropdown-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:transparent;z-index:10004}.field-dropdown-modal{background:#fff;border-radius:8px;box-shadow:0 10px 25px #00000026;width:400px;max-height:400px;display:flex;overflow:hidden;border:1px solid #e5e7eb}.field-dropdown-modal.open-upward{box-shadow:0 -10px 25px #00000026}.field-dropdown-body{display:flex;width:100%}.field-dropdown-sidebar{width:48px;background:#f8fafc;border-right:1px solid #e5e7eb;padding:8px 4px;display:flex;flex-direction:column;gap:8px}.field-dropdown-sidebar .sidebar-icon{width:32px;height:32px;background:#e5e7eb;border:1px solid #d1d5db;border-radius:6px;display:flex;align-items:center;justify-content:center;font-size:14px;color:#6b7280;cursor:pointer;transition:all .2s ease}.field-dropdown-sidebar .sidebar-icon:hover{background:#e0e7ff;border-color:#93c5fd}.field-dropdown-sidebar .sidebar-icon.selected{background:#dbeafe;border-color:#93c5fd;color:#2563eb}.field-dropdown-main{flex:1;display:flex;flex-direction:column}.field-dropdown-main .search-container{padding:12px;border-bottom:1px solid #e5e7eb}.field-dropdown-main .field-search-input{width:100%;padding:8px 12px;border:1px solid #d1d5db;border-radius:6px;font-size:14px;color:#1f2937;background:#fff;transition:border-color .2s ease}.field-dropdown-main .field-search-input:focus{outline:none;border-color:#3b82f6}.field-dropdown-content{flex:1;overflow-y:auto;padding:0}.field-dropdown-content .field-group{border-bottom:1px solid #f3f4f6}.field-dropdown-content .field-group:last-child{border-bottom:none}.field-dropdown-content .field-group-header{display:flex;align-items:center;gap:8px;padding:8px 12px;background:#f8fafc;font-size:12px;font-weight:500;color:#6b7280}.field-dropdown-content .page-icon{font-size:14px}.field-dropdown-content .page-name{color:#1f2937}.field-dropdown-content .field-list{padding:4px 0}.field-dropdown-content .field-item{display:flex;align-items:center;gap:8px;padding:8px 12px;cursor:pointer;transition:all .2s ease}.field-dropdown-content .field-item:hover{background:#f8fafc}.field-dropdown-content .field-icon{font-size:14px;width:16px;text-align:center}.field-dropdown-content .field-label{font-size:13px;color:#1f2937}.field-dropdown-content .no-fields-message{padding:20px 12px;text-align:center;color:#6b7280}.field-dropdown-content .no-fields-message p{margin:0 0 4px;font-size:13px}.field-dropdown-content .no-fields-message p:last-child{margin:0;font-size:12px;color:#9ca3af}.field-dropdown-content .category-placeholder{padding:20px 12px;text-align:center;color:#6b7280}.field-dropdown-content .category-placeholder p{margin:0;font-size:13px}.field-dropdown-content .loading-message{padding:20px 12px;text-align:center;color:#6b7280}.field-dropdown-content .loading-message p{margin:0;font-size:13px}.field-dropdown-content .calculation-item{display:flex;align-items:center;gap:8px;padding:8px 12px;cursor:pointer;transition:all .2s ease;border-left:3px solid #3b82f6}.field-dropdown-content .calculation-item:hover{background:#f0f9ff}.field-dropdown-content .calculation-item .field-label{font-weight:500;color:#1e293b}.field-dropdown-content .calculation-item .calculation-type{font-size:11px;color:#64748b;background:#f1f5f9;padding:2px 6px;border-radius:4px;text-transform:uppercase;font-weight:500}.rule-action{position:relative}.rule-action>span{display:block;font-size:14px;color:#6b7280;margin-bottom:16px}.action-inputs{display:flex;gap:16px;align-items:center}.action-select{padding:14px 40px 14px 18px;border:2px solid #e5e7eb;border-radius:8px;font-size:14px;color:#1f2937;background:#fff;cursor:pointer;min-width:140px;-webkit-appearance:none;-moz-appearance:none;appearance:none;background-image:url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 20 20'%3e%3cpath stroke='%236b7280' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.5' d='m6 8 4 4 4-4'/%3e%3c/svg%3e");background-position:right 12px center;background-repeat:no-repeat;background-size:16px}.action-select:focus{outline:none;border-color:#3b82f6}.action-value-input{flex:1;padding:14px 18px;border:2px solid #e5e7eb;border-radius:8px;font-size:14px;color:#1f2937;background:#fff;transition:border-color .2s ease}.action-value-input:focus{outline:none;border-color:#3b82f6}.rule-handle{position:absolute;right:12px;top:50%;transform:translateY(-50%);color:#d1d5db;font-size:18px;cursor:grab;padding:4px}.rule-handle:active{cursor:grabbing}.builder-actions{display:flex;justify-content:space-between;align-items:center;margin-top:32px;padding-top:24px;border-top:1px solid #e5e7eb}.new-rule-btn{background:#1f2937;color:#fff;border:none;border-radius:6px;padding:12px 20px;font-size:14px;font-weight:500;cursor:pointer;transition:background-color .2s ease}.new-rule-btn:hover{background:#111827}.done-btn{background:#f3f4f6;color:#1f2937;border:1px solid #d1d5db;border-radius:6px;padding:12px 24px;font-size:14px;font-weight:500;cursor:pointer;transition:all .2s ease}.done-btn:hover{background:#e5e7eb;border-color:#9ca3af}.calculations-list-container{max-width:900px;margin:0 auto;padding:24px}.calculations-list-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:32px}.calculations-list-header h2{font-size:28px;font-weight:600;color:#1f2937;margin:0}.new-calculation-btn{background:#3b82f6;color:#fff;border:none;border-radius:8px;padding:12px 24px;font-size:15px;font-weight:500;cursor:pointer;transition:background-color .2s ease}.new-calculation-btn:hover{background:#2563eb}.calculations-loading{text-align:center;padding:60px 20px;color:#6b7280;font-size:16px}.calculations-empty-state{text-align:center;padding:60px 20px}.calculations-empty-state p{font-size:18px;color:#1f2937;margin:0 0 8px;font-weight:500}.empty-state-description{font-size:14px;color:#6b7280;margin:0 0 24px!important;font-weight:400!important}.create-first-calculation-btn{background:#3b82f6;color:#fff;border:none;border-radius:8px;padding:14px 28px;font-size:16px;font-weight:500;cursor:pointer;transition:background-color .2s ease}.create-first-calculation-btn:hover{background:#2563eb}.calculations-list{display:flex;flex-direction:column;gap:16px}.calculation-card{background:#fff;border:2px solid #e5e7eb;border-radius:12px;padding:20px;transition:border-color .2s ease,box-shadow .2s ease}.calculation-card:hover{border-color:#3b82f6;box-shadow:0 4px 12px #3b82f61a}.calculation-card-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:16px}.calculation-info{display:flex;align-items:center;gap:12px}.calculation-name{font-size:20px;font-weight:600;color:#3b82f6;font-family:Monaco,Courier New,monospace}.calculation-type-badge{background:#f3f4f6;color:#6b7280;padding:4px 12px;border-radius:6px;font-size:12px;font-weight:500;text-transform:uppercase}.calculation-actions{display:flex;gap:8px}.edit-calculation-btn{background:#fff;color:#3b82f6;border:1px solid #3b82f6;border-radius:6px;padding:8px 16px;font-size:14px;font-weight:500;cursor:pointer;transition:all .2s ease}.edit-calculation-btn:hover{background:#3b82f6;color:#fff}.delete-calculation-btn{background:#fff;color:#ef4444;border:1px solid #ef4444;border-radius:6px;padding:8px 16px;font-size:14px;font-weight:500;cursor:pointer;transition:all .2s ease}.delete-calculation-btn:hover{background:#ef4444;color:#fff}.calculation-card-body{display:flex;flex-direction:column;gap:8px}.calculation-detail{font-size:14px;color:#4b5563}.calculation-detail strong{color:#1f2937;font-weight:600;margin-right:8px}.calculation-description{font-size:13px;color:#6b7280;font-style:italic;margin-top:4px}.edge-button-wrapper{display:flex;justify-content:center;align-items:center;width:100%;height:100%;pointer-events:all;overflow:visible}.edge-condition-button{display:flex;align-items:center;gap:6px;padding:6px 12px;background:#fff;border:1px solid #9ca3af;border-top:1px solid #9ca3af;border-right:1px solid #9ca3af;border-bottom:1px solid #9ca3af;border-left:1px solid #9ca3af;border-radius:6px;font-size:13px;font-weight:500;color:#6b7280;cursor:pointer;transition:all .2s ease;box-shadow:0 2px 4px #0000001a;pointer-events:all;overflow:visible;box-sizing:border-box}.edge-condition-button:hover{background:#f3f4f6;border-color:#9ca3af;border-top-color:#9ca3af;border-right-color:#9ca3af;border-bottom-color:#9ca3af;border-left-color:#9ca3af;color:#374151;box-shadow:0 4px 6px #00000026}.edge-condition-button.has-condition{background:#eff6ff;border-color:#3b82f6;color:#3b82f6}.edge-condition-button.has-condition:hover{background:#dbeafe;border-color:#2563eb;color:#2563eb}.condition-icon-small{width:14px;height:14px}.condition-builder-modal{background:#fff;border-radius:8px;box-shadow:0 10px 25px #0003;padding:20px;min-width:600px;max-width:700px;pointer-events:all}.condition-builder-header{font-size:16px;font-weight:600;color:#1e293b;margin-bottom:16px;padding-bottom:12px;border-bottom:1px solid #e2e8f0}.condition-field-selector{flex:1;min-width:160px;padding:8px 12px;background:#fff;border:1px solid #d1d5db;border-radius:6px;font-size:14px;color:#374151;cursor:pointer;transition:all .2s ease;display:flex;align-items:center;justify-content:space-between;text-align:left}.condition-field-selector:hover{border-color:#9ca3af;background:#f9fafb}.selected-field-badge{background:#eff6ff;color:#3b82f6;padding:2px 8px;border-radius:4px;font-size:13px;font-weight:500}.dropdown-arrow{color:#9ca3af;font-size:10px;margin-left:8px}.condition-modal-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:transparent;z-index:10002;pointer-events:all}.edge-delete-button-wrapper{display:flex;justify-content:center;align-items:center;width:100%;height:100%;pointer-events:all;background:transparent}.edgebutton-foreignobject{background:transparent!important;overflow:visible!important}foreignObject{background:transparent!important;overflow:visible!important}.edge-delete-button{width:24px;height:24px;background:#ef4444;border:2px solid white;border-radius:50%;font-size:20px;font-weight:700;color:#fff;cursor:pointer;transition:all .2s ease;pointer-events:all;display:flex;align-items:center;justify-content:center;padding:0;line-height:1;margin:0;text-align:center;font-family:Arial,sans-serif;outline:none}.edge-delete-button:focus{outline:none}.edge-delete-button:before{content:"×";display:block;margin-top:0;line-height:1}.edge-delete-button:hover{background:#dc2626;transform:scale(1.15)}.edge-delete-button:active{transform:scale(.95)}.modal-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background-color:#00000080;display:flex;align-items:center;justify-content:center;z-index:1000;animation:fadeIn .2s ease-out}.modal-content{background:#fff;border-radius:12px;width:90%;max-width:500px;max-height:90vh;overflow-y:auto;box-shadow:0 20px 25px -5px #0000001a,0 10px 10px -5px #0000000a;animation:slideUp .3s ease-out}@keyframes slideUp{0%{transform:translateY(20px);opacity:0}to{transform:translateY(0);opacity:1}}.modal-header{padding:24px 24px 16px;border-bottom:1px solid #e5e7eb;display:flex;justify-content:space-between;align-items:center}.modal-header h2{margin:0;font-size:20px;font-weight:600;color:#111827}.modal-close{background:none;border:none;padding:8px;cursor:pointer;color:#6b7280;border-radius:6px;display:flex;align-items:center;justify-content:center;transition:all .15s ease}.modal-close:hover:not(:disabled){background-color:#f3f4f6;color:#111827}.modal-close:disabled{opacity:.5;cursor:not-allowed}.modal-body{padding:24px}.invite-form{display:flex;flex-direction:column;gap:20px}.form-group{display:flex;flex-direction:column;gap:8px}.form-group label{font-size:14px;font-weight:500;color:#374151}.form-group input,.form-group select{padding:10px 12px;border:1px solid #d1d5db;border-radius:6px;font-size:14px;transition:all .15s ease;background-color:#fff;color:#111827}.form-group input:focus,.form-group select:focus{outline:none;border-color:#3b82f6;box-shadow:0 0 0 3px #3b82f61a}.form-group input::placeholder{color:#9ca3af}.form-group input:disabled,.form-group select:disabled{background-color:#f9fafb;cursor:not-allowed;opacity:.6;color:#6b7280}.role-description{font-size:13px;color:#6b7280;margin:0;line-height:1.5}.error-message{display:flex;align-items:flex-start;gap:8px;padding:12px;background-color:#fef2f2;border:1px solid #fecaca;border-radius:6px;color:#dc2626;font-size:14px;line-height:1.5}.error-message svg{flex-shrink:0;margin-top:2px}.modal-footer{display:flex;justify-content:flex-end;gap:12px;padding-top:4px}.btn-secondary,.btn-primary{padding:10px 16px;border-radius:6px;font-size:14px;font-weight:500;cursor:pointer;transition:all .15s ease;border:none}.btn-secondary{background-color:#fff;color:#374151;border:1px solid #d1d5db}.btn-secondary:hover:not(:disabled){background-color:#f9fafb;border-color:#9ca3af}.btn-primary{background-color:#3b82f6;color:#fff}.btn-primary:hover:not(:disabled){background-color:#2563eb}.btn-primary:disabled,.btn-secondary:disabled{opacity:.6;cursor:not-allowed}@media (max-width: 640px){.modal-content{width:95%;max-width:none;margin:20px}.modal-header{padding:20px 16px 12px}.modal-body{padding:20px 16px}.modal-header h2{font-size:18px}}.team-members-container{width:100%}.team-selector-bar{display:flex;justify-content:space-between;align-items:center;padding:16px 20px;background-color:#f8f9fa;border:1px solid #e5e7eb;border-radius:8px;margin-bottom:24px}.team-selector-group{display:flex;align-items:center;gap:12px;flex:1}.team-selector-group label{font-size:14px;font-weight:500;color:#374151;white-space:nowrap}.team-select{padding:8px 32px 8px 12px;border:1px solid #d1d5db;border-radius:6px;font-size:14px;font-weight:500;background-color:#fff;color:#111827;cursor:pointer;transition:all .15s ease;min-width:200px;max-width:300px;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='%23666' d='M6 9L1 4h10z'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 10px center;-webkit-appearance:none;-moz-appearance:none;appearance:none}.team-select option{color:#111827}.team-select:hover{border-color:#9ca3af}.team-select:focus{outline:none;border-color:#3b82f6;box-shadow:0 0 0 3px #3b82f61a}.team-count{font-size:13px;color:#6b7280;background-color:#e5e7eb;padding:4px 10px;border-radius:12px;font-weight:500}.create-team-btn{display:flex;align-items:center;gap:8px;padding:8px 16px;background-color:#fff;color:#374151;border:1px solid #d1d5db;border-radius:6px;font-size:14px;font-weight:500;cursor:pointer;transition:all .2s;white-space:nowrap}.create-team-btn:hover{background-color:#f9fafb;border-color:#9ca3af;color:#111827}.create-team-btn svg{flex-shrink:0}.team-members-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:32px}.tabs{display:flex;gap:8px}.tab{padding:8px 16px;background:none;border:none;font-size:14px;font-weight:500;color:#666;cursor:pointer;border-radius:6px;transition:all .2s}.tab:hover{background-color:#f5f5f5;color:#000}.tab.active{background-color:#e6f0ff;color:#3a86ff}.invite-member-btn{display:flex;align-items:center;gap:8px;padding:10px 16px;background-color:#2d2d2d;color:#fff;border:none;border-radius:6px;font-size:14px;font-weight:500;cursor:pointer;transition:all .2s}.invite-member-btn:hover{background-color:#1a1a1a}.invite-member-btn.secondary{background-color:#3a86ff}.invite-member-btn.secondary:hover{background-color:#2870dd}.members-table-container{background-color:#fff;border:1px solid #e5e5e5;border-radius:8px;overflow:hidden}.members-table{width:100%;border-collapse:collapse}.members-table thead{background-color:#fafafa}.members-table th{text-align:left;padding:14px 20px;font-size:13px;font-weight:600;color:#666;text-transform:uppercase;letter-spacing:.5px;border-bottom:1px solid #e5e5e5}.members-table tbody tr{border-bottom:1px solid #f0f0f0;transition:background-color .2s}.members-table tbody tr:hover{background-color:#fafafa}.members-table tbody tr:last-child{border-bottom:none}.members-table td{padding:16px 20px;font-size:14px;color:#333}.member-name-cell{display:flex;align-items:center;gap:12px}.member-avatar{width:36px;height:36px;border-radius:50%;background-color:#4a90e2;color:#fff;display:flex;align-items:center;justify-content:center;font-size:14px;font-weight:600;flex-shrink:0}.member-name{display:flex;align-items:center;gap:8px;font-weight:500;color:#000}.you-badge{background-color:#e6f0ff;color:#3a86ff;padding:3px 8px;border-radius:4px;font-size:11px;font-weight:600;text-transform:uppercase;letter-spacing:.3px}.member-email,.member-role{color:#666}.manage-btn{padding:6px 14px;background-color:#fff;border:1px solid #d0d0d0;border-radius:6px;color:#666;font-size:13px;font-weight:500;cursor:pointer;transition:all .2s}.manage-btn:hover{border-color:#999;color:#333;background-color:#f5f5f5}.cancel-invite-btn{padding:6px 14px;background-color:#fff;border:1px solid #d63031;border-radius:6px;color:#d63031;font-size:13px;font-weight:500;cursor:pointer;transition:all .2s}.cancel-invite-btn:hover{background-color:#d63031;color:#fff}.invites-container{background-color:#fff;border:1px solid #e5e5e5;border-radius:8px;padding:48px}.empty-state{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:16px;padding:32px;text-align:center}.empty-state p{color:#999;font-size:14px;margin:0}.modal-content{background-color:#fff;border-radius:12px;padding:24px;max-width:500px;width:90%;box-shadow:0 20px 60px #0000004d}.modal-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px}.modal-header h2{font-size:20px;font-weight:600;color:#000;margin:0}.modal-body{padding:20px 0}.modal-body p{text-align:center;color:#666;font-size:14px}.loading-state{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:60px 20px;gap:16px}.spinner{width:40px;height:40px;border:3px solid #f3f3f3;border-top:3px solid #3a86ff;border-radius:50%;animation:spin 1s linear infinite}.loading-state p{color:#666;font-size:14px;margin:0}.success-banner,.error-banner{display:flex;align-items:center;gap:12px;padding:12px 16px;border-radius:8px;margin-bottom:20px;font-size:14px;animation:slideDown .3s ease-out}@keyframes slideDown{0%{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}.success-banner{background-color:#d4edda;border:1px solid #c3e6cb;color:#155724}.error-banner{background-color:#f8d7da;border:1px solid #f5c6cb;color:#721c24}.tab .badge{display:inline-block;background-color:#3a86ff;color:#fff;border-radius:10px;padding:2px 6px;font-size:11px;font-weight:600;margin-left:6px}.tab.active .badge{background-color:#fff;color:#3a86ff}.role-badge{display:inline-block;padding:4px 10px;border-radius:12px;font-size:12px;font-weight:500;text-transform:capitalize}.role-badge.role-admin{background-color:#fff3cd;color:#856404}.role-badge.role-member{background-color:#e7f3ff;color:#004085}.role-select{padding:6px 10px;border:1px solid #d1d5db;border-radius:6px;font-size:13px;background-color:#fff;color:#111827;cursor:pointer;transition:all .15s ease}.role-select option{color:#111827}.role-select:hover{border-color:#9ca3af}.role-select:focus{outline:none;border-color:#3a86ff;box-shadow:0 0 0 3px #3a86ff1a}.remove-btn{padding:6px 14px;background-color:#fff;border:1px solid #d63031;border-radius:6px;color:#d63031;font-size:13px;font-weight:500;cursor:pointer;transition:all .2s}.remove-btn:hover{background-color:#d63031;color:#fff}.expires-cell{color:#999;font-size:13px}.create-team-form{padding:24px}.create-team-form .form-group{margin-bottom:20px;display:flex;flex-direction:column;gap:8px}.create-team-form .form-group label{font-size:14px;font-weight:500;color:#374151}.create-team-form .form-group input{padding:10px 12px;border:1px solid #d1d5db;border-radius:6px;font-size:14px;transition:all .15s ease;background-color:#fff;color:#111827}.create-team-form .form-group input::placeholder{color:#9ca3af}.create-team-form .form-group input:focus{outline:none;border-color:#3b82f6;box-shadow:0 0 0 3px #3b82f61a}.create-team-form .help-text{margin:8px 0 0;font-size:13px;color:#6b7280;line-height:1.5}.create-team-form .modal-footer{margin-top:24px;display:flex;justify-content:flex-end;gap:12px}.create-team-form .btn-primary,.create-team-form .btn-secondary{padding:10px 16px;border-radius:6px;font-size:14px;font-weight:500;cursor:pointer;transition:all .15s ease;border:none}.create-team-form .btn-secondary{background-color:#fff;color:#374151;border:1px solid #d1d5db}.create-team-form .btn-secondary:hover{background-color:#f9fafb;border-color:#9ca3af}.create-team-form .btn-primary{background-color:#3b82f6;color:#fff}.create-team-form .btn-primary:hover{background-color:#2563eb}@media (max-width: 768px){.team-selector-bar{flex-direction:column;gap:12px;align-items:stretch}.team-selector-group{flex-direction:column;align-items:stretch;gap:8px}.team-select{max-width:100%}.create-team-btn{width:100%;justify-content:center}.team-members-header{flex-direction:column;align-items:flex-start;gap:16px}.tabs{width:100%}.tab{flex:1;text-align:center}.invite-member-btn{width:100%;justify-content:center}.members-table{font-size:13px}.members-table th,.members-table td{padding:12px}.member-avatar{width:32px;height:32px;font-size:13px}.modal-content{width:95%;padding:20px}}@media (max-width: 640px){.members-table th:nth-child(3),.members-table td:nth-child(3){display:none}.invites-container,.empty-state{padding:24px}}.my-account-container{width:100%}.account-section{background-color:#fff;border:1px solid #e5e5e5;border-radius:12px;padding:32px;margin-bottom:24px}.account-section .section-header{margin-bottom:28px}.account-section .section-header h2{font-size:18px;font-weight:600;color:#000;margin:0 0 4px}.account-section .section-description{font-size:14px;color:#999;margin:0}.profile-picture-row{display:flex;align-items:flex-start;gap:40px;margin-bottom:28px}.input-label{display:flex;align-items:center;gap:6px;font-size:14px;font-weight:500;color:#333;margin-bottom:8px;min-width:120px}.input-label svg{color:#999;cursor:help;flex-shrink:0}.profile-picture-content{display:flex;align-items:center;gap:16px}.profile-picture-placeholder{width:80px;height:80px;border-radius:50%;background-color:#f5f5f5;display:flex;align-items:center;justify-content:center;overflow:hidden}.profile-picture{width:80px;height:80px;border-radius:50%;object-fit:cover}.remove-picture-btn{display:flex;align-items:center;gap:6px;padding:8px 14px;background-color:#fff;border:1px solid #d0d0d0;border-radius:6px;color:#666;font-size:13px;font-weight:500;cursor:pointer;transition:all .2s}.remove-picture-btn:hover{border-color:#999;color:#333;background-color:#f5f5f5}.name-row{display:flex;gap:16px}.input-group{flex:1;display:flex;flex-direction:column}.text-input{width:100%;padding:10px 14px;border:1px solid #d0d0d0;border-radius:6px;font-size:14px;color:#333;transition:border-color .2s,box-shadow .2s}.email-row{display:flex;flex-direction:column;gap:8px}.email-content{display:flex;align-items:center;justify-content:space-between;gap:16px}.email-display{display:flex;align-items:center;gap:10px;padding:10px 14px;background-color:#f9f9f9;border:1px solid #e5e5e5;border-radius:6px;flex:1;max-width:400px}.email-display svg{color:#999;flex-shrink:0}.email-display span{font-size:14px;color:#333}.edit-btn{padding:8px 16px;background-color:#fff;border:1px solid #d0d0d0;border-radius:6px;color:#666;font-size:13px;font-weight:500;cursor:pointer;transition:all .2s;flex-shrink:0}.edit-btn:hover{border-color:#999;color:#333;background-color:#f5f5f5}.enable-2fa-btn{padding:10px 18px;background-color:#fff;border:1px solid #d0d0d0;border-radius:6px;color:#333;font-size:14px;font-weight:500;cursor:pointer;transition:all .2s}.enable-2fa-btn:hover{border-color:#999;background-color:#f5f5f5}.signout-devices-btn{padding:10px 18px;background-color:#fff;border:1px solid #d0d0d0;border-radius:6px;color:#333;font-size:14px;font-weight:500;cursor:pointer;transition:all .2s}.signout-devices-btn:hover{border-color:#999;background-color:#f5f5f5}.integrations-link{display:inline-flex;align-items:center;gap:6px;color:#3a86ff;font-size:14px;text-decoration:none;transition:opacity .2s}.integrations-link:hover{opacity:.8}.integrations-link svg{flex-shrink:0}@media (max-width: 768px){.name-row{flex-direction:column}.email-content{flex-direction:column;align-items:stretch}.email-display{max-width:100%}.profile-picture-row{flex-direction:column;gap:16px}}.custom-domain-container{max-width:900px;padding:2rem}.loading-state{text-align:center;padding:3rem;color:#666}.alert{padding:1rem 1.5rem;border-radius:8px;margin-bottom:1.5rem;display:flex;justify-content:space-between;align-items:center}.alert-error{background-color:#fee;color:#c33;border:1px solid #fcc}.alert-success{background-color:#efe;color:#3a3;border:1px solid #cfc}.alert-close{background:none;border:none;font-size:1.5rem;cursor:pointer;color:inherit;padding:0;width:24px;height:24px}.domain-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:2rem}.domain-header h2{margin:0 0 .5rem;font-size:1.5rem;color:#1a1a1a}.domain-header p{margin:0;color:#666;font-size:.9rem}.domain-empty-state{text-align:center;padding:4rem 2rem;border:2px dashed #e0e0e0;border-radius:12px;background-color:#fafafa}.domain-icon{margin-bottom:1.5rem}.domain-empty-state h3{margin:0 0 .5rem;font-size:1.25rem;color:#333}.domain-empty-state p{color:#666;margin-bottom:2rem}.domains-list{display:flex;flex-direction:column;gap:1rem}.domain-card{display:flex;justify-content:space-between;align-items:center;padding:1.5rem;border:1px solid #e0e0e0;border-radius:8px;background:#fff;transition:box-shadow .2s}.domain-card:hover{box-shadow:0 2px 8px #0000001a}.domain-info{flex:1}.domain-name{font-size:1.1rem;font-weight:600;color:#1a1a1a;margin-bottom:.5rem}.domain-meta{display:flex;align-items:center;gap:1rem}.domain-date{font-size:.85rem;color:#999}.domain-actions{display:flex;gap:.5rem}.status-badge{display:inline-block;padding:.25rem .75rem;border-radius:12px;font-size:.8rem;font-weight:500}.status-active{background-color:#e8f5e9;color:#2e7d32}.status-pending{background-color:#fff3e0;color:#e65100}.status-verifying,.status-issuing{background-color:#fff9c4;color:#f57f17}.status-failed{background-color:#ffebee;color:#c62828}.status-expiring{background-color:#fff3e0;color:#ef6c00}.btn-primary,.btn-secondary,.btn-danger{padding:.6rem 1.2rem;border-radius:6px;font-weight:500;cursor:pointer;border:none;transition:all .2s}.btn-primary{background-color:#4f46e5;color:#fff}.btn-primary:hover{background-color:#4338ca}.btn-secondary{background-color:#f3f4f6;color:#374151;border:1px solid #d1d5db}.btn-secondary:hover{background-color:#e5e7eb}.btn-danger{background-color:#dc2626;color:#fff}.btn-danger:hover{background-color:#b91c1c}.modal-content{background:#fff;border-radius:12px;width:90%;max-width:500px;max-height:90vh;overflow-y:auto;box-shadow:0 20px 25px -5px #0000001a}.modal-large{max-width:700px}.modal-header{padding:1.5rem;border-bottom:1px solid #e5e7eb;display:flex;justify-content:space-between;align-items:center}.modal-header h3{margin:0;font-size:1.25rem;color:#1a1a1a}.modal-close{background:none;border:none;font-size:2rem;cursor:pointer;color:#9ca3af;padding:0;width:32px;height:32px;display:flex;align-items:center;justify-content:center}.modal-close:hover{color:#4b5563}.modal-body{padding:1.5rem}.modal-footer{padding:1.5rem;border-top:1px solid #e5e7eb;display:flex;justify-content:flex-end;gap:.75rem}.form-group{margin-bottom:1.5rem}.form-group label{display:block;margin-bottom:.5rem;font-weight:500;color:#374151}.form-input{width:100%;padding:.75rem;border:1px solid #d1d5db;border-radius:6px;font-size:1rem}.form-input:focus{outline:none;border-color:#4f46e5;box-shadow:0 0 0 3px #4f46e51a}.form-hint{display:block;margin-top:.5rem;color:#6b7280;font-size:.85rem}.config-steps{display:flex;flex-direction:column;gap:2rem}.config-step{border:1px solid #e5e7eb;border-radius:8px;overflow:hidden}.config-step.completed{border-color:#10b981;background-color:#f0fdf4}.step-header{display:flex;align-items:center;padding:1.25rem;background-color:#f9fafb;gap:1rem}.config-step.completed .step-header{background-color:#ecfdf5}.step-number{width:32px;height:32px;border-radius:50%;background-color:#4f46e5;color:#fff;display:flex;align-items:center;justify-content:center;font-weight:600;flex-shrink:0}.config-step.completed .step-number{background-color:#10b981}.step-title{flex:1}.step-title h4{margin:0 0 .25rem;font-size:1rem;color:#1a1a1a}.step-title p{margin:0;font-size:.85rem;color:#6b7280}.step-content{padding:1.25rem}.step-disabled{color:#9ca3af;font-style:italic}.dns-table{width:100%;border-collapse:collapse;margin-bottom:1rem;border:1px solid #e5e7eb;border-radius:6px;overflow:hidden}.dns-table thead{background-color:#f9fafb}.dns-table th,.dns-table td{padding:.75rem;text-align:left;border-bottom:1px solid #e5e7eb}.dns-table th{font-weight:600;color:#374151;font-size:.85rem;text-transform:uppercase}.dns-table td{font-family:Monaco,Courier New,monospace;font-size:.9rem}.dns-table tbody tr:last-child td{border-bottom:none}.dns-table code{background-color:#f3f4f6;padding:.25rem .5rem;border-radius:3px;font-size:.85rem}.dns-instructions{background-color:#f9fafb;padding:1rem;border-radius:6px;margin-bottom:1rem}.dns-instructions p{margin:0 0 .75rem;color:#374151}.dns-instructions ol{margin:0;padding-left:1.5rem;color:#6b7280}.dns-instructions li{margin-bottom:.5rem}.dns-warning{background-color:#fff8e1;border:1px solid #ffb74d;border-radius:6px;padding:1rem;margin-top:1rem}.dns-warning p{margin:0;color:#e65100;font-size:.9rem}.dns-warning p:first-child{font-weight:600;margin-bottom:.5rem}.dns-warning strong{color:#d84315}.error-message,.success-message,.loading-message{padding:1rem;border-radius:6px;margin-top:1rem}.error-message{background-color:#fee;color:#c33;border:1px solid #fcc}.error-message strong{display:block;margin-bottom:.5rem}.error-message .btn-primary{margin-top:.75rem}.success-message{background-color:#efe;color:#2a2;border:1px solid #cfc}.success-message p{margin:0}.success-message small{color:#6a6}.loading-message{background-color:#fffbf0;color:#856404;border:1px solid #ffeaa7;display:flex;align-items:center;gap:1rem}.loading-message p{margin:0}.spinner{width:20px;height:20px;border:3px solid #f3f3f3;border-top:3px solid #4f46e5;border-radius:50%;animation:spin 1s linear infinite}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.domain-url{display:block;background-color:#f3f4f6;padding:1rem;border-radius:6px;margin-top:.5rem;font-family:Monaco,Courier New,monospace;word-break:break-all}@media (max-width: 768px){.custom-domain-container{padding:1rem}.domain-header,.domain-card{flex-direction:column;align-items:flex-start;gap:1rem}.domain-actions{width:100%}.domain-actions button{flex:1}.modal-content{width:95%;max-width:none}.modal-footer{flex-direction:column-reverse}.modal-footer button{width:100%}}.billing-container{width:100%}.billing-empty-state{background-color:#fff;border:1px solid #e5e5e5;border-radius:12px;padding:100px 60px;display:flex;flex-direction:column;align-items:center;text-align:center}.billing-title{font-size:22px;font-weight:600;color:#000;margin:0 0 16px}.billing-description{font-size:15px;color:#999;line-height:1.6;max-width:500px;margin:0 0 32px}.billing-upgrade-btn{display:flex;align-items:center;gap:8px;padding:12px 24px;background-color:#2d2d2d;color:#fff;border:none;border-radius:8px;font-size:15px;font-weight:600;cursor:pointer;transition:all .2s;box-shadow:0 2px 8px #00000026}.billing-upgrade-btn:hover{background-color:#1a1a1a;transform:translateY(-1px);box-shadow:0 4px 12px #0003}.billing-upgrade-btn svg{color:#ffd93d}.billing-details{width:100%}.billing-section{background-color:#fff;border:1px solid #e5e5e5;border-radius:12px;padding:32px;margin-bottom:24px}.billing-section .section-header{margin-bottom:20px}.billing-section .section-header h2{font-size:18px;font-weight:600;color:#000;margin:0 0 4px}.billing-section .section-description{font-size:14px;color:#999;margin:0}@media (max-width: 768px){.billing-empty-state{padding:60px 40px}.billing-title{font-size:20px}.billing-description{font-size:14px}}.usage-container{width:100%}.usage-header{margin-bottom:32px}.usage-subtitle{font-size:15px;color:#666;margin:0;line-height:1.5}.usage-loading{padding:60px;text-align:center;color:#999;font-size:14px}.usage-stats-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:24px;max-width:900px}.usage-stat-card{background-color:#fff;border:1px solid #e5e5e5;border-radius:12px;padding:32px;display:flex;align-items:flex-start;gap:20px;transition:all .2s}.usage-stat-card:hover{border-color:#d0d0d0;box-shadow:0 2px 8px #0000000d}.stat-icon{width:56px;height:56px;border-radius:12px;display:flex;align-items:center;justify-content:center;flex-shrink:0}.submissions-icon,.forms-icon{background-color:#6c7cf8}.stat-icon svg{width:24px;height:24px}.stat-content{display:flex;flex-direction:column;gap:8px;flex:1}.stat-label{font-size:14px;color:#666;font-weight:400;line-height:1.4}.stat-value{font-size:36px;font-weight:700;color:#000;line-height:1}@media (max-width: 768px){.usage-stats-grid{grid-template-columns:1fr}.usage-stat-card{padding:24px}.stat-value{font-size:32px}}@media (max-width: 480px){.stat-icon{width:48px;height:48px}.stat-icon svg{width:20px;height:20px}.stat-value{font-size:28px}}.developer-container{width:100%}.developer-loading{padding:60px;text-align:center;color:#999;font-size:14px}.developer-empty-state{background-color:#fff;border:1px solid #e5e5e5;border-radius:12px;padding:80px 60px;display:flex;flex-direction:column;align-items:center;text-align:center}.api-key-icon{margin-bottom:24px;opacity:.5}.empty-description{font-size:15px;color:#999;line-height:1.6;max-width:500px;margin:0 0 32px}.create-api-key-btn{padding:12px 24px;background-color:#3a86ff;color:#fff;border:none;border-radius:8px;font-size:15px;font-weight:600;cursor:pointer;transition:all .2s;box-shadow:0 2px 8px #3a86ff33}.create-api-key-btn:hover{background-color:#2870dd;transform:translateY(-1px);box-shadow:0 4px 12px #3a86ff4d}.api-docs-notice{margin-top:40px;padding:20px;background-color:#f9f9f9;border-radius:8px;max-width:600px}.api-docs-notice p{font-size:13px;color:#666;margin:0;line-height:1.6}.api-docs-notice a{color:#3a86ff;text-decoration:none}.api-docs-notice a:hover{text-decoration:underline}.api-keys-list{width:100%}.api-keys-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:24px;flex-wrap:wrap;gap:16px}.api-keys-subtitle{font-size:15px;color:#666;margin:0;flex:1}.api-key-card{background-color:#f9f9f9;border:1px solid #e5e5e5;border-radius:12px;padding:28px;margin-bottom:20px}.api-key-card-header{display:flex;align-items:flex-start;gap:16px;margin-bottom:24px}.key-icon{width:48px;height:48px;background-color:#e6f0ff;border-radius:10px;display:flex;align-items:center;justify-content:center;flex-shrink:0}.key-info{flex:1}.key-info h3{font-size:16px;font-weight:600;color:#000;margin:0 0 6px}.key-meta{font-size:13px;color:#999;margin:0}.key-actions{display:flex;gap:8px;align-items:center}.edit-key-btn{padding:8px;background:none;border:none;color:#3a86ff;cursor:pointer;border-radius:6px;transition:all .2s;display:flex;align-items:center;justify-content:center}.edit-key-btn:hover{background-color:#3a86ff1a}.delete-key-btn{padding:8px;background:none;border:none;color:#d63031;cursor:pointer;border-radius:6px;transition:all .2s;display:flex;align-items:center;justify-content:center}.delete-key-btn:hover{background-color:#d630311a}.api-key-details{display:flex;flex-direction:column;gap:20px}.detail-row{display:flex;flex-direction:column;gap:8px}.detail-row label{font-size:13px;font-weight:600;color:#333}.url-input input,.key-input-group input{width:100%;padding:10px 14px;border:1px solid #d0d0d0;border-radius:6px;font-size:13px;color:#666;background-color:#fff;font-family:Monaco,Menlo,Courier New,monospace}.key-input-group{display:flex;gap:8px}.key-input-group input{flex:1}.copy-btn,.regenerate-btn{display:flex;align-items:center;gap:6px;padding:10px 14px;background-color:#2d2d2d;color:#fff;border:none;border-radius:6px;font-size:13px;font-weight:500;cursor:pointer;transition:all .2s;white-space:nowrap}.copy-btn:hover,.regenerate-btn:hover{background-color:#1a1a1a}.copy-btn:disabled{opacity:.5;cursor:not-allowed}.copy-btn:disabled:hover{background-color:#2d2d2d}.regenerate-btn{background-color:#fff;color:#666;border:1px solid #d0d0d0}.regenerate-btn:hover{background-color:#f5f5f5;border-color:#999;color:#333}.key-scopes{display:flex;flex-direction:column;gap:8px}.key-scopes label{font-size:13px;font-weight:600;color:#333}.scope-badges{display:flex;flex-wrap:wrap;gap:8px}.scope-badge{padding:4px 10px;background-color:#e6f0ff;color:#3a86ff;border-radius:4px;font-size:12px;font-weight:500;font-family:Monaco,Menlo,Courier New,monospace}.modal-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background-color:#00000080;display:flex;align-items:center;justify-content:center;z-index:1000;animation:fadeIn .2s}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.modal-content{background-color:#fff;border-radius:12px;padding:28px;max-width:550px;width:90%;max-height:90vh;overflow-y:auto;box-shadow:0 20px 60px #0000004d;animation:slideUp .3s}@keyframes slideUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.modal-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:24px;gap:16px}.success-icon{width:40px;height:40px;border-radius:50%;background-color:#e8f5e9;display:flex;align-items:center;justify-content:center}.modal-close{background:none;border:none;cursor:pointer;padding:4px;color:#666;display:flex;align-items:center;justify-content:center;transition:color .2s;flex-shrink:0}.text-input,.select-input{width:100%;padding:10px 14px;border:1px solid #d0d0d0;border-radius:6px;font-size:14px;color:#000;background-color:#fff;transition:border-color .2s,box-shadow .2s}.text-input:focus,.select-input:focus{outline:none;border-color:#3a86ff;box-shadow:0 0 0 3px #3a86ff1a}.scopes-checkboxes{display:flex;flex-direction:column;gap:12px}.btn-primary:disabled:hover{background-color:#3a86ff}.btn-primary-full{width:100%;padding:12px 20px;background-color:#3a86ff;color:#fff;border:none;border-radius:6px;font-size:14px;font-weight:600;cursor:pointer;transition:all .2s}.btn-primary-full:hover{background-color:#2870dd}.new-key-modal{max-width:600px}.warning-box{display:flex;align-items:flex-start;gap:12px;padding:16px;background-color:#fff9e6;border:1px solid #ffe082;border-radius:8px;margin-bottom:24px}.warning-box svg{flex-shrink:0;margin-top:2px}.warning-box p{font-size:14px;color:#856404;margin:0;line-height:1.5}.new-key-details{display:flex;flex-direction:column;gap:20px}.url-display{padding:10px 14px;background-color:#f5f5f5;border:1px solid #e5e5e5;border-radius:6px;font-size:13px;color:#666;font-family:Monaco,Menlo,Courier New,monospace;word-break:break-all}.key-display-group{display:flex;gap:8px}.key-display{flex:1;padding:10px 14px;background-color:#fff;border:1px solid #3a86ff;border-radius:6px;font-size:13px;color:#333;font-family:Monaco,Menlo,Courier New,monospace;font-weight:600}.copy-btn-primary{display:flex;align-items:center;gap:6px;padding:10px 16px;background-color:#2d2d2d;color:#fff;border:none;border-radius:6px;font-size:13px;font-weight:500;cursor:pointer;transition:all .2s;white-space:nowrap}.copy-btn-primary:hover{background-color:#1a1a1a}.copy-btn-primary.copied{background-color:#4caf50}@media (max-width: 768px){.developer-empty-state{padding:60px 40px}.api-keys-header{flex-direction:column;align-items:stretch}.key-input-group{flex-direction:column}.copy-btn,.regenerate-btn{justify-content:center}.key-display-group{flex-direction:column}.modal-content{width:95%;padding:24px}}.webhooks-container{width:100%}.webhooks-loading{padding:60px;text-align:center;color:#999;font-size:14px}.webhooks-empty-state{background-color:#fff;border:1px solid #e5e5e5;border-radius:12px;padding:80px 60px;display:flex;flex-direction:column;align-items:center;text-align:center}.webhook-icon{margin-bottom:24px;opacity:.5}.empty-title{font-size:22px;font-weight:600;color:#000;margin:0 0 12px}.empty-description{font-size:15px;color:#999;line-height:1.6;max-width:520px;margin:0 0 32px}.create-webhook-btn{padding:12px 24px;background-color:#3a86ff;color:#fff;border:none;border-radius:8px;font-size:15px;font-weight:600;cursor:pointer;transition:all .2s;box-shadow:0 2px 8px #3a86ff33}.create-webhook-btn:hover{background-color:#2870dd;transform:translateY(-1px);box-shadow:0 4px 12px #3a86ff4d}.webhooks-list{width:100%}.webhooks-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:24px;flex-wrap:wrap;gap:16px}.webhooks-subtitle{font-size:15px;color:#666;margin:0;flex:1}.webhook-card{background-color:#fff;border:1px solid #e5e5e5;border-radius:12px;padding:24px;margin-bottom:16px}.webhook-card-header{display:flex;align-items:flex-start;gap:16px;margin-bottom:16px}.webhook-icon-small{width:40px;height:40px;background-color:#6c7cf8;border-radius:8px;display:flex;align-items:center;justify-content:center;flex-shrink:0}.webhook-info{flex:1;min-width:0}.webhook-info h3{font-size:16px;font-weight:600;color:#000;margin:0 0 6px}.webhook-url{font-size:13px;color:#3a86ff;margin:0 0 4px;font-family:Monaco,Menlo,Courier New,monospace;word-break:break-all}.webhook-meta{font-size:12px;color:#999;margin:0}.webhook-actions{display:flex;gap:8px;align-items:center;flex-shrink:0}.webhook-toggle{position:relative;display:inline-block;width:36px;height:20px}.webhook-toggle input{opacity:0;width:0;height:0}.toggle-slider-small{position:absolute;cursor:pointer;top:0;left:0;right:0;bottom:0;background-color:#d0d0d0;transition:.3s;border-radius:20px}.toggle-slider-small:before{position:absolute;content:"";height:14px;width:14px;left:3px;bottom:3px;background-color:#fff;transition:.3s;border-radius:50%}.webhook-toggle input:checked+.toggle-slider-small{background-color:#4caf50}.webhook-toggle input:checked+.toggle-slider-small:before{transform:translate(16px)}.webhook-action-btn{padding:8px;background:none;border:1px solid #d0d0d0;color:#666;cursor:pointer;border-radius:6px;transition:all .2s;display:flex;align-items:center;justify-content:center}.webhook-action-btn:hover{background-color:#f5f5f5;border-color:#999}.webhook-action-btn.delete{color:#d63031;border-color:#d63031}.webhook-action-btn.delete:hover{background-color:#d630311a}.webhook-stats{display:flex;gap:24px;padding:16px;background-color:#f9f9f9;border-radius:8px}.stat-item{display:flex;gap:8px;font-size:13px}.stat-label{color:#999}.stat-value{color:#333;font-weight:600}.stat-item.success .stat-value{color:#4caf50}.stat-item.error .stat-value{color:#d63031}.modal-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background-color:#00000080;display:flex;align-items:center;justify-content:center;z-index:1000}.modal-content{background-color:#fff;border-radius:12px;padding:28px;max-width:550px;width:90%;max-height:90vh;overflow-y:auto;box-shadow:0 20px 60px #0000004d}.events-modal{max-width:800px}.modal-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:24px}.modal-header h2{font-size:20px;font-weight:600;color:#000;margin:0;flex:1}.modal-close{background:none;border:none;cursor:pointer;padding:4px;color:#666;display:flex;align-items:center;justify-content:center;transition:color .2s}.modal-close:hover{color:#000}.modal-body{margin-bottom:24px}.form-group{margin-bottom:20px}.form-group label{display:block;font-size:14px;font-weight:600;color:#333;margin-bottom:8px}.text-input{width:100%;padding:10px 14px;border:1px solid #d0d0d0;border-radius:6px;font-size:14px;color:#000;background-color:#fff;transition:border-color .2s,box-shadow .2s}.text-input::placeholder{color:#999}.input-hint{font-size:12px;color:#999;margin:6px 0 0}.events-checkboxes{display:flex;flex-direction:column;gap:12px}.checkbox-label{display:flex;align-items:center;gap:10px;font-size:14px;color:#333;cursor:pointer}.checkbox-label input[type=checkbox]{width:18px;height:18px;cursor:pointer}.modal-footer{display:flex;gap:12px;justify-content:flex-end}.btn-secondary,.btn-primary{padding:10px 20px;border-radius:6px;font-size:14px;font-weight:500;cursor:pointer;transition:all .2s}.btn-secondary{background-color:#fff;color:#666;border:1px solid #d0d0d0}.btn-secondary:hover{background-color:#f5f5f5;border-color:#999}.btn-primary{background-color:#3a86ff;color:#fff;border:none}.btn-primary:hover{background-color:#2870dd}.btn-primary:disabled{opacity:.5;cursor:not-allowed}.events-empty{padding:40px;text-align:center;color:#999}.events-table{width:100%;border-collapse:collapse}.events-table th{text-align:left;padding:12px;font-size:12px;font-weight:600;color:#666;text-transform:uppercase;border-bottom:2px solid #e5e5e5}.events-table td{padding:12px;font-size:14px;border-bottom:1px solid #f0f0f0}.status-badge{padding:4px 8px;border-radius:4px;font-size:11px;font-weight:600;text-transform:uppercase}.status-badge.delivered{background-color:#e8f5e9;color:#2e7d32}.status-badge.failed{background-color:#ffebee;color:#c62828}.status-badge.pending{background-color:#fff3e0;color:#e65100}.status-badge.delivering{background-color:#e3f2fd;color:#1565c0}.settings-container{display:flex;min-height:100vh;background-color:#fafafa}.settings-sidebar{width:240px;background-color:#fff;border-right:1px solid #e5e5e5;padding:24px 0;display:flex;flex-direction:column;position:fixed;height:100vh;overflow-y:auto}.back-to-dashboard{display:flex;align-items:center;gap:8px;padding:8px 24px;margin-bottom:24px;background:none;border:none;color:#666;font-size:14px;cursor:pointer;transition:color .2s}.back-to-dashboard:hover{color:#000}.settings-nav{display:flex;flex-direction:column;gap:2px;flex:1}.settings-nav-item{display:flex;align-items:center;gap:12px;padding:10px 24px;background:none;border:none;text-align:left;font-size:14px;color:#666;cursor:pointer;transition:all .2s;position:relative}.settings-nav-item:hover:not(.disabled){background-color:#f5f5f5;color:#000}.settings-nav-item.active{background-color:#f0f0f0;color:#000;font-weight:500}.settings-nav-item.active:before{content:"";position:absolute;left:0;top:0;bottom:0;width:3px;background-color:#3a86ff}.settings-nav-item.disabled{opacity:.5;cursor:not-allowed}.settings-nav-item svg{flex-shrink:0;width:18px;height:18px}.settings-nav-item .badge{margin-left:auto;background-color:#ff6b6b;color:#fff;padding:2px 6px;border-radius:10px;font-size:11px;font-weight:600}.settings-sidebar-footer{border-top:1px solid #e5e5e5;padding-top:16px;margin-top:16px;display:flex;flex-direction:column;gap:2px}.upgrade-btn{margin:12px 24px 0;display:flex;align-items:center;justify-content:center;gap:8px;padding:10px 16px;background:linear-gradient(135deg,#ffd93d,#ffb800);border:none;border-radius:8px;color:#000;font-size:14px;font-weight:600;cursor:pointer;transition:transform .2s,box-shadow .2s}.upgrade-btn:hover{transform:translateY(-1px);box-shadow:0 4px 12px #ffb8004d}.settings-main{margin-left:240px;flex:1;padding:48px 80px;max-width:1200px}.settings-main h1{font-size:28px;font-weight:600;color:#000;margin-bottom:32px}.settings-section{background-color:#fff;border:1px solid #e5e5e5;border-radius:12px;padding:32px;margin-bottom:24px}.section-header{margin-bottom:24px;display:flex;align-items:center;gap:12px;flex-wrap:wrap}.section-header h2{font-size:18px;font-weight:600;color:#000;margin:0}.section-description{font-size:14px;color:#666;margin:4px 0 0;width:100%}.enterprise-badge{background-color:#3a86ff;color:#fff;padding:4px 10px;border-radius:4px;font-size:11px;font-weight:600;text-transform:uppercase;letter-spacing:.5px}.setting-row{display:flex;align-items:center;justify-content:space-between;gap:24px;padding:20px 0;border-bottom:1px solid #f0f0f0}.setting-row:last-child{border-bottom:none;padding-bottom:0}.setting-row:first-child{padding-top:0}.setting-label{display:flex;align-items:center;gap:8px;font-size:14px;color:#333;font-weight:500}.setting-label svg{color:#999;cursor:help}.logo-upload{flex-shrink:0}.no-logo-placeholder{width:100px;height:100px;background-color:#f5f5f5;border:2px dashed #d0d0d0;border-radius:8px;display:flex;align-items:center;justify-content:center;color:#999;font-size:13px}.upgrade-to-set-btn{padding:8px 16px;background-color:#fff;border:1px solid #3a86ff;border-radius:6px;color:#3a86ff;font-size:13px;font-weight:500;cursor:pointer;transition:all .2s}.upgrade-to-set-btn:hover{background-color:#3a86ff;color:#fff}.subdomain-input{display:flex;align-items:center;gap:4px;font-size:14px;color:#666}.subdomain-link{color:#3a86ff;font-weight:500;cursor:pointer}.subdomain-link:hover{text-decoration:underline}.remove-subdomain-btn{margin-left:12px;padding:4px 12px;background:none;border:none;color:#999;font-size:13px;cursor:pointer;text-decoration:underline}.remove-subdomain-btn:hover{color:#666}.toggle-switch{position:relative;display:inline-block;width:44px;height:24px;flex-shrink:0}.toggle-switch input{opacity:0;width:0;height:0}.toggle-slider{position:absolute;cursor:pointer;top:0;left:0;right:0;bottom:0;background-color:#d0d0d0;transition:.3s;border-radius:24px}.toggle-slider:before{position:absolute;content:"";height:18px;width:18px;left:3px;bottom:3px;background-color:#fff;transition:.3s;border-radius:50%}.toggle-switch input:checked+.toggle-slider{background-color:#d0d0d0}.toggle-switch input:checked+.toggle-slider:before{transform:translate(20px)}.text-input{flex:1;max-width:400px;padding:10px 14px;border:1px solid #d0d0d0;border-radius:6px;font-size:14px;color:#333;transition:border-color .2s}.text-input:focus{outline:none;border-color:#3a86ff;box-shadow:0 0 0 3px #3a86ff1a}.sso-notice{padding:16px;background-color:#f9f9f9;border-radius:6px;font-size:14px;color:#666}.sso-notice .link{color:#3a86ff;text-decoration:none}.sso-notice .link:hover{text-decoration:underline}.danger-section{border-color:#fee;background-color:#fff9f9}.danger-section .section-header h2{color:#d63031}.danger-btn{padding:10px 20px;background-color:#fff;border:1px solid #d63031;border-radius:6px;color:#d63031;font-size:14px;font-weight:500;cursor:pointer;transition:all .2s}.danger-btn:hover{background-color:#d63031;color:#fff}@media (max-width: 1024px){.settings-main{padding:32px 40px}}@media (max-width: 768px){.settings-sidebar{width:200px}.settings-main{margin-left:200px;padding:24px}.setting-row{flex-direction:column;align-items:flex-start}.text-input{max-width:100%}}
