.creative-playground{margin:32px 7% 0;border:1px solid #424d56;position:relative;background:#13191e;overflow:hidden;border-radius:12px}.play-heading{padding:24px 28px;display:flex;align-items:center;justify-content:space-between;gap:20px}.play-heading>span{font-size:18px}.play-heading small{font-size:13px;color:#aab7c0}.creative-playground canvas{display:block;width:100%;height:320px;touch-action:pan-y}.play-controls{display:flex;align-items:center;gap:12px;padding:18px 28px;border-top:1px solid #49556255;flex-wrap:wrap}.play-controls button{border:1px solid #72838f;background:transparent;border-radius:30px;padding:10px 18px;font-size:14px;transition:background .2s}.play-controls button:hover{background:#cbdce722}.play-controls button:focus-visible{outline:2px solid #fff;outline-offset:4px}.play-status{margin-left:auto;font-size:13px;color:#b7c9d5}.creative-playground[data-mode=type]{background:#e2e4e2;color:#27313a;border-radius:0}.creative-playground[data-mode=type] .play-heading small,.creative-playground[data-mode=type] .play-status{color:#56626a}.creative-playground[data-mode=wave]{background:#182025;border-color:#4b5c65}.creative-playground[data-mode=light]{background:#17191c}.creative-playground[data-mode=connect]{background:#20212a;border-radius:32px}.creative-playground[data-mode=journey]{background:linear-gradient(120deg,#172029,#23272a)}@media(max-width:640px){.creative-playground{margin:24px 6% 0}.play-heading{align-items:flex-start;flex-direction:column;gap:8px;padding:20px}.play-heading small{line-height:1.6}.creative-playground canvas{height:280px}.play-controls{padding:16px;gap:8px}.play-controls button{font-size:13px;padding:9px 13px}.play-status{width:100%;margin-left:0}}