.hz{border:1.5px solid var(--border);border-radius:var(--radius-lg);background:var(--surface);box-shadow:var(--shadow-sm);flex-direction:column;gap:16px;margin:1em 0 1.6em;padding:22px;display:flex}.hz-inputs{grid-template-columns:minmax(0,1fr) auto minmax(0,1.3fr);align-items:start;gap:12px 18px;display:grid}.hz-field{flex-direction:column;gap:8px;min-width:0;display:flex}.hz-field>label,.hz-label{font:700 .85rem var(--font-body);color:var(--ink-soft);text-transform:uppercase;letter-spacing:.04em}.hz-nudge{align-items:center;gap:8px;max-width:340px;display:flex}.hz-nudge button{font:800 1.3rem var(--font-body);border:2px solid var(--border);background:var(--surface);width:44px;height:44px;color:var(--ink);cursor:pointer;border-radius:12px;flex:none}.hz-nudge button:hover{border-color:var(--accent)}.hz-numwrap{border:2px solid var(--border);background:var(--bg-2);border-radius:14px;flex:auto;align-items:center;min-width:0;padding:0 14px;display:flex}.hz-numwrap:focus-within{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft)}.hz-numwrap input{width:100%;min-width:0;color:var(--ink);font:800 2rem/1.2 var(--font-display);background:0 0;border:0;outline:none;flex:1;padding:8px 0}.hz-numwrap span{font:700 1.2rem var(--font-body);color:var(--muted)}.hz-hint{color:var(--muted);margin:0;font-size:.8rem}.hz-err{min-height:1.2em;color:var(--danger-ink);margin:0;font-size:.88rem}.hz-or{font:700 .9rem var(--font-body);color:var(--muted);align-self:center;padding-top:22px}.hz-letters{flex-wrap:wrap;gap:6px;display:flex}.hz-letters button,.hz-accs button,.hz-oct button{font:800 1.05rem var(--font-body);border:2px solid var(--border);background:var(--surface);min-width:40px;height:40px;color:var(--ink);cursor:pointer;border-radius:10px}.hz-letters button[aria-pressed=true],.hz-accs button[aria-pressed=true]{border-color:var(--accent);background:var(--accent);color:#fff}.hz-letters button:hover,.hz-accs button:hover,.hz-oct button:hover{border-color:var(--accent)}.hz-mods{flex-wrap:wrap;align-items:center;gap:8px 16px;display:flex}.hz-accs{gap:6px;display:inline-flex}.hz-oct{align-items:center;gap:6px;display:inline-flex}.hz-oct output{font:700 .95rem var(--font-body);color:var(--ink-soft);text-align:center;min-width:70px}.hz-result{background:var(--bg-2);border-radius:var(--radius-md);grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);align-items:center;gap:16px 24px;padding:18px 22px;display:grid}.hz-show{flex-direction:column;gap:8px;min-width:0;display:flex}.hz-name{font:700 1.2rem var(--font-body);color:var(--muted);margin:0}.hz-name b{font:800 3.4rem/1.05 var(--font-display);color:var(--accent)}.hz-sentence{font:700 1.15rem/1.4 var(--font-body);color:var(--ink);margin:0}.hz-tuning{color:var(--muted);font-size:.85rem;font-weight:600;display:block}.hz-facts{color:var(--ink-soft);margin:0;font-size:.9rem;line-height:1.5}.hz-meter{max-width:340px}.hz-scale{background:var(--surface);border:1.5px solid var(--border);cursor:pointer;touch-action:none;border-radius:8px;height:16px;position:relative}.hz-scale:before{content:"";position:absolute;inset:-14px 0}.hz-scale:after{content:"";background:var(--ink-soft);opacity:.5;width:2px;margin-left:-1px;position:absolute;top:2px;bottom:2px;left:50%}.hz-zone{background:var(--success-soft);width:10%;position:absolute;top:0;bottom:0;left:45%}.hz-needle{background:var(--success);cursor:grab;z-index:1;border-radius:2px;width:4px;margin-left:-2px;transition:left .25s;position:absolute;top:-6px;bottom:-6px}.hz-needle:after{content:"";background:inherit;border:3px solid var(--surface);width:20px;height:20px;box-shadow:var(--shadow-sm);border-radius:50%;margin:-10px 0 0 -10px;position:absolute;top:50%;left:50%}.hz-needle:focus{outline:none}.hz-needle:focus-visible:after{outline:3px solid var(--accent);outline-offset:2px}.hz-meter.hz-off .hz-needle{background:var(--accent)}.hz-dragging .hz-needle{cursor:grabbing;transition:none}.hz-ticks{color:var(--muted);justify-content:space-between;margin-top:9px;font-size:.78rem;display:flex}.hz-meter-hint{color:var(--muted);margin:4px 0 0;font-size:.8rem}.hz-draw{justify-self:center;width:100%;max-width:260px}.hz-staff{width:100%;height:auto;display:block}.hz-line{stroke:var(--staff-line);stroke-width:2px}.hz-clef{fill:var(--staff-line)}.hz-note ellipse{fill:var(--ink)}.hz-note .hz-hole{fill:var(--bg-2)}.hz-acc line{stroke:var(--ink);stroke-width:2px}.hz-acc .hz-bar{stroke-width:5px}.hz-acc .hz-flat{fill:none;stroke:var(--ink);stroke-width:2.5px}.hz-8va{font:italic 800 20px var(--font-body);fill:var(--ink)}.hz-8va tspan{font-size:14px}.hz-8line{fill:none;stroke:var(--ink);stroke-width:2px;stroke-dasharray:6 5}.hz-waves{border-top:1.5px solid var(--border);grid-column:1/-1;margin:0;padding-top:12px}.hz-wave{width:100%;height:96px;display:block}.hz-axis{stroke:var(--border);stroke-width:1.5px}.hz-w-note{fill:none;stroke:var(--ink);stroke-width:2.5px;stroke-dasharray:7 5;opacity:.7}.hz-w-hz{fill:none;stroke:var(--accent);stroke-width:3px}.hz-w-hz,.hz-w-note{transition:stroke-width .15s,opacity .15s}.hz.hz-sound-hz .hz-w-hz,.hz.hz-sound-note .hz-w-note{stroke-width:5px;opacity:1}.hz.hz-sound-hz .hz-w-note,.hz.hz-sound-note .hz-w-hz{opacity:.3}.hz-key{font:700 .85rem var(--font-body);color:var(--ink-soft);gap:18px;margin:6px 0 2px;display:flex}.hz-key span:before{content:"";vertical-align:middle;border-top:3px solid var(--accent);width:22px;height:0;margin-right:6px;display:inline-block}.hz-key .hz-k-note:before{border-top:3px dashed var(--ink);opacity:.7}.hz-waves figcaption{color:var(--ink-soft);font-size:.9rem;line-height:1.45}.hz-row{flex-wrap:wrap;align-items:center;gap:10px;display:flex}.hz-row .btn{padding:10px 18px}.hz-row .btn[hidden]{display:none}.hz-settings{border-top:1.5px solid var(--border);flex-wrap:wrap;align-items:flex-end;gap:14px 26px;padding-top:14px;display:flex}.hz-set{flex-direction:column;gap:6px;display:flex}.hz-seg{flex-wrap:wrap;gap:4px;display:inline-flex}.hz-seg button{font:700 .85rem var(--font-body);border:2px solid var(--border);background:var(--surface);color:var(--ink-soft);cursor:pointer;border-radius:10px;min-height:36px;padding:5px 11px}.hz-seg button[aria-pressed=true]{border-color:var(--accent);color:var(--accent-text);background:var(--accent-soft)}.hz-compact{border-radius:var(--radius-md);box-shadow:none;gap:10px;margin:0;padding:14px}.hz-compact .hz-only-full,.hz-compact .hz-facts,.hz-compact .hz-waves,.hz-compact .hz-hint,.hz-compact .hz-meter-hint,.hz-compact .hz-or{display:none}.hz-compact .hz-inputs{grid-template-columns:1fr;gap:8px}.hz-compact .hz-result{grid-template-columns:minmax(0,1.4fr) minmax(0,1fr);padding:12px 14px}.hz-compact .hz-name b{font-size:2.4rem}.hz-compact .hz-numwrap input{font-size:1.5rem}.hz-tablewrap{border:1.5px solid var(--border);border-radius:var(--radius-md);background:var(--surface);margin:.6em 0 1.4em;overflow-x:auto}.prose .hz-tablewrap table{width:100%;max-width:none;box-shadow:none;font-variant-numeric:tabular-nums;border-collapse:collapse;border:0;border-radius:0;margin:0;font-size:.88rem;display:table;overflow:visible}.prose .hz-tablewrap caption{caption-side:top;text-align:left;color:var(--ink-soft);padding:10px 12px;font-weight:700}.prose .hz-tablewrap th,.prose .hz-tablewrap td{text-align:right;vertical-align:middle;border:0;border-top:1px solid var(--border);white-space:nowrap;padding:0}.prose .hz-tablewrap thead th{background:var(--bg-2);padding:6px 8px;font-size:.9rem}.prose .hz-tablewrap tbody th{text-align:left;background:var(--surface-2);padding:6px 10px;font-weight:800}.prose .hz-tablewrap tbody th,.prose .hz-tablewrap thead th:first-child{z-index:1;position:sticky;left:0}.prose .hz-tablewrap thead th:first-child{background:var(--surface-2);text-align:left}.prose .hz-tablewrap tbody tr:nth-child(n) td{background:0 0}.prose .hz-tablewrap tbody tr:nth-child(n) td.hz-in{background:var(--bg-2)}.prose .hz-tablewrap td.hz-out{color:var(--muted)}.prose .hz-tablewrap td.hz-bold{font-weight:800}.prose .hz-tablewrap tbody tr:nth-child(n) td.hz-cur{background:var(--accent);color:#fff}.hz-tablewrap td button{all:unset;box-sizing:border-box;cursor:pointer;text-align:right;width:100%;padding:6px 8px;display:block}.hz-tablewrap td button:hover{background:var(--accent-soft)}.hz-tablewrap td.hz-cur button:hover{background:0 0}.hz-tablewrap td button:focus-visible{outline:3px solid var(--accent);outline-offset:-3px}.prose .hz-common{columns:2;column-gap:28px}.prose .hz-common li{break-inside:avoid}@media (prefers-reduced-motion:reduce){.hz-needle,.hz-w-hz,.hz-w-note{transition:none}}@media (width<=640px){.hz{border-radius:var(--radius-md);padding:14px}.hz-inputs{grid-template-columns:1fr}.hz-or{padding:0}.hz-result{grid-template-columns:1fr;padding:14px}.hz-name b{font-size:2.8rem}.hz-row .btn{flex:auto;justify-content:center}.hz-draw{max-width:200px}.hz-letters{flex-wrap:nowrap;gap:5px}.hz-letters button{flex:1 1 0;min-width:0}.prose .hz-common{columns:1}}
