:root{--bg:#fff;--soft:#f9fafb;--border:#e5e7eb;--text:#111827;--muted:#6b7280;--shadow:0 8px 24px rgba(0,0,0,.06);--radius:16px;--btn:#111827;--btnText:#fff;--warnBg:#fffbeb;--warnBd:#fde68a;--warnText:#92400e;--okBg:#ecfdf5;--okBd:#bbf7d0;--okText:#166534;--errBg:#fef2f2;--errBd:#fecaca;--errText:#991b1b}*{box-sizing:border-box}body{margin:0;font-family:system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial,"Noto Sans JP",Meiryo,sans-serif;background:var(--bg);color:var(--text);line-height:1.6}button{font:inherit}button:disabled{opacity:.48;cursor:not-allowed}.nw-header{position:sticky;top:0;z-index:10;background:rgba(255,255,255,.92);backdrop-filter:saturate(180%) blur(10px);border-bottom:1px solid var(--border)}.nw-header-inner{max-width:1200px;margin:0 auto;padding:10px 16px}.nw-logo{font-weight:700;color:var(--text);text-decoration:none}.nw-main{max-width:760px;margin:0 auto;padding:18px 14px 32px}h1{margin:14px 0 8px;font-size:clamp(28px,6vw,36px);line-height:1.15}h2{margin:0 0 10px;font-size:16px}p{margin:0}.nw-desc{margin:0 0 14px;color:var(--muted);font-size:14px}.nw-lang-switch{display:flex;gap:8px;margin:10px 0}.nw-lang-switch button{border:1px solid var(--border);background:var(--bg);color:var(--text);padding:8px 12px;border-radius:999px;font-size:13px;cursor:pointer}.nw-lang-switch button.active,.nw-lang-switch button:hover{background:var(--soft);font-weight:700}.nw-ad{border:1px dashed var(--border);background:var(--soft);border-radius:12px;padding:14px;color:var(--muted);font-size:12px;text-align:center}.ad-top{margin:14px 0 16px}.ad-bottom{margin:20px 0 14px}.notice-card,.meter-section,.faq-section,.nw-donate{border:1px solid var(--border);background:var(--bg);border-radius:var(--radius);box-shadow:var(--shadow);padding:14px}.notice-card{margin:14px 0}.notice-card.warning{background:var(--warnBg);border-color:var(--warnBd);color:var(--warnText)}.notice-card p,.notice-card li,.small-note,.meter-note{color:var(--muted);font-size:13px}.notice-card.warning li{color:var(--warnText)}.notice-card ul{margin:8px 0 0;padding-left:1.2em}.notice-card li+li{margin-top:6px}.meter-section{margin-top:16px}.mic-controls,.snapshot-actions{display:flex;flex-direction:column;gap:10px}.primary-btn,.secondary-btn,.segment-controls button,.link-btn{appearance:none;border:1px solid var(--border);border-radius:12px;padding:12px 14px;font-size:15px;cursor:pointer;width:100%}.primary-btn{background:var(--btn);color:var(--btnText);border-color:var(--btn);font-weight:700}.secondary-btn{background:var(--soft);color:var(--text);font-weight:700}.secondary-btn:hover,.link-btn:hover{background:#eceef1}.secondary-btn.danger{background:var(--errBg);border-color:var(--errBd);color:var(--errText)}.link-btn{background:transparent;border-radius:999px;padding:10px 12px;font-size:13px;margin-top:12px}.mic-status{margin-top:12px;border:1px solid var(--border);background:var(--soft);border-radius:12px;padding:10px 12px;color:var(--muted);font-size:13px}.mic-status.ok{background:var(--okBg);border-color:var(--okBd);color:var(--okText)}.mic-status.error{background:var(--errBg);border-color:var(--errBd);color:var(--errText)}.voice-activity{margin-top:12px;border:1px solid #f3f4f6;border-radius:12px;background:var(--soft);padding:10px 12px;display:flex;align-items:center;gap:10px}.voice-activity p{font-size:13px;color:var(--muted)}.voice-activity.silent{display:none}.voice-activity .bars{display:flex;align-items:flex-end;gap:4px;height:18px;width:32px}.voice-activity .bars span{display:block;width:6px;height:6px;border-radius:4px;background:var(--text);opacity:.9;transform-origin:bottom}.voice-activity.active .bars span:nth-child(1){animation:vu 650ms infinite ease-in-out}.voice-activity.active .bars span:nth-child(2){animation:vu 520ms infinite ease-in-out}.voice-activity.active .bars span:nth-child(3){animation:vu 720ms infinite ease-in-out}@keyframes vu{0%{height:6px;opacity:.55}35%{height:18px;opacity:.95}70%{height:9px;opacity:.8}100%{height:6px;opacity:.55}}.realtime-meter{border-top:1px solid #f3f4f6;margin-top:14px;padding-top:14px}.meter-item{border:1px solid #f3f4f6;background:var(--soft);border-radius:12px;padding:12px;margin:10px 0}.meter-item label{display:block;font-size:12px;color:var(--muted);margin-bottom:8px}#volumeValue,#pitchValue,#noteValue{font-variant-numeric:tabular-nums}#pitchValue{font-size:20px;font-weight:700;margin-top:2px}#noteValue{font-size:14px;color:var(--muted);margin-top:2px}.meter-note{margin-top:8px}.meter-bar{height:12px;border-radius:999px;background:#f3f4f6;overflow:hidden;border:1px solid var(--border)}#volumeBar{height:100%;width:0;background:var(--text);border-radius:999px;transition:width 80ms linear}#volumeValue{margin-top:8px;font-size:14px;font-weight:700}#spectrumCanvas{width:100%;max-width:100%;height:auto;display:block;border:1px solid var(--border);border-radius:12px;background:#fff}.snapshot-actions{margin-top:12px}.small-note{margin-top:10px}.snapshot-list{margin-top:12px;border:1px solid #f3f4f6;border-radius:12px;background:var(--soft);padding:10px 12px}.snapshot-list summary{cursor:pointer;font-weight:700;font-size:13px;color:var(--text)}#snapshotItems{margin-top:10px;display:flex;flex-direction:column;gap:10px}.empty-note{margin:8px 0 0;color:var(--muted);font-size:13px}.snapshot-card{border:1px solid var(--border);background:#fff;border-radius:12px;padding:10px}.snapshot-card .meta{font-size:12px;color:var(--muted);margin-bottom:6px}.snapshot-card .vals{font-size:13px;font-variant-numeric:tabular-nums}.snapshot-card .actions{margin-top:8px;display:flex;justify-content:flex-end}.snapshot-card .delete{appearance:none;border:1px solid var(--border);background:var(--soft);border-radius:999px;padding:7px 10px;font-size:12px;cursor:pointer}.segment-section{margin-top:14px;border-top:1px solid #f3f4f6;padding-top:14px}.segment-controls{display:flex;gap:10px;margin-top:10px}.segment-controls button{width:50%;background:var(--bg);font-weight:700}.segment-result{margin-top:12px;border:1px solid #f3f4f6;background:var(--soft);border-radius:12px;padding:12px;font-size:13px;color:var(--text);font-variant-numeric:tabular-nums}.segment-result .muted{color:var(--muted);font-size:12px}.faq-section{margin-top:20px}.faq-section details{border-top:1px solid #f3f4f6;padding:12px 0}.faq-section details:first-of-type{border-top:0}.faq-section summary{cursor:pointer;font-weight:700;font-size:14px}.faq-section p{margin-top:8px;color:var(--muted);font-size:13px}.nw-donate{margin:20px 0;box-shadow:none;text-align:center}.nw-donate-text{color:var(--muted);font-size:13px;margin-bottom:10px}.nw-donate-links{display:flex;justify-content:center;gap:10px;flex-wrap:wrap}.nw-donate-links a{display:inline-flex;align-items:center;justify-content:center;min-width:120px;padding:10px 14px;border-radius:999px;border:1px solid var(--border);background:var(--soft);text-decoration:none;color:var(--text);font-weight:700;font-size:13px}.nw-links{margin:14px 0 0;display:grid;grid-template-columns:1fr;gap:8px}.nw-links a{color:var(--text);text-decoration:none;border:1px solid var(--border);border-radius:12px;padding:10px 12px;display:block;background:var(--bg);font-size:13px}.nw-footer{border-top:1px solid var(--border);padding:18px 16px;color:var(--muted);font-size:12px;text-align:center}.nw-footer-line+.nw-footer-line{margin-top:6px}.nw-footer a{color:var(--text)}.hidden{display:none!important}@media(max-width:480px){.segment-controls{flex-direction:column}.segment-controls button{width:100%}}@media(min-width:768px){.nw-main{max-width:860px;padding:24px 18px 36px}.notice-card,.meter-section,.faq-section,.nw-donate{padding:18px}.mic-controls,.snapshot-actions{flex-direction:row;align-items:center}.primary-btn,.secondary-btn{width:auto;min-width:220px}.nw-links{grid-template-columns:repeat(4,minmax(0,1fr))}}@media(min-width:1200px){.nw-main{max-width:900px;padding:28px 18px 42px}.nw-header-inner{padding:12px 18px}}