@import "https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&family=JetBrains+Mono:wght@400;500&display=swap";.app-shell{background:radial-gradient(ellipse 80% 50% at 50% -20%, #6366f11f 0%, transparent 60%), var(--bg-base);flex-direction:column;min-height:100vh;display:flex}.header{padding:0 var(--space-6);-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);border-bottom:1px solid var(--border);z-index:50;background:#0e1220d9;justify-content:space-between;align-items:center;height:60px;display:flex;position:sticky;top:0}.header-brand{align-items:center;gap:var(--space-3);display:flex}.header-logo{background:linear-gradient(135deg, var(--accent), var(--violet));border-radius:var(--radius-md);width:32px;height:32px;box-shadow:0 0 16px var(--accent-glow);justify-content:center;align-items:center;font-size:1rem;display:flex}.header-logo-img{object-fit:contain;width:36px;height:36px}[data-theme=dark] .header-logo-img{filter:invert()}.header-name{background:linear-gradient(135deg, var(--text-primary), var(--accent-light));-webkit-text-fill-color:transparent;letter-spacing:-.02em;-webkit-background-clip:text;background-clip:text;font-size:1.15rem;font-weight:700}.header-tagline{color:var(--text-muted);margin-left:var(--space-1);font-size:.72rem;font-weight:400}.nav-tabs{gap:var(--space-1);background:var(--bg-elevated);border:1px solid var(--border);border-radius:var(--radius-lg);padding:3px;display:flex}.nav-tab{align-items:center;gap:var(--space-2);padding:var(--space-2) var(--space-4);border-radius:calc(var(--radius-lg) - 2px);cursor:pointer;transition:all var(--transition-fast);color:var(--text-muted);font-size:.83rem;font-weight:500;font-family:var(--font-sans);background:0 0;border:none;display:flex;position:relative}.nav-tab:hover{color:var(--text-secondary);background:var(--bg-hover)}.nav-tab.active{background:var(--accent);color:#fff;box-shadow:0 0 16px var(--accent-glow)}.nav-tab-icon{font-size:.95rem}.header-right{align-items:center;gap:var(--space-3);display:flex}.header-pill{align-items:center;gap:var(--space-2);padding:var(--space-1) var(--space-3);background:var(--success-dim);border-radius:var(--radius-full);color:var(--success);letter-spacing:.04em;border:1px solid #22c55e40;font-size:.72rem;font-weight:600;display:flex}.header-dot{background:var(--success);border-radius:50%;width:6px;height:6px;animation:2s infinite pulse}.main-content{padding:var(--space-6);gap:var(--space-6);flex-direction:column;flex:1;width:100%;max-width:1600px;margin:0 auto;display:flex}.theme-toggle{border-radius:var(--radius-md);background:var(--bg-elevated);border:1px solid var(--border);cursor:pointer;width:36px;height:36px;transition:all var(--transition-fast);color:var(--text-secondary);flex-shrink:0;justify-content:center;align-items:center;font-size:1rem;display:flex}.theme-toggle:hover{background:var(--bg-hover);border-color:var(--border-hover);color:var(--text-primary);transform:rotate(20deg)scale(1.1)}.theme-toggle:active{transform:scale(.93)}.footer{border-top:1px solid var(--border);background:var(--bg-surface);padding:var(--space-8) var(--space-6) var(--space-6);margin-top:auto}.footer-inner{gap:var(--space-8);grid-template-columns:2fr 1fr 1fr 1fr;max-width:1600px;margin:0 auto;display:grid}.footer-brand{gap:var(--space-3);flex-direction:column;display:flex}.footer-logo-row{align-items:center;gap:var(--space-3);display:flex}.footer-logo{background:linear-gradient(135deg, var(--accent), var(--violet));border-radius:var(--radius-md);width:28px;height:28px;box-shadow:0 0 12px var(--accent-glow);flex-shrink:0;justify-content:center;align-items:center;font-size:.85rem;display:flex}.footer-logo-img{object-fit:contain;width:32px;height:32px}[data-theme=dark] .footer-logo-img{filter:invert()}.footer-name{background:linear-gradient(135deg, var(--text-primary), var(--accent-light));-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text;font-size:1rem;font-weight:700}.footer-desc{color:var(--text-muted);max-width:260px;font-size:.8rem;line-height:1.7}.footer-privacy-cta{align-items:center;gap:var(--space-2);padding:var(--space-2) var(--space-3);background:var(--success-dim);border-radius:var(--radius-md);color:var(--success);cursor:pointer;transition:all var(--transition-fast);width:fit-content;font-size:.78rem;font-weight:600;font-family:var(--font-sans);border:1px solid #22c55e4d;display:inline-flex}.footer-privacy-cta:hover{background:#22c55e33;border-color:#22c55e80;transform:translateY(-1px)}.footer-col{gap:var(--space-3);flex-direction:column;display:flex}.footer-col-title{text-transform:uppercase;letter-spacing:.08em;color:var(--text-secondary);font-size:.72rem;font-weight:700}.footer-links{gap:var(--space-2);flex-direction:column;display:flex}.footer-link{color:var(--text-muted);cursor:pointer;transition:color var(--transition-fast);align-items:center;gap:var(--space-2);font-size:.8rem;font-family:var(--font-sans);text-align:left;background:0 0;border:none;padding:0;text-decoration:none;display:flex}.footer-link:hover{color:var(--accent-light)}.footer-bottom{max-width:1600px;margin:var(--space-6) auto 0;padding-top:var(--space-5);border-top:1px solid var(--border);justify-content:space-between;align-items:center;gap:var(--space-4);flex-wrap:wrap;display:flex}.footer-copy{color:var(--text-muted);font-size:.75rem;line-height:1.6}.footer-badges{align-items:center;gap:var(--space-2);flex-wrap:wrap;display:flex}.footer-badge{border-radius:var(--radius-full);letter-spacing:.04em;border:1px solid;align-items:center;gap:5px;padding:3px 10px;font-size:.68rem;font-weight:600;display:inline-flex}.footer-badge-green{background:var(--success-dim);color:var(--success);border-color:#22c55e40}.footer-badge-blue{background:var(--info-dim);color:var(--info);border-color:#38bdf840}.footer-badge-purple{background:var(--accent-dim);color:var(--accent-light);border-color:#6366f140}.privacy-modal{background:var(--bg-panel);border:1px solid var(--border);border-radius:var(--radius-xl);width:560px;max-width:95vw;max-height:85vh;box-shadow:var(--shadow-lg), var(--shadow-glow);flex-direction:column;animation:.25s fadeIn;display:flex;overflow:hidden}.privacy-modal-header{padding:var(--space-5) var(--space-6);border-bottom:1px solid var(--border);align-items:flex-start;gap:var(--space-4);background:linear-gradient(135deg,#6366f11a,#a78bfa0f);display:flex}.privacy-shield-icon{background:linear-gradient(135deg, var(--success), #16a34a);border-radius:var(--radius-lg);flex-shrink:0;justify-content:center;align-items:center;width:48px;height:48px;font-size:1.4rem;display:flex;box-shadow:0 0 20px #22c55e4d}.privacy-modal-title-group{flex:1}.privacy-modal-title{color:var(--text-primary);margin-bottom:4px;font-size:1.1rem;font-weight:700}.privacy-modal-subtitle{color:var(--text-muted);font-size:.8rem}.privacy-modal-body{padding:var(--space-5) var(--space-6);gap:var(--space-5);flex-direction:column;flex:1;display:flex;overflow-y:auto}.privacy-highlight{align-items:flex-start;gap:var(--space-3);padding:var(--space-4);background:var(--success-dim);border-radius:var(--radius-lg);border:1px solid #22c55e40;display:flex}.privacy-highlight-icon{flex-shrink:0;margin-top:2px;font-size:1.3rem}.privacy-highlight-text{color:var(--text-secondary);font-size:.85rem;line-height:1.7}.privacy-highlight-text strong{color:var(--success)}.privacy-section{gap:var(--space-3);flex-direction:column;display:flex}.privacy-section-title{color:var(--text-primary);text-transform:uppercase;letter-spacing:.05em;align-items:center;gap:var(--space-2);font-size:.78rem;font-weight:700;display:flex}.privacy-items{gap:var(--space-2);flex-direction:column;display:flex}.privacy-item{align-items:flex-start;gap:var(--space-3);color:var(--text-secondary);font-size:.82rem;line-height:1.6;display:flex}.privacy-item-dot{background:var(--accent);border-radius:50%;flex-shrink:0;width:6px;height:6px;margin-top:7px}.privacy-item-dot.green{background:var(--success)}.privacy-item-dot.red{background:var(--error)}.privacy-modal-footer{padding:var(--space-4) var(--space-6);background:var(--bg-elevated);border-top:1px solid var(--border);justify-content:space-between;align-items:center;gap:var(--space-3);display:flex}.privacy-trust-badge{align-items:center;gap:var(--space-2);color:var(--text-muted);font-size:.75rem;display:flex}.privacy-trust-badge strong{color:var(--success)}@media (width<=1024px){.footer-inner{gap:var(--space-6);grid-template-columns:1fr 1fr}.footer-brand{grid-column:1/-1}}@media (width<=768px){.header{padding:0 var(--space-4);gap:var(--space-2);height:auto;min-height:60px;padding-top:var(--space-2);padding-bottom:var(--space-2);flex-wrap:wrap}.header-tagline{display:none}.nav-tabs{scrollbar-width:none;order:3;gap:0;width:100%;padding-bottom:2px;overflow-x:auto}.nav-tabs::-webkit-scrollbar{display:none}.nav-tab{white-space:nowrap;padding:var(--space-2) var(--space-3);flex-shrink:0;font-size:.8rem}.main-content{padding:var(--space-3) var(--space-3) var(--space-4)}.footer-inner{gap:var(--space-4);grid-template-columns:1fr}.footer-brand{grid-column:unset}.footer-bottom{align-items:flex-start;gap:var(--space-3);flex-direction:column}.footer-badges{flex-wrap:wrap}.privacy-modal{width:95vw;max-height:92vh}}@media (width<=480px){.header-name{font-size:1rem}.header-logo-img{width:28px;height:28px}.nav-tab-icon{display:none}.main-content{padding:var(--space-2) var(--space-2) var(--space-3)}}.toast-container{bottom:var(--space-6);right:var(--space-6);z-index:1000;gap:var(--space-2);pointer-events:none;flex-direction:column;display:flex;position:fixed}.toast{align-items:center;gap:var(--space-3);padding:var(--space-3) var(--space-4);border-radius:var(--radius-lg);min-width:280px;max-width:400px;box-shadow:var(--shadow-lg);pointer-events:auto;animation:slideInRight var(--transition-normal) ease;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border:1px solid;font-size:.85rem;font-weight:500;display:flex}.toast-success{background:var(--bg-panel);color:var(--text-primary);border-color:#22c55e4d}.toast-error{background:var(--bg-panel);color:var(--text-primary);border-color:#ef44444d}.toast-info{background:var(--bg-panel);color:var(--text-primary);border-color:#38bdf84d}.toast-icon{flex-shrink:0;font-size:1rem}.toast-message{flex:1}.toast-close{color:var(--text-muted);cursor:pointer;transition:color var(--transition-fast);background:0 0;border:none;flex-shrink:0;padding:0;font-size:1rem}.toast-close:hover{color:var(--text-primary)}.history-layout{gap:var(--space-4);flex-direction:column;display:flex}.history-header{justify-content:space-between;align-items:center;display:flex}.history-title{color:var(--text-primary);font-size:1.1rem;font-weight:600}.history-grid{gap:var(--space-4);grid-template-columns:repeat(auto-fill,minmax(320px,1fr));display:grid}.history-card{background:var(--bg-panel);border:1px solid var(--border);border-radius:var(--radius-lg);padding:var(--space-4);gap:var(--space-3);transition:all var(--transition-normal);animation:fadeIn var(--transition-normal) ease;flex-direction:column;display:flex}.history-card:hover{border-color:var(--border-accent);box-shadow:var(--shadow-glow);transform:translateY(-1px)}.history-card-header{justify-content:space-between;align-items:center;gap:var(--space-2);display:flex}.history-formats{align-items:center;gap:var(--space-2);display:flex}.history-arrow{color:var(--text-muted);font-size:.9rem}.history-card-time{color:var(--text-muted);font-size:.72rem}.history-snippet{background:var(--bg-surface);border:1px solid var(--border);border-radius:var(--radius-md);padding:var(--space-3);font-family:var(--font-mono);color:var(--text-muted);white-space:pre-wrap;word-break:break-all;max-height:80px;font-size:.72rem;line-height:1.6;position:relative;overflow:hidden}.history-snippet:after{content:"";background:linear-gradient(transparent, var(--bg-surface));height:30px;position:absolute;bottom:0;left:0;right:0}.history-card-actions{gap:var(--space-2);display:flex}.modal-overlay{-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);z-index:200;background:#080b14d9;justify-content:center;align-items:center;animation:.2s fadeIn;display:flex;position:fixed;inset:0}.modal{background:var(--bg-panel);border:1px solid var(--border);border-radius:var(--radius-xl);padding:var(--space-6);width:420px;box-shadow:var(--shadow-lg), var(--shadow-glow);gap:var(--space-5);flex-direction:column;animation:.25s fadeIn;display:flex}.modal-header{justify-content:space-between;align-items:center;display:flex}.modal-title{color:var(--text-primary);font-size:1rem;font-weight:600}.modal-close{color:var(--text-muted);cursor:pointer;transition:color var(--transition-fast);border-radius:var(--radius-sm);background:0 0;border:none;padding:2px;font-size:1.2rem}.modal-close:hover{color:var(--text-primary);background:var(--bg-hover)}.modal-section{gap:var(--space-3);flex-direction:column;display:flex}.modal-section-title{color:var(--text-muted);text-transform:uppercase;letter-spacing:.05em;font-size:.75rem;font-weight:600}.format-grid{gap:var(--space-2);grid-template-columns:repeat(3,1fr);display:grid}.format-btn{align-items:center;gap:var(--space-1);padding:var(--space-3);background:var(--bg-elevated);border:1px solid var(--border);border-radius:var(--radius-md);cursor:pointer;transition:all var(--transition-fast);font-family:var(--font-sans);flex-direction:column;display:flex}.format-btn:hover{border-color:var(--border-hover);background:var(--bg-hover)}.format-btn.active{border-color:var(--accent);background:var(--accent-dim);box-shadow:0 0 12px var(--accent-glow)}.format-btn-icon{font-size:1.3rem}.format-btn-label{color:var(--text-secondary);text-transform:uppercase;letter-spacing:.04em;font-size:.75rem;font-weight:600}.format-info-btn{background:var(--bg-surface);border:1.5px solid var(--border-accent);width:26px;height:26px;color:var(--text-accent);cursor:pointer;transition:all var(--transition-fast);font-size:.85rem;font-weight:800;font-family:var(--font-sans);box-shadow:0 0 8px var(--accent-dim);border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;line-height:1;display:inline-flex}.format-info-btn:hover{background:var(--accent);border-color:var(--accent-light);color:#fff;box-shadow:0 0 12px var(--accent-glow);transform:scale(1.1)}.format-info-modal{background:var(--bg-panel);border:1px solid var(--border);border-radius:var(--radius-xl);width:620px;max-width:95vw;max-height:88vh;box-shadow:var(--shadow-lg), var(--shadow-glow);flex-direction:column;animation:.22s fadeIn;display:flex;overflow:hidden}.format-info-header{padding:var(--space-5) var(--space-6);align-items:center;gap:var(--space-4);border-bottom:1px solid var(--border);flex-shrink:0;display:flex}.format-info-icon-wrap{border-radius:var(--radius-lg);flex-shrink:0;justify-content:center;align-items:center;width:52px;height:52px;font-size:1.6rem;display:flex}.format-info-title-group{flex:1}.format-info-name{color:var(--text-primary);margin-bottom:3px;font-size:1.2rem;font-weight:700}.format-info-ext{border-radius:var(--radius-sm);font-size:.72rem;font-weight:600;font-family:var(--font-mono);margin-right:var(--space-2);align-items:center;padding:2px 8px;display:inline-flex}.format-info-tagline{color:var(--text-muted);margin-top:var(--space-1);font-size:.82rem}.format-info-body{padding:var(--space-5) var(--space-6);gap:var(--space-5);flex-direction:column;flex:1;display:flex;overflow-y:auto}.format-info-section{gap:var(--space-2);flex-direction:column;display:flex}.format-info-section-title{text-transform:uppercase;letter-spacing:.07em;color:var(--text-muted);align-items:center;gap:var(--space-2);font-size:.72rem;font-weight:700;display:flex}.format-info-desc{color:var(--text-secondary);font-size:.85rem;line-height:1.75}.format-use-cases{gap:var(--space-2);flex-wrap:wrap;display:flex}.format-use-case-tag{background:var(--bg-elevated);border:1px solid var(--border);border-radius:var(--radius-full);color:var(--text-secondary);padding:4px 12px;font-size:.75rem}.format-pros-cons{gap:var(--space-3);grid-template-columns:1fr 1fr;display:grid}.format-pros,.format-cons{background:var(--bg-elevated);border-radius:var(--radius-md);padding:var(--space-3);gap:var(--space-2);flex-direction:column;display:flex}.format-pros{border:1px solid #22c55e33}.format-cons{border:1px solid #ef444433}.format-pros-title{color:var(--success);text-transform:uppercase;letter-spacing:.05em;font-size:.72rem;font-weight:700}.format-cons-title{color:var(--error);text-transform:uppercase;letter-spacing:.05em;font-size:.72rem;font-weight:700}.format-pro-item,.format-con-item{color:var(--text-secondary);align-items:flex-start;gap:var(--space-2);font-size:.78rem;line-height:1.5;display:flex}.format-pro-item:before{content:"✓";color:var(--success);flex-shrink:0;font-weight:700}.format-con-item:before{content:"✗";color:var(--error);flex-shrink:0;font-weight:700}.format-example{background:var(--bg-surface);border:1px solid var(--border);border-radius:var(--radius-md);padding:var(--space-3) var(--space-4);font-family:var(--font-mono);color:var(--text-secondary);white-space:pre;max-height:180px;font-size:.75rem;line-height:1.7;overflow:auto}.format-info-footer{padding:var(--space-4) var(--space-6);background:var(--bg-elevated);border-top:1px solid var(--border);justify-content:space-between;align-items:center;gap:var(--space-3);flex-shrink:0;display:flex}.format-nav-btns{gap:var(--space-2);display:flex}@keyframes formatFlash{0%{border-color:var(--border);box-shadow:0 0 #22c55e00}30%{border-color:#22c55e99;box-shadow:0 0 0 4px #22c55e40}to{border-color:var(--border-accent);box-shadow:0 0 #22c55e00}}.editor-panel--formatted{animation:1.8s forwards formatFlash}.btn-format-success{background:var(--success-dim)!important;color:var(--success)!important;border-color:#22c55e66!important}.toolbar-divider{background:var(--border);width:1px;height:20px;margin:0 var(--space-1);flex-shrink:0}.converter-layout{gap:var(--space-4);flex-direction:column;flex:1;min-height:0;display:flex}.converter-panels{align-items:stretch;gap:var(--space-4);flex-direction:row;flex:1;width:100%;min-height:0;display:flex}.editor-panel{background:var(--bg-panel);border:1px solid var(--border);border-radius:var(--radius-lg);transition:border-color var(--transition-normal);flex-direction:column;flex:1;min-width:260px;min-height:850px;max-height:100vh;display:flex;overflow:hidden}.converter-panels .editor-panel:first-child{resize:both;flex:0 50%;max-width:85%;min-height:850px;overflow:hidden}.converter-panels .editor-panel:last-child{flex:1;min-height:850px}.editor-panel:focus-within{border-color:var(--border-accent)}.editor-header{padding:var(--space-3) var(--space-4);background:var(--bg-elevated);border-bottom:1px solid var(--border);justify-content:space-between;align-items:center;gap:var(--space-3);flex-shrink:0;display:flex}.editor-header-left{align-items:center;gap:var(--space-3);display:flex}.editor-header-right{align-items:center;gap:var(--space-2);display:flex}.editor-body{flex-direction:column;flex:1;min-height:850px;display:flex;position:relative;overflow:hidden}.editor-textarea-wrap{flex-direction:column;flex:1;min-height:0;display:flex;position:relative;overflow:auto}.editor-line-nums{background:var(--code-gutter);border-right:1px solid var(--border);width:40px;padding:var(--space-4) 0;pointer-events:none;z-index:1;flex-direction:column;display:flex;position:absolute;top:0;bottom:0;left:0;overflow:hidden}.line-num{font-family:var(--font-mono);color:var(--text-muted);text-align:right;padding:0 var(--space-2);height:1.7em;padding-right:10px;font-size:.72rem;line-height:1.7}.code-viewer-row{transition:background-color var(--transition-fast)}.code-viewer-row:hover td{background:var(--bg-hover)!important}.editor-footer{padding:var(--space-2) var(--space-4);background:var(--bg-elevated);border-top:1px solid var(--border);flex-shrink:0;justify-content:space-between;align-items:center;display:flex}.editor-stats{color:var(--text-muted);gap:var(--space-4);font-size:.72rem;display:flex}.converter-divider{justify-content:center;align-items:center;gap:var(--space-3);flex-direction:column;flex-shrink:0;width:48px;display:flex}.convert-btn-vert{align-items:center;gap:var(--space-2);padding:var(--space-4) var(--space-3);background:linear-gradient(180deg, var(--accent), #4f46e5);border-radius:var(--radius-lg);cursor:pointer;color:#fff;font-family:var(--font-sans);transition:all var(--transition-normal);box-shadow:0 0 20px var(--accent-glow), var(--shadow-md);writing-mode:vertical-lr;text-orientation:mixed;letter-spacing:.05em;border:none;flex-direction:column;font-size:.75rem;font-weight:600;display:flex}.convert-btn-vert:hover{box-shadow:0 0 32px var(--accent-glow), var(--shadow-lg);transform:scale(1.04)}.convert-btn-vert:active{transform:scale(.97)}.convert-btn-icon{writing-mode:horizontal-tb;font-size:1.2rem}.converter-toolbar{padding:var(--space-3) var(--space-5);background:var(--bg-elevated);border:1px solid var(--border);border-radius:var(--radius-lg);flex-shrink:0;justify-content:space-between;align-items:center;display:flex}.toolbar-left,.toolbar-right{align-items:center;gap:var(--space-3);display:flex}.error-banner{align-items:flex-start;gap:var(--space-3);padding:var(--space-3) var(--space-4);background:var(--error-dim);border-radius:var(--radius-md);color:#fca5a5;animation:fadeIn var(--transition-fast) ease;border:1px solid #ef44444d;font-size:.82rem;display:flex}.error-banner-icon{color:var(--error);flex-shrink:0;margin-top:1px}.format-detect{align-items:center;gap:var(--space-2);color:var(--text-muted);font-size:.72rem;display:flex}.format-detect-dot{background:var(--success);border-radius:50%;width:5px;height:5px}@media (width<=900px){.converter-panels .editor-panel:first-child{max-width:75%}}@media (width<=768px){.converter-layout{height:auto;min-height:unset}.converter-panels{min-height:unset;flex-direction:column;align-items:stretch}.converter-panels .editor-panel:first-child{resize:vertical;flex:unset;height:280px;min-height:240px;width:100%!important;max-width:100%!important}.converter-panels .editor-panel:last-child{flex:unset;height:280px;min-height:500px}.converter-divider{width:100%;height:auto;padding:var(--space-2) 0;flex-direction:row}.convert-btn-vert{writing-mode:horizontal-tb;width:100%;padding:var(--space-3) var(--space-4);flex-direction:row;justify-content:center}.converter-arrow{justify-content:center;transform:rotate(90deg)}.editor-header,.editor-header-left{gap:var(--space-2);flex-wrap:wrap}.editor-header-right{gap:var(--space-2);flex-wrap:wrap;justify-content:flex-start;width:100%}.converter-toolbar{align-items:stretch;gap:var(--space-3);padding:var(--space-3);flex-direction:column}.toolbar-left,.toolbar-right{justify-content:flex-start;gap:var(--space-2);flex-wrap:wrap}.toolbar-right{padding-top:var(--space-3);border-top:1px solid var(--border)}}@media (width<=480px){.editor-header{align-items:flex-start;gap:var(--space-2);flex-direction:column}.editor-header-left{width:100%}.editor-header-right{flex-wrap:wrap;width:100%}.editor-header-left .format-selector{max-width:120px}.toolbar-left,.toolbar-right{flex-wrap:wrap}.toolbar-divider{display:none}.converter-panels .editor-panel:first-child,.converter-panels .editor-panel:last-child{height:500px;min-height:500px}}.explorer-layout{gap:var(--space-4);flex-direction:column;flex:1;min-height:550px;display:flex}.explorer-top{align-items:stretch;gap:var(--space-4);flex-shrink:0;width:100%;display:flex}.explorer-input-panel{background:var(--bg-panel);border:1px solid var(--border);border-radius:var(--radius-lg);resize:vertical;flex-direction:column;flex:1;height:320px;min-height:200px;display:flex;overflow:hidden}.explorer-main{align-items:stretch;gap:var(--space-4);flex-direction:row;flex:1;width:100%;min-height:0;max-height:100vh;display:flex}.explorer-sidebar{background:var(--bg-panel);border:1px solid var(--border);border-radius:var(--radius-lg);resize:horizontal;flex-direction:column;flex:0 0 280px;min-width:180px;max-width:450px;display:flex;overflow:hidden}.explorer-content{background:var(--bg-panel);border:1px solid var(--border);border-radius:var(--radius-lg);flex-direction:column;flex:1;min-width:0;display:flex;overflow:hidden}.view-tabs{border-bottom:1px solid var(--border);display:flex}.view-tab{justify-content:center;align-items:center;gap:var(--space-2);padding:var(--space-3);cursor:pointer;transition:all var(--transition-fast);color:var(--text-muted);font-size:.8rem;font-weight:500;font-family:var(--font-sans);background:0 0;border:none;border-bottom:2px solid #0000;flex:1;margin-bottom:-1px;display:flex}.view-tab:hover{color:var(--text-secondary);background:var(--bg-hover)}.view-tab.active{color:var(--accent-light);border-bottom-color:var(--accent);background:var(--accent-dim)}.tree-view{padding:var(--space-3);flex:1;overflow:auto}.tree-node{font-family:var(--font-mono);cursor:pointer;padding:1px var(--space-2);border-radius:var(--radius-sm);transition:background var(--transition-fast);align-items:flex-start;gap:var(--space-1);font-size:.78rem;line-height:1.8;display:flex}.tree-node:hover{background:var(--bg-hover)}.tree-node.selected{background:var(--accent-dim)}.tree-node-children{padding-left:var(--space-4);border-left:1px solid var(--border);margin-left:6px}.tree-toggle{cursor:pointer;-webkit-user-select:none;user-select:none;color:var(--text-muted);margin-top:4px;font-size:.65rem}.tree-key{color:#818cf8}.tree-colon{color:var(--text-muted)}.tree-val-string{color:#4ade80}.tree-val-number{color:#fb923c}.tree-val-boolean{color:#f472b6}.tree-val-null{color:var(--text-muted);font-style:italic}.tree-val-object{color:var(--text-muted)}.tree-node-count{color:var(--text-muted);margin-left:var(--space-1);font-size:.68rem}.table-wrap{flex:1;overflow:auto}.data-table{border-collapse:collapse;width:100%;font-size:.8rem}.data-table th{background:var(--bg-elevated);color:var(--text-secondary);padding:var(--space-2) var(--space-4);text-align:left;border-bottom:1px solid var(--border);z-index:1;text-transform:uppercase;letter-spacing:.05em;white-space:nowrap;font-size:.75rem;font-weight:600;position:sticky;top:0}.data-table th .th-inner{align-items:center;gap:var(--space-2);display:flex}.data-table th .sort-btn{color:var(--text-muted);cursor:pointer;transition:color var(--transition-fast);background:0 0;border:none;padding:0;font-size:.7rem}.data-table th .sort-btn:hover,.data-table th .sort-btn.active{color:var(--accent-light)}.data-table td{padding:var(--space-2) var(--space-4);border-bottom:1px solid var(--border);color:var(--text-secondary);text-overflow:ellipsis;white-space:nowrap;max-width:240px;font-family:var(--font-mono);font-size:.78rem;overflow:hidden}.data-table tr:hover td{background:var(--bg-hover);color:var(--text-primary)}.data-table tr:last-child td{border-bottom:none}.table-filter-row td{padding:var(--space-2) var(--space-3);background:var(--bg-surface)}.table-filter-row td:hover{background:var(--bg-surface);color:var(--text-secondary)}.col-filter{background:var(--bg-elevated);border:1px solid var(--border);border-radius:var(--radius-sm);color:var(--text-primary);width:100%;font-size:.75rem;font-family:var(--font-sans);outline:none;padding:3px 8px}.col-filter:focus{border-color:var(--accent)}.raw-view{padding:var(--space-4);flex:1;overflow:auto}.raw-pre{font-family:var(--font-mono);color:var(--text-secondary);white-space:pre-wrap;word-break:break-word;font-size:.78rem;line-height:1.7}.node-path{padding:var(--space-2) var(--space-4);background:var(--bg-surface);border-top:1px solid var(--border);font-family:var(--font-mono);color:var(--text-muted);align-items:center;gap:var(--space-2);flex-shrink:0;font-size:.72rem;display:flex}.node-path-label{color:var(--text-muted);font-family:var(--font-sans)}.node-path-value{color:var(--accent-light)}.explorer-toolbar{padding:var(--space-3) var(--space-4);background:var(--bg-elevated);border-bottom:1px solid var(--border);justify-content:space-between;align-items:center;gap:var(--space-3);flex-shrink:0;display:flex}.toolbar-section{align-items:center;gap:var(--space-2);display:flex}.info-panel{padding:var(--space-4);border-top:1px solid var(--border);background:var(--bg-elevated);flex-shrink:0}.info-grid{gap:var(--space-3);grid-template-columns:repeat(3,1fr);display:grid}.info-item{flex-direction:column;gap:2px;display:flex}.info-label{color:var(--text-muted);text-transform:uppercase;letter-spacing:.05em;font-size:.68rem}.info-value{color:var(--text-primary);font-size:.85rem;font-weight:600;font-family:var(--font-mono)}@media (width<=900px){.explorer-sidebar{flex:0 0 220px}}@media (width<=768px){.explorer-layout{height:auto;min-height:unset}.explorer-top{flex-direction:column}.explorer-input-panel{resize:vertical;max-height:unset;height:240px;min-height:200px;width:100%!important}.explorer-main{flex-direction:column}.explorer-sidebar{display:none}.info-grid{grid-template-columns:repeat(2,1fr)}}@media (width<=480px){.view-tabs .view-tab{padding:var(--space-2);font-size:.72rem}}.diff-layout{gap:var(--space-4);flex-direction:column;flex:1;min-height:550px;animation:.2s fadeIn;display:flex}.diff-header{justify-content:space-between;align-items:center;gap:var(--space-4);flex-wrap:wrap;flex-shrink:0;display:flex}.diff-title-group{flex-direction:column;gap:2px;display:flex}.diff-title{color:var(--text-primary);align-items:center;gap:var(--space-2);font-size:1.1rem;font-weight:700;display:flex}.diff-subtitle{color:var(--text-muted);font-size:.78rem}.diff-controls{align-items:center;gap:var(--space-3);flex-wrap:wrap;display:flex}.diff-format-row{align-items:center;gap:var(--space-2);color:var(--text-muted);font-size:.8rem;display:flex}.diff-inputs{align-items:stretch;gap:var(--space-4);flex-direction:row;flex:1;width:100%;min-height:0;display:flex}.diff-input-panel{background:var(--bg-panel);border:1px solid var(--border);border-radius:var(--radius-lg);flex-direction:column;flex:1;min-width:280px;min-height:0;display:flex;overflow:hidden}.diff-inputs .diff-input-panel:first-child{resize:both;flex:0 50%;max-width:85%;overflow:hidden}.diff-inputs .diff-input-panel:last-child{flex:1}.diff-input-header{padding:var(--space-3) var(--space-4);background:var(--bg-elevated);border-bottom:1px solid var(--border);flex-shrink:0;justify-content:space-between;align-items:center;display:flex}.diff-input-label{color:var(--text-secondary);align-items:center;gap:var(--space-2);font-size:.8rem;font-weight:600;display:flex}.diff-input-label-dot{border-radius:50%;width:8px;height:8px}.diff-input-label-dot.original{background:var(--error)}.diff-input-label-dot.modified{background:var(--success)}.diff-textarea{background:var(--bg-surface);width:100%;height:100%;min-height:800px;color:var(--text-primary);font-family:var(--font-mono);padding:var(--space-4);resize:none;border:none;outline:none;flex:1;font-size:.8rem;line-height:1.65}.diff-textarea::placeholder{color:var(--text-muted)}.diff-textarea:focus{background:var(--bg-hover)}.diff-lines-container{background:var(--bg-surface);font-family:var(--font-mono);padding:var(--space-2) 0;flex-direction:column;flex:1;font-size:.8rem;line-height:1.6;display:flex;overflow:auto}.diff-line-row{align-items:stretch;width:100%;min-width:max-content;display:flex}.diff-line-row.added{color:var(--success);background:#22c55e14}.diff-line-row.added .diff-line-marker{color:var(--success)}.diff-line-row.removed{color:var(--error);background:#ef444414}.diff-line-row.removed .diff-line-marker{color:var(--error)}.diff-line-row.empty{background:var(--bg-panel);opacity:.15;background-image:radial-gradient(var(--border) 1px, transparent 1px);background-size:6px 6px}.diff-line-number{width:44px;min-width:44px;padding:0 var(--space-2);text-align:right;border-right:1px solid var(--border);color:var(--text-muted);-webkit-user-select:none;user-select:none;background:var(--bg-elevated);justify-content:flex-end;align-items:center;font-size:.72rem;display:flex}.diff-line-marker{text-align:center;-webkit-user-select:none;user-select:none;width:22px;min-width:22px;color:var(--text-muted);justify-content:center;align-items:center;font-size:.82rem;font-weight:700;display:flex}.diff-line-content{padding:0 var(--space-3);white-space:pre;font-family:inherit;font-size:inherit;line-height:inherit;align-items:center;margin:0;display:flex}.diff-stats{align-items:center;gap:var(--space-4);padding:var(--space-3) var(--space-5);background:var(--bg-elevated);border:1px solid var(--border);border-radius:var(--radius-lg);flex-wrap:wrap;flex-shrink:0;display:flex}.diff-stat{text-align:center;padding:var(--space-2) var(--space-4);background:var(--bg-surface);border:1px solid var(--border);border-radius:var(--radius-md);flex-direction:column;align-items:center;gap:2px;min-width:110px;display:flex}.diff-stat-count{font-weight:800;font-family:var(--font-mono);font-size:1.4rem;line-height:1.1}.diff-stat-count.added{color:var(--success)}.diff-stat-count.removed{color:var(--error)}.diff-stat-count.changed{color:#fbbf24}.diff-stat-label{color:var(--text-muted);font-size:.72rem;font-weight:500}.diff-parse-error{align-items:center;gap:var(--space-2);padding:var(--space-2) var(--space-4);background:var(--error-dim);color:#fca5a5;border-bottom:1px solid #ef444440;flex-shrink:0;font-size:.75rem;display:flex}.diff-view-toggle{background:var(--bg-elevated);border:1px solid var(--border);border-radius:var(--radius-md);display:flex;overflow:hidden}.diff-view-btn{padding:var(--space-1) var(--space-3);color:var(--text-muted);cursor:pointer;transition:all var(--transition-fast);font-size:.75rem;font-weight:500;font-family:var(--font-sans);background:0 0;border:none}.diff-view-btn.active{background:var(--accent);color:#fff}.diff-view-btn:not(.active):hover{background:var(--bg-hover);color:var(--text-secondary)}@media (width<=768px){.diff-layout{height:auto;min-height:unset}.diff-inputs{flex-direction:column;align-items:stretch}.diff-inputs .diff-input-panel:first-child{resize:vertical;flex:unset;min-height:250px;width:100%!important;max-width:100%!important}.diff-inputs .diff-input-panel:last-child{flex:unset;min-height:250px}.diff-header{flex-direction:column;align-items:flex-start}.diff-controls{justify-content:flex-start;width:100%}.diff-textarea{min-height:180px}.diff-stats{gap:var(--space-2)}}@media (width<=480px){.diff-view-toggle{width:100%}.diff-view-btn{text-align:center;flex:1}}.schema-layout{gap:var(--space-4);flex-direction:column;flex:1;min-height:850px;animation:.2s fadeIn;display:flex}.schema-header{justify-content:space-between;align-items:center;gap:var(--space-4);flex-wrap:wrap;flex-shrink:0;display:flex}.schema-title-group{flex-direction:column;gap:2px;display:flex}.schema-title{color:var(--text-primary);align-items:center;gap:var(--space-2);font-size:1.1rem;font-weight:700;display:flex}.schema-subtitle{color:var(--text-muted);font-size:.78rem}.schema-controls{align-items:center;gap:var(--space-3);flex-wrap:wrap;display:flex}.schema-toolbar{align-items:center;gap:var(--space-4);padding:var(--space-3) var(--space-4);background:var(--bg-elevated);border:1px solid var(--border);border-radius:var(--radius-lg);row-gap:var(--space-2);flex-wrap:wrap;flex-shrink:0;display:flex}.schema-toolbar-divider{background:var(--border);flex-shrink:0;width:1px;height:22px}.schema-format-group{align-items:center;gap:var(--space-2);display:flex}.schema-format-label{color:var(--text-muted);white-space:nowrap;font-size:.78rem}.schema-toggle-group{align-items:center;gap:var(--space-2);flex-shrink:0;display:flex}.schema-toggle-label{color:var(--text-muted);white-space:nowrap;font-size:.72rem}.schema-legend{gap:var(--space-3);flex-wrap:wrap;margin-left:auto;display:flex}.schema-legend-item{color:var(--text-muted);align-items:center;gap:4px;font-size:.7rem;display:flex}.schema-legend-dot{border-radius:50%;flex-shrink:0;width:7px;height:7px}.schema-panels{align-items:stretch;gap:var(--space-4);flex-direction:row;flex:1;width:100%;min-height:0;display:flex}.schema-panel{background:var(--bg-panel);border:1px solid var(--border);border-radius:var(--radius-lg);flex-direction:column;flex:1;min-width:260px;min-height:0;display:flex;overflow:hidden}.schema-panel-left{resize:horizontal;flex:0 50%;max-width:80%;overflow:hidden}.schema-panel-right{flex:1}.schema-panel-header{padding:var(--space-3) var(--space-4);background:var(--bg-elevated);border-bottom:1px solid var(--border);justify-content:space-between;align-items:center;gap:var(--space-2);flex-shrink:0;display:flex}.schema-panel-label{color:var(--text-secondary);align-items:center;gap:var(--space-2);font-size:.8rem;font-weight:600;display:flex}.schema-panel-label-meta{color:var(--text-muted);margin-left:4px;font-size:.7rem;font-weight:400}.schema-panel-actions{align-items:center;gap:var(--space-2);flex-wrap:wrap;display:flex}.schema-parse-error{align-items:center;gap:var(--space-2);padding:var(--space-2) var(--space-4);background:var(--error-dim);color:#fca5a5;border-bottom:1px solid #ef444440;flex-shrink:0;font-size:.75rem;display:flex}.schema-textarea{background:var(--bg-surface);width:100%;height:100%;min-height:0;color:var(--text-primary);font-family:var(--font-mono);padding:var(--space-4);resize:none;border:none;outline:none;flex:1;font-size:.8rem;line-height:1.65}.schema-textarea::placeholder{color:var(--text-muted);opacity:.7}.schema-textarea:focus{background:var(--bg-hover)}.schema-output-view{background:var(--bg-surface);padding:var(--space-4);font-family:var(--font-mono);white-space:pre;-webkit-user-select:text;user-select:text;flex:1;font-size:.8rem;line-height:1.65;overflow:auto}.schema-empty{justify-content:center;align-items:center;gap:var(--space-3);color:var(--text-muted);padding:var(--space-8);text-align:center;flex-direction:column;flex:1;display:flex}.schema-empty-icon{opacity:.4;font-size:3rem}.schema-empty-title{color:var(--text-secondary);font-size:1rem;font-weight:600}.schema-empty-desc{max-width:360px;font-size:.82rem;line-height:1.6}.schema-info-bar{align-items:center;gap:var(--space-4);padding:var(--space-2) var(--space-4);background:var(--bg-elevated);border:1px solid var(--border);border-radius:var(--radius-md);color:var(--text-muted);flex-wrap:wrap;flex-shrink:0;font-size:.75rem;display:flex}@media (width<=768px){.schema-layout{min-height:unset}.schema-panels{flex-direction:column;align-items:stretch}.schema-panel-left{resize:vertical;flex:unset;min-height:220px;width:100%!important;max-width:100%!important}.schema-panel-right{flex:unset;min-height:300px}.schema-header{flex-direction:column;align-items:flex-start}.schema-controls{justify-content:flex-start;width:100%}.schema-toolbar{gap:var(--space-2)}.schema-toolbar-divider{display:none}.schema-legend{margin-left:0}}@media (width<=480px){.schema-format-group,.schema-toggle-group{flex-wrap:wrap}}.page-loader-overlay{z-index:99999;background:radial-gradient(circle at center, var(--bg-surface) 0%, var(--bg-base) 100%);opacity:1;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);flex-direction:column;justify-content:center;align-items:center;transition:opacity .6s cubic-bezier(.16,1,.3,1),transform .6s cubic-bezier(.16,1,.3,1);display:flex;position:fixed;inset:0;transform:scale(1)}.page-loader-overlay.fade-out{opacity:0;pointer-events:none;transform:scale(1.08)}.loader-container{text-align:center;padding:var(--space-8);border-radius:var(--radius-xl);flex-direction:column;justify-content:center;align-items:center;display:flex}.loader-brand-container{width:160px;height:160px;margin-bottom:var(--space-4);justify-content:center;align-items:center;display:flex;position:relative}.loader-logo-glow{background:var(--accent);filter:blur(28px);opacity:.22;border-radius:50%;width:90px;height:90px;animation:2.5s ease-in-out infinite pulseGlow;position:absolute}.loader-ring-outer{border:2px dotted var(--accent);opacity:.45;border-radius:50%;width:145px;height:145px;animation:12s linear infinite rotateClockwise;position:absolute}.loader-ring-inner{border:3px double #0000;border-top-color:var(--accent);border-bottom-color:var(--accent);width:115px;height:115px;box-shadow:0 0 20px var(--accent-glow);opacity:.85;border-radius:50%;animation:2.8s cubic-bezier(.44,.21,.26,.88) infinite rotateCounterClockwise;position:absolute}.loader-logo-wrapper{border:1px solid var(--border);width:75px;height:75px;box-shadow:var(--shadow-md), inset 0 2px 8px #0003;z-index:2;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);background:#1e2a3599;border-radius:50%;justify-content:center;align-items:center;display:flex;position:relative;overflow:hidden}[data-theme=light] .loader-logo-wrapper{box-shadow:var(--shadow-sm), inset 0 2px 4px #0000000d;background:#fff9}.loader-logo-img{object-fit:contain;z-index:3;width:46px;height:46px;animation:3s ease-in-out infinite bounceLogo}[data-theme=dark] .loader-logo-img{filter:invert()}.loader-logo-fallback{z-index:3;font-size:2.2rem;animation:6s linear infinite spin}.loader-title{margin-top:var(--space-4);letter-spacing:.06em;background:linear-gradient(135deg, var(--text-primary) 20%, var(--accent) 100%);-webkit-text-fill-color:transparent;font-size:2rem;font-weight:850;font-family:var(--font-sans);text-transform:uppercase;-webkit-background-clip:text;margin-bottom:2px}.loader-tagline{color:var(--text-secondary);opacity:.85;letter-spacing:.02em;font-size:.82rem;font-weight:500}.loader-progress-container{border-radius:var(--radius-full);width:220px;height:4px;margin-top:var(--space-6);background:#88bdf214;border:1px solid #88bdf20d;position:relative;overflow:hidden}[data-theme=light] .loader-progress-container{background:#3849590f;border-color:#38495908}.loader-progress-bar{background:linear-gradient(90deg, var(--accent) 0%, var(--accent-light) 100%);width:0%;height:100%;box-shadow:0 0 10px var(--accent-glow);border-radius:var(--radius-full);transition:width .3s cubic-bezier(.1,.8,.2,1)}.loader-status{color:var(--text-muted);font-size:.74rem;font-weight:500;font-family:var(--font-mono);margin-top:var(--space-4);letter-spacing:.01em;opacity:.9;min-height:16px;animation:1.5s infinite pulseText}@keyframes rotateClockwise{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@keyframes rotateCounterClockwise{0%{transform:rotate(360deg)}to{transform:rotate(0)}}@keyframes pulseGlow{0%,to{opacity:.18;transform:scale(.92)}50%{opacity:.38;transform:scale(1.12)}}@keyframes bounceLogo{0%,to{transform:translateY(0)scale(1)}50%{transform:translateY(-3px)scale(1.03)}}@keyframes pulseText{0%,to{opacity:.75}50%{opacity:1}}@media (width<=480px){.loader-brand-container{width:130px;height:130px}.loader-ring-outer{width:120px;height:120px}.loader-ring-inner{width:95px;height:95px}.loader-logo-wrapper{width:65px;height:65px}.loader-logo-img{width:38px;height:38px}.loader-title{font-size:1.7rem}.loader-progress-container{width:180px}}:root{--bg-base:#1e2a35;--bg-surface:#243040;--bg-elevated:#2a3848;--bg-panel:#304050;--bg-hover:#364858;--bg-active:#3c5068;--accent:#88bdf2;--accent-light:#bdddfc;--accent-dim:#88bdf226;--accent-glow:#88bdf247;--violet:#6a89a7;--violet-dim:#6a89a733;--success:#22c55e;--success-dim:#22c55e26;--error:#ef4444;--error-dim:#ef444426;--warning:#f59e0b;--info:#bdddfc;--info-dim:#bdddfc26;--text-primary:#e8f0f8;--text-secondary:#a8c0d6;--text-muted:#6a89a7;--text-accent:#88bdf2;--border:#88bdf21a;--border-accent:#88bdf266;--border-hover:#88bdf238;--space-1:4px;--space-2:8px;--space-3:12px;--space-4:16px;--space-5:20px;--space-6:24px;--space-8:32px;--space-10:40px;--radius-sm:6px;--radius-md:10px;--radius-lg:14px;--radius-xl:20px;--radius-full:9999px;--shadow-sm:0 1px 3px #00000059;--shadow-md:0 4px 16px #00000073;--shadow-lg:0 8px 32px #0000008c;--shadow-accent:0 0 20px var(--accent-glow);--shadow-glow:0 0 40px #88bdf22e;--transition-fast:.15s ease;--transition-normal:.25s ease;--transition-slow:.4s ease;--font-sans:"Inter", system-ui, sans-serif;--font-mono:"JetBrains Mono", "Fira Code", monospace;--code-bg:#1e2a35;--code-gutter:#243040;--code-key:#9cdcfe;--code-string:#ce9178;--code-number:#b5cea8;--code-bool:#569cd6;--code-null:#569cd6;--code-punct:#d4d4d4;--code-comment:#6a9955;--code-tag:#4ec9b0;--code-attr:#9cdcfe;--code-attr-val:#ce9178;--code-directive:#c586c0;--code-yaml-sep:#d4d4d4;--code-csv-header:#dcdcaa}[data-theme=light]{--bg-base:#eef4fb;--bg-surface:#e3edf7;--bg-elevated:#fff;--bg-panel:#fff;--bg-hover:#daeaf8;--bg-active:#bdddfc;--accent:#5a9fd4;--accent-light:#88bdf2;--accent-dim:#88bdf22e;--accent-glow:#88bdf240;--text-primary:#1d2d3e;--text-secondary:#384959;--text-muted:#6a89a7;--text-accent:#3a7cb8;--border:#3849591f;--border-accent:#88bdf273;--border-hover:#38495938;--shadow-sm:0 1px 3px #3849591a;--shadow-md:0 4px 16px #38495924;--shadow-lg:0 8px 32px #3849592e;--shadow-glow:0 0 40px #88bdf229;--code-bg:#fff;--code-gutter:#f5f8fc;--code-key:#0056b3;--code-string:#a31515;--code-number:#098658;--code-bool:#0451a5;--code-null:#0451a5;--code-punct:#1e3a50;--code-comment:green;--code-tag:maroon;--code-attr:#e50000;--code-attr-val:#0451a5;--code-directive:#af00db;--code-yaml-sep:#1e3a50;--code-csv-header:#0056b3}[data-theme=light] .app-shell{background:radial-gradient(ellipse 80% 50% at 50% -20%, #88bdf21f 0%, transparent 60%), var(--bg-base)}[data-theme=light] .header{background:#eef4fbed;border-bottom-color:#88bdf233}[data-theme=light] .code-area{color:#1e3a50}[data-theme=light] .select option{color:#1d2d3e;background:#fff}[data-theme=light] .raw-pre{color:#384959}[data-theme=light] .tree-val-string{color:#1a8a4a}[data-theme=light] .tree-val-number{color:#c05c00}[data-theme=light] .tree-val-boolean{color:#8b3db8}[data-theme=light] .tree-val-null{color:#6a89a7}[data-theme=light] .tree-key{color:#1a5f9e}*,:before,:after{box-sizing:border-box;margin:0;padding:0;transition-property:background-color,border-color,color,box-shadow;transition-duration:.25s;transition-timing-function:ease}html{scroll-behavior:smooth;font-size:15px}body{font-family:var(--font-sans);background:var(--bg-base);color:var(--text-primary);-webkit-font-smoothing:antialiased;min-height:100vh;line-height:1.6;overflow-x:hidden}#root{flex-direction:column;min-height:100vh;display:flex}::-webkit-scrollbar{width:6px;height:6px}::-webkit-scrollbar-track{background:var(--bg-surface)}::-webkit-scrollbar-thumb{background:var(--bg-active);border-radius:var(--radius-full)}::-webkit-scrollbar-thumb:hover{background:var(--accent)}h1,h2,h3,h4{font-weight:600;line-height:1.3}code,pre{font-family:var(--font-mono)}.btn{align-items:center;gap:var(--space-2);padding:var(--space-2) var(--space-4);border:1px solid var(--border);border-radius:var(--radius-md);font-family:var(--font-sans);cursor:pointer;transition:all var(--transition-fast);white-space:nowrap;color:var(--text-secondary);background:0 0;font-size:.85rem;font-weight:500;display:inline-flex;position:relative;overflow:hidden}.btn:after{content:"";opacity:0;transition:opacity var(--transition-fast);background:#fff;position:absolute;inset:0}.btn:hover:after{opacity:.04}.btn:active{transform:scale(.97)}.btn:active:after{opacity:.08}.btn-primary{color:#1d2d3e;box-shadow:0 0 16px var(--accent-glow), var(--shadow-sm);background:linear-gradient(135deg,#88bdf2,#5a9fd4);border-color:#88bdf2;font-weight:600}.btn-primary:hover{box-shadow:0 0 24px var(--accent-glow), var(--shadow-md);background:linear-gradient(135deg,#bdddfc,#88bdf2);border-color:#bdddfc}.btn-ghost{background:var(--bg-elevated);border-color:var(--border);color:var(--text-secondary)}.btn-ghost:hover{border-color:var(--border-hover);color:var(--text-primary);background:var(--bg-hover)}.btn-icon{padding:var(--space-2) var(--space-3);border-radius:var(--radius-sm);font-size:.8rem}.btn-danger{background:var(--error-dim);color:var(--error);border-color:#ef44444d}.btn-danger:hover{background:#ef444440}.btn-success{background:var(--success-dim);color:var(--success);border-color:#22c55e4d}.btn-success:hover{background:#22c55e40}.badge{border-radius:var(--radius-full);letter-spacing:.04em;text-transform:uppercase;align-items:center;padding:2px 8px;font-size:.7rem;font-weight:600;display:inline-flex}.badge-json{color:#fbbf24;background:#fbbf2426;border:1px solid #fbbf244d}.badge-yaml{color:#38bdf8;background:#0ea5e926;border:1px solid #0ea5e94d}.badge-xml{color:#f87171;background:#ef444426;border:1px solid #ef44444d}.badge-csv,.badge-xlsx{color:#4ade80;background:#22c55e26;border:1px solid #22c55e4d}.badge-txt{color:#94a3b8;background:#94a3b826;border:1px solid #94a3b84d}.select{background:var(--bg-elevated);border:1px solid var(--border);border-radius:var(--radius-md);color:var(--text-primary);font-family:var(--font-sans);padding:var(--space-2) var(--space-3);cursor:pointer;transition:border-color var(--transition-fast);appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='%2394a3b8' d='M6 8L1 3h10z'/%3E%3C/svg%3E");background-position:right 10px center;background-repeat:no-repeat;outline:none;padding-right:28px;font-size:.85rem}.select:hover{border-color:var(--border-hover)}.select:focus{border-color:var(--accent)}.select option{background:var(--bg-panel)}.input{background:var(--bg-elevated);border:1px solid var(--border);border-radius:var(--radius-md);color:var(--text-primary);font-family:var(--font-sans);padding:var(--space-2) var(--space-3);transition:border-color var(--transition-fast);outline:none;width:100%;font-size:.85rem}.input:hover{border-color:var(--border-hover)}.input:focus{border-color:var(--accent)}.input::placeholder{color:var(--text-muted)}.code-area{resize:none;background:var(--code-bg);width:100%;height:100%;color:var(--text-primary);font-family:var(--font-mono);padding:var(--space-4);tab-size:2;caret-color:var(--accent);border:none;outline:none;font-size:.8rem;line-height:1.7}.code-area::placeholder{color:var(--text-muted);opacity:.8}.panel{background:var(--bg-panel);border:1px solid var(--border);border-radius:var(--radius-lg);overflow:hidden}.panel-header{padding:var(--space-3) var(--space-4);border-bottom:1px solid var(--border);background:var(--bg-elevated);justify-content:space-between;align-items:center;gap:var(--space-3);display:flex}.panel-title{color:var(--text-secondary);text-transform:uppercase;letter-spacing:.06em;font-size:.8rem;font-weight:600}.toggle-group{background:var(--bg-elevated);border:1px solid var(--border);border-radius:var(--radius-md);gap:2px;padding:2px;display:flex}.toggle-option{border-radius:calc(var(--radius-md) - 2px);cursor:pointer;transition:all var(--transition-fast);color:var(--text-muted);font-size:.8rem;font-weight:500;font-family:var(--font-sans);background:0 0;border:none;padding:4px 12px}.toggle-option.active{background:var(--accent);color:#fff;box-shadow:0 0 12px var(--accent-glow)}.toggle-option:not(.active):hover{color:var(--text-secondary);background:var(--bg-hover)}.radio-group{gap:var(--space-2);flex-direction:column;display:flex}.radio-option{align-items:center;gap:var(--space-2);cursor:pointer;color:var(--text-secondary);transition:color var(--transition-fast);font-size:.85rem;display:flex}.radio-option:hover{color:var(--text-primary)}.radio-option input{accent-color:var(--accent);width:14px;height:14px}.radio-option.checked{color:var(--text-primary)}.empty-state{justify-content:center;align-items:center;gap:var(--space-3);padding:var(--space-10);color:var(--text-muted);text-align:center;flex-direction:column;display:flex}.empty-state-icon{opacity:.5;font-size:2.5rem}.empty-state-title{color:var(--text-secondary);font-size:.95rem;font-weight:500}.empty-state-desc{max-width:280px;font-size:.82rem;line-height:1.6}.divider{background:var(--border);height:1px;margin:var(--space-4) 0}[data-tooltip]{position:relative}[data-tooltip]:before{content:attr(data-tooltip);background:var(--bg-active);color:var(--text-primary);border-radius:var(--radius-sm);white-space:nowrap;opacity:0;pointer-events:none;transition:opacity var(--transition-fast);border:1px solid var(--border);z-index:100;padding:4px 8px;font-size:.72rem;position:absolute;bottom:calc(100% + 6px);left:50%;transform:translate(-50%)}[data-tooltip]:hover:before{opacity:1}@keyframes fadeIn{0%{opacity:0;transform:translateY(4px)}to{opacity:1;transform:translateY(0)}}@keyframes slideInRight{0%{opacity:0;transform:translate(20px)}to{opacity:1;transform:translate(0)}}@keyframes slideOutRight{0%{opacity:1;transform:translate(0)}to{opacity:0;transform:translate(20px)}}@keyframes pulse{0%,to{opacity:1}50%{opacity:.6}}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@keyframes shimmer{0%{background-position:-200% 0}to{background-position:200% 0}}.animate-fade-in{animation:fadeIn var(--transition-normal) ease forwards}.animate-spin{animation:1s linear infinite spin}.animate-pulse{animation:1.5s infinite pulse}.flex{display:flex}.flex-col{flex-direction:column}.items-center{align-items:center}.justify-between{justify-content:space-between}.gap-2{gap:var(--space-2)}.gap-3{gap:var(--space-3)}.gap-4{gap:var(--space-4)}.flex-1{flex:1}.min-w-0{min-width:0}.overflow-hidden{overflow:hidden}.text-truncate{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.w-full{width:100%}.h-full{height:100%}@media (width<=768px){.btn-icon{padding:var(--space-1) var(--space-2);font-size:.75rem}.diff-controls{gap:var(--space-2);flex-wrap:wrap;width:100%}.diff-controls .btn{flex:auto;justify-content:center;min-width:70px}.schema-toolbar-row{align-items:flex-start;gap:var(--space-3);flex-direction:column}}@media (width<=480px){.btn{padding:var(--space-1) var(--space-2);font-size:.78rem}.btn-icon{padding:var(--space-1);font-size:.72rem}.diff-controls{flex-direction:column;align-items:stretch}.diff-controls .btn,.diff-controls .diff-view-toggle{width:100%}.diff-view-toggle{display:flex}.diff-view-btn{text-align:center;flex:1;justify-content:center}}
