body{margin:0;background:#171b2d;color:#e9edf6;font:14px/1.7 NotoTC,sans-serif}*{box-sizing:border-box}main{width:min(800px,100%);padding:32px 20px;margin:auto}.phone-demo{position:relative;width:min(402px,100%);aspect-ratio:402 / 800;height:auto;margin:0 auto 36px;padding:0 12px;display:flex;align-items:center;justify-content:center;isolation:isolate;background:#272a40;overflow:hidden;border-radius:24px}.phone-demo .progress-card{margin:0;flex:none}h2{font-size:18px;line-height:1.4;margin:0 0 10px}.reference{margin:0 0 30px;padding-top:24px;border-top:1px solid #3b465e}.reference p{margin:0 0 12px;color:#c7cfdf}.reference .note{font-size:12px;color:#99a7bd}details{margin:10px 0;border:1px solid #414d65;border-radius:9px;overflow:hidden}summary{padding:10px 14px;background:#242d43;cursor:pointer}.codebar{display:flex;justify-content:flex-end;padding:8px;gap:10px}.copy{font:inherit;border:1px solid #64718b;border-radius:6px;padding:5px 12px;background:#303b55;color:white;cursor:pointer}.copy:focus-visible,summary:focus-visible{outline:2px solid #ffe49a;outline-offset:2px}pre{max-height:300px;overflow:auto;background:#101626;color:#dce4f4;margin:0;padding:14px;font:12px/1.8 ui-monospace,monospace;tab-size:2}a{color:#ffe49a}.download{font-size:12px;text-align:center}.progress-overlay{background:none}@media(max-width:440px){main{padding:16px 12px}.phone-demo{padding:0 12px;border-radius:16px}}
.demo-title{width:min(402px,100%);margin:0 auto 14px;font-size:18px;font-weight:700;line-height:1.4}

.code-title{margin:18px 0 10px;color:#adb9cc;font-size:13px;font-weight:500}

.demo-tabs{width:min(402px,100%);display:flex;gap:4px;padding:4px;border:1px solid #414d65;border-radius:10px;margin:0 auto 16px;background:#20273a}.demo-tabs button{flex:1;border:0;border-radius:7px;padding:8px 12px;font:inherit;font-size:13px;color:#aab6cc;background:transparent;cursor:pointer}.demo-tabs button[aria-selected="true"]{color:#fff;background:#404b65}.demo-tabs button:disabled{opacity:.5;cursor:default}.demo-tabs button:focus-visible{outline:2px solid #ffe49a;outline-offset:2px}.phone-demo [hidden]{display:none!important}

.no-progress .action-row{justify-content:center;position:relative;top:4px}.no-progress .continue{flex:0 0 calc(100% - 66px)}

.phone-demo .progress-card.no-progress{padding-bottom:22px}
