:root{--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light;--background:#f5f7f6;--surface:#fff;--surface-soft:#eef3f1;--text:#101417;--muted:#64707a;--line:#d6ddda;--accent:#0e6f5c;--accent-strong:#074d41;--signal:#c03283;--warning:#b6722c;--danger:#a43c3c;--shadow:0 22px 70px #10141714}*{box-sizing:border-box}html{min-height:100%;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}body{min-height:100vh;color:var(--text);background:linear-gradient(120deg, #0e6f5c1a, transparent 34%), linear-gradient(300deg, #c0328317, transparent 42%), var(--background);margin:0}button,input,select,textarea{font:inherit}button{cursor:pointer}a{color:inherit}.app-shell{min-height:100vh}.topbar{justify-content:space-between;align-items:center;gap:18px;width:min(100%,1320px);margin:0 auto;padding:24px clamp(18px,5vw,56px) 0;display:flex}.brand{font-weight:850;text-decoration:none}.topbar nav{border:1px solid var(--line);background:#ffffffb8;border-radius:8px;gap:6px;padding:4px;display:flex}.topbar nav a{min-height:34px;color:var(--muted);border-radius:6px;padding:8px 12px;font-size:.9rem;font-weight:800;text-decoration:none}.topbar nav a:hover{color:#fff;background:var(--text)}.workspace{width:min(100%,1320px);margin:0 auto;padding:clamp(34px,6vw,72px) clamp(18px,5vw,56px) 80px}.intro{max-width:900px;margin-bottom:clamp(28px,5vw,46px)}.eyebrow{color:var(--accent);letter-spacing:.09em;text-transform:uppercase;margin:0 0 14px;font-size:.78rem;font-weight:850}.intro h1{max-width:880px;margin:0;font-size:clamp(3rem,8vw,7.8rem);line-height:.94}.intro p:not(.eyebrow){max-width:720px;color:var(--muted);margin:24px 0 0;font-size:clamp(1.04rem,2vw,1.34rem);line-height:1.55}.tool-layout{grid-template-columns:minmax(280px,360px) minmax(0,1fr);align-items:start;gap:18px;display:grid}.tool-nav,.tool-panel{border:1px solid var(--line);box-shadow:var(--shadow);background:#ffffffc7;border-radius:8px}.tool-nav{gap:4px;padding:8px;display:grid}.tool-tab{width:100%;color:var(--text);text-align:left;background:0 0;border:0;border-radius:8px;grid-template-columns:24px minmax(0,1fr);align-items:start;gap:10px;padding:14px 12px;display:grid}.tool-tab[aria-pressed=true],.tool-tab:hover{background:color-mix(in srgb, var(--accent), transparent 90%)}.tool-tab svg{color:var(--accent)}.tool-tab strong,.tool-tab small{display:block}.tool-tab small{color:var(--muted);margin-top:4px;line-height:1.35}.tool-panel{min-width:0;padding:clamp(18px,3vw,28px)}.tool-heading{border-bottom:1px solid var(--line);align-items:center;gap:12px;margin-bottom:18px;padding-bottom:18px;display:flex}.tool-heading svg{color:var(--accent)}.tool-heading h2{margin:0;font-size:clamp(1.5rem,3vw,2.25rem);line-height:1}.tool-stack{gap:14px;display:grid}label{color:var(--muted);letter-spacing:.04em;text-transform:uppercase;gap:8px;font-size:.82rem;font-weight:850;display:grid}textarea,input,select{border:1px solid var(--line);width:100%;min-height:44px;color:var(--text);background:#fffffff2;border-radius:8px;padding:11px 12px}textarea{resize:vertical;text-transform:none;min-height:180px;line-height:1.45}textarea:focus,input:focus,select:focus{border-color:var(--accent);outline:3px solid color-mix(in srgb, var(--accent), transparent 82%)}.button-row{flex-wrap:wrap;gap:10px;display:flex}.button-row button,.icon-button{border:1px solid var(--line);min-height:42px;color:var(--text);background:#ffffffe0;border-radius:8px;justify-content:center;align-items:center;gap:8px;padding:0 14px;font-weight:850;display:inline-flex}.button-row button:first-child,.icon-button{border-color:var(--accent);color:#fff;background:var(--accent)}.status-line{color:var(--muted);align-items:center;gap:8px;margin:0;font-weight:800;display:flex}.status-line svg{color:var(--accent)}.result-block,.output-box pre{border:1px solid var(--line);color:#1e2a32;background:var(--surface-soft);white-space:pre-wrap;border-radius:8px;max-height:440px;margin:0;padding:14px;overflow:auto}.split-inputs,.field-grid,.metric-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;display:grid}.field-grid.two{grid-template-columns:repeat(2,minmax(0,1fr))}.field-grid.two label:first-child,.field-grid.two label:nth-child(3),.field-grid.two label:nth-child(5){grid-column:1/-1}.split-inputs.compact textarea{min-height:110px}.output-box{gap:10px;display:grid}.output-box div{justify-content:space-between;align-items:center;gap:12px;display:flex}.output-box span,.metric span{color:var(--muted);letter-spacing:.08em;text-transform:uppercase;font-size:.78rem;font-weight:850}.diff-list{gap:8px;display:grid}.diff-row{border:1px solid var(--line);border-left:4px solid var(--muted);background:#ffffffb8;border-radius:8px;grid-template-columns:92px minmax(0,1fr);gap:8px 12px;padding:12px;display:grid}.diff-row.added{border-left-color:var(--accent)}.diff-row.removed{border-left-color:var(--danger)}.diff-row.changed{border-left-color:var(--warning)}.diff-row strong{text-transform:capitalize}.diff-row code{overflow-wrap:anywhere;color:var(--muted);grid-column:2}.metric{border:1px solid var(--line);background:#ffffffb8;border-radius:8px;padding:16px}.metric strong{margin-top:10px;font-size:2rem;line-height:1;display:block}@media (width<=920px){.tool-layout,.split-inputs,.field-grid,.field-grid.two,.metric-grid{grid-template-columns:1fr}.field-grid.two label:first-child,.field-grid.two label:nth-child(3),.field-grid.two label:nth-child(5){grid-column:auto}}@media (width<=560px){.topbar{align-items:flex-start}.topbar nav{max-width:72vw;overflow-x:auto}.button-row button,.icon-button{width:100%}.diff-row{grid-template-columns:1fr}.diff-row code{grid-column:auto}}
