*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}:root{--bg: #1a1a2e;--bg-surface: #16213e;--bg-elevated: #0f3460;--bg-hover: #1a3a6a;--text: #e0e0e0;--text-muted: #8892a4;--accent: #4fc3f7;--border: #2a3a5e;--val-string: #81c784;--val-number: #ffb74d;--val-float: #ce93d8;--val-null: #78909c;--drop-border: #4fc3f7;--scrollbar-thumb: #3a4a6e}html,body{height:100%;font-family:JetBrains Mono,Fira Code,Cascadia Code,Consolas,monospace;font-size:13px;color:var(--text);background:var(--bg)}#app{display:flex;flex-direction:column;height:100vh}#header{background:var(--bg-surface);border-bottom:1px solid var(--border);padding:10px 20px;flex-shrink:0}#header h1{font-size:16px;font-weight:600;color:var(--accent)}#layout{display:flex;flex:1;overflow:hidden}#sidebar{width:280px;min-width:200px;background:var(--bg-surface);border-right:1px solid var(--border);display:flex;flex-direction:column;overflow:hidden}#drop-zone{padding:16px;border-bottom:1px solid var(--border);text-align:center;border:2px dashed var(--border);margin:12px;border-radius:8px;transition:border-color .2s,background .2s}#drop-zone.drag-over{border-color:var(--drop-border);background:#4fc3f714}#drop-zone p{color:var(--text-muted);margin-bottom:10px;font-size:12px}.privacy-note{font-size:10px!important;opacity:.6;margin-top:8px;margin-bottom:0!important}#drop-zone-buttons{display:flex;gap:6px;justify-content:center}#drop-zone-buttons button{padding:5px 10px;font-size:11px;background:var(--bg-elevated);color:var(--text);border:1px solid var(--border);border-radius:4px;cursor:pointer;font-family:inherit}#drop-zone-buttons button:hover{background:var(--bg-hover)}#file-list{flex:1;overflow-y:auto;padding:8px 0}.file-group{margin-bottom:4px}.file-group-header{padding:6px 12px;font-size:11px;font-weight:600;color:var(--accent);text-transform:uppercase;letter-spacing:.5px;display:flex;align-items:center;gap:6px}.file-group-count{background:var(--bg-elevated);padding:1px 6px;border-radius:8px;font-size:10px;color:var(--text-muted)}.file-item{padding:5px 16px;font-size:12px;cursor:pointer;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:var(--text-muted);display:flex;align-items:center;gap:6px}.file-item:hover{background:var(--bg-hover)}.file-item.active{background:var(--bg-elevated);color:var(--text)}.file-item.no-protocol{opacity:.5}.file-item-name{overflow:hidden;text-overflow:ellipsis}.file-item-series{font-size:10px;padding:1px 5px;border-radius:3px;background:var(--bg-elevated);color:var(--accent);flex-shrink:0}.no-protocol-tag{font-size:9px;padding:1px 4px;border-radius:3px;background:var(--border);color:var(--text-muted);flex-shrink:0}#content{flex:1;display:flex;flex-direction:column;overflow:hidden}#dicom-info{display:flex;flex-wrap:wrap;gap:12px 20px;padding:10px 16px;background:var(--bg-surface);border-bottom:1px solid var(--border);font-size:12px}.info-label{color:var(--text-muted)}.info-value{color:var(--text)}#toolbar{display:flex;align-items:center;gap:8px;padding:8px 16px;background:var(--bg-surface);border-bottom:1px solid var(--border);flex-shrink:0}#tabs{display:flex;gap:2px;margin-right:8px}.tab{padding:4px 12px;font-size:12px;background:transparent;color:var(--text-muted);border:1px solid var(--border);border-radius:4px;cursor:pointer;font-family:inherit}.tab.active{background:var(--bg-elevated);color:var(--accent);border-color:var(--accent)}#search-input{flex:1;max-width:300px;padding:5px 10px;font-size:12px;background:var(--bg);color:var(--text);border:1px solid var(--border);border-radius:4px;outline:none;font-family:inherit}#search-input:focus{border-color:var(--accent)}#toolbar button{padding:4px 10px;font-size:11px;background:var(--bg-elevated);color:var(--text);border:1px solid var(--border);border-radius:4px;cursor:pointer;font-family:inherit;white-space:nowrap}#toolbar button:hover{background:var(--bg-hover)}#tree-view{flex:1;overflow:auto;padding:8px 0}.tree-row{display:flex;align-items:baseline;padding:2px 0;line-height:1.6;cursor:default}.tree-row:hover{background:#4fc3f70a}.tree-branch{cursor:pointer}.tree-branch:hover{background:#4fc3f714}.tree-toggle{display:inline-block;width:16px;text-align:center;color:var(--text-muted);flex-shrink:0;font-size:11px}.tree-key{color:var(--accent);margin-right:2px}.tree-sep{color:var(--text-muted)}.tree-info{color:var(--text-muted);font-size:11px;margin-left:4px}.tree-val-string{color:var(--val-string)}.tree-val-number{color:var(--val-number)}.tree-val-float{color:var(--val-float)}.tree-val-null{color:var(--val-null);font-style:italic}#raw-view{flex:1;overflow:auto;padding:16px;font-size:12px;white-space:pre-wrap;word-break:break-all;color:var(--text);background:var(--bg)}#empty-state{flex:1;display:flex;align-items:center;justify-content:center;color:var(--text-muted);font-size:14px}.hidden{display:none!important}::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-track{background:transparent}::-webkit-scrollbar-thumb{background:var(--scrollbar-thumb);border-radius:4px}::-webkit-scrollbar-thumb:hover{background:var(--bg-hover)}