:root{--bg:#eef2f6;--panel:#fff;--panel2:#f8fafc;--line:#d6dee9;--line2:#e8edf3;--text:#182230;--muted:#667085;--blue:#1f66d1;--blue2:#1554b0;--green:#18864b;--yellow:#fff0a8;--yellow2:#ffd84d;--red:#b42318;--mono:Consolas,"Liberation Mono",Menlo,monospace}
*{box-sizing:border-box}html,body{margin:0;min-height:100%;background:var(--bg);color:var(--text);font-family:Segoe UI,Roboto,Arial,sans-serif}.hidden{display:none!important}button,input,select{font:inherit}.app{min-height:100vh}.topbar{height:78px;padding:14px 20px;background:#fff;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between}.topbar h1{font-size:21px;margin:0 0 4px}.topbar p{margin:0;color:var(--muted);font-size:13px}.version{font-size:12px;color:#475467;background:var(--panel2);border:1px solid var(--line);border-radius:999px;padding:7px 10px}.upload-view{min-height:calc(100vh - 78px);display:grid;place-items:center;padding:30px}.dropzone{width:min(720px,100%);min-height:320px;border:2px dashed #9daabd;border-radius:16px;background:#fff;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;cursor:pointer;padding:35px;box-shadow:0 14px 36px rgba(15,23,42,.06);transition:.15s}.dropzone:hover,.dropzone.drag{border-color:var(--blue);background:#f4f8ff;transform:translateY(-1px)}.dropzone input{display:none}.drop-icon{font-size:42px;width:76px;height:76px;display:grid;place-items:center;border-radius:20px;background:#eaf2ff;color:var(--blue);margin-bottom:18px}.dropzone strong{font-size:21px;margin-bottom:8px}.dropzone>span:not(.drop-icon){color:var(--muted)}.dropzone small{margin-top:18px;color:#98a2b3}.editor-view{height:calc(100vh - 78px);display:flex;flex-direction:column}.filebar{height:64px;background:#fff;border-bottom:1px solid var(--line);padding:10px 14px;display:flex;align-items:center;justify-content:space-between;gap:16px}.file-main{min-width:0;display:flex;flex-direction:column}.file-main strong{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.file-main span{color:var(--muted);font-size:12px;margin-top:4px}.file-actions{display:flex;gap:8px;flex-wrap:nowrap}.btn{border:1px solid var(--line);background:#fff;color:#344054;border-radius:8px;padding:9px 12px;font-weight:650;cursor:pointer;white-space:nowrap}.btn:hover{background:#f7f9fc}.btn:disabled{opacity:.45;cursor:not-allowed}.btn.primary{background:var(--blue);border-color:var(--blue);color:#fff}.btn.primary:hover{background:var(--blue2)}.btn.ghost{background:#fff}.btn.small{padding:6px 9px;font-size:12px}.btn.full{width:100%}.btn.large{padding:13px}.workspace{min-height:0;flex:1;display:grid;grid-template-columns:minmax(560px,1fr) 390px;gap:0}.hex-panel{min-width:0;display:flex;flex-direction:column;background:#fff;border-right:1px solid var(--line)}.hex-toolbar{min-height:48px;border-bottom:1px solid var(--line2);display:flex;align-items:center;gap:14px;padding:7px 10px;background:#f8fafc;flex-wrap:wrap}.toolbar-group{display:flex;align-items:center;gap:7px;color:#475467;font-size:12px}.toolbar-group input,.toolbar-group select,.side-panel input,.side-panel select{border:1px solid var(--line);background:#fff;border-radius:7px;padding:7px 8px;color:var(--text)}.jump-group input{width:110px;font-family:var(--mono)}.icon-btn{width:30px;height:30px;border:1px solid var(--line);background:#fff;border-radius:7px;font-size:20px;line-height:1;cursor:pointer}.hex-head{display:grid;grid-template-columns:92px minmax(420px,1fr) 180px;background:#101827;color:#cbd5e1;font:12px var(--mono);padding:8px 12px;gap:12px}.hex-view{flex:1;min-height:0;overflow:auto;background:#111827;color:#dbe5f2;font:13px/1.7 var(--mono);padding:8px 0;outline:none}.hex-row{display:grid;grid-template-columns:92px minmax(420px,1fr) 180px;gap:12px;padding:0 12px;white-space:nowrap}.hex-row:hover{background:#1b2638}.offset{color:#72839b;user-select:none}.hex-bytes,.ascii-bytes{display:flex}.hex-byte{width:24px;text-align:center;border-radius:3px;cursor:default}.hex-byte:nth-child(8){margin-right:10px}.ascii-byte{width:10px;text-align:center;border-radius:2px}.hex-byte.hit,.ascii-byte.hit{background:var(--yellow);color:#111827}.hex-byte.active-hit,.ascii-byte.active-hit{background:var(--yellow2);color:#111827;font-weight:800}.hex-byte.changed,.ascii-byte.changed{color:#68e49e;text-decoration:underline;text-decoration-thickness:2px}.statusbar{height:28px;padding:5px 10px;background:#f8fafc;border-top:1px solid var(--line);display:flex;justify-content:space-between;color:var(--muted);font-size:12px}.side-panel{min-width:0;background:#fff;display:flex;flex-direction:column}.mode-tabs{height:48px;display:grid;grid-template-columns:1fr 1fr;border-bottom:1px solid var(--line)}.mode-tab{border:0;background:#f8fafc;color:#667085;font-weight:700;cursor:pointer}.mode-tab.active{background:#fff;color:var(--blue);box-shadow:inset 0 -3px var(--blue)}.side-scroll{overflow:auto;min-height:0}.tool-section{padding:14px;border-bottom:1px solid var(--line)}.field{display:block;color:#475467;font-size:12px;margin-bottom:11px}.field input{width:100%;display:block;margin-top:5px;font-family:var(--mono)}.field-row{display:flex;gap:10px;align-items:end;margin-bottom:11px}.field-row.two>*{flex:1;min-width:0}.field-row label{color:#475467;font-size:12px}.field-row select{display:block;width:100%;margin-top:5px}.check-label{display:flex!important;gap:7px;align-items:center!important;min-height:34px}.check-label input{width:auto!important;margin:0!important}.message{margin-top:10px;border-radius:8px;padding:9px 10px;font-size:12px;line-height:1.4}.message.info{background:#edf4ff;color:#1756a9}.message.error{background:#fff0ef;color:var(--red)}.message.success{background:#eaf7ef;color:#18723c}.results-section{border-bottom:1px solid var(--line)}.section-title{padding:11px 14px;background:#f8fafc;border-bottom:1px solid var(--line2);display:flex;justify-content:space-between;align-items:center}.section-title>div{display:flex;gap:8px;align-items:center}.section-title span,.history-section summary b{background:#e8eef7;color:#475467;border-radius:999px;padding:3px 7px;font-size:11px}.link-btn{border:0;background:none;color:var(--blue);font-size:12px;cursor:pointer;padding:3px}.result-list{max-height:310px;overflow:auto}.result-item{border-bottom:1px solid var(--line2);padding:9px 10px;display:grid;grid-template-columns:22px 1fr;gap:8px;cursor:pointer}.result-item:hover,.result-item.active{background:#f1f6ff}.result-check{margin-top:3px}.result-offset{font:700 12px var(--mono);color:var(--blue)}.result-context{font:11px/1.45 var(--mono);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:#475467;margin-top:4px}.result-context mark{background:var(--yellow);padding:1px 2px}.replace-actions{padding:10px}.history-section{border-bottom:1px solid var(--line)}.history-section summary{list-style:none;cursor:pointer;padding:12px 14px;background:#f8fafc;display:flex;justify-content:space-between;font-weight:700}.history-section summary::-webkit-details-marker{display:none}.history-list{max-height:260px;overflow:auto}.history-item{padding:9px 12px;border-bottom:1px solid var(--line2)}.history-item .h-top{display:flex;justify-content:space-between;gap:8px}.history-item .h-off{font:700 11px var(--mono);color:var(--blue)}.history-item .h-time{font-size:10px;color:#98a2b3}.history-item .h-change{font:11px/1.45 var(--mono);margin-top:4px;overflow-wrap:anywhere}.old{color:#b42318}.new{color:#18864b}.empty{padding:18px;text-align:center;color:#98a2b3;font-size:12px}.modal{position:fixed;inset:0;background:rgba(15,23,42,.62);display:grid;place-items:center;padding:20px;z-index:20}.modal-card{width:min(570px,100%);background:#fff;border-radius:16px;padding:24px;position:relative;box-shadow:0 25px 80px rgba(0,0,0,.3);text-align:center}.modal-close{position:absolute;right:13px;top:10px;border:0;background:none;font-size:27px;color:#667085;cursor:pointer}.done-icon{width:64px;height:64px;border-radius:50%;display:grid;place-items:center;margin:0 auto 12px;background:#eaf7ef;color:var(--green);font-size:34px;font-weight:800}.modal-card h2{margin:0 0 7px}.modal-card p{color:var(--muted);margin:0 0 17px}.summary-grid{display:grid;grid-template-columns:1fr 1fr;text-align:left;border:1px solid var(--line);border-radius:10px;overflow:hidden;margin-bottom:16px}.summary-grid>div{padding:11px;border-bottom:1px solid var(--line2);min-width:0}.summary-grid>div:nth-child(odd){border-right:1px solid var(--line2)}.summary-grid span{display:block;color:var(--muted);font-size:11px;margin-bottom:4px}.summary-grid b{display:block;font:12px var(--mono);overflow-wrap:anywhere}.modal-card .btn+.btn{margin-top:8px}
@media(max-width:1050px){.workspace{grid-template-columns:1fr 350px}.file-actions .btn.ghost:nth-child(1){display:none}.hex-head,.hex-row{grid-template-columns:82px minmax(390px,1fr) 160px}}
@media(max-width:800px){.editor-view{height:auto;min-height:calc(100vh - 78px)}.filebar{height:auto;align-items:flex-start}.file-actions{flex-wrap:wrap;justify-content:flex-end}.workspace{display:block}.hex-panel{height:65vh;border-right:0}.side-panel{border-top:1px solid var(--line)}.result-list,.history-list{max-height:none}.topbar p{display:none}.summary-grid{grid-template-columns:1fr}.summary-grid>div:nth-child(odd){border-right:0}}

/* v1.11: vollständiger, virtuell gerenderter 32-Byte-Hexdump */
.hex-toolbar{justify-content:flex-start}
.toolbar-note{margin-left:auto;color:#667085;font-size:12px;white-space:nowrap}
.hit-nav{min-width:225px}
.hex-head{grid-template-columns:92px 790px 330px;min-width:1240px}
.hex-view{position:relative;overflow:scroll;scrollbar-gutter:stable both-edges;padding:0;line-height:25px}
.hex-spacer{position:absolute;left:0;top:0;width:1px;pointer-events:none}
.hex-rows{position:absolute;left:0;top:0;min-width:1240px;width:max-content}
.hex-row{grid-template-columns:92px 790px 330px;min-width:1240px;padding:0 12px;line-height:25px}
.hex-bytes,.ascii-bytes{height:25px;align-items:center}
.hex-byte{width:24px;min-width:24px}
.hex-byte:nth-child(8n){margin-right:10px}
.ascii-byte{width:10px;min-width:10px}
.empty-byte{pointer-events:none}
.result-context{color:var(--blue);font-family:Segoe UI,Roboto,Arial,sans-serif}
@media(max-width:1050px){.hex-head,.hex-row{grid-template-columns:82px 790px 330px;min-width:1230px}.hex-rows{min-width:1230px}.toolbar-note{display:none}}


/* v1.12: variable 8-byte columns and strict search-row view */
:root{--hex-data-width:826px;--ascii-data-width:338px;--hex-min-width:1304px}
.hex-head{grid-template-columns:92px var(--hex-data-width) var(--ascii-data-width);min-width:var(--hex-min-width)}
.hex-rows{min-width:var(--hex-min-width)}
.hex-row{grid-template-columns:92px var(--hex-data-width) var(--ascii-data-width);min-width:var(--hex-min-width)}
.column-group select{min-width:118px}
@media(max-width:1050px){.hex-head,.hex-row{grid-template-columns:82px var(--hex-data-width) var(--ascii-data-width);min-width:var(--hex-min-width)}.hex-rows{min-width:var(--hex-min-width)}}

/* v1.14: kompakte String-Trefferansicht mit wählbarem Kontext */
.search-text-row{display:grid;grid-template-columns:92px minmax(520px,1fr);gap:12px;padding:0 12px;line-height:25px;white-space:pre;font-family:var(--mono);cursor:pointer;min-width:760px}
.search-text-row:hover,.search-text-row.active-result-row{background:#1b2638}
.search-text{color:#dbe5f2;overflow:visible}
.search-text mark{background:var(--yellow2);color:#111827;font-weight:800;border-radius:3px;padding:1px 3px}
.context-char{color:#91a4bd;background:#253247;border-radius:2px;padding:1px 2px}
.search-empty{padding:20px;color:#91a4bd;font-family:var(--mono)}
body.search-mode .hex-head{grid-template-columns:92px minmax(520px,1fr)}

/* v1.15: Kontextauswahl in der Hex-Werkzeugleiste */
.context-group select{min-width:105px}
.context-group{white-space:nowrap}
@media(max-width:1250px){.hex-toolbar{gap:9px}.hit-nav{min-width:auto}}
