.tool-header{margin-bottom:24px;padding-bottom:20px;border-bottom:1px solid var(--border)}.tool-breadcrumb{font-family:var(--mono);font-size:11px;color:var(--text-mute);margin-bottom:8px}.tool-breadcrumb a{color:var(--text-mute)}.tool-breadcrumb a:hover{color:var(--text-dim)}.tool-breadcrumb .accent{color:var(--accent)}.tool-title{font-size:24px;font-weight:700;letter-spacing:-.02em;margin-bottom:6px}.tool-desc{color:var(--text-dim);font-size:14px;max-width:640px}.tool-grid{display:grid;grid-template-columns:1fr;gap:16px}@media (min-width: 900px){.tool-grid.split{grid-template-columns:1fr 1fr}}.panel{background:var(--bg-panel);border:1px solid var(--border);border-radius:var(--radius);overflow:hidden}.panel-head{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:10px 14px;background:var(--bg-elev);border-bottom:1px solid var(--border);font-family:var(--mono);font-size:11px;text-transform:uppercase;letter-spacing:.08em;color:var(--text-dim)}.panel-head .actions{display:flex;gap:4px;flex-wrap:wrap}.panel-body{padding:14px}.small-btn{padding:4px 10px;background:transparent;border:1px solid var(--border-2);border-radius:4px;color:var(--text-dim);font-family:var(--mono);font-size:11px;transition:all .1s;white-space:nowrap}.small-btn:hover{color:var(--accent);border-color:var(--accent-dim)}.small-btn.active{color:var(--accent);border-color:var(--accent-dim);background:var(--accent-bg-soft)}.btn{padding:8px 16px;background:var(--accent);border:1px solid var(--accent);border-radius:var(--radius);color:#0e0e10;font-family:var(--sans);font-weight:600;font-size:13px;transition:all .12s}.btn:hover{background:var(--accent-2);border-color:var(--accent-2)}.btn.ghost{background:transparent;color:var(--text-dim);border-color:var(--border-2);font-weight:500}.btn.ghost:hover{color:var(--accent);border-color:var(--accent-dim)}.code-input,.code-output,.text-input{width:100%;padding:12px;background:var(--input-bg);border:1px solid var(--border);border-radius:4px;color:var(--text);font-family:var(--mono);font-size:13px;line-height:1.6;outline:none;transition:border-color .15s}.code-input,.code-output{background:var(--code-bg);color:var(--code-text);border-color:var(--code-border)}.code-input{min-height:180px;resize:vertical}.code-input:focus,.text-input:focus{border-color:var(--accent-dim)}.text-input{padding:9px 12px}.code-output{white-space:pre-wrap;word-break:break-all;overflow-y:auto;max-height:420px;min-height:40px}.field{margin-bottom:14px}.field:last-child{margin-bottom:0}.field-label{display:block;font-family:var(--mono);font-size:11px;text-transform:uppercase;letter-spacing:.08em;color:var(--text-mute);margin-bottom:6px}.row{display:flex;gap:8px;align-items:center;flex-wrap:wrap}.row.tight{gap:4px}select.text-input{cursor:pointer;appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%2371717a' stroke-width='2'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 10px center;padding-right:30px}.seg{display:inline-flex;border:1px solid var(--border-2);border-radius:var(--radius);overflow:hidden}.seg button{padding:6px 12px;background:transparent;border:none;color:var(--text-dim);font-family:var(--mono);font-size:12px;border-right:1px solid var(--border-2)}.seg button:last-child{border-right:none}.seg button.active{background:var(--accent-bg-strong);color:var(--accent)}.seg button:hover:not(.active){color:var(--text);background:var(--bg-elev)}.kv{display:grid;grid-template-columns:minmax(120px,max-content) 1fr;gap:8px 16px;font-family:var(--mono);font-size:13px}.kv .k{color:var(--text-mute)}.kv .v{color:var(--text);word-break:break-all}.kv .v.accent{color:var(--accent)}.err{color:var(--error)}.ok{color:var(--alive)}.muted{color:var(--text-mute)}.warn{color:var(--warn)}.hint{font-family:var(--mono);font-size:11px;color:var(--text-mute);margin-top:8px;line-height:1.6}.privacy-note{display:flex;align-items:center;gap:8px;margin-top:16px;padding:8px 12px;background:var(--accent-bg-soft);border:1px solid var(--accent-dim);border-radius:var(--radius);font-family:var(--mono);font-size:11px;color:var(--text-dim)}.privacy-note svg{flex-shrink:0;color:var(--accent)}.check{display:inline-flex;align-items:center;gap:6px;cursor:pointer;font-family:var(--mono);font-size:13px;color:var(--text-dim);user-select:none}.check input{accent-color:var(--accent);width:15px;height:15px;cursor:pointer}.json-key{color:var(--accent)}.json-string{color:#86efac}.json-number{color:var(--warn)}.json-bool{color:#f472b6}.json-null{color:var(--text-mute)}.copy-btn{font-family:var(--mono);font-size:11px;background:var(--bg-elev);color:var(--text-dim);border:1px solid var(--border);border-radius:4px;padding:3px 9px;cursor:pointer;flex-shrink:0;transition:all .12s}.copy-btn:hover{color:var(--text);border-color:var(--border-2)}.copy-btn.copied{color:var(--accent);border-color:var(--accent-dim);background:var(--accent-bg-soft)}.copy-flash{animation:copy-flash .7s ease;border-radius:4px}@keyframes copy-flash{0%{background:var(--accent-bg-strong);color:var(--accent-2)}to{background:transparent}}.hash-row{display:flex;align-items:center;gap:12px;padding:8px 0;border-bottom:1px solid var(--border)}.hash-row:last-child{border-bottom:none}.hash-label{font-family:var(--mono);font-size:11px;text-transform:uppercase;letter-spacing:.04em;color:var(--text-mute);width:84px;flex-shrink:0}.hash-val{font-family:var(--mono);font-size:12px;color:var(--text);word-break:break-all;flex:1;padding:2px 4px}
