/* radix 固有スタイル */
.tool-main { max-width: 760px; }
[hidden] { display: none !important; }

.rd-in { display: grid; grid-template-columns: 1fr; gap: 0.75rem; }
.rd-in input[type="text"] { font-family: ui-monospace, Consolas, "Courier New", monospace; font-size: 1.15rem; }
.rd-from { display: flex; gap: 0.5rem; align-items: center; flex-wrap: wrap; }
.rd-from select { width: auto; }
.rd-from input[type="number"] { width: 5rem; }
.rd-samples { display: flex; flex-wrap: wrap; gap: 0.35rem; margin-top: 0.5rem; }
.rd-samples .btn, .rd-actions .btn { width: auto; margin: 0; }
.rd-actions { display: flex; gap: 0.5rem; align-items: center; flex-wrap: wrap; margin-top: 0.5rem; }

.rd-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 0.6rem; margin-top: 1rem; }
@media (max-width: 520px) { .rd-grid { grid-template-columns: 1fr; } }
.rd-tile { border: 1px solid var(--border); border-radius: var(--pt-r); padding: 0.6rem 0.75rem; background: var(--surface); display: flex; flex-direction: column; gap: 0.25rem; }
.rd-l { font-size: 0.78rem; color: var(--text-sub); }
.rd-v { font-family: ui-monospace, Consolas, "Courier New", monospace; font-size: 1.15rem; font-weight: 600; word-break: break-all; line-height: 1.5; }
.rd-tile .btn { align-self: flex-start; width: auto; margin: 0; }
.rd-custom { display: flex; align-items: center; gap: 0.5rem; margin-top: 0.75rem; font-size: 0.9rem; }
.rd-custom input { width: 5rem; }

.rd-twos { display: grid; gap: 0.3rem; font-size: 0.9rem; }
.rd-twos div { display: flex; justify-content: space-between; gap: 1rem; border-bottom: 1px dotted var(--border); padding: 0.3rem 0; }
.rd-twos b { font-family: ui-monospace, Consolas, "Courier New", monospace; font-weight: 600; text-align: right; word-break: break-all; }

.rd-steps, .rd-table { border-collapse: collapse; font-size: 0.9rem; margin-top: 0.5rem; }
.rd-steps th, .rd-steps td, .rd-table th, .rd-table td { padding: 0.35rem 0.9rem; border-bottom: 1px solid var(--border); text-align: right; font-variant-numeric: tabular-nums; }
.rd-steps thead th, .rd-table thead th, .rd-steps tr:first-child th { font-size: 0.78rem; color: var(--text-sub); font-weight: 600; }
.rd-tablewrap { overflow-x: auto; max-height: 20rem; overflow-y: auto; }
.rd-table { width: 100%; }