*{box-sizing:border-box;margin:0;padding:0}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;line-height:1.5;color:#1a1a1a;background:#f5f5f5}button{padding:.5rem 1rem;border:1px solid #ccc;border-radius:4px;background:#fff;cursor:pointer;font-size:14px}button:hover:not(:disabled){background:#f0f0f0}button:disabled{opacity:.5;cursor:not-allowed}button.delete-btn{color:#dc3545;padding:.25rem .5rem}input,textarea,select{padding:.5rem;border:1px solid #ccc;border-radius:4px;font-size:14px}code{background:#f0f0f0;padding:.125rem .25rem;border-radius:3px;font-family:Monaco,monospace;font-size:12px}.session-picker{max-width:1200px;margin:2rem auto;padding:2rem}.section{background:#fff;padding:1.5rem;margin-bottom:2rem;border-radius:8px;box-shadow:0 1px 3px #0000001a}.section-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:1rem}.section-header h2{font-size:1.5rem}.actions{display:flex;gap:.5rem}table{width:100%;border-collapse:collapse}th,td{text-align:left;padding:.75rem;border-bottom:1px solid #eee}th{font-weight:600;background:#fafafa}tr.clickable{cursor:pointer}tr.clickable:hover{background:#f9f9f9}.badge{padding:.25rem .5rem;border-radius:12px;font-size:12px;background:#e9ecef}.badge.draft{background:#fff3cd}.badge.published{background:#d1e7dd}.empty-state{text-align:center;padding:3rem;color:#6c757d}.session-builder{height:100vh;display:flex;flex-direction:column}.top-bar{display:flex;gap:1rem;align-items:center;padding:1rem 1.5rem;background:#fff;border-bottom:1px solid #ddd}.session-name-input{flex:1;font-size:16px;font-weight:600}.session-id{font-size:12px;color:#6c757d}.save-indicator{font-size:12px;color:#ffc107;font-weight:500}.save-indicator.saved{color:#28a745}.builder-main{display:flex;flex:1;overflow:hidden}.steps-list{width:300px;border-right:1px solid #ddd;background:#fafafa;display:flex;flex-direction:column}.steps-list-header{padding:1rem;border-bottom:1px solid #ddd;display:flex;justify-content:space-between;align-items:center}.step-count{font-size:12px;color:#6c757d}.steps-list-content{flex:1;overflow-y:auto;padding:.5rem}.step-card{background:#fff;padding:.75rem;margin-bottom:.5rem;border-radius:6px;border:1px solid #ddd;cursor:pointer}.step-card.selected{border-color:#0d6efd;background:#e7f1ff}.step-card-header{display:flex;gap:.5rem;margin-bottom:.25rem}.step-number{font-weight:600}.step-type{text-transform:capitalize;font-size:14px;color:#6c757d}.step-card-title{font-size:14px;margin-bottom:.25rem}.step-card-id{font-size:11px;color:#6c757d}.step-card-actions{margin-top:.5rem;display:flex;gap:.25rem}.step-card-actions button{padding:.25rem .5rem;font-size:12px}.add-step-container{padding:1rem;border-top:1px solid #ddd;position:relative}.add-step-btn{width:100%}.add-step-menu{position:absolute;bottom:100%;left:1rem;right:1rem;background:#fff;border:1px solid #ddd;border-radius:4px;box-shadow:0 2px 8px #00000026}.add-step-menu button{display:block;width:100%;text-align:left;border:none;border-bottom:1px solid #eee}.add-step-menu button:last-child{border-bottom:none}.editor-panel{flex:1;overflow-y:auto;background:#fff;min-width:0}.activity-preview-panel{width:380px;border-left:1px solid #ddd;background:#f8f9fa;display:flex;flex-direction:column;overflow:hidden}.activity-preview-panel .panel-header{padding:1rem;font-weight:600;border-bottom:1px solid #ddd;background:#fafafa}.activity-preview-panel .preview-card{margin:1rem;background:#fff;border-radius:8px;box-shadow:0 1px 3px #0000001a;min-height:auto}.step-editor{display:flex;flex-direction:column;height:100%}.tabs{display:flex;border-bottom:1px solid #ddd;background:#fafafa}.tab{padding:.75rem 1.5rem;border:none;background:transparent;cursor:pointer;border-bottom:2px solid transparent}.tab.active{border-bottom-color:#0d6efd;font-weight:600}.tab-content{flex:1;overflow-y:auto}.editor-content{padding:1.5rem}.editor{padding:1rem 0}.field{margin-bottom:1.5rem}.field label{display:block;font-weight:500;margin-bottom:.5rem;font-size:14px}.field input,.field textarea,.field select{width:100%}.field.checkbox label{display:flex;align-items:center;gap:.5rem}.field-row{display:grid;grid-template-columns:1fr 1fr;gap:1rem}.option-row{display:flex;gap:.5rem;align-items:center;margin-bottom:.5rem}.option-row input{flex:1}.option-bullet{font-size:18px}.option-id{font-size:11px;color:#6c757d}.remove-option{padding:.25rem .5rem}.add-option{margin-top:.5rem}.step-meta{margin-top:2rem;padding-top:1rem;border-top:1px solid #eee;display:flex;gap:1rem;flex-wrap:wrap}.meta-item{font-size:13px}.meta-label{color:#6c757d;margin-right:.25rem}.schema-viewer{padding:1.5rem}.schema-header{display:flex;justify-content:space-between;margin-bottom:1rem}.validation-badge{font-size:12px;padding:.25rem .5rem;border-radius:12px}.validation-badge.valid{background:#d1e7dd;color:#0f5132}.validation-badge.invalid{background:#f8d7da;color:#842029}.schema-textarea{width:100%;min-height:400px;font-family:Monaco,monospace;font-size:12px;padding:1rem;border:1px solid #ccc;border-radius:4px}.schema-error{margin-top:.5rem;padding:.75rem;background:#f8d7da;color:#842029;border-radius:4px;font-size:13px}.validation-error{color:#dc3545;font-size:13px;margin-top:.5rem}.info-box{padding:1rem;background:#e7f1ff;border-radius:4px;font-size:14px}.debug-panel{border-top:1px solid #ddd;background:#fafafa}.debug-toggle{width:100%;text-align:left;background:#f0f0f0;border:none;border-top:1px solid #ddd;padding:.5rem 1rem;font-size:13px}.debug-content{padding:1rem;background:#2d2d2d;color:#f8f8f2;font-family:Monaco,monospace;font-size:11px;overflow-x:auto;max-height:300px;overflow-y:auto}.modal-overlay{position:fixed;inset:0;background:#00000080;display:flex;align-items:center;justify-content:center;z-index:1000}.modal{background:#fff;padding:2rem;border-radius:8px;max-width:500px;width:90%;max-height:80vh;overflow-y:auto}.modal h3{margin-bottom:1rem}.template-list{margin:1rem 0}.template-option{display:flex;gap:.75rem;padding:.75rem;border:1px solid #ddd;border-radius:4px;margin-bottom:.5rem;cursor:pointer}.template-option:hover{background:#f9f9f9}.template-meta{font-size:12px;color:#6c757d}.modal-actions{display:flex;gap:.5rem;justify-content:flex-end;margin-top:1.5rem}.modal-actions button.primary{background:#0d6efd;color:#fff}.modal-actions button.primary:hover{background:#0b5ed7}.modal.modal-wide{max-width:800px}.template-editor{margin:1rem 0}.json-editor{width:100%;font-family:Monaco,Menlo,Ubuntu Mono,monospace;font-size:12px;line-height:1.4;padding:1rem;border:1px solid #ddd;border-radius:4px;background:#f8f9fa;resize:vertical}.json-editor:focus{outline:none;border-color:#0d6efd}.error-message{color:#dc3545;font-size:14px;margin-top:.5rem;padding:.5rem;background:#f8d7da;border-radius:4px}.edit-btn{background:none;border:none;cursor:pointer;font-size:16px;padding:.25rem .5rem;border-radius:4px;color:#0d6efd}.edit-btn:hover{background:#e7f1ff}.loading{text-align:center;padding:3rem;font-size:16px;color:#6c757d}.view-tabs{display:flex;background:#fafafa;border-bottom:1px solid #ddd;padding:0 1rem}.view-tab{padding:.75rem 1.5rem;border:none;background:transparent;cursor:pointer;border-bottom:2px solid transparent;font-size:14px;font-weight:500;color:#6c757d}.view-tab:hover{color:#1a1a1a;background:transparent}.view-tab.active{color:#0d6efd;border-bottom-color:#0d6efd;background:transparent}.preview-main{flex:1;display:flex;justify-content:center;align-items:flex-start;padding:2rem;background:#e9ecef;overflow-y:auto}.schema-main{flex:1;overflow-y:auto;padding:1rem;background:#1e1e1e}.session-schema{margin:0;padding:1rem;font-family:Monaco,Menlo,monospace;font-size:12px;line-height:1.5;color:#d4d4d4;white-space:pre-wrap;word-break:break-word}.session-preview{display:flex;flex-direction:column;align-items:center;gap:1.5rem}.preview-controls{display:flex;gap:.5rem;align-items:center;background:#fff;padding:.75rem 1rem;border-radius:8px;box-shadow:0 1px 3px #0000001a}.preview-step-indicator{padding:0 1rem;font-weight:500;min-width:80px;text-align:center}.preview-content-area{width:100%;max-width:500px;background:#fff;border-radius:12px;box-shadow:0 2px 8px #0000001a;overflow:hidden}.preview-content-area .preview-card{min-height:400px}.preview-frame{width:375px;min-height:667px;background:#fff;border-radius:40px;box-shadow:0 10px 40px #0003;overflow:hidden;display:flex;flex-direction:column}.preview-frame-header{height:44px;background:#1a1a1a;display:flex;justify-content:center;align-items:flex-end;padding-bottom:8px}.preview-frame-notch{width:150px;height:28px;background:#1a1a1a;border-radius:0 0 20px 20px}.preview-frame-content{flex:1;overflow-y:auto}.preview-frame-footer{height:34px;background:#fff;display:flex;justify-content:center;align-items:center;border-top:1px solid #eee}.preview-frame-home{width:134px;height:5px;background:#1a1a1a;border-radius:3px}.preview-step-list{display:flex;gap:.5rem;flex-wrap:wrap;justify-content:center}.preview-step-dot{width:32px;height:32px;border-radius:50%;border:2px solid #ddd;background:#fff;font-size:12px;font-weight:500;cursor:pointer}.preview-step-dot:hover{border-color:#0d6efd}.preview-step-dot.active{background:#0d6efd;border-color:#0d6efd;color:#fff}.preview-card{min-height:100%;display:flex;flex-direction:column;padding:1.5rem}.preview-progress{font-size:12px;color:#6c757d;margin-bottom:1rem}.preview-content{flex:1}.preview-headline{font-size:28px;font-weight:700;margin-bottom:1rem;line-height:1.2}.preview-body{font-size:16px;color:#495057;line-height:1.6}.preview-question{font-size:20px;font-weight:600;margin-bottom:1.5rem;line-height:1.3}.preview-required{color:#dc3545;margin-left:.25rem}.preview-button{width:100%;padding:1rem;background:#0d6efd;color:#fff;border:none;border-radius:8px;font-size:16px;font-weight:600;margin-top:auto}.preview-options{display:flex;flex-direction:column;gap:.75rem}.preview-option{display:flex;align-items:center;gap:.75rem;padding:1rem;border:1px solid #ddd;border-radius:8px;cursor:pointer}.preview-option:hover{border-color:#0d6efd;background:#f8f9ff}.preview-option input[type=radio]{width:20px;height:20px}.preview-textarea{width:100%;min-height:150px;padding:1rem;border:1px solid #ddd;border-radius:8px;font-size:16px;resize:none}.preview-char-limit{font-size:12px;color:#6c757d;text-align:right;margin-top:.5rem}.preview-rating-scale{display:flex;align-items:center;gap:1rem}.preview-rating-label{font-size:12px;color:#6c757d;max-width:60px;text-align:center}.preview-rating-options{display:flex;gap:.5rem;flex:1;justify-content:center}.preview-rating-option{display:flex;flex-direction:column;align-items:center;gap:.25rem;cursor:pointer}.preview-rating-option input[type=radio]{width:24px;height:24px}.preview-rating-option span{font-size:14px;font-weight:500}.preview-placeholder{text-align:center;justify-content:center}.preview-placeholder-icon{font-size:48px;margin-bottom:1rem}.preview-placeholder h2{font-size:20px;margin-bottom:.5rem}.preview-placeholder p{color:#6c757d}.preview-empty{display:flex;align-items:center;justify-content:center;min-height:400px;color:#6c757d;font-size:16px}.preview-unknown{padding:2rem;text-align:center;color:#6c757d}.template-type{display:block;font-size:11px;color:#6c757d;text-transform:capitalize}.empty-menu{padding:1rem;text-align:center;color:#6c757d;font-size:13px}.debug-status{font-size:11px;color:#6c757d;margin-left:.5rem}.debug-state-row{display:flex;flex-wrap:wrap;gap:.5rem;margin-bottom:.75rem;padding-bottom:.75rem;border-bottom:1px solid #444}.debug-badge{padding:.25rem .5rem;background:#3a3a3a;border-radius:4px;font-size:11px}.debug-badge.active{background:#ffc107;color:#000}.debug-badge.error{background:#dc3545;color:#fff}.debug-json{margin:0;white-space:pre-wrap;word-break:break-word}.debug-tabs{display:flex;gap:.25rem;margin-bottom:.75rem;padding-bottom:.5rem;border-bottom:1px solid #444}.debug-tab{padding:.25rem .75rem;background:#3a3a3a;border:none;border-radius:4px;color:#aaa;font-size:11px;cursor:pointer}.debug-tab:hover{background:#4a4a4a;color:#fff}.debug-tab.active{background:#0d6efd;color:#fff}.debug-clear{margin-left:auto;padding:.25rem .5rem;background:#444;border:none;border-radius:4px;color:#888;font-size:10px;cursor:pointer}.debug-clear:hover{background:#555;color:#fff}.debug-events{max-height:250px;overflow-y:auto}.debug-empty{color:#666;font-style:italic;padding:1rem 0;text-align:center}.debug-event{display:flex;align-items:center;gap:.5rem;padding:.25rem 0;border-bottom:1px solid #333;font-size:11px}.debug-event:last-child{border-bottom:none}.event-time{color:#666;font-family:monospace;flex-shrink:0}.event-icon{flex-shrink:0;width:16px;text-align:center}.event-name{color:#ddd;font-weight:500}.event-duration{color:#888;font-size:10px}.event-detail{color:#888;font-size:10px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:200px}.event-action .event-name{color:#6ea8fe}.event-api .event-name{color:#a78bfa}.event-store .event-name{color:#fdba74}.event-error .event-name,.event-error .event-icon{color:#f87171}
