:root{font-family:Space Grotesk,IBM Plex Sans SC,Noto Sans SC,sans-serif;line-height:1.45;font-weight:400;color:#162028;--json-level-1: #f5f8ff;--json-level-2: #e9f0ff;--json-level-3: #dce8ff;--json-level-4: #cfdfff;--json-level-5: #c2d6ff;--json-hover: #ffeab6;--json-active-outline: #e5b24a;--json-text-main: #1f2937;--json-text-muted: #64748b;background:transparent}*{box-sizing:border-box}body{margin:0;min-height:100vh;position:relative;background:#fffef7}body:before{content:"";position:fixed;top:0;right:0;bottom:0;left:0;pointer-events:none;z-index:0;background:radial-gradient(circle at 15% 10%,#ffd56f 0%,transparent 30%),radial-gradient(circle at 85% 0%,#79d5c5 0%,transparent 35%),linear-gradient(145deg,#fffef7,#eef7ff)}body.modal-open{overflow:hidden;touch-action:none}#root{min-height:100vh;position:relative;z-index:1}.app-shell{width:min(1060px,calc(100% - 2rem));margin:2rem auto 3rem;padding:1.2rem}.top-panel{display:flex;justify-content:space-between;align-items:flex-start;gap:.8rem}.top-panel-main{min-width:0}.top-panel h1{margin:0;font-size:clamp(1.4rem,1.2rem + 1vw,2rem);letter-spacing:.02em}.top-panel p{margin:.3rem 0 1rem;color:#3f535f}.lang-switch{display:inline-flex;align-items:center;gap:.35rem;padding-top:.2rem;white-space:nowrap}.lang-btn{border:0;padding:0;background:transparent;cursor:pointer;font-weight:600;color:#4b6675}.lang-btn.active{color:#0f4f5b}.lang-sep{color:#5f7785}.drop-zone{border:2px dashed #2d6f79;border-radius:16px;padding:1.2rem;text-align:center;background:#fffc;cursor:pointer;transition:transform .18s ease,box-shadow .18s ease;box-shadow:0 10px 30px #11353e17}.drop-zone.is-hover{transform:translateY(-2px);box-shadow:0 14px 32px #11353e2e}.drop-zone.is-disabled{cursor:not-allowed;opacity:.65}.drop-main{margin:0;font-weight:700}.drop-sub{margin:.4rem 0 0;color:#425f69}.hidden-input{display:none}.example-row{margin-top:.6rem;display:flex;justify-content:flex-start}.example-btn{border-color:#4d7598;background:#ffffffd6;font-weight:600}.page-cycle-btn{min-width:9.4rem;font-weight:700;transition:background-color .15s ease,border-color .15s ease,color .15s ease}.page-cycle-btn.stage-0{border-color:#3f86d2;background:#e9f2ff;color:#0f4d8c}.page-cycle-btn.stage-1{border-color:#1b8f64;background:#e5f8ef;color:#0b6f4b}.page-cycle-btn.stage-2{border-color:#ad6d11;background:#fff1d8;color:#7a4a00}.stats-grid{display:grid;grid-template-columns:repeat(4,minmax(120px,1fr));gap:.8rem;margin-top:1rem}.stat-card{background:#ffffffd1;border:1px solid rgba(17,53,62,.1);border-radius:12px;padding:.7rem .8rem}.stat-card span{color:#50616d;display:block;font-size:.9rem}.stat-card strong{font-size:1.05rem}.truncate{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.filter-row{display:flex;gap:.5rem;margin-top:1rem;flex-wrap:wrap;align-items:center}.chip{border:1px solid #2d6f79;border-radius:999px;padding:.32rem .72rem;background:transparent;cursor:pointer;font-weight:600}.chip.active{background:#2d6f79;color:#fff}.search-input{min-width:min(320px,100%);flex:1;border:1px solid #87a7b0;border-radius:999px;background:#ffffffe0;padding:.38rem .8rem;color:#22353f}.error-banner,.loading-tip{margin-top:1rem;padding:.7rem .8rem;border-radius:10px}.error-banner{color:#9f1d1d;background:#ffe9e9;border:1px solid #f4c1c1}.loading-tip{color:#285464;background:#e6f5fb;border:1px solid #b7dcea}.line-list{margin-top:1rem}.line-list-toolbar{display:flex;justify-content:space-between;align-items:center;margin-bottom:.6rem;color:#41535f}.toolbar-actions{display:flex;gap:.45rem}.ghost-btn{border:1px solid #527782;border-radius:8px;background:#ffffffb8;padding:.32rem .65rem;cursor:pointer}.ghost-btn:disabled{opacity:.45;cursor:not-allowed}.line-item{border:1px solid rgba(17,53,62,.15);border-radius:10px;background:#ffffffe0;margin-bottom:.65rem;overflow:hidden}.line-error{border-color:#a0202066}.line-head{padding:.72rem .8rem;display:flex;gap:.6rem;align-items:center;min-height:3rem}.line-head-main{flex:1;border:0;background:transparent;padding:0;text-align:left;display:flex;gap:.6rem;align-items:center;cursor:pointer}.line-head-actions{display:flex;gap:.45rem;justify-content:flex-end;align-items:center;min-width:1.7rem;flex-shrink:0;position:relative;z-index:2}.icon-btn{width:1.7rem;height:1.7rem;display:inline-flex;align-items:center;justify-content:center;border:1px solid #527782;border-radius:8px;background:#ffffffb8;color:#1f3f51;cursor:pointer;padding:0;transition:background-color .12s ease,border-color .12s ease,color .12s ease}.icon-btn svg{width:.85rem;height:.85rem;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}.line-head-actions .icon-btn{opacity:0;pointer-events:none}.line-item:hover .line-head-actions .icon-btn,.line-head:focus-within .icon-btn,.line-item.is-expanded .line-head-actions .icon-btn{opacity:1;pointer-events:auto}.line-fullscreen-actions .icon-btn{opacity:1;pointer-events:auto}.icon-btn:hover,.icon-btn:focus-visible{background:#edf6fa;border-color:#3d6671;color:#15384a}.line-title{font-weight:700}.line-status{border-radius:999px;padding:.08rem .55rem;font-size:.78rem;font-weight:700}.status-ok{color:#0a5d44;background:#d7ffef}.status-error{color:#8a1f1f;background:#ffe2e2}.line-summary{color:#5c6973;font-size:.9rem}.line-body{border-top:1px solid rgba(17,53,62,.12);padding:.65rem .8rem;overflow:auto;background:#f8fafd}.line-fullscreen-overlay{position:fixed;top:0;right:0;bottom:0;left:0;z-index:1000;background:#08131c94;display:flex;align-items:center;justify-content:center;padding:1rem;overscroll-behavior:contain}.line-fullscreen-panel{width:min(1200px,96vw);height:min(92vh,1000px);background:#fff;border:1px solid rgba(17,53,62,.2);border-radius:12px;box-shadow:0 20px 50px #00000038;display:flex;flex-direction:column}.line-fullscreen-header{border-bottom:1px solid rgba(17,53,62,.14);padding:.7rem .8rem;display:flex;align-items:center;justify-content:space-between;gap:.6rem}.line-fullscreen-actions{display:flex;gap:.45rem;flex-wrap:wrap;justify-content:flex-end;align-items:center}.line-fullscreen-content{flex:1;overflow:auto;padding:.7rem .8rem;overscroll-behavior:contain;background:#f8fafd}.error-text{margin:0 0 .5rem;color:#8a1f1f;font-weight:700}.raw-line{margin:0;background:#fff8f8;border:1px solid #f4d7d7;border-radius:8px;padding:.6rem;overflow:auto}.tree-line{position:relative;display:flex;align-items:baseline;gap:.28rem;border-radius:6px;margin:.08rem 0;padding-top:.06rem;padding-bottom:.06rem;font-family:IBM Plex Mono,Fira Code,monospace;font-size:.9rem;color:var(--json-text-main);transition:background-color .15s ease}.tree-line>*{position:relative;z-index:1}.tree-line:after{content:"";position:absolute;top:0;right:0;bottom:0;left:var(--active-left, 0px);border-radius:6px;background:var(--json-hover);box-shadow:inset 0 0 0 1px var(--json-active-outline);pointer-events:none;opacity:0;z-index:0;transition:opacity .12s ease}.tree-line:before{content:"";position:absolute;top:2px;bottom:2px;left:var(--active-left, 0px);width:2px;border-radius:999px;background:#6f94c5;opacity:0;pointer-events:none;z-index:0;transition:opacity .12s ease}.tree-line:hover:after,.tree-line:focus-within:after{opacity:1}.tree-line:hover:before,.tree-line:focus-within:before{opacity:1}.line-depth-1{background:var(--json-level-1);box-shadow:inset 3px 0 #b8ceff}.line-depth-2{background:var(--json-level-2);box-shadow:inset 3px 0 #9fbcff}.line-depth-3{background:var(--json-level-3);box-shadow:inset 3px 0 #87aaff}.line-depth-4{background:var(--json-level-4);box-shadow:inset 3px 0 #7099ff}.line-depth-5{background:var(--json-level-5);box-shadow:inset 3px 0 #5a89ff}.line-depth-0{background:#fff;box-shadow:inset 3px 0 #d6e2ff}.tree-block{position:relative;border-radius:8px;margin:.16rem 0}.tree-block.is-open{--block-bg: #fcfdff;--block-border: #c8d8fb;--block-accent: #8eaef5}.tree-block.is-open:before{content:"";position:absolute;top:0;right:0;bottom:0;left:var(--tree-offset, 0px);border:1px solid var(--block-border);border-left:4px solid var(--block-accent);border-radius:8px;background:var(--block-bg);pointer-events:none;z-index:0;transition:border-color .12s ease,box-shadow .12s ease,background-color .12s ease}.tree-block.is-open:hover:before,.tree-block.is-open:focus-within:before{border-color:#6f98e5;background:linear-gradient(180deg,#ffffffeb,#f1f7fff5);box-shadow:0 0 0 2px #6c97e966,0 10px 20px #3a5fa63d}.tree-block.is-open:hover:has(.tree-block.is-open:hover):before{border-color:var(--block-border);background:var(--block-bg);box-shadow:none}.tree-block>*{position:relative;z-index:1}.tree-block.is-open .tree-line{box-shadow:none;background:transparent}.tree-block.is-open .tree-line:hover{background:transparent}.tree-block.is-open .tree-line:focus-within{background:transparent}.block-depth-0.is-open{--block-bg: #fcfdff;--block-border: #d6e3ff;--block-accent: #b6ccff}.block-depth-1.is-open{--block-bg: #f5f8ff;--block-border: #c9d9ff;--block-accent: #a6c0ff}.block-depth-2.is-open{--block-bg: #e4eeff;--block-border: #bad0ff;--block-accent: #90b0ff}.block-depth-3.is-open{--block-bg: #d7e6ff;--block-border: #abc7ff;--block-accent: #7a9fff}.block-depth-4.is-open{--block-bg: #cadfff;--block-border: #9abaff;--block-accent: #678fff}.block-depth-5.is-open{--block-bg: #bdd6ff;--block-border: #88acff;--block-accent: #557fff}.tree-children{padding:.08rem 0}.tree-block-head{border-top-left-radius:8px;border-top-right-radius:8px;align-items:center;justify-content:space-between;gap:.35rem}.tree-head-main{min-width:0;display:flex;align-items:baseline;gap:.28rem;flex:1}.tree-head-actions{display:flex;align-items:center;flex-shrink:0}.tree-copy-btn{border:1px solid #9bb2cc;border-radius:999px;background:#ffffffe6;color:#2f556e;padding:.08rem .5rem;font-size:.72rem;line-height:1.35;cursor:pointer;opacity:0;pointer-events:none;transition:opacity .12s ease,border-color .12s ease,background-color .12s ease}.tree-block-head:hover .tree-copy-btn,.tree-block-head:focus-within .tree-copy-btn{opacity:1;pointer-events:auto}.tree-copy-btn:hover,.tree-copy-btn:focus-visible{border-color:#6f94c5;background:#f4f9ff}.tree-block-tail{border-bottom-left-radius:8px;border-bottom-right-radius:8px}.tree-end-hint{margin-left:.5rem;font-size:.78rem;color:#4e6288;letter-spacing:.01em}.tree-level-toggle{position:relative;border:1px solid #4f6e90;min-width:1.32rem;height:1.32rem;padding:0 .3rem;border-radius:999px;display:inline-flex;align-items:center;justify-content:center;background:#5e7ea4;color:#f9fcff;font-size:.7rem;line-height:1;font-weight:600;text-align:center;font-variant-numeric:tabular-nums;letter-spacing:.02em;cursor:pointer;transition:background-color .12s ease,border-color .12s ease,color .12s ease,box-shadow .12s ease,transform .12s ease}.tree-level-toggle:hover{border-color:#3f5d7f;box-shadow:0 2px 6px #2f567c3d;transform:translateY(-1px)}.tree-level-toggle:focus-visible{outline:2px solid #6f94c5;outline-offset:1px}.tree-level-toggle:active{transform:translateY(0);box-shadow:0 1px 2px #2f567c33}.tree-block.is-open .tree-level-toggle{background:#ffffffb8;border-color:#4364835c;color:#4f6d8c}.tree-key{color:#355b71}.tree-preview,.tree-bracket{color:var(--json-text-muted)}.value-string{color:#8e4b00}.value-number{color:#125f8f}.value-boolean{color:#21734f}.value-null{color:#8f5f13}.value-generic{color:#27323a}.empty-state{background:#ffffffb8;border-radius:10px;padding:1.1rem;text-align:center;color:#60717e}.pagination{display:flex;align-items:center;justify-content:center;gap:.8rem;margin-top:1rem}@media(max-width:860px){.stats-grid{grid-template-columns:repeat(2,minmax(120px,1fr))}}@media(max-width:600px){.app-shell{width:calc(100% - 1rem);margin:1rem auto 2rem;padding:.6rem}.top-panel,.line-head{flex-wrap:wrap}.line-head-main{min-width:100%}.line-head-actions{width:100%;justify-content:flex-start;flex-wrap:wrap}.line-fullscreen-overlay{padding:.5rem}.line-fullscreen-panel{width:100%;height:95vh;border-radius:10px}.line-fullscreen-header{align-items:flex-start;flex-direction:column}.line-fullscreen-actions{width:100%;justify-content:flex-start}}
