:root{color-scheme:dark;font-family:Inter,system-ui,sans-serif;background:#0e1319;color:#e8eef4}*{box-sizing:border-box}body{margin:0}a{color:#75d4ff}header{display:flex;align-items:center;gap:22px;padding:18px 5%;border-bottom:1px solid #344653;background:#15202a}header img{width:120px;height:64px;object-fit:contain}header strong{font-size:21px}header a:last-child{margin-left:auto}.intro{max-width:1400px;margin:auto;padding:30px 4% 18px}.intro h1{margin:0;font-size:32px}.intro p{color:#b5c8d7}.workspace{display:grid;grid-template-columns:245px minmax(0,1fr);gap:28px;max-width:1400px;padding:0 4% 40px;margin:auto}#tool-list{display:flex;flex-direction:column;gap:5px}#tool-list a{padding:12px;border-radius:6px;text-decoration:none;color:#c1ced9}#tool-list a[aria-current]{background:#174c6e;color:white;border-left:3px solid #46c6ff}.panel{min-width:0;border:1px solid #344653;border-radius:12px;padding:28px;background:#17212b}h2{margin-top:0}#description{color:#adc4d5}#fields{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px;margin:25px 0}label{display:flex;flex-direction:column;gap:8px;font-size:14px;color:#d0e0ec}input,select,textarea{font:inherit;border:1px solid #5e7689;border-radius:6px;background:#0e1822;color:#fff;padding:11px;min-width:0;width:100%}textarea{font:14px/1.5 monospace;resize:vertical}button{border:1px solid #56a6d4;background:#176899;color:white;border-radius:6px;padding:12px 20px;font:600 15px system-ui;cursor:pointer}button:hover{background:#2180b8}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:3px solid #7bd9ff;outline-offset:3px}.actions{display:flex;gap:12px;flex-wrap:wrap}#export{background:#30495f}#error{color:#ffd18e;min-height:24px}#result{overflow:auto;max-height:650px}table{border-collapse:collapse;width:100%;font-size:14px}th,td{padding:12px;text-align:left;border-bottom:1px solid #344653}th{background:#203346;position:sticky;top:0}td:last-child{white-space:pre-wrap;overflow-wrap:anywhere}.added{background:#193b31}.removed{background:#492b32}.same{color:#c1ced9}#note{padding:16px;background:#202f3c;line-height:1.6;border-left:3px solid #dc9d54}details{margin-top:24px;font-size:13px;color:#b3c8d9;line-height:1.6}summary{cursor:pointer}canvas{width:100%;max-width:600px;height:auto;margin-top:18px}footer{padding:24px 4%;text-align:center;color:#94a8b8}#source{overflow-wrap:anywhere}@media(max-width:800px){.workspace{grid-template-columns:1fr}#tool-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}.panel{padding:18px}header{flex-wrap:wrap;gap:12px}header a:last-child{margin-left:0}#fields{grid-template-columns:1fr}.intro h1{font-size:27px}}@media print{header,#tool-list,.actions{display:none}.workspace{display:block}.panel{border:0}#result{max-height:none;overflow:visible}}
