/*! Frequency Detector 2.0.0 | pitchdetector.com | measuring-instrument design */
.pfd{--pfd-blue:#2563eb;--pfd-blue2:#1d4ed8;--pfd-violet:#7c3aed;--pfd-ink:#0f172a;--pfd-panel:#0b1220;--pfd-edge:#1e293b;--pfd-dim:#94a3b8;--pfd-muted:#475569;--pfd-line:#e2e8f0;--pfd-tint:#eff6ff;--pfd-ok:#4ade80;--pfd-amb:#fbbf24;--pfd-bad:#f87171;box-sizing:border-box;max-width:1100px;margin:0 auto 1.75em;color:var(--pfd-ink);font-family:inherit;line-height:1.5}
.pfd *,.pfd *::before,.pfd *::after{box-sizing:border-box}.pfd [hidden]{display:none!important}
.pfd .pfd-title{margin:0 0 8px;padding:0;font-size:1.25rem;line-height:1.25;font-weight:700;color:var(--pfd-ink);letter-spacing:normal;text-transform:none}
/* The device: dark instrument panel with a digital readout */
.pfd-stage{background:var(--pfd-panel);color:#e2e8f0;border-radius:16px;padding:14px;display:grid;gap:12px;border:1px solid var(--pfd-edge);box-shadow:inset 0 0 0 1px rgba(255,255,255,.03),0 10px 30px rgba(15,23,42,.18);position:relative;overflow:hidden}
.pfd-stage::before{content:"";position:absolute;left:0;right:0;top:0;height:3px;background:linear-gradient(90deg,var(--pfd-blue),var(--pfd-violet))}
.pfd-read{background:#060b16;border:1px solid var(--pfd-edge);border-radius:12px;padding:14px 12px 12px;text-align:center}
.pfd .pfd-hz{margin:0;font:700 3.4rem/1 ui-monospace,"SFMono-Regular",Consolas,"Liberation Mono",monospace;color:#fff;font-variant-numeric:tabular-nums;display:flex;justify-content:center;align-items:baseline;gap:8px;letter-spacing:-.02em;text-shadow:0 0 18px rgba(124,58,237,.45)}
.pfd .pfd-hz small{font:700 1.1rem/1 system-ui,sans-serif;color:var(--pfd-dim)}
.pfd .pfd-sub{margin:10px 0 0;font-size:1rem;color:#e2e8f0;display:flex;justify-content:center;gap:8px;flex-wrap:wrap;align-items:center}
.pfd-note{font-weight:700}
.pfd .pfd-cents{display:inline-block;border:1px solid var(--pfd-edge);border-radius:6px;padding:1px 8px;font:700 .85rem/1.5 ui-monospace,Consolas,monospace;color:var(--pfd-dim)}
.pfd .pfd-cents[data-state="in"]{color:var(--pfd-ok);border-color:rgba(74,222,128,.4)}.pfd .pfd-cents[data-state="close"]{color:var(--pfd-amb);border-color:rgba(251,191,36,.4)}.pfd .pfd-cents[data-state="off"]{color:var(--pfd-bad);border-color:rgba(248,113,113,.4)}
.pfd .pfd-kind{margin:6px 0 0;font-size:.8rem;letter-spacing:.04em;text-transform:uppercase;color:var(--pfd-dim)}
.pfd-actions{display:flex;gap:10px;flex-wrap:wrap}
.pfd .pfd-btn{appearance:none;display:inline-flex;align-items:center;justify-content:center;margin:0;border:2px solid var(--pfd-blue);background:#fff;color:var(--pfd-blue2);font:700 1rem/1.1 inherit;font-family:inherit;min-height:44px;padding:0 18px;border-radius:10px;cursor:pointer;box-shadow:none;text-transform:none;letter-spacing:normal}
.pfd .pfd-btn:hover:not(:disabled){background:var(--pfd-tint)}.pfd .pfd-btn:disabled{opacity:.45;cursor:not-allowed}
.pfd .pfd-start{flex:1 1 160px;min-height:52px;font-size:1.1rem;background:linear-gradient(135deg,var(--pfd-blue),var(--pfd-violet));border:0;color:#fff}
.pfd .pfd-start:hover:not(:disabled){background:linear-gradient(135deg,var(--pfd-blue2),var(--pfd-violet))}
.pfd .pfd-start.is-on,.pfd .pfd-start.is-on:hover:not(:disabled){background:#fff;color:#b91c1c}
.pfd .pfd-stage .pfd-ghost{background:transparent;color:#e2e8f0;border-color:var(--pfd-edge);min-height:52px;flex:0 1 120px}
.pfd .pfd-stage .pfd-ghost:hover:not(:disabled){background:#111a2e}
.pfd .pfd-stage .pfd-ghost[aria-pressed="true"]{background:#e2e8f0;color:var(--pfd-ink)}
.pfd .pfd-fig{margin:0;border:1px solid var(--pfd-edge);border-radius:12px;padding:6px;background:var(--pfd-panel)}
.pfd-fig canvas{display:block;width:100%;height:190px}
.pfd .pfd-fig figcaption{font-size:.78rem;color:var(--pfd-dim);padding:4px 2px 0}
.pfd .pfd-status{margin:10px 2px;font-size:.9rem;color:var(--pfd-muted)}.pfd .pfd-status[data-kind="error"]{color:#b91c1c;font-weight:600}
/* Measurements under the device */
.pfd .pfd-stats{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin:0 0 12px}
.pfd .pfd-stats div{background:#fff;border:1px solid var(--pfd-line);border-left:3px solid var(--pfd-blue);border-radius:10px;padding:8px 12px;min-width:0}
.pfd .pfd-stats dt{font-size:.75rem;letter-spacing:.03em;text-transform:uppercase;color:var(--pfd-muted);margin:0}
.pfd .pfd-stats dd{margin:0;font:700 1.05rem/1.3 ui-monospace,Consolas,monospace;font-variant-numeric:tabular-nums;overflow-wrap:anywhere}
.pfd-grid{display:grid;gap:12px;margin:0 0 12px}
.pfd .pfd-card{background:#fff;border:1px solid var(--pfd-line);border-radius:12px;padding:12px 14px;margin:0}
.pfd .pfd-card h3{margin:0 0 8px;padding:0;font-size:1rem;font-weight:700;color:var(--pfd-ink);letter-spacing:normal;text-transform:none}
.pfd .pfd-peaks{margin:0;padding-left:1.4em;font-variant-numeric:tabular-nums}.pfd .pfd-peaks li{margin:3px 0}.pfd .pfd-peaks strong{font-family:ui-monospace,Consolas,monospace}.pfd .pfd-peaks small{color:var(--pfd-muted)}
.pfd .pfd-peaks li.pfd-empty{list-style:none;margin-left:-1.4em;color:var(--pfd-muted)}
.pfd .pfd-fig2 canvas{display:block;width:100%;height:170px}.pfd .pfd-fig2 figcaption{font-size:.8rem;color:var(--pfd-muted);padding-top:4px}
.pfd .pfd-settings{margin:0 0 12px}.pfd .pfd-settings summary{cursor:pointer;font-weight:700}
.pfd-fields{display:grid;gap:12px;margin-top:10px}.pfd-field{display:grid;gap:4px;min-width:0}.pfd-field label{font-weight:600;font-size:.9rem}
.pfd .pfd-field select,.pfd .pfd-field input{width:100%;min-height:44px;border:1px solid #cbd5e1;border-radius:10px;padding:0 10px;font:inherit;background:#fff;color:var(--pfd-ink)}
.pfd-row{display:flex;flex-wrap:wrap;gap:8px;align-items:center}.pfd-small{font-size:.8rem;color:var(--pfd-muted)}
.pfd-sr{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;margin:0}
.pfd :focus-visible{outline:3px solid var(--pfd-violet);outline-offset:2px}.pfd .pfd-stage :focus-visible{outline-color:#fff}
@media (min-width:700px){.pfd .pfd-stats{grid-template-columns:repeat(5,minmax(0,1fr))}.pfd-grid{grid-template-columns:1fr 1.4fr}.pfd-fields{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (min-width:900px){.pfd-stage{grid-template-columns:minmax(0,1fr) minmax(0,1.5fr);grid-template-areas:"read fig" "act fig";padding:18px}.pfd-read{grid-area:read}.pfd-actions{grid-area:act}.pfd .pfd-fig{grid-area:fig}.pfd .pfd-hz{font-size:4.4rem}.pfd-fig canvas{height:230px}}