/* Sound discovery uses album-like artwork, a quiet index, and one shared player. */
.sound-section.library-section{background:#f1f3f8;color:#20283f;padding:100px 0;scroll-margin-top:0}
.library-heading{display:flex;align-items:end;justify-content:space-between;gap:30px;margin-bottom:46px}.library-heading h2{font-size:clamp(46px,5.7vw,84px);line-height:1.05;letter-spacing:-.06em;margin:0}.library-heading>p{max-width:240px;font-size:17px;line-height:1.6;color:#626d83;margin:0 0 7px}
.library-layout{display:grid;grid-template-columns:minmax(280px,.82fr) minmax(0,1.18fr);gap:6%;align-items:start}.library-player{background:#fff;border-radius:24px;overflow:hidden;min-width:0}
.library-cover{height:280px;position:relative;overflow:hidden;isolation:isolate;color:#fff}.art-sea{background:linear-gradient(158deg,#9ab9b8 0%,#446f7b 48%,#173e54 100%)}.art-rain{background:linear-gradient(130deg,#b3c8d2,#5a728b 60%,#293e59)}.art-stream{background:linear-gradient(155deg,#adbbae,#708c80 45%,#355a5c)}.art-forest{background:linear-gradient(155deg,#96a48b,#4f6c5e 48%,#263c35)}.art-night{background:linear-gradient(145deg,#7c80a6,#394666 50%,#1b273e)}.art-fire{background:linear-gradient(150deg,#d1a27a,#97674e 50%,#4a3435)}.art-brown{background:linear-gradient(135deg,#bcae9c,#897565,#574e4e)}.art-pink{background:linear-gradient(135deg,#d9b9c5,#a0839c,#665d80)}.art-white{background:linear-gradient(135deg,#d7dbde,#9caeb9,#687f93)}
.cover-disc{position:absolute;width:65%;aspect-ratio:1;left:40%;top:-18%;border-radius:50%;background:linear-gradient(145deg,#ffffff53,#ffffff03);box-shadow:0 0 70px #fff1;pointer-events:none}.cover-lines{position:absolute;width:150%;height:100%;left:-20%;top:50%;border-radius:50%;border:1px solid #ffffff42;box-shadow:0 -20px 0 #ffffff08,0 -44px 0 #ffffff09,0 -70px 0 #ffffff05;transform:rotate(-22deg)}.cover-caption{position:absolute;left:28px;bottom:28px;font-size:34px;letter-spacing:-.05em}.cover-symbol{position:absolute;left:27px;top:28px}.cover-symbol svg{width:34px;height:34px}
.library-now{padding:25px 26px 18px;display:flex;align-items:center;justify-content:space-between;gap:15px}.library-now h3{font-size:25px;letter-spacing:-.04em;line-height:1.2;margin:0;color:#20283f}.library-now p{font-size:13px;color:#6a7489;margin:8px 0 0}.library-play{width:54px;height:54px;border:0;border-radius:50%;background:#20283f;color:#fff;display:grid;place-items:center;cursor:pointer;flex:none}.library-play svg{width:23px;height:23px;fill:currentColor}.library-play .library-pause-icon{display:none;fill:none}.library-layout.is-playing .library-pause-icon{display:block}.library-layout.is-playing .library-play-icon{display:none}.library-play[aria-busy=true]{opacity:.55}
.library-tools{display:flex;justify-content:space-between;gap:10px;padding:0 26px 21px;align-items:center}.library-tools>button{display:flex;align-items:center;gap:7px;font:inherit;font-size:12px;color:#667086;background:none;border:0;padding:8px 0;cursor:pointer}.library-tools svg{width:19px;height:19px;fill:none;stroke:currentColor;stroke-width:1.5}.library-tools>button[aria-pressed=true]{color:#20283f}.library-tools>button[aria-pressed=true] svg{fill:#e8d7b9}.library-volume{display:flex;align-items:center;gap:12px;border-top:1px solid #edf0f5;padding:20px 26px;font-size:12px;color:#667086}.library-volume input{width:100%;min-width:50px;accent-color:#20283f}.library-volume span{min-width:28px}.library-player #audio-status:not(.sr-only){padding:0 26px 18px;color:#9d3535;font-size:13px}
.library-filters{display:flex;flex-wrap:wrap;gap:7px;margin-bottom:25px}.library-filters button{border:0;background:transparent;color:#626d83;padding:10px 15px;border-radius:25px;font:inherit;font-size:13px;cursor:pointer}.library-filters button[aria-pressed=true]{background:#20283f;color:#fff}.library-tracks{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:23px 20px}.library-track{align-self:start;position:relative;text-align:left;border:0;padding:0;background:transparent;font:inherit;color:#20283f;cursor:pointer;min-width:0}.library-track[hidden]{display:none}.track-art{position:relative;display:grid;place-items:center;aspect-ratio:1.35;border-radius:14px;overflow:hidden;color:#fff;margin-bottom:10px}.track-art::after{content:'';position:absolute;inset:-60% -20% 30% 25%;border:1px solid #ffffff35;border-radius:50%;box-shadow:0 15px 0 #ffffff09,0 35px 0 #ffffff09;transform:rotate(-30deg)}.track-art svg{width:35px;height:35px;position:relative;z-index:1}.library-track strong{display:block;font-size:13px;font-weight:600;padding-right:8px}.library-track small{display:block;font-size:11px;line-height:1.5;color:#667086;margin-top:4px}.track-state{position:absolute;right:9px;top:9px;width:24px;height:24px;border-radius:50%;display:grid;place-items:center;background:#ffffffd9;color:#20283f}.track-state svg{width:13px;height:13px;fill:currentColor}.library-track[aria-pressed=true] .track-art{outline:2px solid #20283f;outline-offset:3px}.library-track[aria-pressed=true] .track-state{background:#e8d7b9}.library-track:hover .track-art{filter:brightness(1.07)}.library-empty{color:#667086;min-height:200px;font-size:15px}.library-bottom{display:flex;align-items:center;justify-content:space-between;gap:15px;border-top:1px solid #dce1eb;margin-top:25px;padding-top:23px;font-size:12px;color:#667086}.library-bottom a{color:#20283f;text-decoration:none;white-space:nowrap}.library-bottom a span{margin-left:12px}
.app-experience{background:#e5e9f2;padding:95px 0 0;scroll-margin-top:0;overflow:hidden}.app-experience-layout{display:grid;grid-template-columns:1fr 1fr;gap:8%;align-items:center}.app-experience-copy h2{font-size:clamp(48px,6vw,88px);letter-spacing:-.06em;line-height:1.04;margin:0 0 25px}.app-experience-copy>p{font-size:17px;line-height:1.6;color:#626d83;max-width:350px;margin:0 0 30px}.app-feature-tabs{display:flex;flex-direction:column}.app-feature-tabs>button{text-align:left;background:none;border:0;border-left:2px solid #c4cbd9;padding:17px 0 17px 23px;font:inherit;cursor:pointer;color:#626d83}.app-feature-tabs>button strong{font-size:23px;letter-spacing:-.035em;font-weight:400;display:block}.app-feature-tabs>button span{display:block;font-size:13px;line-height:1.5;margin-top:7px}.app-feature-tabs>button[aria-selected=true]{color:#20283f;border-left-color:#20283f}.app-listen-link{display:inline-flex;gap:30px;margin:30px 0 0 25px;border-bottom:1px solid #727e93;padding-bottom:9px;font-size:14px;text-decoration:none;color:#20283f}
.app-experience-visual{position:relative;display:flex;justify-content:center;padding:35px 20px 30px;isolation:isolate}.app-experience-visual::before{content:'';position:absolute;width:112%;aspect-ratio:1;border-radius:50%;background:#d2dae9;top:6%;z-index:-1}.companion-phone{width:304px;min-height:595px;border:7px solid #323b50;border-radius:44px;padding:15px 21px 21px;background:#20283f;color:#fff;box-shadow:25px 35px 50px #25324e21;position:relative}.phone-status{display:flex;justify-content:space-between;align-items:center;font-size:10px;margin-bottom:23px;color:#d4d9e5}.phone-status i{width:73px;height:16px;border-radius:20px;background:#111a2a}.phone-brand{font-size:29px;letter-spacing:-.08em}.phone-brand>span{font-size:25px;margin-left:4px}.phone-greeting{font-size:21px;letter-spacing:-.04em;margin:25px 0 20px}.companion-phone [role=tabpanel]{min-height:400px}.phone-cover{height:210px;position:relative;overflow:hidden;border-radius:18px;padding:21px}.phone-cover>svg{width:30px;height:30px;position:relative}.phone-cover>span:last-of-type{position:absolute;left:20px;bottom:26px;font-size:26px;letter-spacing:-.04em}.phone-cover button{position:absolute;bottom:22px;right:17px;border:0;width:36px;height:36px;border-radius:50%;display:grid;place-items:center;background:#e8d7b9;color:#20283f;cursor:pointer}.phone-cover button svg{width:18px;height:18px;fill:currentColor}.companion-phone h3{font-size:13px;font-weight:400;margin:25px 0 13px;color:#dce1ec}.phone-sounds{display:flex;gap:10px}.phone-sounds button{width:33%;border:0;color:#dce1ec;background:none;padding:0;font:inherit;font-size:9px;text-align:left;cursor:pointer}.phone-sounds button span{display:grid;place-items:center;height:61px;border-radius:10px;margin-bottom:9px}.phone-sounds svg{width:23px;height:23px;color:#fff}.phone-bottom{display:flex;justify-content:space-between;border-top:1px solid #ffffff17;padding-top:16px;font-size:9px;color:#b4bed3;margin-top:18px}.phone-timer-dial{height:210px;width:210px;border:2px solid #e8d7b9;border-radius:50%;margin:30px auto 20px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:13px;box-shadow:0 0 0 10px #ffffff04}.phone-timer-dial>span{font-size:12px;color:#b4bed3}.phone-timer-dial strong{font-size:64px;letter-spacing:-.06em;font-weight:400}.phone-timer-dial small{font-size:16px;letter-spacing:0;margin-left:5px}.phone-timer-copy{font-size:12px;text-align:center;color:#c6cfe0}.phone-timer-button,.phone-browse{display:block;background:#e8d7b9;color:#20283f;border:0;text-align:center;border-radius:30px;padding:14px 10px;font:inherit;font-size:11px;text-decoration:none;margin-top:27px;cursor:pointer}.phone-saved-list{max-height:285px;overflow:auto}.phone-saved-list>p{font-size:13px;line-height:1.6;color:#b4bed3;padding:20px 0}.phone-saved-list button{width:100%;background:none;color:#fff;border:0;border-bottom:1px solid #ffffff15;padding:15px 0;display:flex;align-items:center;gap:12px;font:inherit;font-size:13px;cursor:pointer;text-align:left}.phone-saved-list .saved-swatch{width:39px;height:39px;border-radius:10px;flex:none}.app-benefits{display:grid;grid-template-columns:repeat(3,1fr);gap:6%;padding-top:70px;padding-bottom:70px;margin-top:40px;border-top:1px solid #cbd3e0}.app-benefits h3{font-size:22px;font-weight:400;letter-spacing:-.035em;margin:0 0 12px}.app-benefits p{font-size:14px;line-height:1.7;color:#626d83;max-width:280px;margin:0}
.library-section button:focus-visible,.app-experience button:focus-visible,.library-section select:focus-visible{outline:2px solid #7c91d4;outline-offset:4px}
@media(max-width:1000px){.library-layout{gap:4%;grid-template-columns:.9fr 1.1fr}.library-tracks{gap:20px 12px}.library-track small{font-size:10px}.library-filters{gap:1px}.library-filters button{padding:9px 12px}.library-cover{height:250px}.library-tools{flex-wrap:wrap}.library-now{padding-inline:20px}.library-tools,.library-volume{padding-inline:20px}.library-bottom>span{display:none}.app-experience-layout{gap:3%}.app-experience-copy h2{font-size:60px}.app-feature-tabs>button span{max-width:240px}.app-experience-visual{padding-inline:0}.app-benefits h3{font-size:20px}}
@media(max-width:700px){.sound-section.library-section{padding:60px 0}.library-heading{display:block;margin-bottom:28px}.library-heading h2{font-size:48px}.library-heading>p{font-size:15px;max-width:none;margin:20px 0 0}.library-layout{grid-template-columns:1fr;gap:30px}.library-cover{height:215px}.library-now{padding:20px 22px 12px}.library-tools{padding:0 22px 12px}.library-volume{padding:16px 22px}.library-tracks{grid-template-columns:repeat(3,minmax(0,1fr));gap:22px 12px}.track-art{aspect-ratio:1.1}.library-track strong{font-size:12px}.library-track small{font-size:10px}.library-filters{justify-content:space-between;gap:0;margin-bottom:22px}.library-filters button{font-size:12px;padding:9px 13px}.library-bottom{margin-top:24px}.app-experience{padding-top:60px}.app-experience-layout{grid-template-columns:1fr;gap:26px}.app-experience-copy h2{font-size:52px}.app-experience-copy>p{font-size:15px}.app-feature-tabs>button{padding:15px 0 15px 19px}.app-feature-tabs>button strong{font-size:22px}.app-feature-tabs>button span{max-width:none;font-size:12px}.app-listen-link{margin-left:21px}.app-experience-visual{padding-block:20px}.app-experience-visual::before{width:110%;top:7%}.companion-phone{width:292px}.app-benefits{grid-template-columns:1fr;gap:25px;margin-top:35px;padding-block:35px 50px}.app-benefits>div{padding-bottom:24px;border-bottom:1px solid #cbd3e0}.app-benefits>div:last-child{border:0;padding:0}.app-benefits h3{font-size:22px;margin-bottom:8px}.app-benefits p{max-width:330px;font-size:14px}}
@media(max-width:380px){.library-heading h2{font-size:43px}.library-tracks{grid-template-columns:repeat(2,minmax(0,1fr));gap:22px 16px}.library-filters button{font-size:11px;padding:9px 10px}.library-tools{gap:2px;padding-inline:18px}.library-tools>button{font-size:11px}.library-timer{font-size:11px}.library-now{padding-inline:18px}.library-now h3{font-size:23px}.library-now p{font-size:12px}.companion-phone{width:270px;padding-inline:16px}.phone-timer-dial{width:200px;height:200px}.app-experience-copy h2{font-size:48px}}

/* Timer choices stay visible, with native radio keyboard behaviour. */
.library-tools{padding-bottom:13px}
.library-timer{min-width:0;margin:0 26px 21px;padding:0;border:0;color:#667086}
.library-timer legend{padding:0;margin-bottom:10px;font-size:12px;line-height:1.4}
.timer-options{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:4px;padding:4px;background:#f0f3f8;border-radius:30px}
.timer-options label{position:relative;min-width:0;cursor:pointer}
.timer-options input{position:absolute;inset:0;width:100%;height:100%;padding:0;margin:0;opacity:0;cursor:pointer;z-index:1}
.timer-options span{min-height:42px;display:flex;align-items:center;justify-content:center;border-radius:24px;font-size:12px;line-height:1.2;color:#657086;transition:background-color .15s,color .15s;white-space:nowrap}
.timer-options input:checked+span{background:#20283f;color:#fff;box-shadow:0 2px 5px #20283f18}
.timer-options input:focus-visible+span{outline:2px solid #667b9c;outline-offset:2px}
@media(hover:hover){.timer-options label:hover span{background:#e1e7f0;color:#20283f}.timer-options label:hover input:checked+span{background:#303c57;color:white}}
.library-volume input{appearance:none;-webkit-appearance:none;height:24px;margin:0;background:transparent;cursor:pointer;--volume-fill:20%}
.library-volume input::-webkit-slider-runnable-track{height:4px;border-radius:4px;background:linear-gradient(to right,#667b9c var(--volume-fill),#e1e6ee var(--volume-fill))}
.library-volume input::-webkit-slider-thumb{appearance:none;-webkit-appearance:none;width:16px;height:16px;margin-top:-6px;border-radius:50%;border:2px solid white;background:#20283f;box-shadow:0 1px 4px #20283f38}
.library-volume input::-moz-range-track{height:4px;border-radius:4px;background:#e1e6ee}
.library-volume input::-moz-range-progress{height:4px;border-radius:4px;background:#667b9c}
.library-volume input::-moz-range-thumb{width:12px;height:12px;border-radius:50%;border:2px solid white;background:#20283f;box-shadow:0 1px 4px #20283f38}
.library-volume input:focus-visible{outline:2px solid #667b9c;outline-offset:4px;border-radius:5px}
@media(max-width:1000px){.library-timer{margin-inline:20px}}
@media(max-width:700px){.library-timer{margin:0 22px 18px}.library-tools{padding-bottom:12px}}
@media(max-width:380px){.library-timer{margin-inline:18px}.timer-options{gap:2px}.timer-options span{font-size:11px}}
@media(prefers-reduced-motion:reduce){.timer-options span{transition:none}}

/* App preview: all styling is confined to the phone. */
.companion-phone.phone-polished{width:304px;min-height:610px;padding:15px 19px 13px;border:5px solid #485168;border-radius:46px;background:radial-gradient(ellipse at 0 0,#2c3950 0,transparent 55%),#151e31;box-shadow:0 0 0 1px #a3acbc,0 0 0 3px #50596e,0 30px 45px -15px #17263d55,inset 0 0 0 2px #0e1729;overflow:hidden;color:#f5f7fb}
.phone-polished .phone-status{margin:0 2px 26px;font-size:10px;position:relative;height:17px;color:#d9dfeb;line-height:1}.phone-polished .phone-status i{width:73px;height:19px;background:#0a1323;position:absolute;left:50%;transform:translateX(-50%);top:-2px}.phone-polished .phone-status>svg{width:31px;height:14px}
.phone-polished .phone-app-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:22px}.phone-polished .phone-app-header>svg{width:22px;height:22px;color:#e8d7b9}.phone-polished .phone-brand{font-size:26px;line-height:1;letter-spacing:-.08em}.phone-polished .phone-brand>span{font-size:24px;margin-left:4px}.phone-polished .phone-greeting{font-size:26px;line-height:1.25;letter-spacing:-.045em;margin:0 0 17px;color:#f3f5fa}
.phone-polished [role=tabpanel]{min-height:408px}.phone-polished [role=tabpanel][hidden]{display:none}
.phone-polished .phone-cover{height:247px;padding:0;border-radius:19px;position:relative;background:#25475d;isolation:isolate;box-shadow:inset 0 0 0 1px #ffffff15}.phone-polished .phone-sea-art{position:absolute;inset:0;width:100%;height:100%;z-index:-2}.phone-polished .phone-cover::after{content:'';position:absolute;inset:45% 0 0;background:linear-gradient(transparent,#0b2438c4);z-index:-1}.phone-polished .phone-cover-copy{position:absolute;bottom:22px;left:19px}.phone-polished .phone-cover-copy span{display:block;font-size:10px;color:#d8e3e7;letter-spacing:.02em;margin-bottom:5px}.phone-polished .phone-cover-copy strong{display:block;font-size:27px;letter-spacing:-.045em;font-weight:400;line-height:1.1}.phone-polished .phone-cover button{right:16px;bottom:21px;width:42px;height:42px;background:#eee0c5;box-shadow:0 3px 16px #0b263343}.phone-polished .phone-cover button svg{width:18px;height:18px}.phone-polished .phone-pause-glyph{display:none}.phone-polished .phone-cover button[aria-pressed=true] .phone-play-glyph{display:none}.phone-polished .phone-cover button[aria-pressed=true] .phone-pause-glyph{display:block}
.phone-polished h3{font-size:12px;color:#c6cfde;font-weight:400;margin:22px 0 12px}.phone-polished .phone-sounds{gap:10px}.phone-polished .phone-sounds button{font-size:10px;line-height:1.5;color:#dbe1ec;width:calc((100% - 20px)/3)}.phone-polished .phone-sounds button>span{height:65px;border-radius:13px;position:relative;overflow:hidden;margin-bottom:9px;box-shadow:inset 0 0 0 1px #ffffff0c}.phone-polished .phone-sounds svg{width:57px;height:57px;color:#e3e6dc;opacity:.8}.phone-polished .phone-tile-rain{background:linear-gradient(140deg,#78949b,#32475d)}.phone-polished .phone-tile-fire{background:radial-gradient(at 50% 90%,#bc885d,#5e3f3b)}.phone-polished .phone-tile-brown{background:linear-gradient(140deg,#a89a85,#504b49)}
.phone-polished .phone-bottom{display:flex;justify-content:space-around;border-top:1px solid #ffffff10;margin:23px -4px 0;padding:13px 0 0;gap:8px}.phone-polished .phone-bottom button{font:inherit;font-size:9px;border:0;padding:3px 5px;background:none;color:#8c9ab3;display:flex;flex-direction:column;align-items:center;gap:6px;min-width:64px;min-height:44px;cursor:pointer}.phone-polished .phone-bottom svg{width:19px;height:19px}.phone-polished .phone-bottom button[aria-pressed=true]{color:#ead8b6}.phone-polished .phone-home-indicator{height:3px;width:83px;border-radius:4px;background:#c8cfda99;margin:17px auto 0}
.phone-polished button:focus-visible,.phone-polished a:focus-visible{outline:2px solid #e8d7b9;outline-offset:3px}.phone-polished button{-webkit-tap-highlight-color:transparent}
.phone-polished .phone-saved-emblem{display:grid;place-items:center;height:120px;margin:20px 0 10px;background:radial-gradient(ellipse at center,#e8d7b90c,transparent 70%)}.phone-polished .phone-saved-emblem svg{height:46px;width:46px;color:#e8d7b9;stroke-width:.8}.phone-polished .phone-saved-list{max-height:215px;overflow:auto;scrollbar-width:thin;scrollbar-color:#64718a transparent}.phone-polished .phone-saved-list>p{font-size:13px;text-align:center;margin:0;padding:5px 20px 18px;color:#aebbd0;line-height:1.7}.phone-polished .phone-saved-list button{padding:12px 0;font-size:13px;gap:13px;border-color:#ffffff0c}.phone-polished .saved-swatch{border-radius:11px;width:42px;height:42px;box-shadow:inset 0 0 0 1px #ffffff15}.phone-polished .phone-browse{font-size:12px;margin-top:22px;background:#26324a;color:#eee0c5;padding:14px;display:flex;justify-content:space-between;align-items:center}
.phone-polished .phone-timer-dial{width:230px;height:230px;margin:27px auto 15px;border:0;box-shadow:none;position:relative;gap:13px;display:flex;justify-content:center;align-items:center}.phone-polished .phone-dial-art{position:absolute;inset:0;width:100%;height:100%}.phone-polished .phone-timer-dial>svg:not(.phone-dial-art){width:23px;height:23px;color:#e8d7b9}.phone-polished .phone-timer-dial strong{font-size:66px;line-height:.95;font-weight:400;letter-spacing:-.06em;text-align:center}.phone-polished .phone-timer-dial small{display:block;font-size:11px;letter-spacing:.03em;color:#aab7cd;margin:10px 0 0}.phone-polished .phone-timer-copy{color:#b7c2d4;font-size:12px;margin:18px 0 23px}.phone-polished .phone-timer-button{font-size:12px;display:flex;align-items:center;justify-content:space-between;padding:15px 18px;background:#e8d7b9;margin:0;width:100%}
@media(max-width:700px){.companion-phone.phone-polished{width:292px}}@media(max-width:360px){.companion-phone.phone-polished{width:272px;padding-inline:17px}.phone-polished .phone-timer-dial{width:220px;height:220px}.phone-polished .phone-sounds button{font-size:9px}.phone-polished .phone-cover{height:232px}.phone-polished [role=tabpanel]{min-height:394px}}
