/*! Chromatic Tuner 2.0.0 | pitchdetector.com */
.pct{--b:#2563eb;--b2:#1d4ed8;--v:#7c3aed;--n:#0f172a;--g:#15803d;--a:#b45309;--r:#b91c1c;--l:#e2e8f0;--m:#475569;--mono:ui-monospace,"SF Mono","Cascadia Mono","Segoe UI Mono",Consolas,monospace;display:grid;gap:12px;max-width:980px;margin:0 auto 1.75em;color:var(--n);line-height:1.45;font-size:16px}
.pct *,.pct *::before,.pct *::after{box-sizing:border-box}
.pct [hidden]{display:none!important}
.pct p,.pct h3{margin:0}
.pct .pct-title{margin:0;font-size:clamp(1.35rem,1.1rem + 1vw,1.75rem);line-height:1.2;color:var(--n)}
.pct .pct-sr{position:absolute!important;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
.pct button{font-family:inherit;text-transform:none;letter-spacing:normal;box-shadow:none;line-height:1.2}
.pct :focus-visible{outline:3px solid var(--v);outline-offset:2px}
.pct .pct-screen :focus-visible{outline-color:#c4b5fd}

/* Hardware: brushed-metal bezel around a black glass screen */
.pct-dev{background:linear-gradient(180deg,#f8fafc 0%,#e2e8f0 55%,#cbd5e1 100%);border:1px solid #cbd5e1;border-radius:22px;padding:10px;box-shadow:inset 0 1px 0 #fff,0 12px 30px rgba(15,23,42,.16)}
@media (min-width:700px){.pct-dev{padding:16px}}
.pct-screen{position:relative;background:radial-gradient(120% 80% at 50% 0%,#0b1433 0%,#030712 60%);color:#e2e8f0;border-radius:14px;border:3px solid #0f172a;box-shadow:inset 0 0 0 1px #1e293b,inset 0 10px 28px rgba(0,0,0,.65);padding:8px 10px 10px;transition:box-shadow .3s}
@media (min-width:700px){.pct-screen{padding:12px 18px 14px}}
.pct-dev[data-state=in] .pct-screen{box-shadow:inset 0 0 0 1px #1e293b,inset 0 10px 28px rgba(0,0,0,.65),0 0 0 3px rgba(74,222,128,.55)}
.pct-hdr{display:flex;justify-content:space-between;align-items:center;gap:8px;margin-bottom:6px}
.pct-leds{display:flex;gap:10px}
.pct-leds i{font-style:normal;font-size:.66rem;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:#334155;transition:color .15s,text-shadow .15s;white-space:nowrap}
.pct-dev[data-dir=flat] .pct-lf,.pct-dev[data-dir=sharp] .pct-ls{color:#fbbf24;text-shadow:0 0 8px rgba(251,191,36,.7)}
.pct-dev[data-state=off][data-dir=flat] .pct-lf,.pct-dev[data-state=off][data-dir=sharp] .pct-ls{color:#f87171;text-shadow:0 0 8px rgba(248,113,113,.7)}
.pct-dev[data-state=in] .pct-li{color:#4ade80;text-shadow:0 0 8px rgba(74,222,128,.8)}
.pct-cal{font:700 .74rem var(--mono);color:#a5b4fc;white-space:nowrap}
.pct-strobe{display:block;width:100%;height:60px;border-radius:8px;background:#020617}
@media (min-width:700px){.pct-strobe{height:92px}}
.pct-mid{display:flex;align-items:center;justify-content:center;gap:14px;margin:6px 0 4px;min-height:74px}
@media (min-width:700px){.pct-mid{gap:28px;min-height:110px}}
.pct-note{display:flex;align-items:flex-start;font-weight:800;font-size:clamp(3.4rem,2.4rem + 5vw,6rem);line-height:.95;color:#f8fafc;min-width:1.6em;justify-content:center;letter-spacing:-.02em;transition:color .15s}
.pct-note small{font-size:.38em;color:#a5b4fc;margin:.2em 0 0 .06em}
.pct-dev[data-state=in] .pct-note{color:#4ade80}
.pct-dev[data-state=close] .pct-note{color:#fbbf24}
.pct-dev[data-state=off] .pct-note{color:#f87171}
.pct-dev[data-state=hold] .pct-note{color:#94a3b8}
.pct-nums{display:flex;flex-direction:column;align-items:flex-start;gap:2px;min-width:0}
.pct-cents{font:700 clamp(1.35rem,1.1rem + 1.4vw,2rem) var(--mono);font-variant-numeric:tabular-nums;color:#f8fafc;white-space:nowrap}
.pct-hz{font:600 clamp(.95rem,.85rem + .5vw,1.15rem) var(--mono);color:#93c5fd;white-space:nowrap}
.pct-meter{margin:2px 0 0}
.pct-segs{position:relative;display:flex;gap:3px;height:16px}
.pct-segs i{flex:1 1 0;border-radius:2px;background:#1e293b;transition:background .08s,box-shadow .08s}
.pct-segs i.pct-s0{background:#14532d}
.pct-segs i[data-on]{background:#93c5fd;box-shadow:0 0 8px rgba(147,197,253,.8)}
.pct-dev[data-state=in] .pct-segs i[data-on]{background:#4ade80;box-shadow:0 0 10px rgba(74,222,128,.9)}
.pct-dev[data-state=close] .pct-segs i[data-on]{background:#fbbf24;box-shadow:0 0 8px rgba(251,191,36,.8)}
.pct-dev[data-state=off] .pct-segs i[data-on]{background:#f87171;box-shadow:0 0 8px rgba(248,113,113,.8)}
.pct-dev[data-state=hold] .pct-segs i[data-on]{background:#64748b;box-shadow:none}
.pct-ptr{position:absolute;top:-4px;bottom:-4px;left:50%;width:2px;margin-left:-1px;background:#f8fafc;border-radius:1px;box-shadow:0 0 4px rgba(255,255,255,.8)}
.pct-dev[data-state=idle] .pct-ptr,.pct-dev[data-state=err] .pct-ptr{opacity:.25}
.pct-lab{display:flex;justify-content:space-between;font:600 .66rem var(--mono);color:#64748b;margin-top:4px}
.pct-cue{text-align:center;font-weight:800;font-size:1rem;margin-top:6px;min-height:1.4em;color:#cbd5e1}
.pct-dev[data-state=in] .pct-cue{color:#4ade80}.pct-dev[data-state=close] .pct-cue{color:#fbbf24}.pct-dev[data-state=off] .pct-cue,.pct-dev[data-state=err] .pct-cue{color:#f87171}.pct-dev[data-state=hold] .pct-cue{color:#94a3b8}
.pct-meta{text-align:center;font-size:.76rem;color:#94a3b8;margin-top:2px;overflow-wrap:anywhere}

/* Start / Stop */
.pct-go-row{display:flex;gap:8px;margin-top:10px}
.pct .pct-go{flex:1 1 auto;display:flex;align-items:center;justify-content:center;gap:10px;min-height:54px;margin:0;padding:0 16px;border:0;border-radius:14px;background:linear-gradient(135deg,var(--b),var(--v));color:#fff;font-size:1.08rem;font-weight:800;cursor:pointer;box-shadow:0 6px 16px rgba(37,99,235,.3)}
.pct .pct-go:hover,.pct .pct-go:focus{background:linear-gradient(135deg,var(--b2),#6d28d9);color:#fff}
.pct .pct-go:disabled{opacity:.6;cursor:wait}
.pct-dot{width:12px;height:12px;border-radius:50%;background:#fff;box-shadow:0 0 0 3px rgba(255,255,255,.35)}
.pct .pct-stop{flex:1 1 auto;min-height:48px;margin:0;padding:0 16px;border-radius:14px;border:1px solid var(--n);background:var(--n);color:#fff;font-size:1rem;font-weight:800;cursor:pointer}
.pct .pct-stop:hover,.pct .pct-stop:focus{background:#1e293b;color:#fff}

/* Hardware controls */
.pct-ctrls{display:grid;gap:8px;grid-template-columns:repeat(auto-fit,minmax(min(100%,250px),1fr));margin-top:10px}
.pct-grp{background:rgba(255,255,255,.72);border:1px solid #cbd5e1;border-radius:12px;padding:8px 10px;display:flex;flex-direction:column;gap:6px;min-width:0}
.pct-gl{font-size:.72rem;font-weight:800;letter-spacing:.05em;text-transform:uppercase;color:var(--m)}
.pct-gl small{text-transform:none;letter-spacing:0;font-weight:600}
.pct-seg{display:flex}
.pct .pct-seg button{flex:1 1 0;min-height:44px;margin:0 0 0 -1px;padding:0 6px;border:1px solid #94a3b8;border-radius:0;background:#fff;color:var(--n);font-size:.95rem;font-weight:800;cursor:pointer}
.pct .pct-seg button:first-child{margin-left:0;border-radius:10px 0 0 10px}
.pct .pct-seg button:last-child{border-radius:0 10px 10px 0}
.pct .pct-seg button:hover,.pct .pct-seg button:focus{background:#eff6ff;color:var(--n)}
.pct .pct-seg button[aria-pressed=true]{background:var(--n);border-color:var(--n);color:#fff;position:relative}
.pct-step{display:flex;gap:6px;align-items:center}
.pct .pct-step button{flex:0 0 46px;min-height:44px;margin:0;padding:0;border-radius:10px;border:1px solid #94a3b8;background:#fff;color:var(--n);font-size:1.2rem;font-weight:700;cursor:pointer}
.pct .pct-step button:hover,.pct .pct-step button:focus{background:#eff6ff;color:var(--n)}
.pct .pct-step input{flex:1 1 auto;min-width:0;width:100%;min-height:44px;margin:0;border:1px solid #94a3b8;border-radius:10px;padding:0 8px;font:700 1rem var(--mono);text-align:center;color:var(--n);background:#fff}
.pct-step span{font-size:.85rem;color:var(--m)}
.pct-quick{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:4px}
.pct .pct-quick button{min-height:44px;margin:0;padding:0 2px;border-radius:10px;border:1px solid #94a3b8;background:#fff;color:var(--n);font:700 .9rem var(--mono);cursor:pointer}
.pct .pct-quick button:hover,.pct .pct-quick button:focus{background:#eff6ff;color:var(--n)}
.pct .pct-quick button[aria-pressed=true]{background:var(--b);border-color:var(--b);color:#fff}
.pct-tonerow{display:flex;gap:6px}
.pct .pct-tonerow select{min-height:44px;margin:0;border:1px solid #94a3b8;border-radius:10px;padding:0 6px;background:#fff;color:var(--n);font:inherit;font-size:.92rem;min-width:0}
.pct .pct-tonerow select:first-of-type{flex:1 1 auto}
.pct .pct-play{flex:0 0 auto;min-height:44px;margin:0;padding:0 12px;border-radius:10px;border:1px solid var(--v);background:#fff;color:#5b21b6;font-size:.92rem;font-weight:800;cursor:pointer;white-space:nowrap}
.pct .pct-play:hover,.pct .pct-play:focus{background:#f5f3ff;color:#5b21b6}
.pct .pct-play[aria-pressed=true]{background:var(--v);color:#fff}
.pct-more{margin-top:8px;background:rgba(255,255,255,.72);border:1px solid #cbd5e1;border-radius:12px}
.pct-more summary{min-height:44px;display:flex;align-items:center;padding:0 12px;cursor:pointer;font-weight:700;font-size:.9rem;color:var(--n)}
.pct-fields{display:grid;gap:10px;grid-template-columns:repeat(auto-fit,minmax(min(100%,220px),1fr));padding:4px 12px 12px}
.pct-f{display:flex;flex-direction:column;gap:4px}
.pct-f label{font-size:.8rem;font-weight:700;color:var(--m)}
.pct .pct-f select{min-height:44px;margin:0;border:1px solid #94a3b8;border-radius:10px;padding:0 8px;background:#fff;color:var(--n);font:inherit;font-size:.92rem;max-width:100%}
.pct-temp{grid-column:1/-1;font-size:.85rem;color:var(--m)}
.pct-status{font-size:.9rem;color:var(--m);background:#f8fafc;border:1px solid var(--l);border-radius:12px;padding:8px 12px}
.pct-status[data-kind=error]{color:var(--r);background:#fef2f2;border-color:#fecaca;font-weight:600}
@media (prefers-reduced-motion:reduce){.pct *{transition:none!important}}