.app{width:100%;min-height:100vh;background:#1a1a1a;color:#e0e0e0}.app-header{display:flex;justify-content:space-between;align-items:center;padding:15px 20px;background:#1a1a1a;border-bottom:1px solid #333;position:sticky;top:0;z-index:100}.app-header h1{margin:0;font-size:20px;font-weight:600;color:#4a9eff;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif}.reset-button{padding:8px 16px;background:#4a9eff;color:#fff;border:none;border-radius:6px;cursor:pointer;font-size:14px;font-weight:500;transition:background .2s}.reset-button:hover{background:#6ab4ff}.file-upload-container{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:100vh;padding:40px;background:linear-gradient(135deg,#1a1a1a,#2a2a2a);color:#e0e0e0;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif}.file-upload-area{width:100%;max-width:600px;min-height:300px;border:3px dashed #555;border-radius:12px;display:flex;align-items:center;justify-content:center;background:#252525;transition:all .3s ease;cursor:pointer}.file-upload-area:hover{border-color:#4a9eff;background:#2a2a2a}.file-upload-area.dragging{border-color:#4a9eff;background:#2f3a4a;transform:scale(1.02)}.file-upload-area.processing{border-color:#4a9eff;background:#2a2a2a;cursor:wait}.upload-content{text-align:center;padding:40px}.upload-icon{font-size:64px;margin-bottom:20px}.upload-content h2{margin:0 0 10px;font-size:24px;font-weight:600}.upload-content p{margin:8px 0;color:#aaa;font-size:14px}.upload-content code{background:#333;padding:2px 6px;border-radius:4px;font-family:Monaco,Menlo,Ubuntu Mono,monospace;color:#4a9eff}.upload-or{margin:20px 0!important;font-size:12px!important;color:#666!important}.upload-button{display:inline-block;padding:12px 24px;background:#4a9eff;color:#fff;border-radius:6px;cursor:pointer;font-weight:500;transition:background .2s;margin-top:10px}.upload-button:hover{background:#6ab4ff}.spinner{width:40px;height:40px;border:4px solid #333;border-top-color:#4a9eff;border-radius:50%;animation:spin 1s linear infinite;margin:0 auto 20px}@keyframes spin{to{transform:rotate(360deg)}}.error-message{margin-top:20px;padding:15px 20px;background:#4a2a2a;border:1px solid #ff6a4a;border-radius:6px;color:#faa;max-width:600px;width:100%}.error-message strong{color:#ff6a4a}.upload-info{margin-top:40px;max-width:600px;width:100%;padding:20px;background:#252525;border-radius:8px;border:1px solid #333}.upload-info h3{margin:0 0 15px;font-size:18px;color:#4a9eff}.upload-info p{margin:10px 0;line-height:1.6;color:#bbb;font-size:14px}.session-detail{padding:20px;max-width:1400px;margin:0 auto;min-height:calc(100vh - 60px)}.session-detail-header{margin-bottom:30px}.back-link{display:inline-block;color:#4a9eff;text-decoration:none;margin-bottom:15px;font-size:14px;transition:color .2s}.back-link:hover{color:#6ab4ff;text-decoration:underline}.session-title{display:flex;align-items:center;gap:15px}.session-title h2{margin:0;font-size:28px;color:#4a9eff}.session-entry-count{background:#4a9eff;color:#fff;padding:6px 14px;border-radius:16px;font-size:13px;font-weight:600}.session-not-found{text-align:center;padding:60px 20px}.session-not-found h2{color:#e0e0e0;margin-bottom:20px}.session-controls{background:#2a2a2a;border:1px solid #444;border-radius:8px;padding:20px;margin-bottom:30px}.logger-selector h3{margin:0 0 15px;font-size:16px;color:#e0e0e0}.logger-checkboxes{display:flex;flex-wrap:wrap;gap:15px}.logger-checkbox{display:flex;align-items:center;gap:8px;cursor:pointer;-webkit-user-select:none;user-select:none;color:#e0e0e0}.logger-checkbox input[type=checkbox]{cursor:pointer;width:18px;height:18px}.no-entries-hint{color:#666;font-size:11px;font-style:italic}.session-logs{display:flex;flex-direction:column;gap:30px}.logger-section{background:#2a2a2a;border:1px solid #444;border-radius:8px;overflow:hidden}.logger-section[data-logger-index="0"]{border-left:3px solid #4a9eff}.logger-section[data-logger-index="1"]{border-left:3px solid #ff6a4a}.logger-section[data-logger-index="2"]{border-left:3px solid #4ade80}.logger-section[data-logger-index="3"]{border-left:3px solid #ffaa4a}.logger-section[data-logger-index="4"]{border-left:3px solid #6a4aff}.logger-section[data-logger-index="5"]{border-left:3px solid #4affff}.logger-section[data-logger-index="6"]{border-left:3px solid #ff4aff}.logger-section[data-logger-index="7"]{border-left:3px solid #ffff4a}.logger-section[data-logger-index="8"]{border-left:3px solid #4a9eff}.logger-section[data-logger-index="9"]{border-left:3px solid #ff6a4a}.logger-section-header{display:flex;justify-content:space-between;align-items:center;padding:15px 20px;background:#333;border-bottom:1px solid #444;cursor:pointer;-webkit-user-select:none;user-select:none;transition:background .2s}.logger-section-header:hover{background:#3a3a3a}.logger-section-title{display:flex;align-items:center;gap:10px}.collapse-icon{color:#888;font-size:12px;width:16px;display:inline-block;text-align:center;transition:transform .2s}.logger-section-header h3.logger-name{margin:0;font-size:18px}.logger-section[data-logger-index="0"] .logger-name{color:#4a9eff}.logger-section[data-logger-index="1"] .logger-name{color:#ff6a4a}.logger-section[data-logger-index="2"] .logger-name{color:#4ade80}.logger-section[data-logger-index="3"] .logger-name{color:#ffaa4a}.logger-section[data-logger-index="4"] .logger-name{color:#6a4aff}.logger-section[data-logger-index="5"] .logger-name{color:#4affff}.logger-section[data-logger-index="6"] .logger-name{color:#ff4aff}.logger-section[data-logger-index="7"] .logger-name{color:#ffff4a}.logger-section[data-logger-index="8"] .logger-name{color:#4a9eff}.logger-section[data-logger-index="9"] .logger-name{color:#ff6a4a}.entry-count{color:#fff;padding:4px 12px;border-radius:12px;font-size:12px;font-weight:600}.logger-section[data-logger-index="0"] .entry-count{background:#4a9eff}.logger-section[data-logger-index="1"] .entry-count{background:#ff6a4a}.logger-section[data-logger-index="2"] .entry-count{background:#4ade80}.logger-section[data-logger-index="3"] .entry-count{background:#ffaa4a}.logger-section[data-logger-index="4"] .entry-count{background:#6a4aff}.logger-section[data-logger-index="5"] .entry-count{background:#4affff}.logger-section[data-logger-index="6"] .entry-count{background:#ff4aff}.logger-section[data-logger-index="7"] .entry-count{background:#ffff4a;color:#1a1a1a}.logger-section[data-logger-index="8"] .entry-count{background:#4a9eff}.logger-section[data-logger-index="9"] .entry-count{background:#ff6a4a}.logger-entries{padding:10px}.log-entry{padding:10px 15px;margin:5px 0;background:#1e1e1e;border-left:3px solid #4a9eff;border-radius:4px;display:flex;flex-direction:column;gap:4px;transition:background .2s}.logger-section[data-logger-index="0"] .log-entry{border-left-color:#4a9eff}.logger-section[data-logger-index="1"] .log-entry{border-left-color:#ff6a4a}.logger-section[data-logger-index="2"] .log-entry{border-left-color:#4ade80}.logger-section[data-logger-index="3"] .log-entry{border-left-color:#ffaa4a}.logger-section[data-logger-index="4"] .log-entry{border-left-color:#6a4aff}.logger-section[data-logger-index="5"] .log-entry{border-left-color:#4affff}.logger-section[data-logger-index="6"] .log-entry{border-left-color:#ff4aff}.logger-section[data-logger-index="7"] .log-entry{border-left-color:#ffff4a}.logger-section[data-logger-index="8"] .log-entry{border-left-color:#4a9eff}.logger-section[data-logger-index="9"] .log-entry{border-left-color:#ff6a4a}.log-entry:hover{background:#252525;transform:translate(2px)}.logger-section[data-logger-index="0"] .log-entry:hover{border-left-color:#6ab4ff}.logger-section[data-logger-index="1"] .log-entry:hover{border-left-color:#ff8a6a}.logger-section[data-logger-index="2"] .log-entry:hover{border-left-color:#6ae89a}.logger-section[data-logger-index="3"] .log-entry:hover{border-left-color:#ffcc6a}.logger-section[data-logger-index="4"] .log-entry:hover{border-left-color:#8a6aff}.logger-section[data-logger-index="5"] .log-entry:hover{border-left-color:#6affff}.logger-section[data-logger-index="6"] .log-entry:hover{border-left-color:#ff6aff}.logger-section[data-logger-index="7"] .log-entry:hover{border-left-color:#ffff6a}.logger-section[data-logger-index="8"] .log-entry:hover{border-left-color:#6ab4ff}.logger-section[data-logger-index="9"] .log-entry:hover{border-left-color:#ff8a6a}.log-entry.separator{background:#3a2a2a;border-left-color:#ff6a4a;font-weight:600}.log-entry-time{font-size:11px;color:#888;font-family:Monaco,Menlo,Ubuntu Mono,monospace}.log-entry-message{font-size:13px;color:#e0e0e0;white-space:pre-wrap;word-wrap:break-word;line-height:1.5}.logger-entries::-webkit-scrollbar{width:8px}.logger-entries::-webkit-scrollbar-track{background:#1a1a1a}.logger-entries::-webkit-scrollbar-thumb{background:#444;border-radius:4px}.logger-entries::-webkit-scrollbar-thumb:hover{background:#555}.session-timeline-view{display:flex;flex-direction:column;height:calc(100vh - 280px);min-height:500px;background:#1a1a1a;border-radius:8px;overflow:hidden;position:relative}.timeline-header-actions{position:absolute;top:15px;right:15px;z-index:200}.timeline-controls{display:flex;gap:20px;padding:15px;background:#2a2a2a;border-bottom:1px solid #444;flex-shrink:0;flex-wrap:wrap}.logger-selector h3{margin:0 0 8px;font-size:14px;font-weight:600;color:#e0e0e0}.logger-checkboxes{display:flex;flex-wrap:wrap;gap:10px}.logger-checkbox{display:flex;align-items:center;gap:8px;cursor:pointer;-webkit-user-select:none;user-select:none;color:#e0e0e0;font-size:13px}.logger-checkbox input[type=checkbox]{cursor:pointer}.time-controls{display:flex;flex-direction:column;gap:8px}.time-controls label{display:flex;align-items:center;gap:10px;color:#e0e0e0;font-size:13px}.time-controls input[type=range]{width:200px}.pin-headers-toggle{padding:8px 16px;background:#2a2a2a;color:#e0e0e0;border:1px solid #444;border-radius:6px;cursor:pointer;font-size:13px;font-weight:500;transition:all .2s;white-space:nowrap;display:flex;align-items:center;gap:6px}.pin-headers-toggle:hover{background:#333;border-color:#4a9eff}.pin-headers-toggle.active{background:#4a9eff;color:#fff;border-color:#4a9eff}.pin-headers-toggle.active:hover{background:#6ab4ff;border-color:#6ab4ff}.time-range-info{display:flex;flex-direction:column;gap:4px;font-size:11px;color:#aaa}.timeline-main{display:flex;flex:1;overflow:hidden;position:relative}.timeline-columns-container{flex:1;overflow:auto;position:relative;width:100%;box-sizing:border-box;min-width:0;overflow-y:auto;overflow-x:auto}.timeline-columns-wrapper{display:flex;position:relative;min-height:100%;width:max-content;min-width:100%;box-sizing:border-box}.timeline-column{flex:1;min-width:300px;max-width:100%;border-right:1px solid #333;display:flex;flex-direction:column;background:#1e1e1e;position:relative}.timeline-column[data-column-index="0"]{border-left:3px solid #4a9eff}.timeline-column[data-column-index="1"]{border-left:3px solid #ff6a4a}.timeline-column[data-column-index="2"]{border-left:3px solid #4ade80}.timeline-column[data-column-index="3"]{border-left:3px solid #ffaa4a}.timeline-column[data-column-index="4"]{border-left:3px solid #6a4aff}.timeline-column[data-column-index="5"]{border-left:3px solid #4affff}.timeline-column[data-column-index="6"]{border-left:3px solid #ff4aff}.timeline-column[data-column-index="7"]{border-left:3px solid #ffff4a}.timeline-column[data-column-index="8"]{border-left:3px solid #4a9eff}.timeline-column[data-column-index="9"]{border-left:3px solid #ff6a4a}.timeline-column-header{background:#2a2a2a;padding:10px;font-weight:600;border-bottom:2px solid #444;z-index:10;text-align:center;display:flex;flex-direction:column;gap:6px;align-items:center;position:relative}.timeline-column-header.pinned{position:sticky;top:0;z-index:100}.logger-name{font-size:16px}.timeline-column[data-column-index="0"] .logger-name{color:#4a9eff}.timeline-column[data-column-index="1"] .logger-name{color:#ff6a4a}.timeline-column[data-column-index="2"] .logger-name{color:#4ade80}.timeline-column[data-column-index="3"] .logger-name{color:#ffaa4a}.timeline-column[data-column-index="4"] .logger-name{color:#6a4aff}.timeline-column[data-column-index="5"] .logger-name{color:#4affff}.timeline-column[data-column-index="6"] .logger-name{color:#ff4aff}.timeline-column[data-column-index="7"] .logger-name{color:#ffff4a}.timeline-column[data-column-index="8"] .logger-name{color:#4a9eff}.timeline-column[data-column-index="9"] .logger-name{color:#ff6a4a}.entry-count-badge{color:#fff;padding:3px 10px;border-radius:12px;font-size:11px;font-weight:600}.timeline-column[data-column-index="0"] .entry-count-badge{background:#4a9eff}.timeline-column[data-column-index="1"] .entry-count-badge{background:#ff6a4a}.timeline-column[data-column-index="2"] .entry-count-badge{background:#4ade80}.timeline-column[data-column-index="3"] .entry-count-badge{background:#ffaa4a}.timeline-column[data-column-index="4"] .entry-count-badge{background:#6a4aff}.timeline-column[data-column-index="5"] .entry-count-badge{background:#4affff}.timeline-column[data-column-index="6"] .entry-count-badge{background:#ff4aff}.timeline-column[data-column-index="7"] .entry-count-badge{background:#ffff4a;color:#1a1a1a}.timeline-column[data-column-index="8"] .entry-count-badge{background:#4a9eff}.timeline-column[data-column-index="9"] .entry-count-badge{background:#ff6a4a}.timeline-column-content{position:relative;flex:1;min-height:100%;overflow:visible;width:100%;padding-bottom:50px;box-sizing:border-box;overflow-y:visible;overflow-x:visible}.timeline-entry{position:absolute;left:5px;right:5px;padding:6px 10px;margin:2px 0;background:#2a2a2a;border-left:3px solid #4a9eff;border-radius:4px;cursor:pointer;transition:all .2s;overflow:hidden;display:flex;flex-direction:column;gap:4px;word-wrap:break-word;z-index:1;min-width:0;max-width:calc(100% - 10px);box-sizing:border-box}.timeline-column[data-column-index="0"] .timeline-entry{border-left-color:#4a9eff}.timeline-column[data-column-index="1"] .timeline-entry{border-left-color:#ff6a4a}.timeline-column[data-column-index="2"] .timeline-entry{border-left-color:#4ade80}.timeline-column[data-column-index="3"] .timeline-entry{border-left-color:#ffaa4a}.timeline-column[data-column-index="4"] .timeline-entry{border-left-color:#6a4aff}.timeline-column[data-column-index="5"] .timeline-entry{border-left-color:#4affff}.timeline-column[data-column-index="6"] .timeline-entry{border-left-color:#ff4aff}.timeline-column[data-column-index="7"] .timeline-entry{border-left-color:#ffff4a}.timeline-column[data-column-index="8"] .timeline-entry{border-left-color:#4a9eff}.timeline-column[data-column-index="9"] .timeline-entry{border-left-color:#ff6a4a}.timeline-entry:hover{background:#333;z-index:5;box-shadow:0 2px 8px #0000004d;transform:translate(2px)}.timeline-column[data-column-index="0"] .timeline-entry:hover{border-left-color:#6ab4ff}.timeline-column[data-column-index="1"] .timeline-entry:hover{border-left-color:#ff8a6a}.timeline-column[data-column-index="2"] .timeline-entry:hover{border-left-color:#6ae89a}.timeline-column[data-column-index="3"] .timeline-entry:hover{border-left-color:#ffcc6a}.timeline-column[data-column-index="4"] .timeline-entry:hover{border-left-color:#8a6aff}.timeline-column[data-column-index="5"] .timeline-entry:hover{border-left-color:#6affff}.timeline-column[data-column-index="6"] .timeline-entry:hover{border-left-color:#ff6aff}.timeline-column[data-column-index="7"] .timeline-entry:hover{border-left-color:#ffff6a}.timeline-column[data-column-index="8"] .timeline-entry:hover{border-left-color:#6ab4ff}.timeline-column[data-column-index="9"] .timeline-entry:hover{border-left-color:#ff8a6a}.timeline-entry.separator{background:#3a2a2a;border-left-color:#ff6a4a;font-weight:600}.timeline-entry.separator:hover{background:#4a3a3a;border-left-color:#ff8a6a}.timeline-entry-time{font-size:10px;color:#888;white-space:nowrap;font-weight:500;font-family:Monaco,Menlo,Ubuntu Mono,monospace}.timeline-entry-message{font-size:12px;color:#e0e0e0;white-space:pre-wrap;word-wrap:break-word;overflow-wrap:break-word;line-height:1.4;max-height:200px;overflow-y:auto}.timeline-entry.no-timestamp{background:#3a2a2a;border-left-color:#ffaa4a}.timeline-columns-container::-webkit-scrollbar{width:8px;height:8px}.timeline-columns-container::-webkit-scrollbar-track{background:#1a1a1a}.timeline-columns-container::-webkit-scrollbar-thumb{background:#444;border-radius:4px}.timeline-columns-container::-webkit-scrollbar-thumb:hover{background:#555}.sessions-list{padding:20px 20px 40px;max-width:1400px;margin:0 auto;min-height:calc(100vh - 60px);box-sizing:border-box}.sessions-header{margin-bottom:30px}.sessions-header h2{margin:0 0 10px;font-size:28px;color:#4a9eff}.sessions-summary{display:flex;gap:10px;color:#aaa;font-size:14px}.view-tabs{display:flex;gap:10px;margin-bottom:20px;border-bottom:2px solid #444}.tab-button{padding:12px 24px;background:transparent;border:none;border-bottom:3px solid transparent;color:#aaa;font-size:14px;font-weight:500;cursor:pointer;transition:all .2s;margin-bottom:-2px}.tab-button:hover{color:#e0e0e0;background:#2a2a2a}.tab-button.active{color:#4a9eff;border-bottom-color:#4a9eff;background:#2a2a2a}.sessions-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(350px,1fr));gap:20px;padding-bottom:20px;margin-bottom:20px}.sessions-list .session-timeline-view{margin-top:0;height:calc(100vh - 320px);max-height:calc(100vh - 320px)}.session-card{display:block;background:#2a2a2a;border:1px solid #444;border-radius:8px;padding:20px;text-decoration:none;color:inherit;transition:all .2s;cursor:pointer}.session-card:hover{background:#333;border-color:#4a9eff;transform:translateY(-2px);box-shadow:0 4px 12px #4a9eff33}.session-card-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:15px;padding-bottom:15px;border-bottom:1px solid #444}.session-card-header h3{margin:0;font-size:20px;color:#e0e0e0}.session-entry-count{background:#4a9eff;color:#fff;padding:4px 12px;border-radius:12px;font-size:12px;font-weight:600}.session-card-body{display:flex;flex-direction:column;gap:10px}.session-info-row{display:flex;justify-content:space-between;align-items:flex-start;gap:15px}.session-label{color:#888;font-size:13px;font-weight:500;min-width:80px}.session-value{color:#e0e0e0;font-size:13px;text-align:right;word-break:break-word;flex:1}*{margin:0;padding:0;box-sizing:border-box}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;background:#1a1a1a;color:#e0e0e0}code{font-family:Monaco,Menlo,Ubuntu Mono,monospace}#root{width:100%;min-height:100vh}