:root{color-scheme:dark}html,body{margin:0;background:#000;color:#c8c8c8;font-family:Onest,Arial,sans-serif}*{box-sizing:border-box}[hidden]{display:none!important}.standalone-bar{height:64px;display:flex;align-items:center;justify-content:space-between;gap:24px;padding:0 clamp(20px,4vw,64px);background:#000;border-bottom:1px solid #242424;font:400 16px/1.5 Onest,Arial,sans-serif;position:relative;z-index:1000}.standalone-bar a{color:#999;text-decoration:none}.standalone-bar>span:last-child{color:#555}.standalone-bar button{border:0;background:none;color:#999;font:inherit;cursor:pointer;padding:12px 0}.standalone-bar a:focus-visible,.standalone-bar button:focus-visible,.demo-launch-button:focus-visible{outline:1px solid #aaa;outline-offset:6px}
.carrier-demo-stage{height:calc(100dvh - 64px);position:relative;background:#000}.carrier-launch{width:min(720px,calc(100% - 48px));margin:0 auto;min-height:100%;display:flex;flex-direction:column;justify-content:center;align-items:flex-start;gap:28px;padding:48px 0}.carrier-launch h1{margin:0;font-size:clamp(54px,9vw,112px);font-weight:300;letter-spacing:-.04em;color:#ddd}.carrier-launch p{font-size:20px;line-height:1.5;color:#888;margin:0;max-width:620px}.demo-launch-button{background:#000;border:1px solid #454545;border-radius:0;padding:16px 24px;color:#ccc;font:400 20px/1.5 Onest,Arial,sans-serif;cursor:pointer}.carrier-frame{display:block;border:0;width:100%;height:100%;background:#000}.carrier-load-status{position:absolute;inset:0;margin:0;display:grid;place-items:center;background:#000;color:#777;font:400 20px/1.5 Onest,Arial,sans-serif;pointer-events:none}
/* AMOLED presentation for the supplied Sonos demo, separate from the author site. */
.sonos-standalone .sit-demo{--ink:#bbb;--dim:#777;--lime:#ddd;background:#000!important;font-family:Onest,Arial,sans-serif;min-height:calc(100dvh - 64px)}
.sonos-standalone .demo-main{padding:32px clamp(20px,4vw,64px);max-width:1600px}.sonos-standalone .demo-top,.sonos-standalone .demo-intro{display:none!important}.sonos-standalone .demo-profiles{gap:16px;margin-bottom:32px}.sonos-standalone .demo-profiles button,.sonos-standalone .demo-profiles button[aria-selected=true]{background:#000!important;border-radius:0;border:1px solid #292929;color:#777}.sonos-standalone .demo-profiles button[aria-selected=true]{border-color:#aaa;color:#ddd}.sonos-standalone .demo-profiles b{font-size:20px;font-weight:400}.sonos-standalone .demo-profiles small,.sonos-standalone .demo-profile-person{color:#666!important}.sonos-standalone .demo-column-label>b{color:#bbb;font-weight:400}.sonos-standalone .demo-column-label>span{color:#666}.sonos-standalone .demo-column-label em{background:#000!important;border-color:#333;color:#888}
.sonos-standalone :is(.orig-wrap,.orig-phone,.orig-cover,.orig-albums>div,.orig-mini,.core-center,.core-constellation>span,.demo-habits,.habit-person>span,.habit-apps>span,.domain-gate,.filter-accepted,.transfer-row,.demo-skeleton,.assembly-badge,.demo-result-note,.demo-player,.demo-footer,.demo-target-wrap){background:#000!important;box-shadow:none!important;border-color:#333!important;color:#888}.sonos-standalone .orig-phone{color:#999}.sonos-standalone .orig-phone *{color:inherit!important;border-color:#2b2b2b!important}.sonos-standalone .core-center{color:#ccc}.sonos-standalone .core-constellation>span,.sonos-standalone .demo-habits,.sonos-standalone .transfer-row,.sonos-standalone .filter-accepted{border-radius:0}.sonos-standalone .filter-accepted>span,.sonos-standalone .result-tick{background:#000;color:#aaa}.sonos-standalone .demo-habits>p,.sonos-standalone .habit-apps>span,.sonos-standalone .domain-gate,.sonos-standalone .filter-accepted b,.sonos-standalone .transfer-row>b{color:#aaa}.sonos-standalone .habit-apps small,.sonos-standalone .filter-accepted small,.sonos-standalone .transfer-row>small,.sonos-standalone .demo-invariants b,.sonos-standalone .demo-invariants>span,.sonos-standalone .demo-invariants small{color:#666}.sonos-standalone .scene-counter{color:#999}.sonos-standalone .demo-narrative h2,.sonos-standalone .demo-result-note h3{color:#aaa}.sonos-standalone .demo-narrative p,.sonos-standalone .demo-try,.sonos-standalone .demo-small{color:#777}.sonos-standalone .demo-chapters button{color:#666}.sonos-standalone .demo-chapters button[aria-current=step]{color:#ddd;border-color:#888}.sonos-standalone .demo-player input{accent-color:#aaa}.sonos-standalone .demo-play,.sonos-standalone .demo-restart,.sonos-standalone .demo-all{background:#000!important;color:#aaa!important;border-color:#444!important}.sonos-standalone .demo-result-note button{background:#000;color:#bbb;border:1px solid #333}.sonos-standalone .result-route span{color:#aaa;border-color:#333}.sonos-standalone .demo-invariants{border-color:#292929}
.sonos-standalone .ux-phone{--phone-bg:#000!important;--phone-text:#bbb!important;--surface:#000!important;--accent:#ddd!important;--radius:8px!important;border:1px solid #333}.sonos-standalone .ux-phone *{font-family:Onest,Arial,sans-serif}.sonos-standalone .ux-nav button[aria-current=page]{box-shadow:inset 0 -1px #999}.sonos-standalone .ux-room-list button[aria-pressed=true]{outline:1px solid #333}.sonos-standalone .ux-mini{border:1px solid #333}.sonos-standalone .ux-action,.sonos-standalone .ux-transport .ux-play{background:#c5c5c5;color:#000}.sonos-standalone .orig-scan{background:#888;box-shadow:0 0 24px #ffffff22}.sonos-standalone .transfer-particle{background:#aaa}
.sonos-standalone .demo-skeleton i{background:#000!important;border:1px solid #292929}.sonos-standalone .demo-column-label>span{font-size:13px}.sonos-standalone .demo-narrative h2{font-size:30px;font-weight:400}.sonos-standalone .demo-narrative p{font-size:18px;line-height:1.5}.sonos-standalone .demo-try,.sonos-standalone .demo-small{font-size:14px;line-height:1.5}.sonos-standalone .demo-chapters button{font-size:13px}
@media(max-width:800px){.standalone-bar{height:56px;font-size:16px;gap:12px}.standalone-bar>span:last-child{display:none}.carrier-demo-stage{height:calc(100dvh - 56px)}.carrier-launch{min-height:100%;gap:24px;padding:32px 0}.carrier-launch p{font-size:20px}.sonos-standalone .demo-film{grid-template-columns:1fr;gap:32px}.sonos-standalone .demo-original{display:none}.sonos-standalone .demo-profiles{grid-template-columns:1fr}.sonos-standalone .demo-profiles button{padding:12px 16px}.sonos-standalone .demo-narrative p{font-size:20px}.sonos-standalone .demo-target{max-width:440px;width:100%;margin:auto}.sonos-standalone .demo-player{position:static}.sonos-standalone .demo-column-label{margin-bottom:20px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}}
