.refresh-sound { background:#f6f9f7; color:#233b33; }
.refresh-sound .sound-header { display:flex; align-items:center; justify-content:space-between; position:sticky; top:0; gap:12px; padding:12px 180px 12px 4%; background:#fafcf9; border-bottom:1px solid #d8e1db; min-height:72px; }
.refresh-sound .sound-header .brand { position:static; }
.refresh-sound .sound-nav { display:flex; gap:14px; }
.refresh-sound .sound-nav a { color:inherit; }
.sound-hero { position:relative; isolation:isolate; color:#fff; background:#23493f; }
.sound-hero::before { content:""; position:absolute; inset:0; z-index:-1; background:linear-gradient(90deg,#122d25e6,#122d2544),url('/assets/hero-room-polished-v1-opt.jpg') center 60%/cover; }
.sound-hero-inner { max-width:1120px; margin:auto; padding:42px 24px 46px; }
.sound-hero .eyebrow { color:#e0e9e1; font:600 12px/1.5 system-ui; margin:0 0 12px; }
.sound-hero h1 { font-size:48px; line-height:1.15; margin:0 0 14px; color:white; }
.sound-hero p:last-child { margin:0; max-width:560px; font-size:16px; line-height:1.8; color:#f1f5f0; }
.sound-library { width:min(1120px,calc(100% - 48px)); margin:auto; padding:32px 0 100px; }
.sound-library-heading { display:flex; justify-content:space-between; align-items:baseline; gap:16px; }
.sound-library h2 { font-size:27px; line-height:1.3; margin:0; }
.sound-count { color:#64746b; font-size:13px; white-space:nowrap; }
.sound-filters { display:flex; flex-wrap:wrap; gap:8px; margin:20px 0 26px; }
.sound-filter { padding:10px 17px; border:1px solid #c6d4cb; border-radius:5px; background:#fff; color:#315146; font:600 14px/1.4 system-ui; cursor:pointer; min-height:44px; }
.sound-filter[aria-pressed="true"] { background:#234e40; border-color:#234e40; color:#fff; }
.sound-filter:focus-visible,.sound-repeat input:focus-visible { outline:3px solid #b78635; outline-offset:3px; }
.sound-list { display:grid; gap:12px; }
.sound-track { display:grid; grid-template-columns:100px minmax(0,1fr) minmax(260px,360px); align-items:center; gap:20px; padding:18px; border:1px solid #dbe3dd; border-radius:6px; background:#fff; }
.sound-track[hidden] { display:none; }
.sound-track.is-playing { border-color:#4a806a; box-shadow:inset 4px 0 #4a806a; background:#f3f8f4; }
.sound-track img { width:100px; height:100px; object-fit:cover; border-radius:4px; }
.sound-track-copy { min-width:0; }
.sound-track-meta { display:flex; flex-wrap:wrap; gap:8px; color:#697970; font:12px/1.5 system-ui; margin-bottom:8px; }
.sound-track h3 { margin:0 0 7px; font:600 18px/1.5 system-ui; color:#223e33; overflow-wrap:anywhere; }
.sound-track-copy p { margin:0; color:#68776e; font:14px/1.6 system-ui; }
.sound-playing { display:none; color:#276849; font-weight:700; }
.is-playing .sound-playing { display:inline; }
.sound-controls { min-width:0; display:grid; gap:7px; }
.sound-controls audio { width:100%; min-width:0; height:44px; }
.sound-options { display:flex; align-items:center; justify-content:space-between; gap:10px; }
.sound-repeat { display:inline-flex; align-items:center; gap:7px; min-height:32px; font:13px/1.4 system-ui; color:#405d4b; cursor:pointer; }
.sound-repeat input { width:17px; height:17px; margin:0; accent-color:#285d49; }
.sound-duration { font:12px/1.4 system-ui; color:#697970; font-variant-numeric:tabular-nums; }
.sound-error { margin:0; color:#9a3e36; font:13px/1.5 system-ui; }
.sound-error:empty { display:none; }
.sound-note { margin:25px 0 0; color:#68776e; font-size:13px; line-height:1.7; max-width:690px; }
.sound-empty { color:#68776e; padding:24px 0; }
.sound-app-link { margin-top:25px; padding-top:24px; border-top:1px solid #d5dfd8; display:flex; align-items:center; gap:14px; }
.sound-app-link img { width:46px; height:46px; border-radius:7px; }
.sound-app-link a { color:#2c5a46; font-weight:600; text-underline-offset:4px; }
.sound-app-link p { margin:3px 0 0; color:#65766b; font-size:13px; }
@media(max-width:720px) {
  .refresh-sound .sound-header { min-height:62px; padding:10px 155px 10px 12px; }
  .sound-hero-inner { padding:28px 20px 30px; }
  .sound-hero h1 { font-size:34px; }
  .sound-hero p:last-child { font-size:14px; max-width:310px; line-height:1.7; }
  .sound-library { width:calc(100% - 32px); padding-top:25px; }
  .sound-library h2 { font-size:23px; }
  .sound-count { font-size:12px; }
  .sound-filters { gap:7px; margin:16px 0 20px; }
  .sound-filter { padding:9px 12px; font-size:13px; }
  .sound-track { grid-template-columns:78px minmax(0,1fr); gap:14px 12px; padding:14px; }
  .sound-track img { width:78px; height:78px; align-self:start; }
  .sound-track h3 { font-size:16px; line-height:1.5; margin-bottom:4px; }
  .sound-track-copy p { font-size:12px; }
  .sound-track-meta { font-size:11px; gap:6px; margin-bottom:5px; }
  .sound-controls { grid-column:1 / -1; }
  .sound-repeat { min-height:36px; }
}
@media(max-width:360px) {
  .refresh-sound .sound-header .brand { gap:4px; padding:4px 7px; font-size:11px; }
  .refresh-sound .sound-header .brand img { width:34px; height:24px; }
  .refresh-sound .sound-header .brand span { font-size:11px; }
  .refresh-sound .zuden-global-tools { right:10px; gap:5px; }
  .refresh-sound .zuden-global-language a,.refresh-sound .zuden-global-menu-toggle { padding-inline:7px; font-size:11px; }
}