.product-demo{--app-green:#285d4f;color:#202724;margin:60px 0 20px;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}.product-demo button{font:inherit;color:inherit;cursor:pointer;-webkit-tap-highlight-color:transparent;border:0}.product-demo button:focus-visible{outline-offset:3px;outline:2px solid #2f6fed}.product-demo button:disabled{opacity:.3;cursor:default}.product-demo button:not(:disabled):active{opacity:.65}.phones{grid-template-columns:minmax(0,350px) 72px minmax(0,350px);justify-content:center;align-items:center;display:grid}.phone-shell{background:#d1d4d2;border:1px solid #bac0bc;border-radius:48px;padding:5px;box-shadow:0 30px 45px -26px #25312a55,inset 0 0 0 2px #eef0ee}.phone-screen{background:#fafbf9;border:5px solid #222724;border-radius:43px;flex-direction:column;height:704px;display:flex;position:relative;overflow:hidden}.phone-status{flex-shrink:0;justify-content:space-between;align-items:center;height:46px;padding:0 20px;font-size:12px;font-weight:600;display:flex;position:relative}.island{background:#202421;border-radius:20px;width:86px;height:23px;position:absolute;top:9px;left:50%;transform:translate(-50%)}.status-icons{align-items:center;gap:4px;display:flex}.home-indicator{opacity:.85;background:#26352d;border-radius:4px;width:104px;height:4px;position:absolute;bottom:9px;left:50%;transform:translate(-50%)}.app-nav{flex-shrink:0;grid-template-columns:1fr auto 1fr;align-items:center;height:44px;padding:0 14px 0 8px;font-size:12px;display:grid}.app-nav strong{font-size:15px;font-weight:600}.nav-back{background:0 0;align-items:center;min-height:44px;padding:0;font-size:12px;display:flex}.nav-live{background:#e4eee8;border-radius:18px;justify-self:end;align-items:center;gap:4px;min-height:32px;padding:0 10px;display:flex;color:var(--app-green)!important;font-size:11px!important}.check-body{scrollbar-width:none;flex:1;min-height:0;padding:15px 19px 10px;overflow:auto}.check-body::-webkit-scrollbar{display:none}.setup-label{color:#67736b;margin-bottom:7px;font-size:9px}.check-body h4{margin:0 0 12px;font-size:29px;font-weight:650;line-height:1.12}.document-meta{color:#66756d;align-items:center;gap:15px;font-size:10px;display:flex}.document-meta span:last-child{color:#426956;align-items:center;gap:4px;display:flex}.sound-summary{border-bottom:1px solid #e5e9e5;grid-template-columns:1fr 1fr;gap:10px;padding:20px 0;display:grid}.sound-summary>div{align-items:center;gap:8px;font-size:11px;display:flex}.sound-summary small{color:#727c76;margin-bottom:3px;font-size:9px;display:block}.demo-avatar,.music-art{background:#e3d5ad;border-radius:50%;flex-shrink:0;width:30px;height:30px;position:relative;overflow:hidden}.demo-avatar:before{content:"";background:#8caa89;border-radius:50%;width:30px;height:24px;position:absolute;top:15px;left:9px}.demo-avatar:after{content:"";background:#c6ceaf;border-radius:50%;width:19px;height:20px;position:absolute;top:8px;left:-3px}.music-art{color:#326256;background:#d2e4e0;border-radius:9px;place-items:center;display:grid}.timeline-heading{justify-content:space-between;padding:18px 0 9px;font-size:13px;font-weight:600;display:flex}.timeline-heading span{color:#6c766f;font-size:10px;font-weight:400}.block-toggle{text-align:left;background:0 0;align-items:center;gap:10px;width:100%;min-height:51px;padding:10px 0;display:flex}.block-time{font-variant-numeric:tabular-nums;color:#768179;flex-shrink:0;width:30px;font-size:9px}.block-name{flex:1;font-size:13px;font-weight:600}.block-name small{color:#6d786f;margin-top:3px;font-size:9px;font-weight:400;display:block}.block-toggle svg{color:#79857c;transition:transform .2s}.block-toggle svg.collapsed{transform:rotate(-90deg)}.demo-cues{margin-bottom:3px}.demo-cue{text-align:left;background:0 0;grid-template-columns:30px 1fr 15px;align-items:center;gap:10px;width:100%;min-height:51px;padding:9px 0;display:grid}.demo-cue>span:first-child{color:#778177;font-size:9px}.demo-cue>span:nth-child(2){border-left:3px solid #c3d0c4;padding-left:11px;font-size:12px;line-height:1.55}.demo-cue svg{color:#809484}.demo-cue.selected>span:nth-child(2){color:#285d4f;border-color:#396953;font-weight:600}.demo-cue.selected{background:#edf3ed;border-radius:10px}.demo-cue.selected svg{color:#285d4f}.check-bottom{-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);background:#fafbf9e8;flex-shrink:0;padding:8px 13px 26px}.prompt-dock{background:#fff;border:1px solid #dce4db;border-radius:26px;align-items:center;gap:9px;padding:5px 12px 5px 5px;display:flex;box-shadow:0 3px 12px #23482f0d}.prompt-dock>span{color:#788478;flex:1;font-size:12px}.prompt-dock>.demo-icon{color:#466640;background:#e6eee3;width:38px;height:38px}.prompt-dock>svg{color:#5b6f58}.demo-icon{background:0 0;border-radius:50%;flex-shrink:0;place-items:center;width:44px;height:44px;padding:0;transition:background .18s,opacity .18s;display:grid}.demo-icon:hover:not(:disabled){background:#dae6dc}.demo-icon[aria-pressed=true]{background:#d3e2d7}.between-phones{color:#8b9d92;justify-self:center}.live-phone{padding-top:48px}.live-phone .phone-screen{background:#ecf1eb}.live-dot{background:#527560;border-radius:50%;justify-self:end;width:6px;height:6px;margin-right:12px}.live-document{color:#516858;background:#f8faf7a8;border:1px solid #ffffffc0;border-radius:14px;justify-content:space-between;margin:16px 20px 0;padding:12px 14px;font-size:10px;display:flex}.live-document span:last-child{color:#727e72}.lyric-stage{flex-direction:column;flex:1;justify-content:center;min-height:0;padding:30px 26px;display:flex}.lyric-previous,.lyric-next{color:#758475;max-width:230px;margin:0;font-size:17px;line-height:1.5}.lyric-current{color:#28523f;margin:24px 0;font-size:34px;font-weight:600;line-height:1.17;animation:.25s ease-out cue-arrive}.live-bottom{-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);background:#ffffff78;border:1px solid #fff;border-radius:28px;margin:0 16px 30px;padding:17px 18px 9px;box-shadow:0 6px 20px #33482a08}.demo-progress{background:#d3ded3;border-radius:3px;height:3px;overflow:hidden}.demo-progress>span{transform-origin:0;background:#487153;width:100%;height:100%;transition:transform .2s linear;display:block}.progress-times{color:#677563;font-variant-numeric:tabular-nums;justify-content:space-between;margin-top:7px;font-size:9px;display:flex}.transport{justify-content:space-between;align-items:center;padding:10px 16px;display:flex}.primary-play{width:62px;height:62px;box-shadow:0 4px 9px #2d513324;color:#fff!important;background:#365d43!important}.primary-play svg{fill:currentColor;width:27px;height:27px}.secondary-transport{border-top:1px solid #e1e8dc;justify-content:space-between;padding-top:5px;display:flex}.secondary-transport svg{width:18px;height:18px}.demo-captions{text-align:center;grid-template-columns:1fr 1fr;gap:72px;max-width:772px;margin:30px auto 0;display:grid}.demo-captions span{color:#6b7d70;font-size:11px}.demo-captions p{margin:9px 0 0;font-size:22px}.concept-disclosure{text-align:center;color:#66736a;margin:28px 0 0;font:11px Manrope,sans-serif}.demo-switch{display:none}@supports (corner-shape:squircle){.phone-shell,.phone-screen,.live-bottom,.prompt-dock,.live-document{corner-shape:squircle}}@keyframes cue-arrive{0%{opacity:.4;transform:translateY(5px)}to{opacity:1;transform:translateY(0)}}@media (width<=900px) and (width>=761px){.phones{grid-template-columns:minmax(0,330px) 24px minmax(0,330px)}.phone-screen{height:700px}.check-body{padding-inline:14px}.lyric-stage{padding-inline:20px}.between-phones svg{width:16px}.live-document{margin-inline:14px;font-size:9px}}@media (width<=760px){.product-demo{margin-top:32px}.demo-switch{background:#e1e6e2;border-radius:24px;width:200px;margin:0 auto 26px;padding:4px;display:flex}.demo-switch button{background:0 0;border-radius:20px;flex:1;min-height:36px;font-size:13px}.demo-switch button[aria-pressed=true]{background:#fff;box-shadow:0 1px 5px #21372b16}.phones{max-width:350px;margin:auto;display:block}.between-phones{display:none}.live-phone{padding:0}.phone-screen{height:704px}.product-demo[data-view=check] .live-phone,.product-demo[data-view=live] .check-phone{display:none}.demo-captions{margin-top:25px;display:block}.product-demo[data-view=check] .demo-captions>div:last-child,.product-demo[data-view=live] .demo-captions>div:first-child{display:none}.concept-disclosure{margin-top:16px;font-size:10px}}@media (width<=360px){.phone-shell{border-radius:38px;padding:3px}.phone-screen{border-width:4px;border-radius:34px}.phone-status{padding-inline:15px}.island{width:69px}.check-body{padding-inline:12px}.sound-summary{gap:5px}.sound-summary>div{gap:5px;font-size:10px}.lyric-current{font-size:30px}.live-document{margin-inline:12px;padding-inline:10px;font-size:9px}.lyric-stage{padding-inline:20px}.live-bottom{margin-inline:12px;padding-inline:12px}.demo-cue{gap:6px}.demo-cue>span:nth-child(2){padding-left:8px}}@media (prefers-reduced-motion:reduce){.product-demo *,.product-demo :before{transition:none!important;animation:none!important}}.phone-window{height:480px;padding-top:12px;position:relative;overflow:clip}.phone-window:after{content:"";pointer-events:none;background:linear-gradient(#0000,#f1f4f5);height:76px;position:absolute;inset:auto 0 0}.phone-window .phones{transform:translateY(var(--reveal-offset,0px));opacity:var(--reveal-opacity,1);align-items:start}.phone-window .live-phone{padding-top:0}.phone-window .between-phones{align-self:center}.preview-size-control{justify-content:center;margin-top:4px;display:flex}.preview-size-control .demo-icon{color:#667b6d;background:#e6ebe7}.product-demo .demo-captions{margin-top:12px}.product-demo[data-expanded=false] .check-body{flex:none;height:322px;padding-bottom:35px}.product-demo[data-expanded=false] .check-body h4{margin-bottom:8px;font-size:24px}.product-demo[data-expanded=false] .setup-label{display:none}.product-demo[data-expanded=false] .sound-summary{padding-block:12px}.product-demo[data-expanded=false] .timeline-heading{padding-top:12px;padding-bottom:4px}.product-demo[data-expanded=false] .block-toggle{min-height:40px;padding-block:6px}.product-demo[data-expanded=false] .check-bottom{visibility:hidden}.product-demo[data-expanded=true] .phone-window{height:760px;overflow:visible}.product-demo[data-expanded=true] .phone-window:after{display:none}@media (width<=760px){.phone-window{height:470px}.product-demo[data-expanded=true] .phone-window{height:750px}}@media (prefers-reduced-motion:reduce){.phone-window .phones{opacity:1;transform:none}}
