.unpack-log-window { height: 100vh; box-sizing: border-box; padding: 18px; background: #000313; color: #D5DBFE; display: flex; flex-direction: column; gap: 12px; } .unpack-log-header { display: flex; align-items: center; justify-content: space-between; gap: 16px; flex-shrink: 0; } .unpack-log-header h1 { margin: 0; font-size: 22px; } .unpack-log-controls { display: flex; align-items: center; gap: 12px; flex: 1; justify-content: flex-end; } .unpack-log-toggle { display: flex; align-items: center; gap: 6px; color: #aeb7df; font-size: 13px; cursor: pointer; user-select: none; } .unpack-log-regex { flex: 0 1 320px; padding: 7px 12px; font-family: Consolas, "Courier New", monospace; font-size: 13px; color: #D5DBFE; background: #050813; border: 1px solid #2a3252; border-radius: 6px; outline: none; } .unpack-log-regex:focus { border-color: #4866b9; } .unpack-log-regex.invalid { border-color: #ff6666; } .unpack-log-regex-error { flex-shrink: 0; color: #ff8a8a; font-size: 12px; font-family: Consolas, "Courier New", monospace; } .unpack-log-body { flex: 1; min-height: 0; display: grid; grid-template-columns: minmax(220px, 320px) 1fr; gap: 12px; } .unpack-log-list { display: flex; flex-direction: column; gap: 4px; overflow-y: auto; padding: 8px; border: 1px solid #2a3252; border-radius: 6px; background: #050813; } .unpack-log-list-stats { color: #8892b0; font-size: 12px; padding: 2px 4px 6px; border-bottom: 1px solid #26304f; margin-bottom: 4px; } .unpack-log-list-item { display: grid; grid-template-columns: 44px 1fr auto auto; gap: 8px; align-items: center; padding: 6px 8px; text-align: left; color: #D5DBFE; background: transparent; border: 1px solid transparent; border-radius: 4px; font-family: Consolas, "Courier New", monospace; font-size: 12px; cursor: pointer; } .unpack-log-list-item:hover { background: #0d1530; } .unpack-log-list-item.active { background: #14224d; border-color: #4866b9; } .unpack-log-list-badge { font-weight: bold; text-align: center; padding: 2px 4px; border-radius: 3px; font-size: 11px; } .unpack-log-list-item.success .unpack-log-list-badge { color: #050813; background: #8ee6a6; } .unpack-log-list-item.error .unpack-log-list-badge { color: #050813; background: #ff8a8a; } .unpack-log-list-name { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .unpack-log-list-time { color: #8892b0; font-size: 11px; } .unpack-log-list-matches { color: #aeb7df; background: #14224d; border-radius: 10px; padding: 1px 8px; font-size: 11px; min-width: 16px; text-align: center; } .unpack-log-detail { overflow: auto; padding: 14px; border: 1px solid #2a3252; border-radius: 6px; background: #050813; font-family: Consolas, "Courier New", monospace; font-size: 13px; line-height: 1.35; display: flex; flex-direction: column; gap: 10px; } .unpack-log-detail-nav { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-shrink: 0; } .unpack-log-detail-pos { color: #8892b0; font-size: 12px; } .unpack-log-empty { color: #8892b0; padding: 8px 4px; } .unpack-log-empty-stream { color: #8892b0; font-style: italic; } .unpack-log-entry { display: flex; flex-direction: column; } .unpack-log-meta { margin-bottom: 6px; font-weight: bold; } .unpack-log-meta.success { color: #8ee6a6; } .unpack-log-meta.error, .unpack-log-stream.stderr { color: #ff8a8a; } .unpack-log-path { color: #aeb7df; word-break: break-all; } .unpack-log-stream { margin: 8px 0 0; font: inherit; white-space: pre-wrap; word-break: break-word; } .unpack-log-stream.stdout { color: #D5DBFE; }