.demo{--red:#d62311;background:var(--color-ink-3);border:1px solid var(--color-line);border-radius:1.25rem;flex-direction:column;display:flex;overflow:hidden;box-shadow:0 30px 70px -30px #000000b3}.demo-tabs{border-bottom:1px solid var(--color-line);gap:4px;padding:8px 10px 0;display:flex}.demo-tabs button{color:var(--color-mute);cursor:pointer;border:1px solid #0000;border-bottom:0;border-radius:10px 10px 0 0;margin-bottom:-1px;padding:8px 16px;font-size:.88rem;font-weight:600}.demo-tabs button:hover{color:#fff}.demo-tabs button[aria-pressed=true]{background:var(--color-ink-2);color:#fff;border-color:var(--color-line)}.demo-bar{background:var(--color-ink-2);border-bottom:1px solid var(--color-line);flex-wrap:wrap;align-items:center;gap:8px 14px;padding:10px 14px;display:flex}.seg{flex-wrap:wrap;gap:4px;display:inline-flex}.seg button{border:1px solid var(--color-line);color:#fff;cursor:pointer;border-radius:999px;padding:5px 12px;font-size:.85rem;font-weight:500}.seg button[aria-pressed=true]{color:var(--color-ink);background:#fff;border-color:#fff}.tplsel{border:1px solid var(--color-line);background:var(--color-ink);color:#fff;border-radius:999px;flex:10rem;min-width:0;padding:6px 12px;font-size:.85rem;font-weight:500}.email{color:#2c2c2a;background:#fff;padding:16px 20px;font-family:Arial,Helvetica,sans-serif;font-size:.88rem;line-height:1.5}.email .meta{color:#6b7280;border-bottom:1px solid #e5e7eb;gap:2px;margin-bottom:12px;padding-bottom:8px;font-size:.8rem;display:grid}.email .meta b{color:#2c2c2a;font-weight:600}.email .ccnote{font-size:.75rem}.email .banner{background:var(--red);color:#fff;border-radius:6px;margin-bottom:12px;padding:10px 14px;font-size:1rem;font-weight:700}.email .etitle{color:var(--red);margin:0 0 6px;font-size:1.1rem;font-weight:700}.email p{margin:0}.email p+p,.email p+div,.email div+p{margin-top:8px}.email .panel{border-top:4px solid var(--red);background:#f8f7f4;margin-top:10px;padding:10px 12px}.email .panel .k{letter-spacing:.06em;text-transform:uppercase;color:var(--red);font-size:.7rem;font-weight:700}.email .panel .t{font-weight:600}.email .plinks{flex-wrap:wrap;gap:4px 16px;margin-top:6px;display:flex}.email .plinks span{color:var(--red);font-size:.85rem;font-weight:600}.email .qrow{border-bottom:1px solid #ecebe6;justify-content:space-between;gap:10px;padding:3px 0;display:flex}.email .attach{color:#374151;border:1px solid #e5e7eb;border-radius:8px;align-items:center;gap:8px;margin-top:10px;padding:5px 10px;font-size:.82rem;display:inline-flex}.email .attach svg{width:16px;height:16px;color:var(--red)}.email .recs{flex-direction:column;margin-top:10px;display:flex}.email .recs b{color:var(--red);font-size:.92rem}.email .rec{border-bottom:1px solid #ecebe6;justify-content:space-between;align-items:center;gap:10px;padding:4px 0;font-size:.85rem;display:flex}.email .rec em{color:#fff;background:var(--red);border-radius:4px;flex:none;padding:2px 9px;font-size:.75rem;font-style:normal;font-weight:600}.email .sig{align-items:flex-start;gap:12px;margin-top:14px;display:flex}.email .sig .ph{flex:none;width:44px;height:54px}.email .sig .ph svg{border-radius:6px;width:100%;height:100%;display:block}.email .sig .nm{color:var(--red);font-weight:700}.email .sig .tt{color:#535353}.email .sig small{color:#666;width:fit-content;display:block}.fill{-webkit-box-decoration-break:clone;box-decoration-break:clone;background:#fff4cc;border-radius:4px;padding:0 3px;transition:background .6s}.fill.flash{background:#ffe58a}.typed{border:1.5px dashed #8a96a3;border-radius:4px;padding:0 4px}.demo-foot{color:#566778;background:#fff;border-top:1px solid #e5e7eb;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:10px 14px;padding:10px 14px;font-size:.8rem;display:flex}.demo-foot .legend{flex:14rem}.key{color:#2c2c2a;border-radius:4px;padding:0 4px}.fillkey{background:#fff4cc}.typedkey{border:1.5px dashed #8a96a3}.demo-foot .actions{flex-wrap:wrap;gap:8px;display:flex}.pm-btn{cursor:pointer;border-radius:6px;justify-content:center;align-items:center;gap:6px;padding:7px 14px;font-size:.85rem;font-weight:600;line-height:1.2;text-decoration:none;transition:background .15s,color .15s;display:inline-flex}.pm-btn svg{flex:none;width:16px;height:16px}.pm-solid{color:#fff;background:#6875f5;border:1px solid #6875f5}.pm-solid:hover{background:#5462e6}.pm-outline{color:#3b82c4;background:#fff;border:1px solid #8ec5ff}.pm-outline:hover{background:#eef6ff}.smsview{color:#111;background:#fff;flex-direction:column;flex:auto;justify-content:center;padding:22px 18px;display:flex}.smsview[hidden],.email[hidden]{display:none}.phone{color:#111;background:#fff;border-radius:34px;width:min(340px,100%);margin-inline:auto;padding:18px 16px 22px;box-shadow:0 30px 70px -30px #000000b3}.phone-top{border-bottom:1px solid #e5e7eb;flex-direction:column;align-items:center;gap:4px;margin-bottom:16px;padding-bottom:14px;display:flex}.phone-top .av{color:#fff;background:#d62311;border-radius:50%;place-items:center;width:44px;height:44px;font-size:.95rem;font-weight:700;display:grid}.phone-top b{font-size:.92rem}.phone-top small{color:#6b7280;font-size:.78rem}.bubble{color:#111;background:#e9e9eb;border-radius:18px 18px 18px 5px;max-width:92%;padding:10px 14px;font-size:.95rem;line-height:1.45}.sms-meta{color:#6b7280;margin-top:8px;font-size:.76rem}.paired{color:#6b7280;margin-top:18px;font-size:.84rem}.paired b{color:#111;font-weight:600}.morebtn{display:none}@media (width>=1024px){.demo{max-height:calc(100vh - 6rem);position:sticky;top:5rem}.email{flex:auto;min-height:0;overflow-y:auto}}@media (width<=1023px){.email.clamp{max-height:440px;position:relative;overflow:hidden}.email.clamp:after{content:"";background:linear-gradient(#fff0,#fff);height:90px;position:absolute;inset:auto 0 0}.morebtn{color:#3b82c4;cursor:pointer;background:#fff;border-top:1px solid #e5e7eb;justify-content:center;align-items:center;width:100%;min-height:44px;font-size:.95rem;font-weight:600;display:flex}.morebtn[hidden]{display:none}.seg button,.tplsel,.demo-tabs button,.pm-btn{min-height:44px}}.lib{border:1px solid var(--color-line);background:var(--color-ink-2);border-radius:1rem;grid-template-columns:250px 1fr;display:grid;overflow:hidden}.folders{background:var(--color-ink);border-right:1px solid var(--color-line);flex-direction:column;gap:2px;padding:10px;display:flex}.folders button{color:#fff;text-align:left;cursor:pointer;border-radius:10px;align-items:center;gap:10px;min-height:44px;padding:8px 12px;font-size:.95rem;font-weight:600;display:flex}.folders button svg{width:18px;height:18px;color:var(--color-bolt-soft);flex:none}.folders button:hover{background:#ffffff0d}.folders button[aria-pressed=true]{color:var(--color-bolt-soft);background:#0075ff2e}.tpl{padding:18px 22px 8px}.tpl .desc{color:var(--color-mute);padding-bottom:10px;font-size:.95rem}.tpl li{border-top:1px solid var(--color-line);grid-template-columns:20px 1fr auto;align-items:center;gap:12px;padding:11px 0;display:grid}.tpl li svg{width:18px;height:18px;color:var(--color-mute)}.tpl li small{color:var(--color-mute);text-align:right;font-size:.82rem}.tpl li.more{color:var(--color-mute);border-top-style:dashed;font-size:.9rem}@media (width<=760px){.lib{grid-template-columns:1fr}.folders{border-right:0;border-bottom:1px solid var(--color-line);scrollbar-width:none;flex-direction:row;overflow-x:auto}.folders button{white-space:nowrap}.tpl li{grid-template-columns:20px 1fr}.tpl li small{text-align:left;grid-column:2}}@media (prefers-reduced-motion:reduce){.fill{transition:none}}