:root{font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;color:#1f2933;background:#f6f7f9;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}*{box-sizing:border-box}body{min-width:320px;min-height:100vh;margin:0}button,select,input{font:inherit}button{cursor:pointer}button:disabled{cursor:not-allowed}.app-shell{min-height:100vh;padding:28px}.app-header{display:flex;align-items:center;justify-content:space-between;gap:18px;max-width:1240px;margin:0 auto 22px}.eyebrow{margin:0 0 5px;color:#4f6f5b;font-size:.78rem;font-weight:700;letter-spacing:0;text-transform:uppercase}h1,h2{margin:0;line-height:1.1;letter-spacing:0}h1{font-size:clamp(2rem,5vw,4rem);font-weight:760}h2{font-size:1rem;font-weight:720}.api-status{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-width:118px;min-height:38px;padding:8px 12px;border:1px solid #d9dee5;border-radius:8px;background:#fff;color:#64707d;text-transform:capitalize}.api-status.online{border-color:#b7d9c1;color:#2f6b42}.api-status.offline{border-color:#edb9b9;color:#9a3d3d}.workspace{display:grid;grid-template-columns:minmax(280px,370px) minmax(0,1fr);gap:18px;max-width:1240px;margin:0 auto;align-items:start}.control-panel,.preview-panel{border:1px solid #d9dee5;border-radius:8px;background:#fff;box-shadow:0 16px 36px #242d3a14}.control-panel{padding:18px}.preview-panel{min-height:620px;padding:18px}.panel-heading{display:flex;align-items:center;justify-content:space-between;gap:14px;margin-bottom:16px}.icon-button{display:inline-flex;align-items:center;justify-content:center;width:36px;height:36px;border:1px solid #d9dee5;border-radius:8px;background:#fff;color:#46505c}.icon-button:hover,.output-tabs button:hover,.output-toolbar button:hover{border-color:#9bb9a4;color:#2f6b42}.conversion-form{display:grid;gap:14px}.source-mode{display:grid;grid-template-columns:1fr 1fr;gap:8px}.source-mode button{display:inline-flex;align-items:center;justify-content:center;gap:7px;min-height:40px;border:1px solid #ccd3dc;border-radius:8px;background:#fff;color:#46505c;font-weight:700}.source-mode button:hover{border-color:#9bb9a4;color:#2f6b42}.source-mode button.active{border-color:#78a987;background:#eef6f0;color:#2f6b42}.field{display:grid;gap:7px}.field span{color:#46505c;font-size:.86rem;font-weight:700}select{width:100%;min-height:42px;padding:8px 10px;border:1px solid #ccd3dc;border-radius:8px;background:#fff;color:#1f2933}select:focus,button:focus-visible,.file-drop:focus-within{outline:3px solid rgba(71,137,89,.2);outline-offset:2px}.file-drop{display:grid;place-items:center;gap:8px;min-height:172px;padding:20px;border:1px dashed #98a5b3;border-radius:8px;background:#fafbfc;color:#46505c;text-align:center}.file-drop span{max-width:100%;overflow-wrap:anywhere;font-weight:720}.file-drop small{color:#687787}input[type=file]{width:1px;height:1px;position:absolute;opacity:0}.primary-button{display:inline-flex;align-items:center;justify-content:center;gap:9px;min-height:44px;border:1px solid #2f6b42;border-radius:8px;background:#347a4a;color:#fff;font-weight:740}.primary-button:hover:not(:disabled){background:#2f6b42}.primary-button:disabled{border-color:#cbd3dc;background:#d9dee5;color:#758191}.alert{display:flex;align-items:flex-start;gap:9px;margin-top:14px;padding:11px 12px;border:1px solid #edb9b9;border-radius:8px;background:#fff5f3;color:#8f3535;white-space:pre-wrap}.output-count{display:inline-flex;align-items:center;min-height:28px;padding:5px 9px;border-radius:8px;background:#eef6f0;color:#2f6b42;font-size:.82rem;font-weight:700}.output-workspace{display:grid;gap:12px}.output-tabs{display:flex;gap:8px;overflow-x:auto;padding-bottom:2px}.output-tabs button{display:inline-flex;align-items:center;gap:7px;max-width:240px;min-height:38px;padding:8px 10px;border:1px solid #d9dee5;border-radius:8px;background:#fff;color:#46505c;white-space:nowrap}.output-tabs button.active{border-color:#347a4a;background:#eef6f0;color:#2f6b42}.output-tabs span,.output-toolbar span{overflow:hidden;text-overflow:ellipsis}.output-toolbar{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:44px;padding:9px 10px;border:1px solid #d9dee5;border-radius:8px;background:#fafbfc;color:#46505c}.output-toolbar button{display:inline-flex;align-items:center;justify-content:center;gap:7px;min-height:34px;padding:6px 10px;border:1px solid #c5ccd5;border-radius:8px;background:#fff;color:#1f2933;flex:0 0 auto}.json-preview{min-height:492px;max-height:66vh;margin:0;padding:16px;overflow:auto;border:1px solid #d9dee5;border-radius:8px;background:#161a20;color:#eef2f6;font-family:Cascadia Code,SFMono-Regular,Consolas,monospace;font-size:.86rem;line-height:1.55;-moz-tab-size:2;tab-size:2}.empty-state{display:grid;place-items:center;gap:10px;min-height:520px;border:1px dashed #c5ccd5;border-radius:8px;background:#fafbfc;color:#687787;text-align:center}.spin{animation:spin .8s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}@media(max-width:820px){.app-shell{padding:18px}.app-header{align-items:flex-start;flex-direction:column}.workspace{grid-template-columns:1fr}.preview-panel{min-height:520px}.json-preview{min-height:360px}}