*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}:root{--bg: #0f0f10;--surface: #18181b;--border: #27272a;--text: #e4e4e7;--muted: #71717a;--accent: #38bdf8;--danger: #ef4444;--marker: #facc15}html,body{height:100%;background:var(--bg);color:var(--text);font:13px/1.5 system-ui,sans-serif}#app{display:flex;flex-direction:column;height:100vh}header{display:flex;align-items:center;gap:.75rem;padding:.6rem 1rem;border-bottom:1px solid var(--border);flex-shrink:0}h1{font-size:.9rem;font-weight:600;color:var(--accent);letter-spacing:.08em;text-transform:uppercase}nav{display:flex;gap:.25rem;margin-left:auto}button{padding:.2rem .65rem;background:transparent;border:1px solid var(--border);border-radius:.2rem;color:var(--muted);cursor:pointer;font-size:.78rem;transition:border-color .15s,color .15s}button:hover{border-color:var(--accent);color:var(--text)}button.active{background:var(--accent);border-color:var(--accent);color:#000;font-weight:500}#compare{margin-left:.5rem}#clear:hover{border-color:var(--danger);color:var(--danger)}#repo-link{color:var(--muted);font-size:.75rem;text-decoration:none;margin-left:.25rem;transition:color .15s}#repo-link:hover{color:var(--text)}#file-bar{display:flex;align-items:center;padding:.35rem 1rem;border-bottom:1px solid var(--border);flex-shrink:0;min-height:2.2rem}#file-chips{display:flex;flex-wrap:wrap;gap:.35rem}.file-chip{display:inline-flex;align-items:center;gap:.3rem;padding:.15rem .25rem .15rem .5rem;background:var(--surface);border:1px solid var(--border);border-radius:.2rem;font-size:.75rem;cursor:pointer;transition:border-color .15s;-webkit-user-select:none;user-select:none}.file-chip:hover{border-color:var(--accent)}.file-chip.active{border-color:var(--accent);color:var(--text)}.dot{width:6px;height:6px;border-radius:50%;flex-shrink:0}.chip-name{max-width:180px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--muted)}.file-chip.active .chip-name{color:var(--text)}.chip-remove{padding:0 .2rem;border:none;border-radius:0;color:var(--muted);font-size:.85rem;line-height:1;background:transparent;transition:color .15s}.chip-remove:hover{border-color:transparent;color:var(--danger)}main{flex:1;position:relative;overflow:hidden;min-height:0}main.dropping:after{content:"Drop to add file";position:absolute;top:0;right:0;bottom:0;left:0;display:flex;align-items:center;justify-content:center;background:#38bdf80f;border:2px dashed var(--accent);color:var(--accent);font-size:.9rem;pointer-events:none;z-index:10}#drop-zone{position:absolute;top:1.5rem;right:1.5rem;bottom:1.5rem;left:1.5rem;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.5rem;border:2px dashed var(--border);border-radius:.4rem;cursor:pointer;transition:border-color .15s,background .15s}#drop-zone:hover,#drop-zone.over{border-color:var(--accent);background:#38bdf808}#drop-zone p{color:var(--muted);font-size:.9rem}#drop-zone small{color:#3f3f46;font-size:.75rem}#chart{width:100%;height:100%}#markers{border-top:1px solid var(--border);padding:.4rem 1rem;min-height:2rem;flex-shrink:0}#marker-list{display:flex;flex-wrap:wrap;gap:.4rem}.marker-tag{padding:.15rem .5rem;background:var(--surface);border:1px solid var(--border);border-radius:.2rem;font-size:.72rem;font-family:monospace;color:var(--marker);cursor:pointer;transition:border-color .15s,color .15s}.marker-tag:hover{border-color:var(--danger);color:var(--danger)}[hidden]{display:none!important}
