.json-formatter-layout{align-items: stretch;row-gap: 16px}.json-formatter-tool,.json-formatter-tool *{box-sizing: border-box}.json-formatter-input-panel,.json-formatter-result-panel{min-width: 0;overflow: hidden;height: auto}.json-formatter-panel-header{display: flex;flex-wrap: wrap;align-items: center;gap: 12px;min-width: 0}.json-formatter-panel-header>span:first-child{flex: 1 1 150px;min-width: 0}.json-formatter-panel-header>span:first-child i{margin-right: 6px}.json-formatter-header-actions{display: flex;flex: 1 1 280px;flex-wrap: wrap;gap: 8px;align-items: center;justify-content: flex-end;min-width: 0}.json-formatter-header-actions .btn-sm{flex: 0 1 auto;min-height: 28px;min-width: 0;padding-top: 4px;padding-bottom: 4px;white-space: nowrap}.json-formatter-header-actions .btn i{margin-right: 6px}.json-formatter-input-body,.json-formatter-result-body{background: #fff}.json-formatter-input-body .CodeMirror,.json-formatter-result-body .CodeMirror{width: 100%;min-height: 400px;height: 400px;border-radius: var(--radius)}.json-formatter-input-panel.json-formatter-dragover{outline: 2px dashed var(--primary);outline-offset: -6px}.json-formatter-view-toggle{display: inline-flex;flex: 0 0 auto;border: 1px solid var(--border);border-radius: var(--radius);background: var(--bg);overflow: hidden}.json-formatter-view-toggle label{margin: 0;display: flex}.json-formatter-view-toggle input{position: absolute;opacity: 0;pointer-events: none}.json-formatter-view-toggle span{display: inline-flex;align-items: center;gap: 5px;padding: 4px 10px;color: var(--text-2);font-size: 12.5px;font-weight: 500;line-height: 1.5;cursor: pointer}.json-formatter-view-toggle span i{font-size: 12px}.json-formatter-view-toggle input:checked + span{background: var(--primary-soft);color: var(--primary);font-weight: 600}.json-formatter-options-panel{margin-top: 16px;background: #fff}.json-formatter-option-grid{grid-template-columns: repeat(2,minmax(0,1fr))}.json-formatter-option-grid .code-option-check:last-child{grid-column: 1 / -1}.json-formatter-stats{display: grid;grid-template-columns: repeat(auto-fit,minmax(118px,1fr));gap: 10px;margin-bottom: 14px}.json-formatter-result-toolbar{display: flex;flex-wrap: wrap;justify-content: flex-end;gap: 8px;margin-bottom: 12px}.json-formatter-result-toolbar .btn{min-width: 0;justify-content: center;white-space: nowrap}.json-formatter-result-toolbar .btn i{margin-right: 6px}.json-formatter-stat-card{display: flex;flex-direction: column;gap: 3px;min-width: 0;padding: 10px 12px;border: 1px solid var(--border);border-radius: var(--radius);background: var(--bg-soft)}.json-formatter-stat-card strong{overflow: hidden;color: var(--text);font-size: 15px;line-height: 1.3;text-overflow: ellipsis;white-space: nowrap}.json-formatter-stat-card span{color: var(--text-2);font-size: 12.5px;line-height: 1.35}.json-formatter-stat-primary{border-color: rgba(37,99,235,.28);background: var(--primary-soft)}.json-formatter-stat-primary strong{color: var(--primary)}.json-formatter-message{display: flex;align-items: flex-start;gap: 8px;margin-bottom: 14px}.json-formatter-empty{text-align: center;color: var(--text-3);padding: 56px 16px}.json-formatter-empty i{display: block;margin-bottom: 12px;font-size: 34px}.json-formatter-empty p{max-width: 420px;margin: 0 auto;font-size: 13.5px;line-height: 1.6}.json-formatter-tree-view{min-width: 0}.json-formatter-tree-toolbar{display: grid;grid-template-columns: repeat(auto-fit,minmax(118px,1fr));gap: 8px;margin-bottom: 10px}.json-formatter-tree-toolbar .btn{width: 100%;min-width: 0;justify-content: center}.json-formatter-tree-toolbar .btn i{margin-right: 6px}.json-formatter-path-bar{display: flex;align-items: center;gap: 8px;min-width: 0;margin-bottom: 10px;padding: 8px 10px;border: 1px solid var(--border);border-radius: var(--radius);background: var(--bg-soft)}.json-formatter-path-label{flex: 0 0 auto;color: var(--text-3);font-size: 12px;font-weight: 600;text-transform: uppercase}.json-formatter-selected-path{min-width: 0;overflow: hidden;color: var(--text);font-family: var(--mono);font-size: 12.5px;text-overflow: ellipsis;white-space: nowrap}.json-formatter-tree{width: 100%;min-width: 0;border: 1px solid var(--border);border-radius: var(--radius);background: var(--bg);max-height: 500px;overflow: auto;padding: 10px 12px;font-family: var(--mono);font-size: 13px;line-height: 1.9}.json-formatter-tree .json-children{border-left: 1px dashed var(--border-strong);margin-left: 12px;padding-left: 10px}.json-formatter-tree .json-node.collapsed>.json-children{display: none}.json-row{display: flex;align-items: baseline;gap: 6px;min-width: 0;padding: 1px 6px;border-radius: 4px;cursor: pointer}.json-row>*{min-width: 0}.json-row:hover{background: var(--bg-soft)}.json-row-selected,.json-row-selected:hover{background: var(--primary-soft);box-shadow: inset 3px 0 0 var(--primary)}.json-row-leaf{cursor: default}.json-row-note{color: var(--text-3);font-style: italic}.json-toggle{flex: 0 0 auto;margin: 0;padding: 0 2px;border: 0;background: none;color: var(--text-3);cursor: pointer;line-height: inherit}.json-toggle i{font-size: 11px}.json-toggle-spacer{flex: 0 0 15px}.json-key{color: #7c3aed;word-break: break-all}.json-colon{color: var(--text-3)}.json-value{min-width: 0;word-break: break-all}.json-value-string{color: #15803d}.json-value-number{color: #1d4ed8}.json-value-boolean{color: #c2410c}.json-value-null{color: var(--text-3);font-style: italic}.json-badge{flex: 0 0 auto;padding: 2px 7px;border-radius: 999px;font-family: inherit;font-size: 10.5px;font-weight: 600;line-height: 1.5;white-space: nowrap}.json-badge-object{color: #7c3aed;background: rgba(124,58,237,.12)}.json-badge-array{color: #1d4ed8;background: rgba(29,78,216,.12)}.json-badge-string{color: #15803d;background: rgba(21,128,61,.12)}.json-badge-number{color: #1d4ed8;background: rgba(29,78,216,.12)}.json-badge-boolean{color: #c2410c;background: rgba(194,65,12,.12)}.json-badge-null{color: var(--text-3);background: rgba(110,118,129,.15)}.json-count{color: var(--text-3);font-size: 12px}.json-formatter-action-bar{display: flex;flex-wrap: wrap;align-items: center;gap: 8px;margin-top: 16px;padding: 12px;border: 1px solid var(--border);border-radius: var(--radius);background: #ffffff}.json-formatter-action-bar .btn{flex: 0 1 132px;min-width: 0;justify-content: center;white-space: nowrap}.json-formatter-action-bar .btn-primary{flex-basis: 160px}.json-formatter-action-bar .btn i{margin-right: 6px}.json-formatter-hint{display: inline-flex;flex: 1 1 240px;align-items: center;gap: 6px;justify-content: flex-end;min-width: 0;margin-left: 0;color: var(--text-3);font-size: 12.5px;text-align: right}:root[data-theme="dark"] .json-formatter-input-body,:root[data-theme="dark"] .json-formatter-result-body,:root[data-theme="dark"] .json-formatter-options-panel,:root[data-theme="dark"] .json-formatter-action-bar{background: #161b22}:root[data-theme="dark"] .json-formatter-tool .CodeMirror{background: #0d1117;color: #c9d1d9;border-color: var(--border)}:root[data-theme="dark"] .json-formatter-tool .CodeMirror-gutters{background: #161b22;border-right-color: var(--border)}:root[data-theme="dark"] .json-formatter-tool .CodeMirror-linenumber{color: #6e7681}:root[data-theme="dark"] .json-formatter-tool .CodeMirror-cursor{border-left-color: #c9d1d9}:root[data-theme="dark"] .json-formatter-tool .CodeMirror-selected{background: rgba(56,139,253,.25)}:root[data-theme="dark"] .json-formatter-path-bar{background: #0d1117}:root[data-theme="dark"] .json-formatter-tree .json-key{color: #c4b5fd}:root[data-theme="dark"] .json-formatter-tree .json-value-string{color: #7ee787}:root[data-theme="dark"] .json-formatter-tree .json-value-number{color: #79c0ff}:root[data-theme="dark"] .json-formatter-tree .json-value-boolean{color: #ffa657}:root[data-theme="dark"] .json-formatter-tree .json-badge-object{color: #c4b5fd;background: rgba(196,181,253,.16)}:root[data-theme="dark"] .json-formatter-tree .json-badge-array,:root[data-theme="dark"] .json-formatter-tree .json-badge-number{color: #79c0ff;background: rgba(121,192,255,.16)}:root[data-theme="dark"] .json-formatter-tree .json-badge-string{color: #7ee787;background: rgba(126,231,135,.16)}:root[data-theme="dark"] .json-formatter-tree .json-badge-boolean{color: #ffa657;background: rgba(255,166,87,.16)}@media (max-width: 991px){.json-formatter-option-grid{grid-template-columns: 1fr}.json-formatter-stat-primary{grid-column: 1 / -1}}@media (max-width: 1199px){.json-formatter-header-actions{justify-content: flex-start}.json-formatter-header-actions .btn-sm{flex: 1 1 112px;justify-content: center}.json-formatter-view-toggle{flex: 1 1 100%}.json-formatter-view-toggle label{flex: 1}.json-formatter-view-toggle span{flex: 1;justify-content: center}}@media (max-width: 640px){.json-formatter-panel-header{display: grid;grid-template-columns: minmax(0,1fr);row-gap: 8px}.json-formatter-header-actions{display: grid;grid-template-columns: repeat(2,minmax(0,1fr));gap: 8px}.json-formatter-view-toggle{grid-column: 1 / -1;justify-self: stretch}.json-formatter-view-toggle label{flex: 1}.json-formatter-view-toggle span{flex: 1;justify-content: center}.json-formatter-header-actions .btn{width: 100%;min-width: 0;justify-content: center}.json-formatter-result-toolbar{display: grid;grid-template-columns: 1fr}.json-formatter-result-toolbar .btn{width: 100%}.json-formatter-action-bar{display: grid;grid-template-columns: 1fr;gap: 8px;padding: 14px}.json-formatter-action-bar .btn{width: 100%;min-width: 0}.json-formatter-hint{justify-content: center;text-align: center}.json-formatter-stats{grid-template-columns: 1fr}.json-formatter-stat-primary{grid-column: auto}.json-formatter-tree-toolbar{display: grid;grid-template-columns: repeat(2,minmax(0,1fr))}.json-formatter-tree-toolbar .btn{width: 100%;min-width: 0;justify-content: center}.json-formatter-path-bar{align-items: flex-start;flex-direction: column}}