.tool{gap:20px;margin-top:28px;display:grid}.tool-grid{grid-template-columns:1fr 1fr;gap:14px;display:grid}.tool-drop{border:1px dashed var(--line);background:var(--card);cursor:pointer;border-radius:14px;gap:6px;min-width:0;padding:22px 18px;display:grid;position:relative}.tool-drop:hover,.tool-drop--active,.tool-drop:focus-within{border-color:var(--amber);background:var(--card-2)}.tool-drop__label{color:var(--fg);font-weight:600}.tool-drop__file{color:var(--muted);overflow-wrap:anywhere;font-size:13px}.tool-drop__input{opacity:0;cursor:pointer;width:100%;position:absolute;inset:0}.tool-row{flex-wrap:wrap;align-items:center;gap:12px 16px;display:flex}.tool-label{color:var(--fg);font-size:14px;font-weight:600}.tool-range{accent-color:var(--amber);flex:160px}.tool-example{margin-left:auto}.tool-fields{grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;display:grid}.tool-field{gap:6px;min-width:0;display:grid}.tool-input{border:1px solid var(--line);background:var(--bg-2);width:100%;color:var(--fg);border-radius:10px;padding:10px 12px;font-size:15px}.tool-input:focus{outline:2px solid var(--amber);outline-offset:1px}.tool-hint,.tool-muted{color:var(--muted);font-size:13px;line-height:1.55}.tool-error{color:var(--pink);font-size:14px}.tool-result{gap:16px;min-width:0;display:grid}.tool-verdict{color:var(--fg);flex-wrap:wrap;align-items:center;gap:10px;font-size:15.5px;line-height:1.6;display:flex}.tool-badge{border-radius:999px;padding:3px 10px;font-size:13px;font-weight:700;display:inline-block}.tool-badge--changed{color:#ff8cc4;background:#ff3d9a29}.tool-badge--same{color:var(--green);background:#2bd17e24}.tool-table{border-collapse:collapse;width:100%;font-size:14px}.tool-table caption{text-align:left;margin-bottom:8px}.tool-table th,.tool-table td{border-bottom:1px solid var(--line-soft);text-align:left;vertical-align:top;color:var(--muted);padding:10px 12px}.tool-table th{color:var(--fg);font-weight:600}.tool-table thead th{color:var(--faint);text-transform:uppercase;letter-spacing:.04em;font-size:12px}.tool-table a{color:var(--amber)}.tool-row--us th,.tool-row--us td{background:#f5a6230d}.tool-tabs{flex-wrap:wrap;gap:8px;display:flex}.tool-tab{border:1px solid var(--line);color:var(--muted);font:inherit;cursor:pointer;background:0 0;border-radius:999px;padding:7px 14px;font-size:13px}.tool-tab--on{border-color:var(--amber);color:var(--fg)}.tool-canvas{border:1px solid var(--line);background:#fff;border-radius:10px;max-width:100%;height:auto;display:block}.tool-steps{counter-reset:tool-step;gap:12px;margin:0;padding:0;list-style:none;display:grid}.tool-steps li{counter-increment:tool-step;color:var(--muted);padding-left:34px;line-height:1.6;position:relative}.tool-steps li:before{content:counter(tool-step);width:22px;height:22px;color:var(--amber);background:#f5a62324;border-radius:50%;place-items:center;font-size:12px;font-weight:700;display:grid;position:absolute;top:1px;left:0}.tool-steps strong{color:var(--fg)}@media (max-width:720px){.tool-grid,.tool-fields{grid-template-columns:1fr 1fr}.tool-example{margin-left:0}.tool-table thead{clip:rect(0 0 0 0);width:1px;height:1px;position:absolute;overflow:hidden}.tool-table tr{border-bottom:1px solid var(--line-soft);gap:4px;padding:12px 0;display:grid}.tool-table th,.tool-table td{border:0;padding:0 4px;display:block}.tool-table td[data-label]:before{content:attr(data-label) ": ";color:var(--muted);font-family:var(--sora)}}@media (max-width:480px){.tool-grid{grid-template-columns:1fr}}
