.tool-content{padding:0}.hero .highlight-bar p{max-width:880px;margin-left:auto;margin-right:auto}.tool-wrap{max-width:920px;margin:0 auto;padding:40px 24px 72px}.tool-card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-lg);box-shadow:var(--shadow-lg);overflow:hidden}.tool-card-body{padding:28px 32px 32px}.tool-form{flex-direction:column;gap:18px;display:flex}.tool-row{flex-wrap:wrap;gap:12px;display:flex}.tool-label{color:var(--ink);margin-bottom:8px;font-size:16px;font-weight:600;display:block}.tool-input,.tool-textarea,.tool-select{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-sm);box-sizing:border-box;color:var(--ink);font-family:var(--font-mono);flex:1;min-width:220px;padding:12px 14px;font-size:16px;transition:border-color .15s,box-shadow .15s}.tool-select{font-family:var(--font-body)}.tool-textarea{resize:vertical;width:100%;min-height:130px;line-height:1.6}.tool-input:focus,.tool-textarea:focus,.tool-select:focus{border-color:var(--brand);outline:none;box-shadow:0 0 0 3px #2b42ff26}.tool-btn{background:var(--brand);border-radius:var(--radius-sm);box-shadow:var(--shadow-sm);color:#fff;cursor:pointer;white-space:nowrap;border:0;padding:11px 26px;font-family:inherit;font-size:15px;font-weight:600;line-height:24px;transition:background-color .15s ease-in-out,box-shadow .15s ease-in-out,transform .15s ease-in-out;display:inline-block}.tool-btn:hover:not([disabled]){background:var(--brand-strong);box-shadow:var(--shadow-md);transform:translateY(-1px)}.tool-btn:focus-visible{outline-offset:2px;outline:3px solid #2b42ff66}.tool-btn[disabled]{cursor:progress;opacity:.6}.tool-btn--secondary{background:var(--surface-tint);color:var(--brand-strong)}.tool-btn--secondary:hover:not([disabled]){background:var(--border)}.tool-examples{flex-wrap:wrap;align-items:center;gap:8px;margin-top:10px;display:flex}.tool-examples-label{color:var(--ink-soft);font-size:16px}.tool-example{background:var(--surface-tint);border:1px solid var(--border);color:var(--brand-strong);cursor:pointer;font-family:var(--font-mono);border-radius:999px;padding:6px 13px;font-size:13px;line-height:1;transition:background-color .15s,border-color .15s}.tool-example:hover{background:var(--surface);border-color:var(--brand)}.tool-example:focus-visible{outline-offset:2px;outline:3px solid #2b42ff66}.tool-divider{color:var(--ink-soft);letter-spacing:.1em;text-transform:uppercase;align-items:center;gap:16px;font-size:12px;display:flex}.tool-divider:before,.tool-divider:after{background:var(--border);content:"";flex:1;height:1px}.tool-hint{color:var(--ink-soft);margin:0;font-size:16px}.tool-error{border-radius:var(--radius-sm);color:#b32d00;background:#eb3a0014;border:1px solid #eb3a0040;margin-top:16px;padding:12px 16px;font-size:16px;display:none}.tool-error.is-visible{display:block}.tool-result{margin-top:24px;display:none}.tool-result.is-visible{display:block}.tool-kv{grid-template-columns:minmax(140px,max-content) 1fr;gap:10px 24px;margin:0;display:grid}.tool-kv dt{color:var(--ink-soft);font-size:16px}.tool-kv dd{color:var(--ink);font-family:var(--font-mono);overflow-wrap:anywhere;margin:0;font-size:16px}.tool-table-wrap{overflow-x:auto}.tool-table{border-collapse:collapse;width:100%;margin-top:8px;font-size:16px}.tool-table th{border-bottom:2px solid var(--border);color:var(--ink-soft);text-align:left;white-space:nowrap;padding:8px 12px;font-weight:600}.tool-table td{border-bottom:1px solid var(--border);color:var(--ink);vertical-align:top;padding:8px 12px}.tool-table td.mono{font-family:var(--font-mono)}.tool-badge{white-space:nowrap;border-radius:999px;padding:5px 12px;font-size:13px;font-weight:600;line-height:1;display:inline-block}.tool-badge--ok{color:#0d7a41;background:#14aa5a24}.tool-badge--err{color:#b32d00;background:#eb3a001f}.tool-badge--warn{color:#a05e00;background:#eb910029}.tool-badge--muted{background:var(--surface-tint);color:var(--ink-soft)}.tool-spinner{border:3px solid var(--border);border-top-color:var(--brand);border-radius:50%;width:22px;height:22px;margin:24px auto 0;animation:.8s linear infinite tool-spin;display:none}.tool-spinner.is-visible{display:block}@keyframes tool-spin{to{transform:rotate(360deg)}}.tool-about{color:var(--ink-soft);margin:48px auto 0;font-size:16px;line-height:1.75}.tool-about:not(:has(*)){display:none}.tool-about h2{color:var(--ink);text-align:left;margin:0 0 12px;font-size:22px}.tool-try{margin-top:56px}.tool-try-head{justify-content:space-between;align-items:baseline;margin-bottom:20px;display:flex}.tool-try-head h2{color:var(--ink);text-align:left;margin:0;font-size:26px}.tool-try-head a{color:var(--brand-strong);white-space:nowrap;font-size:16px;font-weight:600;text-decoration:none}.tool-try-head a:hover{text-decoration:underline}.tool-try-grid{grid-template-columns:repeat(auto-fit,minmax(320px,1fr));gap:20px;display:grid}.tool-try-card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-md);justify-content:space-between;align-items:center;gap:24px;padding:22px 26px;text-decoration:none;transition:border-color .15s,box-shadow .15s;display:flex}.tool-try-card:hover{border-color:var(--brand);box-shadow:var(--shadow-sm)}.tool-try-body h3{color:var(--ink);text-align:left;margin:0 0 8px;font-size:18px}.tool-try-body p{color:var(--ink-soft);margin:0;font-size:16px;line-height:1.6}.tool-try-cta{color:var(--brand-strong);white-space:nowrap;font-size:16px;font-weight:600}.tool-try-card:hover .tool-try-cta{text-decoration:underline}.tool-bars{flex-direction:column;gap:10px;display:flex}.tool-bar-row{grid-template-columns:minmax(120px,200px) 1fr 64px;align-items:center;gap:12px;display:grid}.tool-bar-label{color:var(--ink);text-overflow:ellipsis;white-space:nowrap;font-size:16px;overflow:hidden}.tool-bar-track{background:var(--surface-tint);border-radius:6px;height:12px;overflow:hidden}.tool-bar-fill{background:var(--brand);border-radius:6px;height:100%}.tool-bar-count{color:var(--ink-soft);font-family:var(--font-mono);text-align:right;font-size:13px}@media only screen and (width<=700px){.tool-wrap{padding:28px 16px 56px}.tool-card-body{padding:20px}.tool-kv{grid-template-columns:1fr}}