.ambience{position:fixed;left:max(20px,env(safe-area-inset-left));bottom:max(20px,env(safe-area-inset-bottom));z-index:45;color:var(--brand-petrol,#173d3b);font:400 .8125rem/1.4 var(--sans,sans-serif)}
.ambience__controls{display:flex;width:max-content;align-items:center;background:#faf9f5f5;border:1px solid #b398566b;border-radius:28px;box-shadow:0 3px 16px #173d390b}
.ambience button{color:inherit;background:transparent;border:0;min-height:44px;font:inherit;cursor:pointer}
.ambience__toggle{display:flex;align-items:center;gap:10px;padding:0 13px 0 17px;border-radius:24px 0 0 24px!important;min-width:120px}
.ambience__settings{display:grid;place-items:center;min-width:44px;padding:0 12px;border-left:1px solid #173d3917!important;border-radius:0 24px 24px 0!important}
.ambience__settings span{font-size:1.25rem;letter-spacing:.04em;line-height:1;transform:translateY(-3px)}
.ambience button:hover{color:var(--brand-plum,#582a3c)}
.ambience button:focus-visible,.ambience input:focus-visible{outline:2px solid #582a3c;outline-offset:3px}
.ambience__bars{display:flex;align-items:center;gap:3px;height:16px;width:16px}
.ambience__bars i{display:block;width:2px;height:4px;border-radius:2px;background:currentColor;transform-origin:center}
.ambience__bars i:nth-child(2){height:11px}.ambience__bars i:nth-child(3){height:7px}
.ambience.is-playing .ambience__bars i{animation:ambience-breathe 1.8s ease-in-out infinite alternate}.ambience.is-playing .ambience__bars i:nth-child(2){animation-delay:-.6s}.ambience.is-playing .ambience__bars i:nth-child(3){animation-delay:-1.2s}
.ambience__panel{width:min(260px,calc(100vw - 40px));padding:20px;background:#faf9f5;border:1px solid #b398566b;border-radius:12px;margin-bottom:10px;box-shadow:0 8px 35px #173d3912}
.ambience__panel[hidden]{display:none}
.ambience__title{font:500 1rem/1.4 var(--sans,sans-serif);color:#582a3c;margin:0 0 20px}
.ambience label{display:flex;align-items:center;justify-content:space-between;font-size:.875rem;color:inherit;letter-spacing:0;text-transform:none}
.ambience output{font-variant-numeric:tabular-nums}
.ambience input[type=range]{width:100%;min-height:44px;margin:0;accent-color:#582a3c;cursor:pointer;padding:0;border:0;background:transparent}
.ambience__note{font-size:.75rem;line-height:1.5;color:#586864;margin:6px 0 0}
.ambience__status{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
@keyframes ambience-breathe{from{transform:scaleY(.65)}to{transform:scaleY(1.25)}}
@media(max-width:760px){.ambience{left:max(14px,env(safe-area-inset-left));bottom:max(14px,env(safe-area-inset-bottom))}.ambience__toggle{min-width:112px;padding-left:14px}}
@media(prefers-reduced-motion:reduce){.ambience.is-playing .ambience__bars i{animation:none}}
@media print{.ambience{display:none}}
