:root{color:#17202f;background:#f7f9fc;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;font-synthesis:none;text-rendering:optimizeLegibility}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;min-width:320px;background:#f7f9fc}button,input,select,textarea{font:inherit}a{color:inherit}.site{min-height:100vh;background:linear-gradient(180deg,#e5edf7e6,#f7f9fc00 420px),#f7f9fc;color:#17202f}.site.dark{background:linear-gradient(180deg,#182333e6,#0a0e1500 420px),#0a0e15;color:#eef4ff}.topbar{display:flex;align-items:center;justify-content:space-between;max-width:1220px;margin:0 auto;padding:22px 24px}.brand,nav,.hero-actions,.toolbar,.panel-title,.status,.search-box,footer,.eyebrow{display:flex;align-items:center}.brand{gap:10px;font-weight:800;text-decoration:none}.brand-mark{width:36px;height:36px;display:inline-grid;place-items:center;border-radius:8px;color:#fff;background:#145c4b}nav{gap:18px;font-size:14px}nav a{text-decoration:none;color:#4f5e72}.dark nav a{color:#b8c4d6}.theme-button,.language-button,.icon-button,.view-tabs button{border:1px solid #d7e0eb;background:#fff;color:#17202f;cursor:pointer}.theme-button{width:38px;height:38px;display:grid;place-items:center;border-radius:8px}.language-button{min-width:48px;height:38px;border-radius:8px;padding:0 10px;font-weight:800}.dark .theme-button,.dark .language-button,.dark .icon-button,.dark .view-tabs button{border-color:#2a3748;background:#121a27;color:#eef4ff}.hero{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(280px,.6fr);gap:36px;align-items:end;max-width:1220px;margin:0 auto;padding:54px 24px 32px}.eyebrow,.section-kicker{gap:8px;color:#145c4b;font-size:13px;font-weight:800;letter-spacing:0;text-transform:uppercase}.dark .eyebrow,.dark .section-kicker{color:#7ee0c3}h1,h2,h3,p{margin-top:0}h1{max-width:780px;margin-bottom:18px;font-size:clamp(48px,8vw,92px);line-height:.94;letter-spacing:0}h2{margin-bottom:12px;font-size:34px;line-height:1.12;letter-spacing:0}h3{margin-bottom:8px;font-size:18px}.hero-text{max-width:720px;margin-bottom:26px;color:#4f5e72;font-size:20px;line-height:1.55}.dark .hero-text,.dark .feature-grid p,.dark .guide-copy p,.dark footer span,.dark .faq-item p{color:#b8c4d6}.hero-actions{gap:12px;flex-wrap:wrap}.primary-link,.secondary-link{min-height:46px;display:inline-flex;align-items:center;justify-content:center;border-radius:8px;padding:0 18px;font-weight:800;text-decoration:none}.primary-link{background:#145c4b;color:#fff}.secondary-link{border:1px solid #c7d2de;background:#ffffffb8}.dark .secondary-link{border-color:#334155;background:#121a27c7}.hero-stats{display:grid;grid-template-columns:1fr;gap:12px}.hero-stats div{border-left:4px solid #f2b84b;padding:16px 18px;background:#ffffffbd}.dark .hero-stats div{background:#121a27db}.hero-stats strong{display:block;font-size:30px}.hero-stats span{color:#4f5e72}.dark .hero-stats span{color:#b8c4d6}.tool-shell,.feature-band,.tools-band,.content-band,.faq-band{max-width:1220px;margin:28px auto;padding:0 24px}.tool-shell{scroll-margin-top:12px}.tool-header{display:flex;align-items:flex-end;justify-content:space-between;gap:20px;padding:24px;border:1px solid #d8e2ee;border-bottom:0;border-radius:8px 8px 0 0;background:#fff}.dark .tool-header,.dark .toolbar,.dark .editor-panel,.dark .feature-grid article,.dark .faq-item,.dark .guide-copy,.dark .tools-band,.dark footer{border-color:#243247;background:#101824}.tool-header h2{margin-bottom:0}.status{gap:8px;min-height:36px;border-radius:8px;padding:0 12px;font-weight:800}.status.ok{background:#e8f7f0;color:#0f684e}.status.error{background:#fff0e6;color:#9a431d}.toolbar{gap:8px;flex-wrap:wrap;padding:12px;border:1px solid #d8e2ee;border-bottom:0;background:#fdfefe}.icon-button{gap:9px;min-height:38px;border-radius:8px;padding:0 13px;font-weight:700}.icon-button svg{flex:0 0 auto}.icon-button:disabled{cursor:not-allowed;opacity:.48}.file-input{display:none}.select-control{display:flex;align-items:center;gap:8px;min-height:38px;margin-left:auto;color:#4f5e72;font-size:13px;font-weight:800}.select-control select{height:38px;border:1px solid #d7e0eb;border-radius:8px;padding:0 9px;background:#fff}.dark .select-control,.dark .panel-title small{color:#b8c4d6}.error-panel{display:flex;gap:10px;align-items:center;padding:12px 16px;border:1px solid #f0c6ae;background:#fff5ed;color:#8a3e1e;font-weight:700}.dark .error-panel{border-color:#7b3a24;background:#2a1712;color:#ffb08a}.editor-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);border:1px solid #d8e2ee;border-radius:0 0 8px 8px;overflow:hidden;background:#fff}.editor-panel{min-width:0;background:#fff}.editor-panel+.editor-panel{border-left:1px solid #d8e2ee}.dark .editor-panel+.editor-panel{border-left-color:#243247}.panel-title{gap:9px;height:44px;padding:0 14px;border-bottom:1px solid #e3ebf3;font-weight:800}.dark .panel-title{border-bottom-color:#243247}.panel-title small{margin-left:auto;color:#6c7a8d;font-weight:700}textarea,.output-box{width:100%;height:520px;border:0;outline:none;resize:vertical;background:#fbfdff;color:#17202f;font-family:JetBrains Mono,SFMono-Regular,Consolas,monospace;font-size:14px;line-height:1.55}textarea{padding:18px}.dark textarea,.dark .output-box{background:#0b111b;color:#e6eefc}.view-tabs{display:flex;gap:6px;padding:10px 12px 0}.view-tabs button{min-height:32px;border-radius:8px;padding:0 10px;text-transform:capitalize}.view-tabs button.active{border-color:#145c4b;background:#145c4b;color:#fff}.search-box{gap:8px;margin:10px 12px;border:1px solid #d7e0eb;border-radius:8px;padding:0 10px;background:#fff}.dark .search-box{border-color:#2a3748;background:#121a27}.search-box input{width:100%;height:34px;border:0;outline:none;background:transparent;color:inherit}.output-box{overflow:auto;padding:16px}pre{margin:0;white-space:pre-wrap;word-break:break-word}mark{background:#ffe08a;color:#17202f}.tree-node{margin:4px 0}.tree-node summary{cursor:pointer}.tree-children{margin-left:18px;padding-left:12px;border-left:1px solid #d9e3ee}.dark .tree-children{border-left-color:#2a3748}.tree-row,.tree-node summary{min-height:28px}.tree-key{margin-right:10px;color:#145c4b;font-weight:800}.dark .tree-key{color:#7ee0c3}.tree-meta,.tree-value{color:#66758a}.tree-value.string{color:#a04d00}.tree-value.number,.tree-value.boolean{color:#214fa3}.table-wrap{overflow:auto}table{width:100%;border-collapse:collapse;font-family:inherit}th,td{border:1px solid #d9e3ee;padding:9px;text-align:left;vertical-align:top}th{background:#eef4f8}.dark th,.dark td{border-color:#2a3748}.dark th{background:#121a27}.empty-state{display:grid;place-items:center;gap:8px;min-height:260px;color:#66758a;text-align:center}.section-heading{max-width:780px;margin-bottom:22px}.feature-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}.feature-grid article,.faq-item,.guide-copy,.tools-band{border:1px solid #d8e2ee;border-radius:8px;background:#fff}.feature-grid article{padding:22px}.feature-grid article svg{color:#145c4b}.feature-grid p,.guide-copy p,.faq-item p{color:#4f5e72;line-height:1.65}.tools-band{padding:24px}.tool-list{display:flex;flex-wrap:wrap;gap:10px}.tool-list a{min-height:38px;display:inline-flex;align-items:center;border:1px solid #cdd8e4;border-radius:8px;padding:0 12px;text-decoration:none;font-weight:800}.dark .tool-list a{border-color:#2a3748}.guide-copy{max-width:820px;padding:26px}.faq-list{display:grid;gap:10px;max-width:860px}.faq-item{padding:18px 20px}.faq-item summary{cursor:pointer;font-weight:800}.faq-item p{margin:12px 0 0}footer{justify-content:space-between;max-width:1220px;margin:40px auto 0;padding:28px 24px 36px;border-top:1px solid #d8e2ee}footer div{display:grid;gap:4px}footer a{font-weight:800}@media(max-width:960px){.hero,.editor-grid,.feature-grid{grid-template-columns:1fr}.editor-panel+.editor-panel{border-left:0;border-top:1px solid #d8e2ee}.select-control{margin-left:0}}@media(max-width:680px){.topbar{align-items:flex-start;flex-direction:column;gap:14px}nav{width:100%;justify-content:space-between}.hero{padding-top:32px}h1{font-size:46px}h2{font-size:28px}.hero-text{font-size:17px}.tool-header,footer{align-items:flex-start;flex-direction:column}textarea,.output-box{height:420px}.icon-button span{display:none}.icon-button{width:40px;justify-content:center;padding:0}}