.tool-header{margin-bottom:var(--space-6)}.tool-header__title{font-size:var(--font-size-3xl);font-weight:var(--font-weight-bold);margin-bottom:var(--space-2)}.tool-header__description{font-size:var(--font-size-lg);color:var(--color-text-secondary);margin-bottom:var(--space-3)}.privacy-badge{align-items:center;gap:var(--space-2);padding:var(--space-1) var(--space-3);font-size:var(--font-size-xs);font-weight:var(--font-weight-medium);color:var(--color-success);background:var(--color-success-light);border-radius:var(--radius-full);letter-spacing:.3px;display:inline-flex}.panels{margin-bottom:var(--space-8);grid-template-rows:auto;grid-template-columns:1fr auto 1fr;align-items:stretch;gap:0;display:grid}.panel{flex-direction:column;display:flex}.panel--input{grid-column:1}.panel--output{grid-column:3}.panel__header{margin-bottom:var(--space-3);justify-content:space-between;align-items:center;gap:var(--space-3);flex-wrap:wrap;display:flex}.panel__title{font-size:var(--font-size-sm);font-weight:var(--font-weight-semi);color:var(--color-muted);text-transform:uppercase;letter-spacing:.5px;flex-shrink:0}.panel__actions{gap:var(--space-2);display:flex}.json-input{resize:vertical;min-height:420px;font-family:var(--font-mono);font-size:var(--font-size-sm);line-height:var(--line-height-normal);tab-size:2;flex:1}.action-bar{justify-content:center;align-items:center;gap:var(--space-3);padding:0 var(--space-4);flex-direction:column;grid-column:2;min-width:140px;display:flex}.action-bar__spacer{height:var(--space-4)}.indent-select{gap:var(--space-1);flex-direction:column;width:100%;display:flex}.indent-label{font-size:var(--font-size-xs);color:var(--color-muted);font-weight:var(--font-weight-medium)}.select--sm{padding:var(--space-2) var(--space-3);font-size:var(--font-size-xs)}.view-toggle{border:1px solid var(--color-border);border-radius:var(--radius-md);width:100%;display:flex;overflow:hidden}.view-toggle__btn{justify-content:center;align-items:center;gap:var(--space-1);padding:var(--space-2) var(--space-2);font-size:var(--font-size-xs);font-weight:var(--font-weight-medium);color:var(--color-muted);cursor:pointer;transition:all var(--transition-fast);white-space:nowrap;background:0 0;border:none;flex:1;display:flex}.view-toggle__btn:hover{color:var(--color-text);background:var(--color-surface-2)}.view-toggle__btn--active{color:var(--color-primary);background:var(--color-primary-ghost);font-weight:var(--font-weight-semi)}.presets-row{gap:var(--space-2);flex-wrap:wrap;display:flex}.preset-btn{font-size:var(--font-size-xs);border:1px solid var(--color-border);border-radius:var(--radius-full);padding:var(--space-1) var(--space-3);transition:all var(--transition-fast);white-space:nowrap}.preset-btn:hover{border-color:var(--color-primary);color:var(--color-primary);background:var(--color-primary-ghost)}.preset-btn--active{border-color:var(--color-primary);background:var(--color-primary-ghost);color:var(--color-primary);font-weight:var(--font-weight-semi)}.output-view{flex-direction:column;flex:1;min-height:420px;display:flex}.output-placeholder{justify-content:center;align-items:center;gap:var(--space-4);color:var(--color-muted);font-size:var(--font-size-sm);text-align:center;padding:var(--space-8);background:var(--color-surface);border:1px dashed var(--color-border);border-radius:var(--radius-lg);flex-direction:column;flex:1;display:flex}.output-code{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-lg);padding:var(--space-4);max-height:520px;font-family:var(--font-mono);font-size:var(--font-size-sm);line-height:var(--line-height-normal);white-space:pre;tab-size:2;flex:1;overflow:auto}.line-number{min-width:2.5em;padding-right:var(--space-3);color:var(--color-muted);-webkit-user-select:none;user-select:none;text-align:right;opacity:.5;display:inline-block}.json-key{color:#6366f1}.json-string{color:#059669}.json-number{color:#d97706}.json-boolean{color:#2563eb;font-weight:var(--font-weight-medium)}.json-null{color:#9ca3af;font-style:italic}.repair-banner{align-items:flex-start;gap:var(--space-3);padding:var(--space-3) var(--space-4);margin-bottom:var(--space-3);background:var(--color-warning-light);border-left:3px solid var(--color-warning);border-radius:var(--radius-md);font-size:var(--font-size-sm);color:#92400e;animation:.3s fadeIn;display:flex}.repair-banner svg{color:var(--color-warning);flex-shrink:0;margin-top:2px}.repair-banner strong{font-weight:var(--font-weight-semi)}.repair-list{margin:var(--space-1) 0 0 var(--space-4);font-size:var(--font-size-xs);padding:0;list-style:outside}.repair-list li{margin-bottom:2px}.error-banner{align-items:flex-start;gap:var(--space-3);padding:var(--space-3) var(--space-4);margin-bottom:var(--space-3);background:var(--color-error-light);border-left:3px solid var(--color-error);border-radius:var(--radius-md);font-size:var(--font-size-sm);color:var(--color-error);animation:.3s fadeIn;display:flex}.error-banner__icon{font-weight:var(--font-weight-bold);font-size:var(--font-size-lg);flex-shrink:0}.error-banner__message{margin-top:var(--space-1);font-size:var(--font-size-sm);line-height:var(--line-height-relaxed)}.error-location{opacity:.6;font-size:var(--font-size-xs)}.error-hint{margin-top:var(--space-2);font-size:var(--font-size-xs);opacity:.7;font-weight:var(--font-weight-normal);font-style:italic;display:block}.status-bar{align-items:center;gap:var(--space-4);padding:var(--space-2) var(--space-3);margin-bottom:var(--space-3);background:var(--color-success-light);border-radius:var(--radius-md);font-size:var(--font-size-xs);color:var(--color-success);animation:.3s fadeIn;display:flex}.status-bar__item{align-items:center;gap:var(--space-1);font-weight:var(--font-weight-medium);display:inline-flex}.tree-container{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-lg);padding:var(--space-4);max-height:520px;font-family:var(--font-mono);font-size:var(--font-size-sm);line-height:1.7;overflow:auto}.tree-node{padding-left:var(--space-4)}.tree-node:first-child{padding-left:0}.tree-node__header{cursor:default}.tree-node__header--expandable{cursor:pointer;border-radius:var(--radius-sm);padding:1px var(--space-2);margin-left:calc(-1 * var(--space-2))}.tree-node__header--expandable:hover{background:var(--color-primary-ghost)}.tree-toggle{width:1em;color:var(--color-muted);transition:transform var(--transition-fast);-webkit-user-select:none;user-select:none;font-size:.7em;display:inline-block}.tree-key{color:var(--color-primary)}.tree-colon{color:var(--color-muted)}.tree-bracket{color:var(--color-text);font-weight:var(--font-weight-medium)}.tree-count{color:var(--color-muted);font-size:var(--font-size-xs);margin-left:var(--space-2)}.tree-closer{color:var(--color-text);font-weight:var(--font-weight-medium)}.tree-node--collapsed>.tree-children,.tree-node--collapsed>.tree-closer{display:none}.tree-node__leaf{padding:1px var(--space-2);border-radius:var(--radius-sm)}.tree-node__leaf:hover{background:var(--color-surface-2)}.seo-content{margin-top:var(--space-12)}.seo-content__text{font-size:var(--font-size-base);color:var(--color-text-secondary);line-height:var(--line-height-relaxed);margin-bottom:var(--space-6)}.seo-content__list{padding-left:var(--space-6);color:var(--color-text-secondary);line-height:var(--line-height-relaxed);list-style-type:disc}.seo-content__list li{margin-bottom:var(--space-3)}.seo-content__list code,.faq-item__answer code{font-family:var(--font-mono);font-size:var(--font-size-sm);background:var(--color-surface-2);border-radius:var(--radius-sm);color:var(--color-primary);padding:.125rem .375rem}.faq-item{margin-bottom:var(--space-6);padding-bottom:var(--space-4);border-bottom:1px solid var(--color-border)}.faq-item:last-child{border-bottom:none;margin-bottom:0;padding-bottom:0}.faq-item__question{font-size:var(--font-size-lg);font-weight:var(--font-weight-semi);margin-bottom:var(--space-2)}.faq-item__answer{font-size:var(--font-size-base);color:var(--color-text-secondary);line-height:var(--line-height-relaxed)}.example-card{margin-bottom:var(--space-8);padding-bottom:var(--space-8);border-bottom:1px solid var(--color-border)}.example-card:last-child{border-bottom:none;margin-bottom:0;padding-bottom:0}.example-card--error{background:var(--color-error-light);border-radius:var(--radius-md);padding:var(--space-5);margin-left:calc(-1 * var(--space-2));margin-right:calc(-1 * var(--space-2));border:1px solid #fca5a5}.example-card__header{justify-content:space-between;align-items:flex-start;gap:var(--space-4);margin-bottom:var(--space-4);flex-wrap:wrap;display:flex}.example-card__title{font-size:var(--font-size-base);font-weight:var(--font-weight-semi);margin-bottom:var(--space-1)}.example-card__desc{font-size:var(--font-size-sm);color:var(--color-text-secondary);line-height:var(--line-height-relaxed)}.example-load-btn{white-space:nowrap;flex-shrink:0}.example-code{background:var(--color-surface-2);border:1px solid var(--color-border);border-radius:var(--radius-md);padding:var(--space-4);margin-bottom:var(--space-3);font-family:var(--font-mono);font-size:var(--font-size-sm);line-height:var(--line-height-relaxed);color:var(--color-text);white-space:pre;overflow-x:auto}.example-note{font-size:var(--font-size-sm);color:var(--color-text-secondary);line-height:var(--line-height-relaxed)}.example-note code{font-family:var(--font-mono);font-size:var(--font-size-sm);background:var(--color-surface-2);border-radius:var(--radius-sm);color:var(--color-primary);padding:.125rem .375rem}.example-errors-list{margin-top:var(--space-3);padding-left:var(--space-5);font-size:var(--font-size-sm);color:var(--color-text-secondary);line-height:var(--line-height-relaxed)}.example-errors-list li{margin-bottom:var(--space-2)}.example-errors-list code{font-family:var(--font-mono);font-size:var(--font-size-sm);border-radius:var(--radius-sm);color:var(--color-primary);background:#fff9;padding:.125rem .375rem}.error-ref-table{border-collapse:collapse;width:100%;font-size:var(--font-size-sm);margin:var(--space-4) 0}.error-ref-table th{text-align:left;font-weight:var(--font-weight-semi);padding:var(--space-3) var(--space-4);background:var(--color-surface-2);border-bottom:2px solid var(--color-border);color:var(--color-text);font-size:var(--font-size-xs);text-transform:uppercase;letter-spacing:.5px}.error-ref-table td{padding:var(--space-3) var(--space-4);border-bottom:1px solid var(--color-border);color:var(--color-text-secondary);line-height:var(--line-height-relaxed);vertical-align:top}.error-ref-table tr:last-child td{border-bottom:none}.error-ref-table tr:hover td{background:var(--color-surface-2)}.error-ref-table code{font-family:var(--font-mono);font-size:var(--font-size-xs);background:var(--color-surface-2);border-radius:var(--radius-sm);color:var(--color-primary);white-space:nowrap;padding:.125rem .375rem}.cross-links{gap:var(--space-4);grid-template-columns:repeat(auto-fit,minmax(240px,1fr));display:grid}.cross-link{padding:var(--space-4);border:1px solid var(--color-border);border-radius:var(--radius-md);color:inherit;transition:all var(--transition-base);text-decoration:none;display:block}.cross-link:hover{border-color:var(--color-primary);box-shadow:var(--shadow-md);transform:translateY(-2px)}.cross-link strong{color:var(--color-text);margin-bottom:var(--space-1);display:block}.cross-link span{font-size:var(--font-size-sm);color:var(--color-text-secondary)}@keyframes fadeIn{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}@media (width<=768px){.tool-header__title{font-size:var(--font-size-2xl)}.tool-header__description{font-size:var(--font-size-base)}.panels{gap:var(--space-4);grid-template-rows:auto auto auto;grid-template-columns:1fr}.panel--input{grid-area:1/1}.action-bar{min-width:unset;flex-flow:wrap;grid-area:2/1;justify-content:center;padding:0}.action-bar__spacer{display:none}.indent-select{align-items:center;gap:var(--space-2);flex-direction:row;width:auto}.view-toggle{width:auto}.panel--output{grid-area:3/1}.json-input,.output-view{min-height:200px}.output-code,.tree-container{max-height:400px}.panel__header{flex-direction:column;align-items:flex-start}.presets-row{gap:var(--space-1)}}@media (width<=640px){.example-card__header{flex-direction:column}}