:root{color-scheme:dark;--bg:#0b1120;--surface:#111b2b;--border:#293547;--text:#eff4f7;--muted:#9faec0;--faint:#687b90;--accent:#84edca;--accent-dark:#071c1a;--font:Inter,ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;min-height:100vh;background:var(--bg);font-family:var(--font);color:var(--text);-webkit-font-smoothing:antialiased}button,input{font:inherit}button{cursor:pointer}a{color:inherit}button:focus-visible,input:focus-visible,a:focus-visible,summary:focus-visible{outline:3px solid var(--accent);outline-offset:4px}button:disabled{opacity:.55;cursor:not-allowed}svg{display:block}p{line-height:1.62}.container{max-width:1164px;margin:0 auto;padding:0 28px}.page-glow{position:absolute;z-index:-1;pointer-events:none;left:0;right:0;top:0;height:790px;background:radial-gradient(ellipse 50% 50% at 67% 34%,rgba(30,103,100,.16),transparent 76%)}
.site-header{border-bottom:1px solid #2531449c}.header-inner{height:82px;display:flex;align-items:center;justify-content:space-between;gap:25px}.wordmark{text-decoration:none;display:flex;align-items:center;gap:12px;font-size:17px;font-weight:850;letter-spacing:.065em;white-space:nowrap}.mark{height:37px;width:37px;display:grid;place-items:center;border-radius:11px;background:#18352f;color:var(--accent)}.mark svg{width:29px;height:29px}.brand-light{color:var(--accent)}.brand-dot{color:#7ee5c1}.site-header nav{display:flex;align-items:center;gap:34px}.site-header nav a{font-size:13px;text-decoration:none;color:#a5b3c2;transition:color .2s}.site-header nav a:hover,.footer-inner a:hover{color:var(--accent)}.header-tag{display:flex;align-items:center;gap:10px;padding:9px 13px;border:1px solid #2d3d47;border-radius:40px;color:#bdcdd0;font-size:11px;white-space:nowrap}.dot{height:6px;width:6px;background:#7ee6be;border-radius:50%;box-shadow:0 0 10px rgba(132,237,202,.7)}
.hero{padding:81px 0 53px}.eyebrow{display:flex;align-items:center;gap:12px;color:var(--accent);font-size:10px;font-weight:750;letter-spacing:.23em}.eyebrow-line{width:25px;height:1px;background:var(--accent)}.hero h1{margin:20px 0 16px;font-weight:750;letter-spacing:-.055em;font-size:clamp(42px,5.8vw,76px);line-height:1.08}.hero h1 em{font-style:normal;color:var(--accent)}.hero-lead{max-width:630px;margin:0;color:#aebdca;font-size:15px;line-height:1.8}.hero-specs{display:flex;gap:24px;flex-wrap:wrap;margin-top:25px}.hero-specs span{display:flex;gap:8px;align-items:center;color:#b8c9d2;font-size:12px}.hero-specs svg{width:18px;height:18px;color:#7edbc3}
.workspace{display:grid;grid-template-columns:minmax(0,1.03fr) minmax(0,.97fr);gap:20px;scroll-margin-top:28px}.panel{background:linear-gradient(160deg,#162235,#111b2b 62%);border:1px solid #2a394c;border-radius:16px;box-shadow:0 15px 45px #02091022}.control-panel{padding:30px 32px 26px}.panel-header,.visual-header{display:flex;align-items:flex-start;justify-content:space-between;gap:10px;margin-bottom:32px}.panel-index{font-size:10px;color:#738ca0;font-weight:750;letter-spacing:.17em}.panel h2{margin:8px 0 0;font-size:19px;font-weight:700;letter-spacing:-.025em}.control-status{display:flex;gap:8px;align-items:center;background:#1b293b;padding:9px 11px;border:1px solid #324358;border-radius:50px;font-size:11px;color:#a6b9c5}.status-led{height:7px;width:7px;border-radius:50%;background:#8598a9}.control-status.is-playing{color:#b1ffdc;border-color:#346951;background:#173729}.control-status.is-playing .status-led{background:var(--accent);box-shadow:0 0 9px #8cf5ce}
.field-label{font-size:11px;font-weight:750;letter-spacing:.145em;color:#b8cbd8}.frequency-top{display:flex;align-items:center;justify-content:space-between}.range-hint{font-size:11px;color:#7c91a5}.frequency-control{display:flex;gap:10px;margin-top:13px;align-items:stretch}.step-button{width:52px;flex-shrink:0;border-radius:9px;background:#1b2a3d;border:1px solid #354a5e;color:#cde1e7;font-size:24px;transition:background .2s}.step-button:hover{background:#263b50}.frequency-input-wrap{display:flex;align-items:center;position:relative;flex:1;min-width:0;background:#0e1828;border:1px solid #355169;border-radius:9px;box-shadow:inset 0 0 0 1px #1b3443}.frequency-input-wrap:focus-within{border-color:var(--accent)}.frequency-input-wrap input{min-width:0;width:100%;background:transparent;border:0;outline:none!important;padding:11px 62px 11px 15px;font-size:42px;font-weight:650;color:#f0fbfc;letter-spacing:-.06em;appearance:textfield;-moz-appearance:textfield}.frequency-input-wrap input::-webkit-inner-spin-button,.frequency-input-wrap input::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}.frequency-unit{position:absolute;right:19px;top:50%;transform:translateY(-50%);font-size:14px;color:#8ca5b7}.range-container{margin-top:22px}.frequency-range,.volume-row input{appearance:none;-webkit-appearance:none;display:block;width:100%;height:6px;border-radius:6px;border:0;background:linear-gradient(90deg,var(--accent) 0,var(--accent) var(--fill,45%),#334153 var(--fill,45%),#334153 100%);cursor:pointer;outline:none}.frequency-range::-webkit-slider-thumb,.volume-row input::-webkit-slider-thumb{appearance:none;-webkit-appearance:none;width:18px;height:18px;background:var(--accent);border:3px solid #14273a;border-radius:50%;box-shadow:0 0 0 1px var(--accent)}.frequency-range::-moz-range-thumb,.volume-row input::-moz-range-thumb{width:13px;height:13px;background:var(--accent);border:3px solid #14273a;border-radius:50%;box-shadow:0 0 0 1px var(--accent)}.range-labels{display:flex;justify-content:space-between;color:#7f94a6;font-size:10px;margin-top:13px}.field-help{color:#7f93a5;font-size:11px;margin:13px 0 0}.presets-wrap{margin-top:26px}.presets{display:flex;gap:8px;flex-wrap:wrap;margin-top:12px}.preset{font-size:12px;color:#a4bacb;border:1px solid #36485b;background:#1b293b;border-radius:7px;padding:9px 13px}.preset:hover,.preset.active{color:#baffdf;border-color:#4e977e;background:#1b3b36}.panel-separator{border-top:1px solid #304153;margin:29px 0 25px}.waveform-title{margin-bottom:12px}.waveform-selector{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:9px}.wave-button{display:flex;flex-direction:column;gap:10px;align-items:center;justify-content:center;min-width:0;padding:15px 5px 13px;border:1px solid #34465a;border-radius:9px;color:#a1b7c6;background:#182638;font-size:11px}.wave-button svg{width:70%;max-width:80px;height:27px;overflow:visible}.wave-button svg path{fill:none;stroke:currentColor;stroke-width:1.8;stroke-linejoin:round;stroke-linecap:round}.wave-button:hover{background:#253a4b}.wave-button.active{border-color:#5faa91;background:#193c36;color:var(--accent)}.volume-control{margin-top:29px}.volume-label{display:flex;align-items:center;justify-content:space-between}.volume-label output{font-size:13px;font-weight:650;color:var(--accent);font-variant-numeric:tabular-nums}.volume-row{display:flex;gap:13px;align-items:center;margin-top:17px}.volume-row svg{width:18px;height:18px;flex-shrink:0;color:#7c93a5}.play-button{display:flex;align-items:center;justify-content:center;gap:12px;margin-top:28px;width:100%;min-height:57px;border:0;border-radius:9px;background:var(--accent);color:#08251d;font-size:15px;font-weight:750;box-shadow:0 3px 18px #6ee5b91f;transition:background .2s,transform .2s}.play-button:hover{background:#a1f6d7;transform:translateY(-1px)}.play-button svg{width:19px;height:19px}.play-button .stop-icon{display:none}.play-button.playing{background:#f2bd8c;color:#322219}.play-button.playing:hover{background:#ffcea0}.play-button.playing .stop-icon{display:block}.play-button.playing .play-icon{display:none}.play-shortcut{margin-left:auto;margin-right:16px;color:#31765f;background:#8fe4c221;border-radius:4px;padding:4px 6px;font-size:9px;letter-spacing:.08em}.play-button.playing .play-shortcut{color:#75452b;background:#fff4e24c}.play-button .play-icon{margin-left:auto}.play-button .stop-icon{margin-left:auto}.safety-note{display:flex;align-items:flex-start;gap:10px;margin-top:19px;color:#91a3b5;font-size:11px;line-height:1.55}.safety-note svg{width:15px;height:15px;flex-shrink:0;color:#e3b46e;margin-top:1px}.error-message{font-size:12px;color:#ffc2b6;background:#542f2b65;border:1px solid #884c46;padding:12px;border-radius:6px}
.visual-column{display:flex;flex-direction:column;gap:18px;min-width:0}.visual-panel{padding:30px 26px 0}.visual-header{margin-bottom:24px}.visual-live{display:flex;align-items:center;gap:7px;color:#8298aa;font-size:10px;font-weight:650;letter-spacing:.12em}.visual-live-dot{border-radius:50%;background:#637789;width:6px;height:6px}.visual-live.active{color:var(--accent)}.visual-live.active .visual-live-dot{background:var(--accent);box-shadow:0 0 9px #86eec7}.visual-stage{position:relative;height:274px;border-radius:9px;background:#0c1726;overflow:hidden;border:1px solid #25384b}.visual-stage canvas{height:100%;width:100%;display:block}.visual-centerline{pointer-events:none;position:absolute;top:50%;left:0;right:0;border-top:1px dashed #64857930}.visual-stage-label{position:absolute;bottom:15px;left:17px;right:17px;display:flex;justify-content:space-between;font-size:10px;letter-spacing:.12em;color:#70869a}.visual-footer{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));margin:25px 0 26px}.visual-footer>div{display:flex;flex-direction:column;gap:10px;padding-left:18px;border-left:1px solid #344357;min-width:0}.visual-footer>div:first-child{padding-left:0;border:0}.metric-name{font-size:9px;color:#7c92a6;font-weight:750;letter-spacing:.15em}.metric-value{font-size:17px;color:#dae9f0;font-weight:650;letter-spacing:-.03em;white-space:nowrap}.metric-value small{font-size:12px;color:#8a9eb1}.info-card{display:flex;align-items:flex-start;gap:15px;padding:22px 20px;border:1px solid #2c443f;border-radius:11px;background:#132b2b}.info-icon{flex-shrink:0;color:var(--accent);border-radius:10px;background:#24433d;padding:10px}.info-icon svg{height:20px;width:20px}.info-card strong{font-size:13px;color:#d5f8e7}.info-card p{font-size:12px;color:#9aadaa;margin:7px 0 0;line-height:1.65}
.content-section{padding-top:100px;scroll-margin-top:36px}.section-heading h2{font-size:clamp(26px,3.1vw,35px);margin:18px 0 8px;letter-spacing:-.04em}.section-heading>p{color:#9aafc0;margin:0;font-size:14px}.steps-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin-top:30px}.step-card{padding:26px;background:#101c2c;border:1px solid #28394d;border-radius:12px}.step-number{font-size:12px;font-weight:700;color:var(--accent)}.step-card h3{margin:24px 0 10px;font-size:16px;letter-spacing:-.02em}.step-card p{font-size:13px;color:#9bafc0;margin:0}.wave-guide{padding-top:88px}.wave-guide-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin-top:28px}.wave-guide-grid>div{border-radius:9px;background:#111e2e;border:1px solid #2a384a;padding:22px 24px}.wave-guide-grid strong{font-size:14px;color:#dbe9f0}.wave-guide-grid p{font-size:13px;color:#9caebf;margin:8px 0 0}.faq-section{padding-bottom:95px}.faq-list{margin-top:28px;border-top:1px solid #2b3949}.faq-list details{border-bottom:1px solid #2b3949;padding:2px 0}.faq-list summary{cursor:pointer;list-style:none;padding:20px 26px 20px 0;font-weight:600;font-size:14px;position:relative}.faq-list summary::-webkit-details-marker{display:none}.faq-list summary:after{content:"+";position:absolute;right:5px;top:17px;color:var(--accent);font-size:24px;font-weight:300}.faq-list details[open] summary:after{content:"−"}.faq-list details p{margin:-1px 40px 20px 0;color:#9cafbf;font-size:13px}.site-footer{border-top:1px solid #283748;background:#0b1422}.footer-inner{display:flex;justify-content:space-between;gap:20px;align-items:center;min-height:76px;font-size:11px;color:#7d90a2}.footer-inner a{color:#9db8b2;text-decoration:none}
[hidden]{display:none!important}
@media(max-width:960px){.header-tag{display:none}.workspace{grid-template-columns:minmax(0,1fr)}.visual-column{display:grid;grid-template-columns:minmax(0,1.7fr) minmax(0,1fr);align-items:start}.visual-stage{height:210px}.visual-footer{margin:19px 0}.info-card{display:block}.info-icon{display:inline-block;margin-bottom:10px}.info-card p{font-size:11px}.hero{padding:65px 0 42px}.content-section{padding-top:72px}.control-panel{padding:28px}}
@media(max-width:680px){.container{padding:0 17px}.header-inner{height:65px}.site-header nav{gap:13px}.site-header nav a{font-size:11px}.site-header nav a:nth-child(2){display:none}.mark{height:32px;width:32px}.wordmark{font-size:14px;gap:8px}.hero{padding:52px 0 36px}.hero h1{font-size:clamp(38px,10.4vw,58px);margin:17px 0}.hero-lead{font-size:13px}.hero-specs{gap:13px 18px;margin-top:19px}.hero-specs span{font-size:11px}.workspace{gap:14px}.control-panel{padding:22px 19px}.panel-header{margin-bottom:26px}.panel h2{font-size:17px}.frequency-input-wrap input{font-size:39px}.step-button{width:45px}.preset{font-size:11px;padding:8px 9px}.wave-button{padding:13px 2px;font-size:10px}.waveform-selector{gap:6px}.visual-column{display:flex}.visual-panel{padding:22px 18px 0}.visual-header{margin-bottom:19px}.visual-stage{height:230px}.visual-footer{margin:21px 0}.info-card{display:flex;padding:17px}.info-icon{margin:0}.step-card{padding:21px}.steps-grid,.wave-guide-grid{grid-template-columns:1fr;gap:10px}.step-card h3{margin:13px 0 7px}.content-section{padding-top:66px}.wave-guide{padding-top:59px}.faq-section{padding-bottom:68px}.footer-inner{flex-wrap:wrap;padding:24px 17px;gap:12px}.footer-inner>span:nth-child(2){order:3;flex-basis:100%}}
@media(max-width:370px){.hero-specs{gap:12px}.site-header nav{gap:10px}.site-header nav a{font-size:10px}.visual-footer>div{padding-left:11px}.metric-value{font-size:15px}.frequency-control{gap:7px}.presets{gap:6px}.preset{padding:7px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{animation-duration:.01ms!important;transition-duration:.01ms!important}}


/* V1.1: task-first layout. Keep playback controls visible before optional settings. */
.site-header .header-inner { height: 66px; }
.hero { padding: 29px 0 22px; }
.hero h1 { margin: 0 0 8px; font-size: clamp(38px, 4.2vw, 54px); line-height: 1.12; }
.hero-lead { max-width: 740px; font-size: 14px; line-height: 1.55; }
.workspace { grid-template-columns: minmax(0, 1.12fr) minmax(0, .88fr); align-items: start; }
.control-panel { padding: 24px 27px 25px; }
.panel-header { margin-bottom: 19px; align-items: center; }
.panel h2 { margin: 0; font-size: 20px; }
.frequency-control { margin-top: 9px; }
.frequency-input-wrap input { font-size: 40px; padding-top: 8px; padding-bottom: 8px; }
.range-container { margin-top: 15px; }
.range-labels { margin-top: 9px; }
.volume-control { margin-top: 23px; }
.volume-row { margin-top: 10px; }
.play-button { margin-top: 19px; min-height: 55px; }
.safety-note { margin-top: 12px; }
.secondary-controls { border-top: 1px solid #304153; margin-top: 23px; padding-top: 19px; }
.presets-wrap { margin-top: 0; }
.presets { margin-top: 10px; }
.panel-separator { margin: 19px 0 17px; }
.wave-button { padding: 11px 5px 10px; gap: 6px; }
.wave-button svg { height: 22px; }
.visual-panel { padding: 23px 23px 0; }
.visual-header { margin-bottom: 15px; align-items: center; }
.visual-stage { height: 164px; }
.visual-footer { margin: 17px 0 19px; }
.visual-footer > div { gap: 6px; }
.metric-value { font-size: 15px; }
.info-card { padding: 15px 18px; }
.info-icon { padding: 7px; }
.info-icon svg { width: 17px; height: 17px; }
.info-card p { margin-top: 4px; }
.content-section { padding-top: 77px; }
.wave-guide { padding-top: 70px; }

@media (max-width: 960px) {
  .workspace { grid-template-columns: minmax(0, 1fr); }
  .visual-column { display: grid; grid-template-columns: minmax(0, 1.65fr) minmax(0, 1fr); align-items: start; }
  .visual-stage { height: 170px; }
  .hero { padding: 28px 0 21px; }
}
@media (max-width: 680px) {
  .site-header .header-inner { height: 60px; }
  .hero { padding: 23px 0 20px; }
  .hero h1 { font-size: clamp(32px, 8.5vw, 40px); margin: 0 0 7px; }
  .hero-lead { font-size: 12px; line-height: 1.5; }
  .control-panel { padding: 20px 18px; }
  .panel-header { margin-bottom: 16px; }
  .panel h2 { font-size: 18px; }
  .frequency-input-wrap input { font-size: 36px; }
  .frequency-control { margin-top: 8px; }
  .range-container { margin-top: 14px; }
  .volume-control { margin-top: 19px; }
  .play-button { margin-top: 17px; min-height: 54px; }
  .safety-note { margin-top: 11px; }
  .secondary-controls { margin-top: 19px; padding-top: 18px; }
  .wave-button { padding: 10px 2px; }
  .visual-column { display: flex; }
  .visual-panel { padding: 19px 18px 0; }
  .visual-stage { height: 145px; }
  .visual-footer { margin: 15px 0 17px; }
  .info-card { padding: 13px 16px; }
  .content-section { padding-top: 58px; }
  .wave-guide { padding-top: 57px; }
}

/* Align the main play action independently of its optional keyboard hint. */
.play-button { position: relative; }
.play-button .play-icon, .play-button .stop-icon { margin-left: 0; }
.play-shortcut { position: absolute; right: 16px; margin: 0; }
@media (max-width: 680px) { .play-shortcut { display: none; } }

/* V3: task-oriented sweep and channel tests; primary generator layout is unchanged. */
.site-header nav{gap:22px}
.tools-section{padding-top:67px;scroll-margin-top:26px}
.tools-heading{display:flex;justify-content:space-between;align-items:end;gap:24px;margin-bottom:21px}
.tools-heading h2{font-size:clamp(26px,3.2vw,35px);letter-spacing:-.04em;margin:12px 0 6px}
.tools-heading p{max-width:730px;margin:0;color:#9faec0;font-size:14px;line-height:1.65}
.tool-chip{flex-shrink:0;border:1px solid #345448;background:#152b2b;border-radius:50px;padding:9px 13px;color:#9ceac8;font-size:11px}
.sweep-layout{display:grid;grid-template-columns:minmax(0,1.13fr) minmax(0,.87fr);gap:16px;align-items:stretch}
.sweep-card,.sweep-monitor{padding:25px 26px}
.sweep-fields{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:11px}
.setting-field{display:grid;grid-template-columns:1fr auto;gap:9px;color:#b8cbd8;font-size:10px;font-weight:750;letter-spacing:.08em;align-items:center}
.setting-field span{color:#8297a7;font-size:11px;text-transform:none}
.setting-field input{grid-column:1/-1;min-width:0;width:100%;padding:12px 13px;color:#eefaf8;background:#0e1828;border:1px solid #355169;border-radius:8px;font-size:20px;font-weight:650;letter-spacing:0;font-variant-numeric:tabular-nums}
.tool-hint{margin:17px 0 0;color:#96a9b9;font-size:12px}
.sweep-start-button{margin-top:17px;min-height:49px;font-size:14px}
.triangle-glyph{font-size:13px}
.sweep-action-row{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px;margin-top:11px}
.utility-button{display:inline-flex;align-items:center;justify-content:center;gap:7px;border:1px solid #43685b;background:#1c3e37;color:#c0f7dc;border-radius:8px;min-height:43px;padding:9px 14px;font-size:12px;font-weight:680;text-align:center}
.utility-button:hover:not(:disabled){background:#2a594b;border-color:#7cc4a9}
.utility-button:disabled{opacity:.38}
.subtle-button{background:#1c293a;border-color:#3b4b5f;color:#b2c5d2}
.subtle-button:hover:not(:disabled){background:#29384a;border-color:#69849a}
.tool-message{min-height:36px;margin:13px 0 0;color:#9bb6ba;font-size:12px;line-height:1.5}
.monitor-top{display:flex;align-items:center;justify-content:space-between;gap:10px}
.monitor-state{color:#84edca;font-size:10px;letter-spacing:.1em;font-weight:750}
.monitor-frequency{margin:20px 0 16px;color:#f0fbfc;font-size:clamp(45px,5vw,65px);font-weight:680;letter-spacing:-.055em;line-height:1.1;font-variant-numeric:tabular-nums}
.monitor-frequency span{font-size:20px;color:#92a7b7;font-weight:500;letter-spacing:0}
.progress-track{height:8px;border-radius:10px;background:#304154;overflow:hidden}
.progress-track>span{display:block;height:100%;width:0;background:var(--accent);border-radius:10px;transition:width .08s linear}
.progress-ends{display:flex;justify-content:space-between;color:#8497ab;font-size:11px;margin-top:11px}
.marked-tone{border-top:1px solid #2e4053;margin-top:25px;padding-top:21px;display:flex;flex-direction:column;gap:8px}
.marked-tone strong{font-size:20px;font-weight:650;color:#e3f7eb;font-variant-numeric:tabular-nums}
.sweep-monitor>p{font-size:12px;color:#9daebc;line-height:1.55;margin:15px 0 0}
.speaker-section{padding-top:67px}
.check-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
.check-card{border:1px solid #2a394c;background:#111d2d;border-radius:13px;padding:23px 25px}
.check-card h3{font-size:17px;margin:0 0 8px;letter-spacing:-.018em}
.check-card p{min-height:44px;color:#9daebd;font-size:12px;margin:0 0 17px;line-height:1.6}
.check-buttons{display:flex;gap:9px;flex-wrap:wrap}
.check-buttons .utility-button{flex:1;min-width:110px}
.check-footer{margin-top:14px;border:1px solid #2a394c;background:#0e1929;border-radius:9px;display:flex;justify-content:space-between;align-items:center;gap:16px;padding:10px 12px 10px 17px;color:#a6b8c6;font-size:12px}
.check-footer .utility-button{min-height:36px}
.disclaimer{color:#8398aa;font-size:11px;margin:13px 0 0}
@media(max-width:960px){.tools-section{padding-top:60px}.sweep-layout{grid-template-columns:minmax(0,1fr)}.sweep-monitor{min-height:240px}.marked-tone{margin-top:19px;padding-top:16px}}
@media(max-width:680px){.site-header nav{gap:13px}.site-header nav a:nth-child(3){display:none}.tools-section,.speaker-section{padding-top:53px}.tools-heading{align-items:start}.tools-heading p{font-size:12px}.tools-heading h2{font-size:27px}.tool-chip{display:none}.sweep-card,.sweep-monitor{padding:19px 18px}.sweep-fields{gap:7px}.setting-field{font-size:9px;letter-spacing:0}.setting-field input{font-size:17px;padding:10px}.sweep-action-row{gap:7px}.utility-button{font-size:11px;padding:9px}.check-grid{grid-template-columns:minmax(0,1fr);gap:12px}.check-card{padding:19px}.check-card p{min-height:auto}.check-footer{flex-wrap:wrap}.check-footer .utility-button{width:100%}.tools-heading{margin-bottom:15px}}
@media(max-width:370px){.site-header nav a:nth-child(2){display:none}.sweep-fields{grid-template-columns:repeat(3,minmax(0,1fr))}.sweep-card,.sweep-monitor{padding:17px 13px}.setting-field input{font-size:16px;padding:9px 7px}.sweep-action-row{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(prefers-reduced-motion:reduce){.progress-track>span{transition:none}}

/* Keep the sweep shortcut discoverable on narrow mobile headers. */
@media(max-width:680px){.site-header nav a:nth-child(2){display:inline}.site-header nav a:nth-child(4){display:none}}
@media(max-width:370px){.site-header nav a:nth-child(2){display:inline}.site-header nav a:nth-child(1){display:none}}


/* V4: simplified consumer-first layout. All audio controls and JS IDs are preserved. */
.hero {text-align:center;padding:32px 0 26px;}
.hero h1 {margin:0 auto 12px;font-size:clamp(35px,4.7vw,59px);line-height:1.1;}
.hero-lead {max-width:690px;margin:0 auto;font-size:15px;line-height:1.6;}
.workspace {display:block;max-width:1020px;margin:0 auto;}
.generator-panel {padding:28px 32px 30px;}
.generator-panel > .panel-header {margin-bottom:24px;}
.generator-panel h2 {margin:0;font-size:20px;}
.generator-grid {display:grid;grid-template-columns:minmax(0,1.08fr) minmax(0,.92fr);gap:36px;align-items:start;}
.generator-core,.generator-extras {min-width:0;}
.generator-core .frequency-top {margin-top:0;}
.generator-core .frequency-input-wrap input {font-size:43px;}
.generator-core .volume-control {margin-top:24px;}
.generator-core .play-button {margin-top:21px;}
.generator-core .safety-note {margin-top:13px;}
.generator-extras .compact-preview {min-width:0;}
.generator-extras .visual-header {margin:0 0 11px;align-items:center;}
.generator-extras .visual-header h2 {font-size:14px;font-weight:650;}
.generator-extras .visual-stage {height:142px;}
.generator-extras .visual-stage-label {font-size:10px;}
/* These elements are updated by app.js but intentionally not repeated on screen. */
.generator-extras .visual-footer {display:none;}
.generator-extras .secondary-controls {border-top:0;margin:19px 0 0;padding:0;}
.generator-extras .presets {margin-top:9px;}
.generator-extras .presets-wrap {margin-top:0;}
.generator-extras .preset {padding:8px 10px;}
.generator-extras .panel-separator {margin:19px 0 16px;}
.generator-extras .waveform-selector {gap:6px;}
.generator-extras .wave-button {gap:4px;padding:9px 3px;}
.generator-extras .wave-button svg {height:20px;}
.privacy-note {margin:16px 0 0;color:#91a8b6;font-size:12px;line-height:1.4;}
.tools-section,.speaker-section {padding-top:59px;}
.tools-heading {margin-bottom:20px;}
.tools-heading h2 {margin:0 0 9px;}
.tools-heading p {line-height:1.55;}
.content-section {padding-top:66px;}
.section-heading .eyebrow,.tools-heading .eyebrow {display:none;}
.section-heading h2 {margin-top:0;}
#how-it-works {padding-top:76px;}
.how-summary {max-width:880px;font-size:15px;color:#a8b8c7;line-height:1.75;margin:13px 0 0;}
.how-summary strong {color:#eaf3f6;font-weight:650;}
.wave-guide {padding-top:50px;}
.wave-guide-grid {gap:0 30px;}
.wave-guide-grid > div {border:0;border-bottom:1px solid #2c3c4e;border-radius:0;background:transparent;padding:18px 0;}
.wave-guide-grid > div strong {font-size:15px;}
.wave-guide-grid > div p {margin:6px 0 0;}
.faq-section {padding-top:60px;}
@media(max-width:960px) {
  .generator-panel {padding:25px 26px;}
  .generator-grid {gap:24px;}
}
@media(max-width:740px) {
  .hero {padding:26px 0 21px;}
  .hero h1 {font-size:clamp(32px,7.8vw,43px);}
  .hero-lead {font-size:13px;}
  .generator-panel {padding:20px 18px;}
  .generator-panel > .panel-header {margin-bottom:19px;}
  .generator-grid {grid-template-columns:minmax(0,1fr);gap:25px;}
  .generator-core .frequency-input-wrap input {font-size:36px;}
  .generator-core .play-button {margin-top:18px;}
  .generator-extras {border-top:1px solid #304153;padding-top:20px;}
  .generator-extras .visual-stage {height:124px;}
  .generator-extras .secondary-controls {margin-top:19px;}
  .tools-section,.speaker-section {padding-top:52px;}
  .content-section,#how-it-works {padding-top:55px;}
  .wave-guide {padding-top:42px;}
  .faq-section {padding-top:52px;}
}
@media(max-width:370px) {
  .generator-panel {padding:19px 15px;}
  .hero h1 {font-size:31px;}
  .generator-extras .presets {gap:6px;}
  .generator-extras .preset {padding:7px 8px;}
}

/* Remove decorative labels from the preview; playback status remains visible. */
.generator-extras .visual-stage-label{display:none;}

/* V5 · Calm, light, Apple-inspired color system.
   This intentionally changes presentation only; Web Audio behavior is untouched. */
:root {
  color-scheme: light;
  --bg: #f5f5f7;
  --surface: #ffffff;
  --border: #d9d9df;
  --text: #1d1d1f;
  --muted: #6e6e73;
  --faint: #636369;
  --accent: #0071e3;
  --accent-dark: #ffffff;
  --subtle-blue: #edf5ff;
  --light-border: #dedee3;
}
body {background:var(--bg); color:var(--text);}
.page-glow {display:none;}
button:focus-visible,input:focus-visible,a:focus-visible,summary:focus-visible {outline-color:var(--accent);}

/* Navigation and brand */
.site-header {background:#ffffffee;border-bottom:1px solid #e5e5ea;}
.wordmark {color:#1d1d1f;letter-spacing:.035em;}
.mark {background:#eaf3ff;color:#0071e3;}
.brand-light {color:#0071e3;}
.site-header nav a {color:#515157;}
.site-header nav a:hover,.footer-inner a:hover {color:#0071e3;}
.hero h1 {color:#1d1d1f;}
.hero h1 em {color:inherit;}
.hero-lead,.section-heading>p,.tools-heading p {color:#6e6e73;}

/* One quiet, white surface makes the actual tool the focus */
.panel,.check-card {background:#fff;border:1px solid #dedee3;box-shadow:0 8px 26px rgba(29,29,31,.035);}
.panel h2,.tools-heading h2,.section-heading h2,.check-card h3 {color:#1d1d1f;}
.control-status {background:#f5f5f7;color:#636369;border:1px solid #e5e5ea;}
.status-led,.visual-live-dot {background:#86868b;}
.control-status.is-playing {color:#005bb8;border-color:#b8d7ff;background:#edf5ff;}
.control-status.is-playing .status-led,.visual-live.active .visual-live-dot {background:#0071e3;box-shadow:none;}
.field-label,.setting-field {color:#515157;}
.range-hint,.frequency-unit,.range-labels,.field-help,.metric-name,.visual-live {color:#636369;}
.frequency-input-wrap,.setting-field input {background:#fff;border:1px solid #c8c8cf;box-shadow:none;}
.frequency-input-wrap:focus-within,.setting-field input:focus-visible {border-color:#0071e3;}
.frequency-input-wrap input,.setting-field input {color:#1d1d1f;}
.step-button {background:#f5f5f7;border-color:#dedee3;color:#333338;}
.step-button:hover {background:#e9e9ed;}
.frequency-range,.volume-row input {background:linear-gradient(90deg,#0071e3 0,#0071e3 var(--fill,45%),#d2d2d7 var(--fill,45%),#d2d2d7 100%);}
.frequency-range::-webkit-slider-thumb,.volume-row input::-webkit-slider-thumb {background:#fff;border:3px solid #0071e3;box-shadow:0 0 0 1px #fff;}
.frequency-range::-moz-range-thumb,.volume-row input::-moz-range-thumb {background:#fff;border:3px solid #0071e3;box-shadow:0 0 0 1px #fff;}
.volume-label output {color:#005bb8;}
.volume-row svg,.safety-note {color:#6e6e73;}
.safety-note svg {color:#9b670e;}
.play-button {background:#0071e3;color:white;border-radius:11px;box-shadow:none;}
.play-button:hover {background:#0077ed;box-shadow:0 5px 14px #0071e326;}
.play-button.playing {background:#1d1d1f;color:#fff;}
.play-button.playing:hover {background:#333336;}
.play-shortcut,.play-button.playing .play-shortcut {background:rgba(255,255,255,.18);color:#fff;}
.error-message {background:#fff1ef;color:#a42316;border-color:#f3c1ba;}

/* Presets and waveforms: color only represents interaction */
.generator-extras {border-color:#e5e5ea;}
.generator-extras .visual-header h2,.visual-live {color:#55555b;}
.visual-live.active {color:#005bb8;}
.visual-stage {background:#f7f9fc;border:1px solid #e5e5ea;}
.visual-centerline {border-top-color:#c3c7cf66;}
.visual-stage-label,.metric-value small {color:#636369;}
.metric-value {color:#1d1d1f;}
.visual-footer>div {border-color:#e5e5ea;}
.secondary-controls,.panel-separator {border-color:#e5e5ea;}
.preset {background:#f5f5f7;color:#414147;border:1px solid #dedee3;}
.preset:hover {background:#ebedf1;color:#1d1d1f;border-color:#b7b7c0;}
.preset.active {background:#eaf3ff;color:#005bb8;border:1px solid #0071e3;}
.wave-button {background:#f5f5f7;color:#515157;border:1px solid #dedee3;}
.wave-button:hover {background:#eaedf3;}
.wave-button.active {background:#eaf3ff;color:#005bb8;border-color:#0071e3;}
.privacy-note {color:#6e6e73;}

/* Sweep, short audio checks, supporting editorial content */
.tool-chip {background:#edf5ff;color:#005bb8;border-color:#bad6f8;}
.setting-field span,.tool-hint,.tool-message {color:#6e6e73;}
.utility-button {background:#edf5ff;color:#005bb8;border:1px solid #bfd8fb;border-radius:10px;}
.utility-button:hover:not(:disabled) {background:#ddeeff;border-color:#0071e3;}
.utility-button:disabled {opacity:.48;}
.subtle-button {background:#f5f5f7;color:#414147;border-color:#d2d2d7;}
.subtle-button:hover:not(:disabled) {background:#e9e9ed;border-color:#b8b8c0;}
.monitor-state {color:#005bb8;}
.monitor-frequency,.marked-tone strong {color:#1d1d1f;}
.monitor-frequency span,.progress-ends,.sweep-monitor>p {color:#6e6e73;}
.progress-track {background:#e5e5ea;}
.marked-tone {border-color:#e5e5ea;}
.check-card p,.check-footer,.disclaimer {color:#6e6e73;}
.check-footer {background:#fff;border-color:#dedee3;}
.section-heading>p,.how-summary,.wave-guide-grid > div p {color:#6e6e73;}
.how-summary strong {color:#1d1d1f;}
.wave-guide-grid>div,.faq-list details {border-color:#dcdce1;}
.wave-guide-grid>div strong {color:#1d1d1f;}
.faq-list details summary {color:#1d1d1f;}
.faq-list details p {color:#6e6e73;}
.site-footer {border-color:#dedee3;color:#6e6e73;}
.footer-inner a {color:#515157;}

@media (prefers-contrast: more) {
  :root {--border:#8e8e93;--muted:#46464b;}
  .panel,.check-card,.frequency-input-wrap,.setting-field input,.preset,.wave-button {border-color:#8e8e93;}
}
/* Keep the closing section in the same light scheme as the rest of the site. */
.site-footer {background:#fff;border-top:1px solid #e5e5ea;}
.footer-inner {color:#6e6e73;}

/* Keep the next section heading below the initial desktop viewport.
   The first screen grows naturally on short screens and mobile. */
.first-screen { min-height: calc(100svh - 66px); }
@media (max-width: 680px) { .first-screen { min-height: calc(100svh - 60px); } }

/* Use the site's actual domain as the identity; keep the existing tool layout. */
.site-header .wordmark { font-size:15px; letter-spacing:-.025em; gap:9px; min-width:0; }
.site-header .site-name { white-space:nowrap; }
.site-header .site-tld { color:#0071e3; }
@media (max-width: 680px) {
  .site-header .header-inner { height:auto; min-height:92px; padding-top:10px; padding-bottom:9px; flex-direction:column; align-items:flex-start; gap:8px; }
  .site-header .wordmark { font-size:14px; }
  .site-header nav { display:flex; width:100%; gap:8px; justify-content:space-between; }
  .site-header nav a, .site-header nav a:nth-child(1), .site-header nav a:nth-child(2), .site-header nav a:nth-child(3), .site-header nav a:nth-child(4) { display:inline; font-size:11px; }
}
@media (max-width: 370px) {
  .site-header .wordmark { font-size:13px; }
  .site-header nav a { font-size:10px; }
}
