*{margin:0;padding:0;box-sizing:border-box}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,sans-serif;background-color:#f5f7fa;color:#333;line-height:1.6}.container{max-width:1920px;margin:0 auto;padding:20px 30px}.header{display:flex;align-items:center;gap:20px;margin-bottom:30px;padding:20px 30px;border-radius:12px;background:#fff;box-shadow:0 2px 8px #00000014}.header h1{font-size:28px;font-weight:600;color:#000;display:flex;align-items:center;gap:15px}.adshift-logo{height:42px;width:auto;vertical-align:middle}.top-section{display:grid;grid-template-columns:1fr 400px;gap:30px;margin-bottom:30px}.instructions{background:#fff;border-radius:12px;padding:30px;box-shadow:0 2px 8px #00000014;height:fit-content}.events-section{background:#fff;border-radius:12px;padding:30px;box-shadow:0 2px 8px #00000014}.instructions ol{list-style-position:inside;color:#333}.instructions li{margin-bottom:15px;line-height:1.8}.vertical-selector{display:flex;align-items:center;gap:10px;margin-top:10px}.dropdown-label{color:#666;font-size:14px;font-weight:500}.custom-dropdown{position:relative;flex:0 0 250px}.dropdown-selected{display:flex;align-items:center;gap:10px;padding:8px 15px;background:#f8f9fa;border:1px solid #d1d9e0;border-radius:20px;font-size:14px;cursor:pointer;transition:all .2s;-webkit-user-select:none;user-select:none;min-height:36px}.dropdown-selected:hover,.dropdown-selected.active{background:#f0f2f5;border-color:#b0bac5}.dropdown-text{flex:1;color:#333;font-weight:500}.dropdown-chevron{font-size:16px;color:#666;flex-shrink:0;display:inline-flex;align-items:center;justify-content:center;width:16px;height:16px;line-height:1;font-weight:700;margin-top:-4px;transition:transform .2s ease,margin-top .2s ease;transform-origin:center center}.dropdown-selected.active .dropdown-chevron{transform:rotate(180deg);margin-top:4px}.dropdown-menu{position:absolute;top:calc(100% + 5px);left:0;right:0;background:#fff;border-radius:12px;box-shadow:0 4px 12px #00000026;z-index:1000;max-height:300px;overflow-y:auto;display:none;margin-top:4px}.dropdown-menu.show{display:block}.dropdown-item{display:flex;align-items:center;gap:10px;padding:12px 15px;cursor:pointer;transition:background-color .2s;border-bottom:1px solid #f0f0f0}.dropdown-item:first-child{border-top-left-radius:12px;border-top-right-radius:12px}.dropdown-item:last-child{border-bottom:none;border-bottom-left-radius:12px;border-bottom-right-radius:12px}.dropdown-item:hover{background:#f8f9fa}.dropdown-item.selected{background:#f0f7ff}.dropdown-check{margin-left:auto;color:#4a90e2;font-weight:700;font-size:16px;display:none}.dropdown-item.selected .dropdown-check{display:block}.or-text{color:#666;font-weight:500}.import-btn,.download-btn{display:inline-flex;align-items:center;gap:6px;padding:6px 12px;background:#2c3e50;color:#fff;border:none;border-radius:6px;font-size:14px;font-weight:500;cursor:pointer;transition:background-color .2s}.import-btn:hover,.download-btn:hover{background:#1a252f}.upload-icon,.download-icon{font-size:16px}.tabs{display:flex;gap:10px;margin-bottom:20px;border-bottom:2px solid #e1e8ed}.tab{padding:12px 24px;background:transparent;border:none;border-bottom:3px solid transparent;cursor:pointer;font-size:15px;font-weight:500;color:#666;transition:all .2s;margin-bottom:-2px}.tab:hover{color:#333}.tab.active{color:#4a90e2;border-bottom-color:#4a90e2}.tab-content{animation:fadeIn .3s}.tab-content.hidden{display:none}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.events-table-wrapper{overflow-x:auto;border:2px solid #c8d1da;border-radius:8px}.events-table{width:100%;min-width:1100px;border-collapse:collapse;table-layout:fixed;font-size:14px}.events-table thead{background:#f8f9fa}.events-table thead tr:first-child th:first-child{border-top-left-radius:6px}.events-table thead tr:first-child th:last-child{border-top-right-radius:6px}.events-table th{padding:12px;text-align:left;font-weight:600;color:#555;border-bottom:3px solid #c8d1da}.events-table th:nth-child(1){width:7%}.events-table th:nth-child(2){width:17%}.events-table th:nth-child(3){width:16%}.events-table th:nth-child(4){width:10%}.events-table th:nth-child(5){width:18%;border-left:2px solid #c8d1da}.events-table th:nth-child(6){width:12%}.events-table th:nth-child(7){width:20%}.events-table td{padding:12px;border-bottom:3px solid #c8d1da;vertical-align:top;word-wrap:break-word;overflow-wrap:break-word}.events-table td:nth-child(5){border-left:2px solid #c8d1da}.events-table tbody tr:last-child td{border-bottom:none}.events-table tbody tr:hover{background:#f8f9fa}.add-event-btn{padding:8px 16px;background:#2c3e50;color:#fff;border:none;border-radius:6px;font-size:14px;font-weight:500;cursor:pointer;transition:all .2s;display:inline-flex;align-items:center;gap:6px;white-space:nowrap;line-height:1}.add-event-btn:hover{background:#1a252f}.add-event-btn .plus-icon{font-size:18px;font-weight:600;line-height:1}.add-param-btn{padding:6px 12px;background:#2c3e50;color:#fff;border:none;border-radius:4px;font-size:13px;font-weight:500;cursor:pointer;transition:background-color .2s}.add-event-btn:hover,.add-param-btn:hover{background:#1a252f}.add-param-btn{font-size:12px;padding:4px 10px}.remove-btn{padding:2px 6px;background:transparent;color:#999;border:1px solid transparent;border-radius:4px;font-size:16px;font-weight:300;cursor:pointer;transition:all .2s;line-height:1;min-width:24px;height:24px;display:inline-flex;align-items:center;justify-content:center}.remove-btn:hover{color:#dc3545;background:#fee;border-color:#fcc}.event-row{background:#f8f9fa}.event-name{font-family:Courier New,monospace;font-weight:600;color:#2c3e50}.event-purpose,.event-trigger{color:#555;font-size:13px}.event-row td:nth-child(5){vertical-align:top}.params-scrollable{max-height:200px;overflow-y:auto;margin-top:8px;transition:max-height .3s ease}.params-scrollable.expanded{max-height:none;overflow-y:visible}.toggle-params-btn{display:none;margin-top:6px;padding:4px 12px;background:transparent;color:#4a90e2;border:1px solid #d1d9e0;border-radius:4px;font-size:12px;font-weight:500;cursor:pointer;transition:all .2s}.toggle-params-btn:hover{background:#f0f7ff;border-color:#4a90e2}.toggle-params-btn.visible{display:inline-block}.toggle-arrow{display:inline-block;font-weight:700;font-size:14px;line-height:1;margin-top:-4px;vertical-align:middle;transition:transform .2s ease,margin-top .2s ease;transform-origin:center center}.toggle-arrow.rotated{transform:rotate(180deg);margin-top:4px}.param-row-item{display:grid;grid-template-columns:9fr 6fr 10fr;gap:12px;padding:10px 12px;border-bottom:1px solid #e8ecf0;align-items:start}.param-row-item:last-child{border-bottom:none}.param-name-cell,.param-value-cell,.param-description-cell{font-size:13px}.param-description-cell{display:flex;align-items:flex-start;justify-content:space-between;gap:10px}.param-description-cell .param-description{flex:1}.param-description-cell .remove-btn{flex-shrink:0;margin-top:2px}.events-table td:first-child{text-align:center}.param-name,.param-value,.param-description{font-size:13px}.param-name{font-family:Courier New,monospace;color:#2c3e50;font-weight:500}.params-header{display:flex;align-items:center;justify-content:space-between}.param-count{font-size:12px;color:#999}.add-param-container{position:relative}.add-param-popover{display:none;position:absolute;top:calc(100% + 6px);left:0;z-index:1000;background:#fff;border:1px solid #d1d9e0;border-radius:8px;box-shadow:0 4px 16px #00000024;padding:14px 16px;min-width:260px;animation:fadeIn .15s ease}.add-param-popover.open{display:block}.popover-radio-group{display:flex;gap:16px;margin-bottom:12px}.popover-radio-label{display:flex;align-items:center;gap:5px;font-size:13px;font-weight:500;color:#333;cursor:pointer;-webkit-user-select:none;user-select:none}.popover-radio-label input[type=radio]{accent-color:#4a90e2;cursor:pointer}.popover-predefined-section{margin-bottom:12px}.popover-select-label{display:block;font-size:12px;font-weight:500;color:#666;margin-bottom:5px}.predefined-param-select{width:100%;padding:6px 10px;border:1px solid #d1d9e0;border-radius:4px;font-size:13px;font-family:Courier New,monospace;color:#2c3e50;background:#f8f9fa;cursor:pointer;max-height:200px}.predefined-param-select:focus{outline:none;border-color:#4a90e2;background:#fff}.add-param-confirm-btn{width:100%;padding:7px 14px;background:#2c3e50;color:#fff;border:none;border-radius:4px;font-size:13px;font-weight:500;cursor:pointer;transition:background-color .2s}.add-param-confirm-btn:hover{background:#1a252f}.code-language-selector{display:flex;gap:10px;margin-bottom:20px;padding:12px;background:transparent;border:none;border-radius:6px}.lang-btn{padding:16px;background:#f5f7fa;color:#555;border:1px solid #e1e8ed;border-radius:6px;font-size:13px;font-weight:500;cursor:pointer;transition:all .3s cubic-bezier(.4,0,.2,1);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;width:80px;height:80px;min-width:80px;min-height:80px;position:relative;transform:translateY(0);box-shadow:0 1px 3px #0000000d}.lang-icon{width:32px;height:32px;object-fit:contain;font-size:32px;line-height:1;transition:transform .3s cubic-bezier(.4,0,.2,1);transform:scale(1)}.lang-text{font-size:12px;text-align:center;line-height:1.2;transition:color .3s ease}.lang-btn:hover{background:#e8ecf0;border-color:#d1d9e0;transform:translateY(-3px);box-shadow:0 4px 12px #0000001a}.lang-btn:hover .lang-icon{transform:scale(1.1)}.lang-btn:active{transform:translateY(-1px) scale(.98);box-shadow:0 2px 6px #00000014}.lang-btn.active{background:#e8f4fd;color:#4a90e2;border:1px solid #4a90e2;box-shadow:0 2px 8px #4a90e233}.lang-btn.active .lang-icon{transform:scale(1.05)}pre{margin:0;padding:0;background:transparent}pre code{display:block}#codeOutput{background:#f8f9fa;color:#212529;padding:20px;border-radius:6px;overflow-x:auto;font-family:Courier New,monospace;font-size:13px;line-height:1.6;overflow-y:auto;white-space:pre-wrap;word-wrap:break-word;-moz-tab-size:4;tab-size:4;display:block;width:100%;box-sizing:border-box}#codeOutput .code-comment{color:#6a737d;font-style:italic}#codeOutput .code-string{color:#032f62}#codeOutput .code-function{color:#6f42c1;font-weight:600}#codeOutput .code-constant{color:#005cc5}#codeOutput .code-keyword{color:#d73a49;font-weight:600}#codeOutput .code-parameter{color:#e36209}.copy-code-btn{margin-top:15px;padding:10px 20px;background:#2c3e50;color:#fff;border:none;border-radius:6px;cursor:pointer;font-size:14px;font-weight:500;transition:background-color .2s}.copy-code-btn:hover{background:#1a252f}.sidebar{height:fit-content}.overview{background:#fff;border-radius:12px;padding:25px;box-shadow:0 2px 8px #00000014}.overview h2{font-size:20px;font-weight:600;margin-bottom:20px;color:#1a1a1a}.overview-item{display:flex;justify-content:space-between;align-items:center;margin-bottom:15px;padding-bottom:15px;border-bottom:1px solid #e1e8ed}.overview-item:last-child{margin-bottom:0;padding-bottom:0;border-bottom:none}.overview-item .label{font-weight:500;color:#666;font-size:14px}.overview-item .value{font-weight:600;color:#2c3e50;font-size:15px}#appName{cursor:pointer;border-radius:6px;padding:2px 6px;transition:background-color .2s}#appName:hover{background-color:#f0f2f5}@media (max-width: 1400px){.add-event-btn .btn-label{display:none}}@media (max-width: 1200px){.top-section{grid-template-columns:1fr}}.empty-state{text-align:center;padding:60px 20px!important;border-bottom:none!important}.empty-state-content{color:#000}.empty-state-icon{font-size:40px;display:block;margin-bottom:12px}.empty-state-content p{font-size:16px;margin-bottom:6px;color:#000}.empty-state-hint{font-size:13px!important;color:#000}@keyframes highlightFade{0%{background-color:#fff3cd}to{background-color:transparent}}.highlight-flash{animation:highlightFade 1.5s ease-out}.editable{cursor:text;padding:4px 8px;border:1px solid transparent;border-radius:4px;transition:all .2s}.editable:hover{background:#f8f9fa;border-color:#d1d9e0}.editable:focus{outline:none;border-color:#4a90e2;background:#fff}.modal-overlay{position:fixed;top:0;right:0;bottom:0;left:0;z-index:9999;display:flex;align-items:center;justify-content:center;background:#0000;-webkit-backdrop-filter:blur(0px);backdrop-filter:blur(0px);pointer-events:none;transition:background .2s ease,backdrop-filter .2s ease}.modal-overlay.open{background:#00000040;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);pointer-events:auto}.modal-box{background:#fff;border-radius:12px;padding:24px 28px;box-shadow:0 8px 32px #0000002e;min-width:320px;max-width:420px;transform:scale(.92) translateY(8px);opacity:0;transition:transform .2s cubic-bezier(.4,0,.2,1),opacity .2s ease}.modal-overlay.open .modal-box{transform:scale(1) translateY(0);opacity:1}.modal-message{font-size:15px;color:#333;line-height:1.5;margin-bottom:20px;word-break:break-word}.modal-message-icon{display:none;width:18px;height:18px;border-radius:50%;background:transparent;border:1px solid rgba(40,167,69,.35);color:#28a745e6;font-size:12px;font-weight:700;align-items:center;justify-content:center;margin-right:8px;vertical-align:middle;transform:translateY(-1px);-webkit-user-select:none;user-select:none;flex-shrink:0}.modal-overlay.is-info .modal-message-icon{display:inline-flex}.modal-message-text{vertical-align:middle}.modal-actions{display:flex;justify-content:center;gap:10px}.modal-actions.single{justify-content:center}.modal-btn{padding:8px 18px;border-radius:6px;font-size:13px;font-weight:500;cursor:pointer;transition:all .15s ease;border:1px solid transparent;display:inline-flex;align-items:center;justify-content:center;text-align:center}.modal-cancel{background:#f5f7fa;color:#555;border-color:#d1d9e0}.modal-cancel:hover{background:#e8ecf0;border-color:#b0bac5}.modal-cancel:focus-visible{outline:2px solid #4a90e2;outline-offset:2px}.modal-confirm{background:#2c3e50;color:#fff}.modal-confirm:hover{background:#1a252f}.modal-confirm:focus-visible{outline:2px solid #2c3e50;outline-offset:2px}.modal-confirm.destructive{background:#dc3545}.modal-confirm.destructive:hover{background:#c82333}.modal-confirm.destructive:focus-visible{outline-color:#dc3545}
