/* Playfair cipher tool */
.tool-in label.pf-inl { display: inline; margin: 0; font-weight: 600; }
.pf-opts { gap: 14px 22px; }
.pf-opts input[type="radio"], #pf-tidyc { width: 18px; height: 18px; accent-color: var(--accent); margin: 0; }
.pf-grid-opts { display: grid; grid-template-columns: repeat(auto-fit, minmax(210px, 1fr)); gap: 4px 16px; margin: 8px 0 12px; }
.pf-grid-opts select, .pf-grid-opts input[type="text"] { width: 100%; box-sizing: border-box; }
#pf-out { background: var(--bg-subtle); font-family: var(--font-mono); letter-spacing: .04em; }
.pf-h { font-size: 18px; margin: 22px 0 6px; }
.pf-wrap { overflow-x: auto; max-width: 100%; }
.pf-sq { border-collapse: collapse; margin: 8px auto; font: 700 18px/1 var(--font-mono); }
.pf-sq td { width: 44px; height: 42px; text-align: center; border: 1px solid var(--line-strong); background: var(--bg-card); color: var(--ink); }
.pf-sq td.pf-key { background: var(--bg-subtle); }
.pf-sq td.pf-a, .pf-sq td.pf-b { background: var(--accent-tint); box-shadow: inset 0 0 0 2px var(--accent); }
.pf-sq td.pf-r { background: var(--accent); color: #fff; }
.pf-st { border-collapse: collapse; width: 100%; font-size: 14px; }
.pf-st th { text-align: left; padding: 4px 8px; font: 600 12px var(--font-sans); color: var(--muted); border-bottom: 1px solid var(--line-strong); }
.pf-st td { padding: 5px 8px; border-bottom: 1px solid var(--line); vertical-align: top; }
.pf-st tbody tr { cursor: pointer; }
.pf-st tbody tr:hover, .pf-st tbody tr:focus { background: var(--accent-tint); outline: none; }
.pf-st code, .pf-res code, #pf-prep code, #pf-raw code { font-family: var(--font-mono); font-weight: 700; }
.pf-nt { display: block; font-size: 12px; color: var(--muted); }
.pf-res { margin-top: 12px; padding: 12px; border: 1px solid var(--accent); border-radius: var(--radius-md); background: var(--bg-card); }
.pf-res h3 { margin: 0 0 8px; font-size: 16px; }
.pf-resrow { display: flex; flex-wrap: wrap; gap: 8px 20px; align-items: flex-start; }
.pf-resrow .pf-sq td { width: 34px; height: 32px; font-size: 15px; }
.pf-restext { flex: 1 1 260px; min-width: 0; }
.pf-restext p { margin: 4px 0; overflow-wrap: anywhere; }
.pf-pt { word-break: break-word; }
.pf-pmsg { font: 600 18px/1.7 var(--font-mono); word-break: break-word; white-space: pre-wrap; color: #0f172a; min-height: 1.7em; border-bottom: 1px solid #94a3b8; }
.pf-sh { margin: 14px 0 4px; font-weight: 700; color: #0f172a; }
.pf-lines { border-bottom: 1px solid #64748b; height: 30px; }
.pf-sheet .pf-sq td { background: #fff; color: #0f172a; border-color: #64748b; }
.pf-sheet .pf-sq td.pf-key { background: #e2e8f0; }
@media (max-width: 480px) {
  .pf-sq td { width: 38px; height: 36px; font-size: 15px; }
  .pf-sheet { padding: 20px 12px; }
  .pf-st th, .pf-st td { padding: 4px 4px; }
}
@media print {
  .pf-sq { font-size: 15pt; }
  .pf-sq td { border-color: #000 !important; background: #fff !important; color: #000 !important; width: 32pt; height: 28pt; }
  .pf-sq td.pf-key { background: #ddd !important; }
  .pf-pmsg, .pf-sh { color: #000; }
  .pf-pmsg { font-size: 14pt; border-color: #000; }
  .pf-lines { height: 26pt; border-color: #000; }
}