:root{--bg: #f6f7f9;--panel: #ffffff;--border: #e2e5ea;--text: #1f2430;--muted: #6b7280;--accent: #2563eb;--entity: #7c3aed;--entity-bg: #f3e8ff;--array: #0e7490;--array-bg: #e0f7fb;--optional: #b45309;--optional-bg: #fef3c7;--mono: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace}*{box-sizing:border-box}html,body,#root{height:100%;margin:0}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica,Arial,sans-serif;background:var(--bg);color:var(--text);font-size:14px}.app{display:flex;height:100vh}.sidebar{flex:0 0 260px;width:260px;background:var(--panel);border-right:1px solid var(--border);display:flex;flex-direction:column}.sidebar-header{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:14px 16px;border-bottom:1px solid var(--border)}.sidebar-header h2{margin:0;font-size:12px;text-transform:uppercase;letter-spacing:.05em;color:var(--muted)}.file-list{list-style:none;margin:0;padding:8px;overflow-y:auto}.file-list button{width:100%;display:flex;align-items:center;justify-content:space-between;gap:8px;padding:8px 10px;border:none;background:none;border-radius:6px;cursor:pointer;color:var(--text);font-size:13px}.file-list button:hover{background:#f0f2f5}.file-list button.active{background:#e8f0fe;color:var(--accent);font-weight:600}.file-list .fname{font-family:var(--mono);word-break:break-all;text-align:left}.file-list .dot{color:var(--accent);font-size:9px}.file-list .empty{padding:8px 10px;color:var(--muted);font-style:italic}.file-list li.file-row{display:flex;align-items:stretch}.file-list .file-select{flex:1 1 auto;width:auto;min-width:0}.file-list .btn-delete{flex:0 0 auto;width:28px;justify-content:center;color:var(--muted);font-size:14px;line-height:1;opacity:0}.file-list li.file-row:hover .btn-delete,.file-list .btn-delete:focus-visible{opacity:1}.file-list .btn-delete:hover{background:#fde2e2;color:#dc2626}.main{flex:1;display:flex;flex-direction:column;overflow:hidden}.main-header{display:flex;align-items:center;gap:12px;padding:12px 20px;background:var(--panel);border-bottom:1px solid var(--border)}.main-header .title{font-family:var(--mono);font-weight:600}.main-header .spacer{flex:1}.mode-tag{font-size:11px;font-weight:600;padding:2px 8px;border-radius:999px;background:#ede9fe;color:#6d28d9}.btn{border:none;border-radius:6px;padding:7px 14px;font-size:13px;cursor:pointer;background:var(--accent);color:#fff}.btn:hover{filter:brightness(1.05)}.btn:disabled{opacity:.5;cursor:not-allowed}.btn-secondary{background:#eef1f5;color:var(--text)}.btn-sm{padding:5px 10px;font-size:12px}.save-status{font-size:12px}.save-status.saving{color:var(--muted)}.save-status.saved{color:#059669}.save-status.error{color:#dc2626}.banner{padding:10px 20px;font-size:13px}.banner.error{background:#fee2e2;color:#991b1b;border-bottom:1px solid #fecaca}.content{flex:1;overflow:auto;padding:16px 20px}.placeholder{padding:48px;text-align:center;color:var(--muted)}.placeholder code{font-family:var(--mono);background:#eceef1;padding:1px 5px;border-radius:4px}.tree{background:var(--panel);border:1px solid var(--border);border-radius:8px;overflow:hidden}.tree-head,.row{display:flex;align-items:stretch}.tree-head{background:#fafbfc;border-bottom:1px solid var(--border);font-size:11px;text-transform:uppercase;letter-spacing:.05em;color:var(--muted)}.struct-head{flex:1;padding:10px 12px}.comment-head{flex:0 0 360px;width:360px;padding:10px 12px;border-left:1px solid var(--border)}.row{border-bottom:1px solid #f0f1f3}.row:last-child{border-bottom:none}.row:hover{background:#fafbfd}.row-entity{background:var(--entity-bg)}.row-entity:hover{background:#efe3ff}.gutter{flex:0 0 auto;display:flex}.guide{display:inline-block;width:22px;align-self:stretch;border-left:2px solid transparent}.struct{flex:1;min-width:0;display:flex;flex-direction:column;gap:5px;padding:9px 12px 9px 4px}.head{display:flex;align-items:center;flex-wrap:wrap;gap:8px}.toggle{width:26px;height:26px;flex:0 0 26px;display:inline-flex;align-items:center;justify-content:center;padding:0;border:none;border-radius:6px;background:none;cursor:pointer;color:#334155;font-size:13px;line-height:1}.toggle:hover{background:#dde4ec;color:#0f172a}.toggle-empty{color:#cbd2db;cursor:default;font-size:9px}.toggle-empty:hover{background:none}.key{font-family:var(--mono);font-weight:700;font-size:14px}.key.clickable{cursor:pointer}.key.clickable:hover{text-decoration:underline}.type{font-size:12px;color:var(--muted)}.detail{display:flex;flex-direction:column;gap:6px;padding-left:32px;max-width:760px}.desc{color:#334155;font-size:13px;line-height:1.5;white-space:pre-wrap;word-break:break-word}.value{font-family:var(--mono);font-size:13px;color:#1e293b;background:#f3f5f8;border-radius:6px;padding:4px 8px;white-space:pre-wrap;word-break:break-word}.chips{display:flex;flex-wrap:wrap;align-items:center;gap:6px}.chips-label{font-size:11px;color:var(--muted);text-transform:uppercase;letter-spacing:.04em}.chip{font-family:var(--mono);font-size:12px;color:#1e293b;background:#eef2f7;border:1px solid #e1e7ee;border-radius:6px;padding:2px 8px;white-space:pre-wrap;word-break:break-word}.badge{font-size:11px;font-weight:700;padding:2px 10px;border-radius:999px;white-space:nowrap}.badge-entity{background:var(--entity);color:#fff}.badge-array{background:var(--array-bg);color:var(--array)}.badge-optional{background:var(--optional-bg);color:var(--optional)}.badge-null{background:#eef2f7;color:#64748b}.comment-wrap{flex:0 0 360px;width:360px;display:flex;align-items:flex-start;padding:7px 12px;border-left:1px solid var(--border)}.comment{width:100%;border:1px solid transparent;border-radius:6px;padding:6px 8px;font-family:inherit;font-size:13px;line-height:1.45;color:var(--text);background:transparent;resize:none;overflow:hidden}.comment::placeholder{color:#c2c7cf}.comment:hover{border-color:var(--border)}.comment:focus{outline:none;border-color:var(--accent);background:#fff}.comment.has-value{background:#fffdf5;border-color:#f0e6c8}