/* /morse-code-translator/ page styles. Built from /assets/polyatic.css tokens only (no new colours or fonts). */
.nojs{margin:1.25rem 0 0;padding:0.875rem 1rem;border:1px solid var(--line);border-left:0.25rem solid var(--accent);border-radius:0.625rem;background:var(--surface);color:var(--ink);font-size:0.9375rem;line-height:1.6}
.mc-head .sub{margin-bottom:1rem}
@media(max-width:520px){.mc-head h1{margin-bottom:0.25rem}.mc-head .sub{font-size:0.9375rem;margin-bottom:0.75rem}}
@media(min-width:920px){.mc-duo{grid-template-columns:minmax(0,1.3fr) minmax(20rem,.8fr)}}

.mc-stage,.mc-decode,.mc-practice{padding:1rem;display:grid;gap:0.75rem;align-content:start}
@media(max-width:520px){.mc-stage,.mc-decode,.mc-practice{padding:0.75rem;gap:0.625rem}}
.mc-stage .k,.mc-decode .k,.mc-practice .k{font-family:var(--mono);font-size:0.6875rem;font-weight:500;text-transform:uppercase;letter-spacing:.06em;color:var(--muted)}
.mc-h{margin:0;font-size:1.0625rem;font-weight:650;letter-spacing:-.01em}
.mc-practice{margin-top:1.375rem}

.mc-boxes{display:grid;gap:0.625rem}
@media(min-width:640px){.mc-boxes{grid-template-columns:1fr 1fr}}
.mc-box{display:grid;gap:0.3125rem;min-width:0}
.mc-box textarea{width:100%;min-height:4.25rem;resize:vertical;font-size:1rem;line-height:1.5}
.mc-box .mc-code{font-family:var(--mono);letter-spacing:.04em}
@media(min-width:640px){.mc-box textarea{min-height:8rem}}
.mc-flag{margin:0;min-height:1.125rem;font-size:0.8125rem;line-height:1.4;color:var(--muted);overflow-wrap:anywhere}
.mc-flag.bad{color:var(--bad);font-weight:600}

.mc-actions{display:flex;flex-wrap:wrap;gap:0.5rem;align-items:center}
.mc-actions .chip{padding:0.5rem 0.75rem}
.mc-file{display:inline-flex;align-items:center;justify-content:center}
.mc-file:focus-within,.mc-actions .chip:focus-visible{outline:3px solid var(--accent);outline-offset:2px}
.mc-help{margin:0;font-size:0.8125rem;line-height:1.5;color:var(--muted)}
.mc-help b{color:var(--ink-2)}
#playmsg:empty{display:none}

.mc-settings{display:grid;grid-template-columns:1fr 1fr;gap:0.75rem 1rem}
@media(max-width:380px){.mc-settings{grid-template-columns:1fr}}
.mc-settings .field .head{margin-bottom:0.25rem}
.mc-settings select{width:100%}
.mc-out{display:flex;align-items:center;justify-content:space-between;gap:0.75rem;flex-wrap:wrap}
.mc-checks{display:flex;flex-wrap:wrap;gap:0.375rem 1rem}
.mc-lampwrap{display:flex;align-items:center;gap:0.625rem;min-width:0}
.mc-lamp{width:3rem;height:3rem;flex:none;border-radius:0.5rem;border:1px solid var(--line-2);background:var(--surface-2);cursor:pointer;padding:0}
.mc-lamp.on{background:var(--signal);border-color:var(--signal);box-shadow:0 0 1.5rem var(--signal)}
.mc-lamp:fullscreen{width:100vw;height:100vh;border-radius:0;border:0}
.mc-lamp:focus-visible{outline:3px solid var(--accent);outline-offset:2px}
.mc-now{font-family:var(--mono);font-size:0.9375rem;font-weight:600;white-space:pre;color:var(--ink-2);min-width:5rem}

.mc-tone{display:flex;flex-wrap:wrap;align-items:center;gap:0.5rem 1rem}
.mc-hz{display:flex;align-items:center;gap:0.375rem;font-size:0.875rem}
.mc-hz input{width:5.5rem;font-family:var(--mono)}
.mc-hz input:disabled{opacity:.6}
.mc-decode .meter{margin:0}
.mc-status{margin:0;font-size:0.875rem;line-height:1.5;color:var(--ink-2)}
.mc-readout{min-height:3.25rem}
.mc-readout .val{font-size:1.25rem}
.mc-decmorse{margin:0;font-family:var(--mono);font-size:0.8125rem;color:var(--muted);overflow-wrap:anywhere;max-height:6rem;overflow-y:auto}
.mc-decmorse:empty{display:none}

.mc-prow{display:flex;flex-wrap:wrap;gap:0.5rem;align-items:center}
#pform .k{flex-basis:100%}
#pguess{flex:1;min-width:8rem;font-family:var(--mono);font-size:1rem;text-transform:uppercase}
.mc-presult{margin:0;min-height:1.25rem;font-family:var(--mono);font-size:0.9375rem;white-space:pre-wrap;overflow-wrap:anywhere}
.mc-presult.good{color:var(--ok);font-weight:600}
.mc-presult.bad{color:var(--bad);font-weight:600}

/* the ITU table in the explainer */
.mc-tables{display:grid;gap:1rem;grid-template-columns:repeat(auto-fit,minmax(9rem,1fr));align-items:start}
.mc-tables .mc-ref{margin:0;width:100%}
.mc-tables .mc-ref:nth-child(n+3){grid-column:1/-1}
.mc-ref caption{text-align:left;font-weight:650;padding-bottom:0.375rem}
.mc-ref th[scope=row]{font-family:var(--mono);font-weight:600;width:3.5rem}
.mc-ref code{white-space:nowrap;letter-spacing:.06em}
.mc-src{font-size:0.8125rem;color:var(--muted)}
@media(prefers-reduced-motion:reduce){.mc-lamp.on{box-shadow:none}}
