body{margin:0;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}code{font-family:source-code-pro,Menlo,Monaco,Consolas,Courier New,monospace}*{box-sizing:border-box;margin:0;padding:0}body{font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;line-height:1.6}.App{text-align:center;overflow-x:hidden}@media(prefers-reduced-motion:no-preference){.App-logo{animation:App-logo-spin infinite 20s linear}}.App-header{background-color:#282c34;display:flex;flex-direction:row;align-items:center;justify-content:center;font-size:calc(10px + vmin);color:#fff;position:relative;padding:10px 20px}.App-header h1{flex:1;text-align:center}.header-links{position:absolute;right:20px;display:flex;align-items:center;gap:15px}.github-link{opacity:.8;transition:opacity .2s;display:flex;align-items:center}.github-link:hover{opacity:1}.about-button{background:transparent;border:2px solid white;border-radius:50%;width:32px;height:32px;padding:0;cursor:pointer;opacity:.8;transition:opacity .2s;display:flex;align-items:center;justify-content:center}.about-button:hover{opacity:1;background:#ffffff1a}.info-icon{color:#fff;font-family:Georgia,serif;font-style:italic;font-weight:700;font-size:18px;line-height:1}.modal-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:#0009;display:flex;align-items:center;justify-content:center;z-index:1000}.modal-content{background:#fff;padding:30px;border-radius:10px;max-width:500px;width:90%;position:relative;text-align:left}.modal-content h2{margin-top:0;margin-bottom:20px;color:#333}.modal-content h3{margin-top:20px;margin-bottom:5px;color:#555}.modal-content p{margin:5px 0;color:#333;line-height:1.5}.modal-content a{color:#06c}.modal-close{position:absolute;top:10px;right:15px;background:none;border:none;font-size:28px;cursor:pointer;color:#666;padding:0;line-height:1}.modal-close:hover{color:#333}.modal-disclaimer{margin-top:25px;padding:15px;background:#f5f5f5;border-left:4px solid #ff9800;font-size:.9em;color:#666}.App-link{color:#61dafb}@keyframes App-logo-spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}input[type=text],input[type=number],select{padding:.5rem;margin-right:.5rem;border:1px solid #ccc;border-radius:5px;font-size:1rem}input[type=number]{width:100px}button{padding:.5rem 1rem;font-size:1rem;border:none;border-radius:5px;cursor:pointer;background-color:#333;color:#fff;transition:background-color .3s ease}button:hover,button:focus{background-color:#555}button:disabled{background-color:#ccc;cursor:not-allowed}.connection-status{margin-top:1rem;padding:.5rem;font-size:1rem;color:#fff;border-radius:5px;display:inline-block}.connected{margin-left:10px;background-color:#28a745}.disconnected{margin-left:10px;background-color:#dc3545}.reconnect-status{margin-top:10px;padding:10px;background-color:#fff3cd;border:1px solid #ffc107;border-radius:5px;display:flex;align-items:center;justify-content:center;gap:15px}.reconnect-status span{color:#856404;font-weight:500}.reconnect-status button{background-color:#dc3545;padding:5px 15px;font-size:.9rem}.content-container{display:grid;grid-template-columns:repeat(12,1fr);gap:20px;max-width:1500px;margin-left:auto;margin-right:auto;padding:10px}.section{grid-column:span 12;outline:solid;padding:10px;margin:0}@media(min-width:900px){.section{grid-column:span 6}}.section.full-width{grid-column:span 12;overflow-x:auto}@media(min-width:900px){.section.tall{grid-row:span 2}}.trigger-table{border-collapse:collapse;margin-left:auto;margin-right:auto;width:100%;max-width:300px}.trigger-table th,.trigger-table td{padding:8px 12px;text-align:left;border:1px solid #ddd}.trigger-table th{background-color:#f2f2f2;font-weight:600}.trigger-table td:last-child{text-align:center;width:100px}.trigger-table tbody tr:hover{background-color:#f5f5f5}.trigger-table label{cursor:pointer;display:block}.trigger-table input[type=checkbox]{width:18px;height:18px;cursor:pointer}.matches-table{border-collapse:collapse;margin-left:auto;margin-right:auto;font-size:.9rem}.matches-table th,.matches-table td{padding:8px 10px;text-align:left;border:1px solid #ddd}.matches-table th{background-color:#f2f2f2;position:relative}.matches-table th.sortable{cursor:pointer;-webkit-user-select:none;user-select:none}.matches-table th.sortable:hover{background-color:#e0e0e0}.matches-table th.sorted-asc:after{content:" ▲";font-size:.7em}.matches-table th.sorted-desc:after{content:" ▼";font-size:.7em}.matches-table th.col-group-header{text-align:center;font-weight:700;border-bottom:2px solid #999}.matches-table th.col-group-info{background-color:#e3f2fd}.matches-table th.col-group-timestamps{background-color:#fff3e0}.matches-table th.col-group-recordings{background-color:#e8f5e9}.matches-table th.col-group-screenshots{background-color:#fce4ec}.matches-table td.col-info{background-color:#f5faff}.matches-table td.col-timestamps{background-color:#fffaf5}.matches-table td.col-recordings{background-color:#f5fff5}.matches-table td.col-screenshots{background-color:#fff5f8}.matches-table tbody tr:hover td{background-color:#f1f1f1!important}.file-link{color:#06c;cursor:pointer;text-decoration:underline}.file-link:hover{color:#049}.file-link:active{color:#026}.matches-button{margin:10px}input,select{margin:5px}ol{padding-left:20px;text-align:left;margin-left:auto;margin-right:auto}ol li{margin-bottom:0}.connection-helper-steps{text-align:left;margin-left:auto;margin-right:auto;display:inline-block}.chapters-options{text-align:left;display:inline-block;margin-bottom:15px}.chapters-option-row{margin:8px 0;display:flex;align-items:center;gap:8px}.chapters-option-row label{display:flex;align-items:center;gap:8px;cursor:pointer}.chapters-option-row>label:first-child{min-width:120px}.chapters-option-row input[type=checkbox]{width:16px;height:16px;cursor:pointer}.chapters-output{margin-top:15px}.chapters-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:8px;padding:0 5px}.chapters-header span{font-size:.9em;color:#666}.chapters-textarea{width:100%;max-width:600px;height:200px;font-family:monospace;font-size:.85em;padding:10px;border:1px solid #ccc;border-radius:5px;resize:vertical;background-color:#f9f9f9}.info-box{background-color:#e7f3ff;border:1px solid #b8daff;border-radius:5px;padding:15px;margin:10px 0}.success-indicator{color:#28a745;font-weight:700}.warning-box{background-color:#fff3cd;border:2px solid #ffc107;border-radius:5px;padding:15px;margin:10px 0}.warning-box strong{color:#856404}.warning-indicator{color:#856404;font-weight:700}