.nb-tool-page { margin-inline: auto; max-width: 1050px; }
.nb-tool-page__description { font-size: 1.1em; }
.nb-tool { background: var(--nb-surface, #fff); border: 1px solid var(--nb-line, #dce2df); border-radius: var(--nb-radius, 6px); box-shadow: var(--nb-shadow, 0 1px 2px rgba(20, 33, 49, .05)); margin: 1.5rem 0; padding: clamp(1rem, 3vw, 1.5rem); }
.nb-tool textarea { border: 1px solid var(--nb-line, #dce2df); border-radius: var(--nb-radius, 6px); box-sizing: border-box; display: block; margin-top: .4rem; min-height: 8rem; padding: .7rem; resize: vertical; width: 100%; }
.nb-tool input[type="number"] { border: 1px solid var(--nb-line, #dce2df); border-radius: var(--nb-radius, 6px); max-width: 9rem; padding: .45rem; }
.nb-tool button { background: var(--nb-blue-600, #416f8b); border: 1px solid var(--nb-blue-600, #416f8b); border-radius: var(--nb-radius, 6px); color: #fff; cursor: pointer; min-height: 42px; padding: .55rem 1rem; }
.nb-tool button:hover { background: var(--nb-navy-800, #2f485d); border-color: var(--nb-navy-800, #2f485d); }
.nb-tool button.nb-secondary { background: var(--nb-tint-blue, #eef3f5); border-color: var(--nb-line, #dce2df); color: var(--nb-ink, #28343b); }
.nb-tool__actions, .nb-inline-fields, .nb-tool-tabs { display: flex; flex-wrap: wrap; gap: .6rem 1rem; margin: 1rem 0; }
.nb-tool-tabs button[aria-selected="false"] { background: var(--nb-tint-blue, #eef3f5); border-color: var(--nb-line, #dce2df); color: var(--nb-ink, #28343b); }
.nb-results { display: grid; gap: .6rem; grid-template-columns: repeat(3, 1fr); }
.nb-results div { background: var(--nb-tint, #f2f5f2); border-radius: var(--nb-radius, 6px); padding: .8rem; }
.nb-results dt { font-size: .85em; }
.nb-results dd { font-size: 1.5em; font-weight: 700; margin: .2rem 0 0; }
.nb-random-picker__result { background: var(--nb-tint-blue, #eef3f5); border: 1px solid var(--nb-blue-600, #416f8b); border-radius: var(--nb-radius, 6px); display: block; font-size: clamp(1.6rem, 5vw, 2.8rem); font-weight: 700; margin: 1rem 0; overflow-wrap: anywhere; padding: 1rem; text-align: center; }
.nb-random-picker__presets { align-items: center; display: flex; flex-wrap: wrap; gap: .45rem; margin-top: 1rem; }
.nb-random-picker__presets button { min-height: 36px; padding: .35rem .7rem; }
.nb-random-picker__candidate-status { color: var(--nb-muted, #68747a); margin-block: .5rem; }
.nb-random-picker__message { color: var(--nb-muted, #68747a); min-height: 1.5em; }
.nb-random-picker__history { max-height: 20rem; overflow: auto; padding-left: 1.5rem; }
.nb-random-picker__history li { border-bottom: 1px solid var(--nb-line, #dce2df); overflow-wrap: anywhere; padding: .4rem 0; }
.nb-random-picker__history time { color: var(--nb-muted, #68747a); font-size: .85em; margin-right: .7rem; }
.nb-tool-error { color: var(--nb-danger, #a14444); min-height: 1.5em; }
.nb-morse-table > div { max-height: 32rem; overflow: auto; }
.nb-morse-table table { border-collapse: collapse; width: 100%; }
.nb-morse-table th, .nb-morse-table td { border-bottom: 1px solid var(--nb-line, #dce2df); padding: .45rem; text-align: left; }
@media (max-width: 600px) { .nb-results { grid-template-columns: 1fr; } .nb-tool button { flex: 1 1 auto; } }