:root{--bg: #f5f6f8;--panel: #ffffff;--border: #dfe2e8;--text: #1d2330;--muted: #6b7385;--accent: #3a63d8;--accent-soft: #e8eefc;--ok: #1f8a4c;--err: #c83434;--warn: #a8670a;--mono: "JetBrains Mono", "SF Mono", Menlo, Consolas, monospace;--sans: -apple-system, BlinkMacSystemFont, "Segoe UI", Inter, sans-serif}*{box-sizing:border-box}html,body{margin:0;height:100%}body{background:var(--bg);color:var(--text);font:14px/1.4 var(--sans)}#app,.app{height:100%}.app{display:flex;flex-direction:column}button{font:inherit;font-size:13px;padding:5px 11px;border-radius:6px;cursor:pointer;border:1px solid var(--accent);background:var(--accent);color:#fff}button:hover{filter:brightness(1.08)}button.ghost{background:transparent;color:var(--text);border-color:var(--border)}button.ghost:hover{background:var(--accent-soft);filter:none}.spacer{flex:1}.muted{color:var(--muted)}.topbar{display:flex;align-items:center;gap:14px;padding:10px 18px;background:var(--panel);border-bottom:1px solid var(--border)}.brand{display:flex;align-items:center;gap:8px;font-weight:700;font-size:17px}.logo{font-family:var(--mono);color:var(--accent)}.tagline{color:var(--muted);font-size:13px}.panes{flex:1;min-height:0;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:12px;padding:12px}@media(max-width:900px){.panes{grid-template-columns:minmax(0,1fr);grid-auto-rows:minmax(480px,auto)}.tagline{display:none}}.pane{display:flex;flex-direction:column;min-height:0;background:var(--panel);border:1px solid var(--border);border-radius:10px;overflow:hidden}.pane.dragging{outline:2px dashed var(--accent);outline-offset:-4px}.pane-head{display:flex;align-items:center;gap:8px;padding:8px 12px;border-bottom:1px solid var(--border)}.pane-head h2{margin:0 6px 0 0;font-size:14px;text-transform:uppercase;letter-spacing:.06em;color:var(--muted)}.type-select{font:13px var(--mono);padding:4px 6px;border-radius:6px;border:1px solid var(--border);background:var(--panel);color:var(--text);max-width:340px}.tabs{display:flex;gap:2px;padding:6px 8px 0;border-bottom:1px solid var(--border);overflow-x:auto}.tab{display:flex;align-items:center;gap:4px;padding:5px 6px 5px 10px;border-radius:6px 6px 0 0;font:12px var(--mono);color:var(--muted);cursor:pointer;white-space:nowrap;border:1px solid transparent;border-bottom:none}.tab:hover{color:var(--text)}.tab.active{background:var(--panel);color:var(--text);border-color:var(--border);margin-bottom:-1px}.tab.has-errors .tab-name{text-decoration:underline wavy var(--err);text-underline-offset:3px}.tab-close{background:none;border:none;color:var(--muted);padding:0 4px;font-size:14px;line-height:1}.tab-close:hover{color:var(--err);background:none}.editor-wrap{position:relative;flex:1;min-height:0}.cm-host{position:absolute;inset:0}.cm-editor.cm-focused{outline:none}.empty{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;pointer-events:none;text-align:center;padding:20px}.empty p{margin:4px}.status{border-top:1px solid var(--border);padding:8px 12px;max-height:140px;overflow:auto;font-size:13px}.status .ok{color:var(--ok)}.error-item{display:flex;gap:10px;padding:2px 0;cursor:pointer;color:var(--err);font-size:13px}.error-item:hover{text-decoration:underline}.error-item.warning{color:var(--warn)}.error-item .loc{font-family:var(--mono);color:var(--muted);white-space:nowrap}.output{border-top:1px solid var(--border);display:flex;flex-direction:column;height:46%;min-height:220px}.output-head{display:flex;align-items:center;gap:10px;padding:7px 12px;border-bottom:1px solid var(--border)}.badge{font-weight:600;font-size:13px}.badge.ok{color:var(--ok)}.badge.err{color:var(--err)}.badge .warn{color:var(--warn);font-weight:500}.seg{display:flex;border:1px solid var(--border);border-radius:6px;overflow:hidden}.seg button{border:none;border-radius:0;background:transparent;color:var(--muted);padding:3px 10px}.seg button.on{background:var(--accent-soft);color:var(--accent)}.actions{display:flex;gap:6px}.output-body{flex:1;min-height:0;overflow:auto;padding:8px 12px}.diags{flex:none;max-height:30%;overflow:auto;padding:6px 12px;border-bottom:1px solid var(--border)}.bytes{margin:0;font:12.5px/1.6 var(--mono);white-space:pre}.bytes.hex,.bytes.base64{white-space:pre-wrap;word-break:break-all}.decode-row{display:flex;align-items:center;gap:8px;padding:7px 12px;border-top:1px solid var(--border);font-size:13px}.hex-input{flex:1;min-width:0;font:12px var(--mono);padding:5px 8px;border:1px solid var(--border);border-radius:6px;background:var(--bg);color:var(--text)}.notice{position:fixed;bottom:18px;left:50%;transform:translate(-50%);max-width:80vw;background:#1d2330;color:#fff;padding:9px 16px;border-radius:8px;font-size:13px;box-shadow:0 6px 24px #0000002e;cursor:pointer}.notice.error{background:var(--err)}.cm-gutters{background:#fafbfc!important;border-right:1px solid var(--border)!important}.cm-tooltip.cm-tooltip-autocomplete>ul>li[aria-selected]{background:var(--accent)}.cm-completionDetail{color:var(--muted);font-style:normal!important;margin-left:1em}li[aria-selected] .cm-completionDetail{color:#dfe6fb}.fieldmap{display:flex;flex-direction:column;gap:8px}.fieldinfo{position:sticky;top:-8px;z-index:1;box-shadow:0 -8px 0 var(--panel);font:12px var(--mono);padding:5px 8px;border-radius:6px;background:var(--accent-soft);color:var(--text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.fieldinfo.muted{background:#f0f2f5;color:var(--muted);font-family:var(--sans)}.legend{display:flex;flex-wrap:wrap;align-items:center;gap:12px;font-size:12px}.legend>span{display:inline-flex;align-items:center;gap:4px}.bytegrid{font:12px/1 var(--mono)}.brow{display:flex;gap:14px;margin-bottom:2px;content-visibility:auto;contain-intrinsic-size:auto 20px}.boff{color:var(--muted);padding:3px 0;-webkit-user-select:none;user-select:none}.bhex{display:flex;gap:2px}.bhex .b:nth-child(8){margin-right:8px}.bascii{display:flex}.b,.a{display:inline-block;padding:3px 0;text-align:center;border-radius:3px;cursor:default}.b{min-width:2.6ch}.a{min-width:1.15ch;border-radius:0}.tag{font-weight:700;color:#1d2330;box-shadow:inset 0 -2px #1d233059}.len{font-style:italic;color:#4f5668;box-shadow:inset 0 -2px #1d233026}.val{color:#2a3142}.a.tag,.a.len{box-shadow:none}.b.key{background:#eceef2}.b.hl,.a.hl{background:var(--accent)!important;color:#fff!important}.c0{background:#dbe7ff}.c1{background:#ffe1d6}.c2{background:#d9f2e3}.c3{background:#f3dcf5}.c4{background:#fff0c2}.c5{background:#d6f0f5}.c6{background:#ece0d1}.c7{background:#e3e3fb}.cm-pb-hl{background:#3a63d833;border-radius:2px;box-shadow:0 0 0 1px #3a63d859}.cm-tooltip.cm-completionInfo{max-width:420px;padding:8px 10px}.pb-sig{font:12px var(--mono);color:var(--text);white-space:pre-wrap}.pb-doc{margin-top:6px;font:12.5px/1.45 var(--sans);white-space:pre-wrap;color:var(--text)}.pb-sig+.pb-doc{padding-top:6px;border-top:1px solid var(--border)}.pb-typedoc{color:var(--muted)}.pb-typename{font:600 11px var(--mono);color:var(--muted);margin-bottom:2px}
