:root{--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light dark;--brochain-control-size:60px;--brochain-control-size-compact:44px;--brochain-avatar-tag-size:40px;--brochain-appbar-height:64px;--brochain-control-radius:4px;--brochain-badge-size:20px;--brochain-list-bottom-padding:calc(var(--brochain-appbar-height) + 1rem);--brochain-spacing:1rem;--brochain-color-primary:#8fa3e0;--brochain-color-secondary:#d3d3d3;--brochain-color-control:#b8b8b8;--brochain-color-confirmation:#91e383;--brochain-color-rejection:#e38383;--brochain-color-connected:#91e383;--brochain-color-disconnected:#6b8fe0;--brochain-color-unavailable:#b8b8b8;--brochain-color-surface:#b1b2b5;--brochain-color-on-surface:#1a1a1a;--brochain-color-border:#a0a0a5;--brochain-color-avatar:#9b8fe0;--brochain-color-peer-a:#6b8fe0;--brochain-color-peer-a-background:#e7ecfa;--brochain-color-peer-b:#e0a05f;--brochain-color-peer-b-background:#faeee1;--brochain-background:#fff;--brochain-surface:var(--brochain-color-surface);--brochain-text:var(--brochain-color-on-surface);--brochain-muted-text:#5a5a60;--brochain-border:var(--brochain-color-border)}@media (prefers-color-scheme:dark){:root{--lightningcss-light: ;--lightningcss-dark:initial;--brochain-color-secondary:#4a4a4e;--brochain-color-control:#5c5c62;--brochain-color-unavailable:#5c5c62;--brochain-color-surface:#0f172a;--brochain-color-on-surface:#f5f5f7;--brochain-color-border:#33333a;--brochain-color-avatar:#8a7acb;--brochain-color-peer-a:#7c9ae8;--brochain-color-peer-a-background:#232a42;--brochain-color-peer-b-background:#3a2e20;--brochain-background:#0a0d14;--brochain-muted-text:#a3a3ab}}*,:before,:after{box-sizing:border-box}html,body{background:var(--brochain-background);color:var(--brochain-text);margin:0;padding:0;font-family:system-ui,-apple-system,Segoe UI,sans-serif}.app-shell{flex-direction:column;max-width:480px;height:100dvh;margin-inline:auto;display:flex;overflow:hidden}.sr-only{width:1px;height:1px;position:absolute;overflow:hidden}.text-button{border:1px solid var(--brochain-border);border-radius:var(--brochain-control-radius);background:var(--brochain-background);color:var(--brochain-text);font:inherit;cursor:pointer;align-self:flex-start;padding:.5rem 1rem}.text-button:disabled{opacity:.5;cursor:not-allowed}[role=alert]{color:var(--brochain-color-rejection);font-weight:600}.avatar{--avatar-size:60px;width:var(--avatar-size);height:var(--avatar-size);font:inherit;background:0 0;border:none;flex:none;place-items:center;padding:0;display:grid;position:relative}.avatar.sm{--avatar-size:30px;font-size:.7rem}.avatar.lg{--avatar-size:120px;font-size:2rem}.avatar.tag-start,.avatar.tag-end{--avatar-size:var(--brochain-avatar-tag-size);font-size:.85rem}.avatar.tag-start .avatar-circle,.avatar.tag-end .avatar-circle{width:100%;height:100%}.avatar.tag-start .avatar-circle{border-radius:999px 0 0 999px}.avatar.tag-end .avatar-circle{border-radius:0 999px 999px 0}button.avatar{cursor:pointer}button.avatar:focus-visible{outline:2px solid var(--brochain-color-primary);outline-offset:2px;border-radius:50%}.avatar-circle{color:#fff;background:var(--avatar-color,var(--brochain-color-avatar));border-radius:50%;place-items:center;width:calc(100% - 4px);height:calc(100% - 4px);font-weight:700;display:grid;overflow:hidden}.avatar-circle img{object-fit:cover;width:100%;height:100%}.textfield{min-height:var(--brochain-control-size);align-items:center;display:flex;position:relative}.textfield input{width:100%;height:var(--brochain-control-size);border:none;border-bottom:1px solid var(--brochain-color-on-surface);color:var(--brochain-color-on-surface);font:inherit;background:0 0;border-radius:0;margin:0;padding:1.1rem 0 .3rem}.textfield input:focus{border-bottom-color:var(--brochain-color-primary);outline:none}.textfield input:disabled{opacity:.5}.textfield label{inset-inline-start:0;color:var(--brochain-muted-text);pointer-events:none;transition:top .15s,font-size .15s,transform .15s;position:absolute;top:50%;transform:translateY(-50%)}.textfield input:focus+label,.textfield input:not(:placeholder-shown)+label{font-size:.75rem;top:.6rem;transform:translateY(0)}.button{width:var(--brochain-control-size);height:var(--brochain-control-size);border-radius:var(--brochain-control-radius);cursor:pointer;color:var(--brochain-color-on-surface);background:var(--brochain-color-control);border:none;flex:none;place-items:center;padding:0;font-size:1.5rem;line-height:1;display:grid}.button.compact{width:var(--brochain-control-size-compact);height:var(--brochain-control-size-compact);font-size:1.25rem}.button.sm{width:32px;height:32px;font-size:.95rem}.button:disabled{opacity:.5;cursor:not-allowed}.button:focus-visible{outline:2px solid var(--brochain-color-primary);outline-offset:2px}.button.primary{background:var(--brochain-color-primary)}.button.confirmation{background:var(--brochain-color-confirmation)}.button.rejection{background:var(--brochain-color-rejection)}.actionbar{height:var(--brochain-appbar-height);background:var(--brochain-surface);flex:none;align-items:center;gap:12px;padding-inline:12px;display:flex}.actionbar-end{align-items:center;gap:12px;min-width:0;margin-inline-start:auto;display:flex}.action-group{gap:0;display:flex}.action-group>.button{border-radius:0}.action-group>.button:first-child{border-start-start-radius:var(--brochain-control-radius);border-end-start-radius:var(--brochain-control-radius)}.action-group>.button:last-child{border-start-end-radius:var(--brochain-control-radius);border-end-end-radius:var(--brochain-control-radius)}.badge{width:var(--brochain-badge-size);height:var(--brochain-badge-size);border:2px solid var(--brochain-background);border-radius:50%;place-items:center;font-size:.7rem;line-height:1;display:grid;position:absolute}.badge[data-variant=unread]{background:var(--brochain-color-primary);color:var(--brochain-color-on-surface);top:0;right:0;transform:translate(35%,-35%)}.badge[data-variant=call]{color:#fff;background:#3fa34d;bottom:0;right:0;transform:translate(35%,35%)}.badge[data-variant=connection]{bottom:0;right:0;transform:translate(35%,35%)}.badge[data-state=connected]{background:var(--brochain-color-connected)}.badge[data-state=disconnected]{background:var(--brochain-color-disconnected)}.badge[data-state=unavailable]{background:var(--brochain-color-unavailable)}.badge[data-variant=call][data-mode=incoming]{animation:1.2s ease-in-out infinite badge-pulse}@keyframes badge-pulse{50%{opacity:.45}}@media (prefers-reduced-motion:reduce){.badge[data-variant=call][data-mode=incoming]{animation:none}}.statusbar{height:var(--brochain-appbar-height);background:var(--brochain-surface);flex:none;align-items:center;gap:12px;padding-inline:12px;display:flex}.statusbar-icon{flex:none;font-size:1.5rem;line-height:1}.statusbar-title{white-space:nowrap;text-overflow:ellipsis;flex:auto;min-width:0;margin:0;font-size:1.25rem;overflow:hidden}.statusbar-notifications{scrollbar-width:none;flex:none;align-items:center;gap:8px;max-width:50%;margin:0;margin-inline-start:auto;padding:0;list-style:none;display:flex;overflow-x:auto}.statusbar-notifications::-webkit-scrollbar{display:none}.statusbar-notifications>li{flex:none}.handheld{flex-direction:column;flex:1;min-height:0;display:flex}.handheld-body{display:contents}.handheld-content{gap:var(--brochain-spacing);min-height:0;padding:var(--brochain-spacing);flex-direction:column;flex:1;display:flex;overflow-y:auto}.handheld-content>:first-child{margin-block-start:auto}.handheld-content.bleed{gap:0;padding:0}.identity{flex-direction:column;flex:1;justify-content:center;align-items:center;gap:.75rem;margin:0;display:flex}.identity figcaption{font-size:1.25rem;font-weight:700}.list{flex-direction:column;gap:8px;margin:0;padding:0;list-style:none;display:flex}.listitem{min-height:var(--brochain-control-size);border-radius:var(--brochain-control-radius);background:var(--brochain-color-secondary);align-items:center;gap:12px;padding-inline:12px;display:flex;position:relative}.listitem-label{text-overflow:ellipsis;white-space:nowrap;text-align:start;min-width:0;color:inherit;font:inherit;background:0 0;border:none;flex:1;margin:0;padding:0;overflow:hidden}.listitem-surface{cursor:pointer}.listitem-surface:after{content:"";border-radius:inherit;position:absolute;inset:0}.listitem-surface:focus-visible:after{outline:2px solid var(--brochain-color-primary);outline-offset:-2px}.listitem>button.avatar,.listitem-actions{z-index:1;position:relative}.listitem-actions{flex:none;align-items:center;gap:8px;display:flex}.card{padding:var(--brochain-spacing);border-radius:var(--brochain-control-radius);background:var(--brochain-surface);gap:var(--brochain-spacing);flex-direction:column;margin:0;display:flex}.password-strength{grid-template-columns:repeat(4,1fr);gap:.25rem;margin-block:.35rem;display:grid}.password-strength span{background:var(--brochain-color-control);border-radius:.25rem;min-height:.45rem;display:block}.password-strength[data-level="1"] span.active{background:var(--brochain-color-rejection)}.password-strength[data-level="2"] span.active{background:#ef6c00}.password-strength[data-level="3"] span.active{background:#c9a400}.password-strength[data-level="4"] span.active{background:var(--brochain-color-confirmation)}.conference{background:#1a1a1a;flex:1;min-height:0;position:relative}.conference video{background:#1a1a1a}.conference .remote{object-fit:cover;width:100%;height:100%}.conference .local{aspect-ratio:3/4;object-fit:cover;border-radius:var(--brochain-control-radius);border:2px solid var(--brochain-background);width:20%;position:absolute;bottom:.75rem;right:.75rem}.call-stage{flex-direction:column;flex:1;min-height:0;display:flex;position:relative}.call-captions{padding:.5rem var(--brochain-spacing);pointer-events:none;color:#fff;text-shadow:0 1px 3px #000c;flex-direction:column;gap:.25rem;display:flex;position:absolute;inset-block-start:0;inset-inline:0}.call-captions p{margin:0}.call-captions [role=alert]{color:var(--brochain-color-rejection)}.call-ended{padding:var(--brochain-spacing)}.feed{flex-direction:column;gap:8px;margin:0;padding:0;list-style:none;display:flex}.feed-entry{align-items:flex-start;gap:0;display:flex}.feed-entry[data-direction=sent]{flex-direction:row-reverse}.bubble{min-width:0;min-height:var(--brochain-avatar-tag-size);color:var(--brochain-color-on-surface);flex-direction:column;flex:1;justify-content:center;align-self:stretch;gap:.25rem;padding:10px 12px;display:flex}.feed-entry[data-direction=received] .bubble{border-radius:0 8px 8px 0}.feed-entry[data-direction=sent] .bubble{border-radius:8px 0 0 8px}.bubble p{margin:0}.feed-entry[data-icon] .avatar{align-self:stretch;height:auto}.call-record{justify-content:space-between;align-items:center;gap:.5rem;display:flex}.call-record-actions{flex:none;align-items:center;gap:8px;display:flex}.compose-bar{padding:var(--brochain-spacing);background:var(--brochain-background);flex:none;align-items:stretch;gap:0;display:flex}.compose-bar .pill{min-width:0;min-height:var(--brochain-avatar-tag-size);border-radius:8px 0 0 8px;flex:1;align-items:center;gap:.5rem;padding-inline:.75rem;display:flex}.compose-bar .pill textarea{min-width:0;color:var(--brochain-text);font:inherit;resize:none;field-sizing:content;background:0 0;border:none;flex:1;max-height:7.5rem;margin-block:.6rem;padding:0;overflow-y:auto}.compose-bar .pill textarea:focus{outline:none}.compose-bar .pill textarea::placeholder{color:var(--brochain-muted-text)}.compose-bar .attach-button{cursor:pointer;background:0 0;border:none;flex:none;align-self:flex-end;margin-block:.5rem;padding:0;font-size:1.2rem;line-height:1}.compose-bar .send-button{width:var(--brochain-avatar-tag-size);height:var(--brochain-avatar-tag-size);color:#fff;cursor:pointer;border:none;border-radius:0 999px 999px 0;flex:none;align-self:flex-end;place-items:center;font-size:1.1rem;display:grid}.compose-bar .send-button:disabled,.compose-bar .attach-button:disabled{opacity:.5;cursor:not-allowed}.dialog{width:min(300px, calc(100% - 2 * var(--brochain-spacing)));padding:var(--brochain-spacing);border-radius:var(--brochain-control-radius);background:var(--brochain-surface);color:var(--brochain-text);font:inherit;border:none}.dialog::backdrop{background:#00000080}.dialog h2{margin:0;font-size:1.125rem;font-weight:400}.dialog form{flex-direction:column;gap:.75rem;margin-block-start:.75rem;display:flex}.dialog-actions{justify-content:flex-end;gap:.75rem;display:flex}.facts{gap:.25rem var(--brochain-spacing);grid-template-columns:auto minmax(0,1fr);margin:0;display:grid}.facts dt{color:var(--brochain-muted-text);font-weight:600}.facts dd{min-width:0;margin:0}.facts-clipped{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.facts-addresses summary{cursor:pointer;color:var(--brochain-muted-text);font-weight:600}.facts-addresses ul{margin:.5rem 0 0;padding-inline-start:1.25rem}.facts-addresses p{margin:.5rem 0 0}.editable-label{text-align:center;justify-content:center;align-items:center;gap:.5rem;max-width:100%;display:flex}.editable-label .value{text-overflow:ellipsis;white-space:nowrap;min-width:0;font-size:1.25rem;overflow:hidden}.editable-label label{min-width:0;display:flex}.editable-label .button{flex:none}.editable-label input{border:none;border-bottom:1px solid var(--brochain-border);text-align:center;min-width:0;max-width:12rem;color:var(--brochain-text);background:0 0;border-radius:0;margin:0;font-family:inherit;font-size:1.25rem}.editable-label input:focus{border-bottom-color:var(--brochain-color-primary);outline:none}.identity-block{flex-direction:column;align-items:center;gap:.75rem;margin:0;display:flex}.identity-block figcaption{width:100%}.identity-block-actions{justify-content:center;gap:.5rem;display:flex}.toggle-row{justify-content:space-between;align-items:center;gap:var(--brochain-spacing);min-height:var(--brochain-control-size);border-radius:var(--brochain-control-radius);background:var(--brochain-color-secondary);margin-block-end:.5rem;padding-inline:.75rem;display:flex}.toggle-row label{align-items:center;gap:.5rem;margin:0;display:flex}.toggle-row small{color:var(--brochain-muted-text)}.toggle-row input[type=checkbox]{appearance:none;background:var(--brochain-background);cursor:pointer;border-radius:1.25rem;flex:none;width:2.25rem;height:1.25rem;margin:0;transition:background .15s;position:relative}.toggle-row input[type=checkbox]:before{content:"";background:#fff;border-radius:50%;width:1rem;height:1rem;transition:left .15s;position:absolute;top:2px;left:2px}.toggle-row input[type=checkbox]:checked{background:var(--brochain-color-primary)}.toggle-row input[type=checkbox]:checked:before{left:calc(100% - 1.125rem)}.toggle-row input[type=checkbox]:disabled{opacity:.5;cursor:not-allowed}
