/* Morse code translator */
.tool-in label.mo-inl { display: inline; margin: 0; font-weight: 600; }
.mo-opts { gap: 10px 18px; align-items: center; }
.mo-opts input[type="radio"], .mo-opts input[type="checkbox"] { width: 18px; height: 18px; accent-color: var(--accent); margin: 0; }
.mo-sel { display: inline-flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.mo-sel select, .mo-sel input[type="number"] { font: 600 15px var(--font-sans); padding: 6px 8px; border: 1px solid var(--line-strong); border-radius: var(--radius-md); background: var(--bg-canvas); color: var(--ink); }
.mo-sel input[type="number"] { width: 84px; }
#mo-in, #mo-out, #mo-tap, #mo-hear-text { font-family: var(--font-mono); }
#mo-out, #mo-hear-text { background: var(--bg-subtle); }
.mo-h { margin: 26px 0 8px; font-size: 18px; }
.mo-panel { border: 1px solid var(--line); border-radius: var(--radius-md); background: var(--bg-card); padding: 14px; }
.mo-ctl { display: grid; grid-template-columns: auto 1fr; gap: 8px 14px; align-items: center; margin: 10px 0; }
.mo-ctl label { margin: 0; font-weight: 600; white-space: nowrap; }
.mo-ctl input[type="range"] { width: 100%; min-width: 0; accent-color: var(--accent); }
.mo-lamp { height: 34px; border-radius: var(--radius-md); background: var(--bg-muted); border: 1px solid var(--line-strong); transition: background .03s; margin-top: 8px; }
.mo-lamp.on { background: #fde047; box-shadow: 0 0 28px 6px rgba(253, 224, 71, .75); border-color: #eab308; }
.mo-hidefile { position: absolute; width: 1px; height: 1px; opacity: 0; overflow: hidden; }
.mo-filebtn { cursor: pointer; }
.mo-hidefile:focus + * , .mo-hidefile:focus-visible ~ * { outline: none; }
.mo-code { font-family: var(--font-mono); word-break: break-word; }
.mo-big { font-size: 18px; min-width: 96px; }
.mo-key { display: block; width: 100%; margin: 10px 0; padding: 22px 12px; font: 700 17px var(--font-sans); color: var(--ink); background: var(--bg-subtle); border: 2px dashed var(--line-strong); border-radius: var(--radius-lg); cursor: pointer; touch-action: none; user-select: none; -webkit-user-select: none; }
.mo-key small { display: block; font-weight: 400; color: var(--muted); margin-top: 4px; font-size: 13px; }
.mo-key.down, .mo-key:active { background: var(--accent-tint); border-color: var(--accent); }
.mo-tapout { font-family: var(--font-mono); font-size: 18px; word-break: break-word; }
.mo-sheet h3 { margin: 14px 0 6px; font-size: 15px; color: #0f172a !important; }
.mo-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(92px, 1fr)); gap: 6px; }
.mo-cell { display: flex; align-items: baseline; gap: 8px; padding: 5px 8px; border: 1px solid #cbd5e1; border-radius: 6px; font-family: ui-monospace, Menlo, Consolas, monospace; color: #0f172a !important; }
.mo-cell b { font-size: 18px; min-width: 1.1em; }
.mo-cell.wide b { min-width: 2.2em; font-size: 15px; }
.mo-cell span { font-size: 14px; letter-spacing: 1px; }
.mo-note { margin: 14px 0 0; font-size: 12px; color: #475569 !important; text-align: center; }
@media (max-width: 480px) { .mo-grid { grid-template-columns: repeat(auto-fill, minmax(84px, 1fr)); } .mo-big { min-width: 80px; } }
@media print { .mo-grid { grid-template-columns: repeat(5, 1fr); } .mo-cell { break-inside: avoid; } .mo-sheet { max-width: none !important; margin: 0 !important; } }
