.nm-demo{display:grid;grid-template-columns:minmax(0,1fr) minmax(300px,400px);gap:64px;align-items:center;padding:48px;background:#32131d;color:#fff;border-radius:16px;box-sizing:border-box}
.nm-demo *{box-sizing:border-box}
.nm-demo .nm-kicker{display:block;font-size:12px;line-height:1.5;color:#d4bcc6;margin-bottom:18px}
.nm-demo .nm-explanation>h3{font-size:36px;font-weight:400;line-height:1.15;letter-spacing:-.025em;color:#fff;margin:0 0 20px}
.nm-demo .nm-intro{font-size:16px;line-height:1.6;color:#d4bcc6;margin:0 0 32px}
.nm-demo ol{padding:0;margin:0;list-style:none}
.nm-demo li{display:grid;grid-template-columns:28px minmax(0,1fr);gap:16px;padding:20px 0;border-top:1px solid #78555f}
.nm-demo li>span{font-size:12px;line-height:26px;color:#ff5a2b}
.nm-demo li h4{font-size:18px;font-weight:400;line-height:1.4;margin:0 0 8px;color:#fff}
.nm-demo li p{font-size:14px;line-height:1.6;margin:0;color:#d4bcc6}
.nm-demo .nm-disclaimer{font-size:12px;line-height:1.6;margin:24px 0 0;color:#d4bcc6}
.nm-demo .nm-device{margin:0;min-width:0}
.nm-demo .nm-device>figcaption{font-size:12px;line-height:1.5;color:#d4bcc6;text-align:center;margin:0 0 16px}
.nm-demo .nm-phone{width:100%;max-width:360px;margin:auto;border:8px solid #181818;border-radius:40px;background:#fff;box-shadow:0 0 0 1px #70505c,0 24px 48px #16080d66;color:#171717;overflow:hidden;position:relative}
.nm-demo .nm-status{display:flex;justify-content:space-between;align-items:center;padding:16px 22px 10px;font-size:11px;font-weight:500;line-height:16px;color:#171717}
.nm-demo .nm-thread{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:8px 20px 16px;border-bottom:1px solid #e6e6e6;background:#fafafa;color:#777;font-size:22px}
.nm-demo .nm-sender{display:grid;justify-items:center;gap:4px}
.nm-demo .nm-sender>b{display:grid;place-items:center;width:34px;height:34px;border-radius:50%;background:#dedbdc;color:#32131d;font-size:17px;line-height:1;font-weight:500}
.nm-demo .nm-sender>strong{font-size:13px;line-height:18px;color:#171717;font-weight:500}
.nm-demo .nm-sender>small{font-size:10px;line-height:14px;color:#777}
.nm-demo .nm-history{padding:18px 16px 28px;display:flex;flex-direction:column;gap:14px}
.nm-demo .nm-day{text-align:center;color:#999;font-size:10px;line-height:16px;margin-bottom:4px}
.nm-demo .nm-message{max-width:92%;padding:12px 14px 8px;background:#efeeee;border-radius:16px 16px 16px 4px;color:#171717}
.nm-demo .nm-message>p{font-size:14px;line-height:1.45;font-weight:400;margin:0;color:#171717}
.nm-demo .nm-example-link{display:block;font-size:14px;line-height:1.5;color:#2464a8;margin-top:4px;overflow-wrap:anywhere}
.nm-demo .nm-message>small{display:block;text-align:right;margin-top:6px;font-size:9px;line-height:14px;color:#777}
.nm-demo .nm-message.nm-outgoing{align-self:flex-end;background:#e1f0df;border-radius:16px 16px 4px 16px;max-width:82%}
.nm-demo .nm-input{display:flex;justify-content:space-between;align-items:center;margin:0 16px 18px;padding:8px 10px 8px 14px;border:1px solid #ddd;border-radius:22px;font-size:12px;line-height:18px;color:#999}
.nm-demo .nm-input>i{font-style:normal;background:#d9d9d9;color:#fff;display:grid;place-items:center;width:24px;height:24px;border-radius:50%;font-size:18px}
.nm-demo .nm-home{width:100px;height:4px;border-radius:4px;background:#171717;margin:0 auto 8px}
@media(max-width:1000px){.nm-demo{gap:32px;padding:32px;grid-template-columns:minmax(0,1fr) minmax(260px,340px)}.nm-demo .nm-explanation>h3{font-size:28px}}
@media(max-width:700px){.nm-demo{grid-template-columns:1fr;gap:32px;padding:20px 16px}.nm-demo .nm-device{order:0}.nm-demo .nm-explanation{order:1}.nm-demo .nm-device>figcaption{max-width:280px;margin:0 auto 16px}.nm-demo .nm-explanation>h3{font-size:27px}.nm-demo .nm-intro{font-size:14px;margin-bottom:24px}.nm-demo li{gap:12px}.nm-demo li h4{font-size:17px}}
@media(max-width:359px){.nm-demo{padding:18px 12px}.nm-demo .nm-phone{border-width:6px;border-radius:30px}.nm-demo .nm-history{padding:16px 10px 22px}.nm-demo .nm-message{max-width:96%;padding:11px 12px 8px}.nm-demo .nm-message>p,.nm-demo .nm-example-link{font-size:13px}.nm-demo .nm-thread{padding-inline:14px}}