
/* Persistent navigation and shared player UX enhancements */
.wnc-menu-button{display:none;border:1px solid #426855;color:#d5f3df;background:#203a32;border-radius:10px;padding:10px 13px;font:inherit;cursor:pointer}
.wnc-router-ready .wnc-sound-card{border-radius:14px;min-width:0;display:flex;flex-direction:column;background:#162928;border:1px solid #2c4b40;overflow:hidden}
.wnc-sound-card a.tile{border:0;background:transparent;border-radius:0;flex:1;min-height:130px}
.wnc-card-play,.wnc-primary{color:#0c2720;background:#abe5c4;border:0;border-radius:10px;min-height:43px;font:inherit;font-size:13px;font-weight:700;cursor:pointer}
.wnc-card-play{margin:0 12px 12px}
.wnc-page-actions{display:flex;align-items:center;gap:16px;flex-wrap:wrap;padding:6px 0 17px}
.wnc-primary{padding:12px 24px;min-width:150px}
.wnc-play-hint{font-size:12px;line-height:1.5;color:#a6c6b5}
.wnc-native-fallback-hidden{display:none!important}
.wnc-search-controls{padding:12px 0 19px}
.wnc-search-controls label{font-size:13px;font-weight:700;display:block;margin-bottom:10px}
.wnc-search-controls input{width:min(480px,100%);background:#182b28;color:#eaf8ed;border:1px solid #4a715c;border-radius:12px;padding:13px;font:inherit;font-size:16px}
.wnc-filter-row{display:flex;gap:8px;overflow-x:auto;padding:13px 0 7px;scrollbar-width:thin}
.wnc-filter{flex:none;white-space:nowrap;border:1px solid #486753;border-radius:30px;background:#162b27;color:#c5dece;padding:9px 13px;font-size:12px;cursor:pointer}
.wnc-filter.chosen{background:#b0e4c7;color:#143629;border-color:#b0e4c7}
.wnc-planned-categories{margin:18px 0 26px;color:#abc5b4;font-size:13px}
.wnc-planned-categories summary{cursor:pointer;padding:10px 0;font-weight:600}
.wnc-planned-categories .grid{margin:10px 0}
.wnc-route-library #dock,.wnc-route-library #black{display:none!important}
#wnc-mini{position:fixed;z-index:110;left:0;right:0;bottom:0;transform:translateY(120%);transition:transform .15s ease;background:#11231fef;border-top:1px solid #4e785e;backdrop-filter:blur(14px);padding:10px 0 calc(10px + env(safe-area-inset-bottom,0px))}
.wnc-route-library #wnc-mini.has-track{transform:none}
.wnc-mini-inner{width:min(1080px,calc(100% - 32px));margin:auto;display:flex;align-items:center;gap:11px}
.wnc-mini-info{flex:1;min-width:0}
.wnc-mini-info strong{font-size:14px;display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.wnc-mini-info small{color:#a9c9b9;display:block;font-size:11px}
#wnc-mini button{border:1px solid #4c775e;background:#214936;color:#def7e7;border-radius:10px;min-width:43px;min-height:43px;cursor:pointer}
#wnc-mini label{color:#bad5c7;font-size:11px;white-space:nowrap}
#wnc-mini input{vertical-align:middle;accent-color:#a4e4c7;width:92px}
#wnc-mini select{border:1px solid #4c775e;background:#214936;color:#def7e7;border-radius:9px;min-height:41px;padding:6px}
#wnc-screen-dark:not([hidden]){position:fixed;inset:0;z-index:500;background:#000;display:flex;flex-direction:column;gap:22px;align-items:center;justify-content:center;padding:24px;text-align:center;color:#d2e6d7}
#wnc-screen-dark strong{font-size:27px}
#wnc-screen-dark p{color:#8c9e92;font-size:12px;max-width:300px}
#wnc-screen-dark button{background:#14221b;border:1px solid #4c715b;color:#d6efde;padding:14px 24px;border-radius:11px;font:inherit}
.wnc-route-library main{padding-bottom:140px}
.wnc-route-library .playerbox audio.wnc-native-fallback-hidden{display:none!important}
@media(max-width:700px){
 .wnc-router-ready header .wnc-menu-button{display:inline-flex;align-items:center;justify-content:center}
 .wnc-router-ready header nav,.wnc-router-ready header nav.links{display:none!important;width:100%;flex-basis:100%}
 .wnc-router-ready.wnc-menu-open header nav,.wnc-router-ready.wnc-menu-open header nav.links{display:flex!important;flex-direction:column;gap:7px}
 .wnc-router-ready.wnc-menu-open header nav a,.wnc-router-ready.wnc-menu-open header nav.links a{display:block!important;min-height:40px;padding:9px 8px;font-size:13px}
 .wnc-router-ready header{flex-wrap:wrap!important}
 .wnc-mini-volume,.wnc-mini-timer{display:none!important}
 .wnc-mini-inner{gap:8px}
 #wnc-mini button{min-width:40px;min-height:40px}
 .wnc-route-library .grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:460px){.wnc-route-library .grid{grid-template-columns:1fr}.wnc-mini-info strong{font-size:12px}.wnc-mini-info small{font-size:10px}.wnc-mini-inner{width:calc(100% - 20px)}}

/* Mobile settings remain available without returning to the homepage */
.wnc-page-settings{display:flex;align-items:flex-end;flex-wrap:wrap;gap:13px;margin:5px 0 21px}
.wnc-page-settings label{display:flex;flex-direction:column;gap:8px;min-width:145px;color:#b4d1c0;font-size:12px}
.wnc-page-settings select{background:#18372b;border:1px solid #58836c;border-radius:9px;color:#e9ffef;min-height:42px;padding:7px 10px}
.wnc-page-settings input[type=range]{height:36px;width:160px;max-width:100%;accent-color:#b5e8c9}
.wnc-page-settings button{min-height:42px;background:#234735;color:#e7f6eb;border:1px solid #4e8768;border-radius:10px;padding:8px 13px;font:inherit;font-size:13px;cursor:pointer}
#wnc-mini-options{display:none!important}
@media(max-width:700px){
 #wnc-mini-options{display:inline-flex!important}
 .wnc-mini-inner{flex-wrap:wrap}
 .wnc-mini-expanded #wnc-mini label.wnc-mini-volume,.wnc-mini-expanded #wnc-mini label.wnc-mini-timer{display:flex!important;flex-direction:column;gap:5px;flex:1 1 42%;order:10;min-width:0}
 .wnc-mini-expanded #wnc-mini label.wnc-mini-volume input{width:100%}
 .wnc-mini-expanded #wnc-mini label.wnc-mini-timer select{min-width:0;width:100%}
 .wnc-page-settings label{flex:1 1 42%;min-width:0}
 .wnc-page-settings input[type=range]{width:100%}
}

/* Hidden search results must stay hidden despite flex card styles. */
.wnc-sound-card[hidden]{display:none!important}

/* Brown Noise reference Sound Page */
.brown-hero{padding:clamp(18px,3vw,29px);border-color:#558069;background:linear-gradient(145deg,#203b33,#111e21)}
.brown-hero-header{display:flex;align-items:center;justify-content:space-between;gap:15px}
.brown-hero-header h2{margin:12px 0 5px}
.brown-symbol{font-size:65px;line-height:1;color:#a5ddbd}
.brown-chips{display:flex;gap:8px;flex-wrap:wrap;margin:15px 0}
.brown-chips span{border:1px solid #4d775d;border-radius:40px;padding:5px 10px;font-size:11px;color:#c7e4d3}
.brown-fine-link{font-size:12px;color:#b7dbc5}
.brown-compare,.brown-spectrum{border:1px solid #315345;border-radius:17px;background:#142724;padding:clamp(17px,3vw,26px);margin:27px 0}
.brown-compare h2,.brown-spectrum h2{margin:9px 0}
.brown-compare p,.brown-spectrum p{color:#b9d3c3;line-height:1.7}
.brown-compare-grid,.brown-use-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.brown-compare-choice{display:flex;flex-direction:column;justify-content:space-between;gap:9px;min-height:144px;padding:16px;background:#192e2b;border:1px solid #456b56;border-radius:13px;color:#def0e5}
.brown-compare-choice:hover{background:#254337;text-decoration:none}
.brown-compare-choice.is-active,.brown-compare-choice[aria-current=true]{border-color:#bbe8ca;background:#29513e;box-shadow:0 0 0 1px #bbe8ca inset}
.brown-compare-choice strong{display:flex;align-items:center;gap:9px;font-size:15px}
.brown-compare-choice span{font-size:12px;color:#c7d9ce;line-height:1.6}
.brown-compare-choice small{font-size:11px;color:#a6c7b4;line-height:1.5}
.brown-compare-choice .dot{width:13px;height:13px;display:inline-block;border-radius:50%;flex:none}
.brown-compare-choice .dot.brown{background:#eac39c}.brown-compare-choice .dot.pink{background:#f2abc9}.brown-compare-choice .dot.white{background:#eaf8f1}
.brown-now-playing{font-weight:650;font-size:13px;color:#dff2e6}
.brown-spectrum{background:#101f20}
.brown-spectrum figure{margin:18px 0 0}
.brown-spectrum svg{display:block;width:100%;height:auto;background:#0c191d;border-radius:11px}
.brown-spectrum figcaption{font-size:12px;line-height:1.65;color:#aac7b5;padding:10px 0}
.brown-use-grid article{padding:17px;border:1px solid #36594a;background:#172c28;border-radius:14px}
.brown-use-grid h3{margin:0 0 11px;font-size:15px}
.brown-use-grid p{font-size:13px;color:#acc8b6;line-height:1.65}
.brown-use-grid a{font-size:12px}
.brown-faq{border-bottom:1px solid #345346;padding:14px 0}
.brown-faq summary{font-weight:650;cursor:pointer;font-size:15px}
.brown-faq p{color:#acc9b7;line-height:1.65;font-size:13px}
@media(max-width:760px){.brown-compare-grid,.brown-use-grid{grid-template-columns:1fr}.brown-compare-choice{min-height:auto}.brown-symbol{font-size:43px}}
@media(max-width:450px){.brown-hero{padding:16px}.brown-symbol{font-size:30px}.brown-compare,.brown-spectrum{padding:15px}}

/* Pink Noise: reuses the proven Noise Colors comparison UI with a distinct pink identity. */
.pink-reference .pink-hero{background:linear-gradient(145deg,#342535,#1a2428);border-color:#8e6782}
.pink-reference .pink-hero .tag{border-color:#a67d99;color:#f2d5e5}
.pink-reference .pink-hero .brown-symbol{color:#f3bbd7}
.pink-reference .pink-compare{background:#251f29;border-color:#6d526c}
.pink-reference .pink-compare-choice.is-active,.pink-reference .pink-compare-choice[aria-current=true]{border-color:#f2abc9;background:#503346;box-shadow:0 0 0 1px #f2abc9 inset}
.pink-reference .pink-spectrum{border-color:#645060}
.pink-reference .pink-spectrum figcaption{color:#c4b6c4}

/* White Noise technical reference - deliberately distinct from the general sound-machine homepage */
.white-reference .white-hero{background:linear-gradient(140deg,#2d3e43,#172329);border-color:#7899a0}
.white-reference .white-hero .tag{border-color:#8eabb0;color:#e4f4f4}
.white-reference .white-hero .brown-symbol{color:#e4f4ef}
.white-reference .white-compare{background:#1b2a2d;border-color:#587077}
.white-reference .brown-compare-choice.is-active,.white-reference .brown-compare-choice[aria-current=true]{border-color:#e4f4ef;background:#375351;box-shadow:0 0 0 1px #e4f4ef inset}
.white-reference .white-spectrum{background:#172227;border-color:#567074}
.white-reference .white-spectrum figcaption{color:#bbd1cf}
.white-reference .white-technical{margin-top:28px}

/* Green Noise v1: own mid-band design and separate listening-approval status. */
.green-reference .green-hero{background:linear-gradient(144deg,#1a3d35,#152927);border-color:#568a70}
.green-reference .green-hero .tag{color:#c2eacb;border-color:#6a9c80}
.green-reference .green-hero .brown-symbol{color:#81d6a4}
.green-reference .green-compare{background:#152d27;border-color:#416c55}
.green-reference .brown-compare-grid{grid-template-columns:repeat(4,minmax(0,1fr))}
.green-reference .brown-compare-choice.is-active,.green-reference .brown-compare-choice[aria-current=true]{border-color:#9fe7b9;background:#225642;box-shadow:0 0 0 1px #9fe7b9 inset}
.green-reference .brown-compare-choice .dot.green{background:#77d59b}
.green-qa-note{font-size:12px;color:#c4dac9;border-left:3px solid #78b797;padding:5px 0 5px 12px}
.green-spectrum{border:1px solid #3b6152;background:#112823;padding:clamp(17px,3vw,25px);border-radius:16px;margin:27px 0}
.green-spectrum h2{margin:3px 0 12px}
.green-spectrum h3{font-size:17px;margin:20px 0 8px}
.green-spectrum p{color:#b9d5c2;line-height:1.7}
.green-band-table{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin:18px 0}
.green-band-table div{display:flex;flex-direction:column;gap:8px;border:1px solid #426855;border-radius:12px;padding:15px;background:#1b3430}
.green-band-table .green-mid{border-color:#9fdfb6;background:#26483a}
.green-band-table strong{font-size:14px}
.green-band-table span{font-size:12px;color:#a6c9b4}
.green-band-table b{font-size:16px;color:#d7f8de}
@media(max-width:850px){.green-reference .brown-compare-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:570px){.green-reference .brown-compare-grid,.green-band-table{grid-template-columns:1fr}}


/* Batch 18 — distinct editorial sound pages; shared responsive listening shell. */
.batch18-page .batch18-player{padding:clamp(18px,3vw,28px);background:linear-gradient(135deg,#1b3530,#112523);border-color:#49755e}
.batch18-page .batch18-player h2{margin:13px 0 10px}
.batch18-tags{display:flex;gap:8px;flex-wrap:wrap;margin:15px 0}
.batch18-tags span{border:1px solid #507f68;border-radius:90px;padding:5px 9px;color:#c9e6d7;font-size:11px}
.batch18-compare,.batch18-context,.batch18-uses,.batch18-provenance,.batch18-faq{margin:25px 0}
.batch18-compare,.batch18-provenance{border:1px solid #345d4d;background:#152725;border-radius:16px;padding:clamp(16px,3vw,24px)}
.batch18-compare h2{margin:9px 0 12px}
.batch18-compare p,.batch18-context p,.batch18-uses p,.batch18-provenance p{line-height:1.75;color:#accbbb}
.batch18-comparison-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(175px,1fr));gap:10px;margin:18px 0 14px}
.batch18-choice{display:flex;flex-direction:column;justify-content:space-between;gap:10px;background:#1a3530;color:#daf0e2;border:1px solid #486c5a;border-radius:13px;padding:15px;min-height:110px}
.batch18-choice:hover{background:#24463b;color:#e8fff0;text-decoration:none}
.batch18-choice.is-active,.batch18-choice[aria-current="true"]{background:#315844;border-color:#abe9c3;box-shadow:inset 0 0 0 1px #abe9c3}
.batch18-choice strong{font-size:14px}.batch18-choice small{line-height:1.5;color:#b1cdbb;font-size:11px}
.batch18-context h3{font-size:17px;line-height:1.3;margin:20px 0 6px}
.batch18-links{display:flex;flex-wrap:wrap;gap:9px;margin:15px 0}
.batch18-links a{display:inline-flex;align-items:center;min-height:37px;padding:8px 12px;border:1px solid #53745f;border-radius:10px;font-size:12px}
.batch18-page .wnc-facts{margin-top:18px}
.batch18-page a:focus-visible{outline:2px solid #b6ebce;outline-offset:3px}
.batch18-provenance p{margin:10px 0}
@media(max-width:630px){.batch18-comparison-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.batch18-choice{min-height:126px;padding:12px}}
@media(max-width:400px){.batch18-comparison-grid{grid-template-columns:1fr}.batch18-choice{min-height:auto}.batch18-compare,.batch18-provenance{padding:15px}}

.batch18-hub-compare{margin:28px 0;padding:18px;border:1px solid #365a49;border-radius:14px;background:#182d27}.batch18-hub-compare h2{margin-top:0}.batch18-hub-compare p{line-height:1.7;color:#acc8b8}

/* Natural field-recording Sound Pages — approved source, honest loop disclosure */
.field-audio-hero{display:flex;flex-wrap:wrap;align-items:center;gap:9px;margin:17px 0 23px}
.field-audio-hero>span{border:1px solid #416d58;background:#17372d;color:#d3ead9;border-radius:30px;padding:8px 12px;font-size:11px;line-height:1.45}
.field-audio-hero .field-audio-tag{background:#2a5940;border-color:#6a9b7b;color:#f0faed;font-weight:750}
.field-audio-hero strong{font-size:14px;color:#eaf7ed}
.field-explain{border:1px solid #345744;border-radius:17px;background:linear-gradient(155deg,#142e28,#102422);padding:clamp(17px,3vw,28px);margin:29px 0}
.field-explain h2,.field-comparison h2,.field-faq-box h2{margin:11px 0 15px;line-height:1.2;font-size:clamp(23px,3vw,31px)}
.field-explain h3{margin:22px 0 9px;color:#e0f3e7;font-size:18px}
.field-explain p,.field-related p{font-size:14px;line-height:1.75;color:#bbd4c5}
.field-comparison,.field-faq-box{border:1px solid #345b49;border-radius:17px;background:#132a25;padding:clamp(17px,3vw,26px);margin:27px 0}
.field-comparison>p{color:#b8d5c3;font-size:13px;line-height:1.75}
.field-choice-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:11px;margin:18px 0}
.field-choice{min-width:0;display:flex;flex-direction:column;gap:8px;border:1px solid #476f58;border-radius:12px;background:#1e3a30;padding:15px;min-height:119px;color:#e9f8eb}
.field-choice:hover{text-decoration:none;background:#2b5040}
.field-choice strong{font-size:15px}
.field-choice small{font-size:12px;color:#b9d8c4;line-height:1.55}
.field-choice.is-active,.field-choice[aria-current=true]{background:#b8eacb;border-color:#b8eacb;color:#143b26}
.field-choice.is-active small,.field-choice[aria-current=true] small{color:#234b37}
.field-audio-status{font-size:12px;font-weight:700;color:#d4eede}
.field-detail-links{font-size:12px}
.field-faq-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.field-faq{background:#19332a;border:1px solid #3a614d;border-radius:12px;padding:16px}
.field-faq summary{font-size:14px;color:#e7f8ec;font-weight:750;line-height:1.55;cursor:pointer}
.field-faq p{font-size:13px;color:#b6d4c3;line-height:1.65;margin:13px 0 0}
.field-related{border-top:1px solid #345543;padding:18px 0 0;margin:24px 0}
.field-related h2{margin:10px 0}
.field-related p.field-disclosure{color:#b7c5b8;font-size:12px}
@media(max-width:600px){.field-faq-grid{grid-template-columns:1fr}}
@media(max-width:430px){.field-choice-grid{grid-template-columns:1fr}.field-choice{min-height:0}.field-audio-hero{gap:7px}.field-audio-hero>span{padding:7px 10px}.field-explain,.field-comparison,.field-faq-box{padding:17px}}

/* Measured noise-color sound pages: accessible static spectrum, not SPL */
.noise-spectrum-panel,.noise-distinction{margin:28px 0;padding:clamp(16px,3vw,26px);background:linear-gradient(160deg,#172e2d,#112320);border:1px solid #406756;border-radius:17px}
.noise-spectrum-panel h2,.noise-distinction h2{font-size:clamp(23px,3.1vw,32px);line-height:1.25;letter-spacing:-.03em;margin:13px 0 12px}
.noise-spectrum-intro,.noise-spectrum-foot,.noise-distinction p{font-size:13px;line-height:1.78;color:#c0d8c7}
.noise-band-chart{margin:21px 0 17px;border:1px solid #3b5b4d;border-radius:12px;background:#10241f;padding:14px 16px}
.noise-band-row{display:grid;grid-template-columns:120px minmax(30px,1fr) 88px;gap:11px;align-items:center;min-height:40px}
.noise-band-row+.noise-band-row{border-top:1px solid #294939}
.noise-band-label{font-size:12px;color:#cee6d2;white-space:nowrap;font-variant-numeric:tabular-nums}
.noise-band-meter{display:block;height:11px;overflow:hidden;border-radius:10px;background:#283e35}
.noise-band-fill{display:block;height:100%;border-radius:10px;background:linear-gradient(90deg,#6fac8d,#acdcc1)}
.noise-band-level{text-align:right;font-size:11px;font-variant-numeric:tabular-nums;color:#aacbb6;white-space:nowrap}
.noise-spectrum-foot{margin:13px 0 0;font-size:12px}
.noise-distinction h3{margin:20px 0 8px;font-size:17px;line-height:1.4;color:#e6f4e8}
.noise-distinction p{margin:9px 0 13px}
.noise-distinction .noise-refs{border-top:1px solid #3e6551;padding-top:12px;margin-top:20px;font-size:12px;color:#afd0bc}
.noise-spectrum-panel a,.noise-distinction a{color:#b9edd0;text-decoration:underline;text-underline-offset:3px}
.noise-colors-quick-table{width:100%;border-collapse:collapse;font-size:13px}
.noise-colors-quick-table th,.noise-colors-quick-table td{border-bottom:1px solid #39594a;padding:12px 10px;text-align:left;vertical-align:top;line-height:1.6}
.noise-colors-quick-table th{color:#d7f3e4;font-weight:750}
.noise-colors-quick-table td{color:#bad4c5}
.noise-colors-quick-table a{color:#bde6ca;text-decoration:underline;text-underline-offset:3px}
.noise-colors-quick-wrap{overflow-x:auto;max-width:100%;border:1px solid #385e49;border-radius:14px;background:#142921;margin:20px 0}
.noise-colors-measured-guide{margin:24px 0;padding:18px;border:1px solid #446953;border-radius:15px;background:#1b3129}
.noise-colors-measured-guide h2{margin:8px 0 10px;line-height:1.3}
.noise-colors-measured-guide p{font-size:13px;line-height:1.75;color:#bdd4c3}
@media(max-width:600px){.noise-band-row{grid-template-columns:106px minmax(20px,1fr) 78px;gap:7px}.noise-band-label{font-size:11px}.noise-band-level{font-size:10px}.noise-band-chart{padding:10px}.noise-colors-quick-table{min-width:560px}}
@media(max-width:350px){.noise-band-row{grid-template-columns:94px minmax(20px,1fr) 75px;gap:5px}.noise-band-label{font-size:10px}.noise-band-level{font-size:9px}.noise-spectrum-panel,.noise-distinction{padding:13px}}
