:root{--on-tint:100%}:root[data-theme=light]{--on-tint:70%}.tool{--tool-pad:clamp(16px, 2.6vw, 24px);border:1px solid var(--line-strong);border-radius:var(--radius-l);background:var(--surface);box-shadow:var(--shadow-1);position:relative;overflow:hidden}.tool-head{min-height:56px;padding:10px 10px 10px var(--tool-pad);border-bottom:1px solid var(--line);background:linear-gradient(90deg, var(--accent-soft), transparent 55%), var(--bg-2);align-items:center;gap:12px;display:flex}.tool-badge{border:1px solid var(--accent-line);background:var(--accent-soft);width:30px;height:30px;color:var(--accent-strong);font-family:var(--font-mono);border-radius:9px;flex:none;place-items:center;font-size:.72rem;display:inline-grid}.tool-titles{min-width:0}.tool-title{font-family:var(--font-display);font-size:var(--step-0);letter-spacing:-.01em;color:var(--text-strong);font-weight:680;line-height:1.2}.tool-sub{font-size:var(--step--2);color:var(--muted);margin-top:2px;line-height:1.35}.tool-actions{align-items:center;gap:4px;margin-left:auto;display:flex}.tool-reset,.tool-icon-btn{min-width:44px;min-height:44px;color:var(--muted);font-size:var(--step--2);transition:color var(--t) var(--ease), background-color var(--t) var(--ease);border-radius:11px;justify-content:center;align-items:center;gap:6px;padding:0 12px;font-weight:600;display:inline-flex}.tool-reset:hover,.tool-icon-btn:hover{color:var(--text-strong);background:var(--surface-2)}.tool-reset svg,.tool-icon-btn svg{width:16px;height:16px}.tool-body{padding:var(--tool-pad);gap:18px;display:grid}.tool-grid{grid-template-columns:repeat(auto-fit,minmax(min(240px,100%),1fr));gap:14px 16px;display:grid}.tool-field{min-width:0}.tool-field .field-label{justify-content:space-between;align-items:baseline;gap:8px;display:flex}.tool-field .field-hint{font-family:var(--font-mono);color:var(--subtle);font-size:.68rem;font-weight:500}.tool-prefix{border:1px solid var(--line-strong);border-radius:var(--radius-s);background:var(--bg-2);transition:border-color var(--t) var(--ease), box-shadow var(--t) var(--ease);align-items:stretch;display:flex}.tool-prefix:focus-within{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft)}.tool-prefix[data-invalid=true]{border-color:var(--risk);box-shadow:0 0 0 3px var(--risk-soft)}.tool-prefix>span{border-right:1px solid var(--line);font-family:var(--font-mono);color:var(--subtle);place-items:center;padding:0 10px;font-size:.8rem;display:grid}.tool-prefix>.input{background:0 0;border:0;min-width:0;box-shadow:none!important}.tool-chips{flex-wrap:wrap;gap:6px;display:flex}.tool-chip{border:1px solid var(--line);background:var(--bg-2);min-height:36px;color:var(--muted);font-size:var(--step--2);transition:color var(--t) var(--ease), border-color var(--t) var(--ease), background-color var(--t) var(--ease);border-radius:999px;padding:0 12px;font-weight:600}.tool-chip:hover,.tool-chip[aria-pressed=true]{color:var(--text-strong);border-color:var(--accent-line);background:var(--accent-soft)}.tool-out{border:1px solid var(--line);border-radius:var(--radius);background:var(--bg-2);min-width:0}.tool-out-head{border-bottom:1px solid var(--line);align-items:center;gap:10px;min-height:40px;padding:4px 6px 4px 14px;display:flex}.tool-out-label{font-family:var(--font-mono);letter-spacing:.12em;text-transform:uppercase;color:var(--subtle);white-space:nowrap;font-size:.68rem}.tool-out-meta{min-width:0;font-family:var(--font-mono);color:var(--subtle);text-overflow:ellipsis;white-space:nowrap;font-size:.68rem;overflow:hidden}.tool-copy{min-height:36px;color:var(--muted);font-size:var(--step--2);transition:color var(--t) var(--ease), background-color var(--t) var(--ease);border-radius:9px;align-items:center;gap:6px;margin-left:auto;padding:0 10px;font-weight:600;display:inline-flex}.tool-copy:hover{color:var(--text-strong);background:var(--surface-2)}.tool-copy[data-copied=true]{color:var(--good)}.tool-copy svg{width:15px;height:15px}.tool-out-value{font-family:var(--font-mono);font-variant-ligatures:none;color:var(--text-strong);overflow-wrap:anywhere;word-break:break-all;padding:12px 14px 14px;font-size:.86rem;line-height:1.7}.tool-out-value.is-empty{color:var(--subtle);word-break:normal}.tool-bytes{flex-wrap:wrap;gap:4px;display:flex}.tool-byte{background:color-mix(in srgb, var(--f,var(--accent)) 14%, transparent);color:color-mix(in srgb, var(--f,var(--accent-strong)) var(--on-tint), var(--text-strong));font-family:var(--font-mono);border-radius:6px;padding:2px 6px;font-size:.82rem}.tool-stat{font-family:var(--font-mono);font-size:var(--step-2);letter-spacing:-.02em;color:var(--text-strong);font-variant-numeric:tabular-nums;font-weight:560}.tool-error{border:1px solid color-mix(in srgb, var(--risk) 40%, transparent);border-radius:var(--radius-s);background:var(--risk-soft);color:var(--risk);font-size:var(--step--1);align-items:flex-start;gap:8px;padding:10px 14px;display:flex}.tool-ok{color:var(--good)}.tool-hint{font-size:var(--step--1);color:var(--muted)}.tool-foot{padding:12px var(--tool-pad);border-top:1px solid var(--line);font-family:var(--font-mono);color:var(--subtle);flex-wrap:wrap;justify-content:space-between;align-items:center;gap:6px 16px;font-size:.7rem;display:flex}.tool-foot a{color:var(--muted)}.embed{min-height:var(--tool-min,auto)}
