:root{--bg: #f4f5f7;--card: #ffffff;--text: #1a1d21;--muted: #666e7a;--border: #e3e6ea;--accent: #2f6fed;--accent-text: #ffffff;--accent-ink: #2f6fed;--accent-hover: #2861d8;--accent-active: #2154bd;--error: #c0392b;--ok: #1e8449;--warn: #a05e00;--wash: rgba(127, 127, 127, .14);--wash-strong: rgba(127, 127, 127, .18);--on-accent-muted: rgba(255, 255, 255, .78);--on-accent-wash: rgba(255, 255, 255, .18);--scrim: rgba(0, 0, 0, .45);--font-ui: system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;--font-mono: ui-monospace, "Cascadia Code", Consolas, monospace;--fs-micro: 11px;--fs-tiny: 12px;--fs-small: 13px;--fs-compact: 14px;--fs-base: 15px;--fs-title: 16px;--fs-lead: 18px;--fs-h2: 20px;--fs-h1: 24px;--fs-logo: 28px;--fw-regular: 400;--fw-medium: 500;--fw-semibold: 600;--fw-bold: 700;--lh-base: 1.5;--lh-input: 1.4;--space-1: 1px;--space-2: 2px;--space-4: 4px;--space-6: 6px;--space-8: 8px;--space-10: 10px;--space-12: 12px;--space-14: 14px;--space-16: 16px;--space-18: 18px;--space-20: 20px;--space-24: 24px;--space-32: 32px;--r-badge: 4px;--r-sm: 6px;--r-md: 8px;--r-pill: 10px;--r-surface: 12px;--r-round: 50%;--control-h: 40px;--control-h-sm: 32px;--field-pad-y: 9px;--field-pad-x: 11px;--btn-pad-y: 10px;--btn-pad-x: 16px;--avatar-sm: 30px;--avatar-md: 44px;--avatar-lg: 72px;--avatar-xl: 96px;--gutter: 16px;--hairline: 1px solid var(--border);--focus-ring: 2px solid var(--accent);--select-ring: 1px solid var(--accent);color-scheme:light dark}@media(prefers-color-scheme:dark){:root{--bg: #16181d;--card: #1e2127;--text: #e8eaed;--muted: #9aa1ab;--border: #2c3038;--accent: #5b8def;--accent-text: #ffffff;--accent-ink: #5b8def;--accent-hover: #6d9bf2;--accent-active: #7fa9f7;--error: #e57373;--ok: #6ac47a;--warn: #d99b3a}}@media(max-width:720px){:root{--gutter: 8px}}:root{--dot-online: #2ecc71;--dot-away: #f1c40f;--dot-notavailable: #e67e22;--dot-dnd: #e74c3c;--dot-size: 9px;--r-bubble: 14px;--bubble-max: 70%;--bubble-attach-max: 340px;--tick-read: #bde0ff;--composer-max-h: 104px;--image-box: 300px;--image-loose-max-h: 320px;--attach-name-max: 200px;--workspace-max: 968px;--rail-min: 260px;--nav-h: 56px;--field-max: 520px;--auth-form-max: 360px;--settings-max: 760px;--modal-w: 460px}@media(max-width:720px){:root{--rail-min: 220px}}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--text);font:var(--fs-base)/var(--lh-base) var(--font-ui)}.splash{padding:48px;text-align:center;color:var(--muted)}.logo{font-size:var(--fs-logo);font-weight:var(--fw-bold);letter-spacing:-.5px;margin:0}.logo.small{font-size:var(--fs-lead)}.muted{color:var(--muted)}.small{font-size:var(--fs-small)}.hint{display:block;font-size:var(--fs-tiny);color:var(--muted);margin-top:var(--space-4)}.error{color:var(--error);font-size:var(--fs-compact)}.ok{color:var(--ok);font-size:var(--fs-compact);margin-left:var(--space-12)}.card{background:var(--card);border:var(--hairline);border-radius:var(--r-surface);padding:var(--space-20);display:flex;flex-direction:column;gap:var(--space-12)}.card h2{margin:0;font-size:var(--fs-title)}label{display:flex;flex-direction:column;gap:var(--space-6);font-size:var(--fs-small);color:var(--muted)}input,select,textarea{font:inherit;color:var(--text);background:var(--bg);border:var(--hairline);border-radius:var(--r-md);padding:var(--field-pad-y) var(--field-pad-x);width:100%}input:focus,select:focus,textarea:focus{outline:var(--focus-ring);outline-offset:-1px}input:disabled,select:disabled,textarea:disabled{opacity:.6;cursor:default}button{font:inherit;background:var(--accent);color:var(--accent-text);border:none;border-radius:var(--r-md);padding:var(--btn-pad-y) var(--btn-pad-x);cursor:pointer;align-self:flex-start}button:hover:not(:disabled):not(.link,.secondary,.peer-name,.status-text,.attach-image,.attach-file){background:var(--accent-hover)}button:active:not(:disabled):not(.link,.secondary,.peer-name,.status-text,.attach-image,.attach-file){background:var(--accent-active)}button:focus-visible{outline:var(--focus-ring);outline-offset:1px}button:disabled{opacity:.6;cursor:default}button.secondary{background:var(--bg);color:var(--text);border:var(--hairline)}button.secondary:hover:not(:disabled){background:var(--bg);border-color:var(--accent);color:var(--accent-ink)}button.link{background:none;color:var(--accent-ink);padding:0;text-decoration:underline}a{color:var(--accent-ink)}.invites{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:var(--space-8)}.invites li{display:flex;align-items:center;gap:var(--space-12)}.invites li.spent code{text-decoration:line-through;color:var(--muted)}.invites code{font-family:var(--font-mono);font-size:var(--fs-base);letter-spacing:1px;background:var(--bg);border:var(--hairline);border-radius:var(--r-sm);padding:var(--space-4) var(--space-8)}.placeholder{opacity:.7}.row{display:flex;align-items:center;gap:var(--space-12)}.subform{display:flex;flex-direction:column;gap:var(--space-12);padding:var(--space-14);border:var(--hairline);border-radius:var(--r-md)}.people{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:var(--space-2)}.people li{display:flex;align-items:center;gap:var(--space-10);padding:7px var(--space-8);border-radius:var(--r-md)}.people.found{border:var(--hairline);border-radius:var(--r-md);padding:var(--space-4)}.people .name{font-weight:var(--fw-medium)}.people .ellipsis{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.badge{margin-left:var(--space-6);font-size:var(--fs-micro);font-weight:var(--fw-regular);color:var(--muted);border:var(--hairline);border-radius:var(--r-badge);padding:var(--space-1) 5px}.dot{width:var(--dot-size);height:var(--dot-size);border-radius:var(--r-round);flex:0 0 auto;background:var(--muted)}.dot-online{background:var(--dot-online)}.dot-away{background:var(--dot-away)}.dot-notavailable{background:var(--dot-notavailable)}.dot-donotdisturb{background:var(--dot-dnd)}.dot-offline,.dot-invisible{background:var(--border);border:1px solid var(--muted)}.avatar{width:var(--avatar-sm);height:var(--avatar-sm);border-radius:var(--r-round);object-fit:cover;flex:0 0 auto;background:var(--bg)}.avatar.empty{display:grid;place-items:center;font-size:var(--fs-small);font-weight:var(--fw-semibold);color:var(--muted);border:var(--hairline)}.avatar.medium{width:var(--avatar-md);height:var(--avatar-md);font-size:var(--fs-lead)}.avatar.big{width:var(--avatar-lg);height:var(--avatar-lg);font-size:var(--fs-logo)}.avatar.huge{width:var(--avatar-xl);height:var(--avatar-xl);font-size:36px}.avatar-row{display:flex;align-items:center;gap:var(--space-14)}.token-box{display:flex;flex-direction:column;gap:var(--space-10);padding:var(--space-14);border:1px solid var(--accent);border-radius:var(--r-md)}.token{font-family:var(--font-mono);font-size:var(--fs-small);word-break:break-all;background:var(--bg);border:var(--hairline);border-radius:var(--r-sm);padding:var(--space-8) var(--space-10)}.icon{display:inline-flex;flex:none}.icon>svg{display:block;width:100%;height:100%}.main.auth-main{display:grid;place-items:center;overflow-y:auto;padding:var(--space-8)}.auth-card{width:min(100%,var(--auth-form-max))}.auth-nav{flex:1;min-height:0;overflow-y:auto;display:flex;flex-direction:column;align-items:flex-start;gap:var(--space-8);padding:var(--space-16) var(--space-12)}.auth-nav a{color:var(--accent-ink);text-decoration:none;padding:var(--space-4) var(--space-8);border-radius:var(--r-md)}.auth-nav a:hover{text-decoration:underline}.auth-nav a.active{color:var(--text);font-weight:var(--fw-semibold);background:var(--bg);outline:var(--select-ring);outline-offset:-1px;text-decoration:none}.auth-nav>span{padding-inline:var(--space-8)}.shell{height:100dvh;display:flex;flex-direction:column;overflow:hidden}.workspace{flex:1;min-height:0;display:grid;grid-template-columns:minmax(0,7fr) minmax(var(--rail-min),3fr);gap:var(--gutter);padding:var(--gutter);overflow:hidden;width:100%;max-width:var(--workspace-max);margin-inline:auto;position:relative}.workspace>*{min-width:0;min-height:0}.panel{background:var(--card);border:var(--hairline);border-radius:var(--r-surface);display:flex;flex-direction:column;min-height:0;overflow:hidden}[hidden]{display:none!important}.main{min-height:0;display:flex}.main>*{flex:1;min-height:0}.empty-chat{flex:1;align-items:center;justify-content:center;padding:var(--space-20);text-align:center}.settings-pane{flex:1;min-height:0;overflow-y:auto;display:grid;gap:var(--gutter);align-content:start;width:100%;max-width:var(--settings-max);margin-inline:auto;padding-right:var(--space-4)}.rail-profile{flex:0 0 auto;display:flex;flex-direction:column;gap:var(--space-8);padding:var(--space-12);border-bottom:var(--hairline)}.rail-id{display:flex;align-items:center;gap:var(--space-10);min-width:0}.rail-id-text{display:flex;flex-direction:column;min-width:0}.rail-name{font-size:var(--fs-title);font-weight:var(--fw-semibold);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.rail-uin{font-size:var(--fs-tiny);color:var(--muted)}.rail-profile .status-select{width:100%}.rail-profile .status-text,.rail-profile .status-text-input{width:100%;max-width:none}.rail-panel{flex:1;min-height:0;display:flex;flex-direction:column}.rail-nav{flex:0 0 auto;display:grid;grid-template-columns:repeat(3,1fr);gap:var(--space-4);padding:var(--space-6);border-top:var(--hairline)}.nav-btn{align-self:stretch;width:100%;min-height:var(--nav-h);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:var(--space-2);padding:var(--space-6) var(--space-2);background:none;color:var(--muted);border-radius:var(--r-md)}.nav-icon{display:inline-flex}.nav-label{font-size:var(--fs-micro)}.nav-btn:hover:not(:disabled){background:var(--bg);color:var(--text)}.nav-btn.selected{background:var(--bg);color:var(--accent-ink);outline:var(--select-ring);outline-offset:-1px}.tab{flex:1;min-height:0;display:flex;flex-direction:column}.tab-fixed{flex:0 0 auto;padding:var(--space-10) var(--space-10) var(--space-6)}.tab-scroll{flex:1;min-height:0;overflow-y:auto;padding:var(--space-6) var(--space-10) var(--space-10)}.tab-scroll>*+*{margin-top:var(--space-6)}.person{cursor:pointer}.person:hover{background:var(--bg)}.person.selected{background:var(--bg);outline:var(--select-ring);outline-offset:-1px}.person .remove{opacity:0;font-size:var(--fs-lead);line-height:1;flex:0 0 auto}.person:hover .remove{opacity:.6}.person .remove:focus-visible{opacity:1}.person .remove.plus{font-size:var(--fs-title)}.entry{display:flex;flex-direction:column;gap:var(--space-1);min-width:0;flex:1}.entry .ellipsis{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.unread{flex:0 0 auto;background:var(--accent);color:var(--accent-text);font-size:var(--fs-tiny);border-radius:var(--r-pill);padding:var(--space-1) 7px}.status-select{width:auto;font-size:var(--fs-compact);padding:var(--space-4) var(--space-8);border-radius:var(--r-sm)}.status-select.failed{outline:2px solid var(--error);outline-offset:-1px}.status-text,.status-text-input{font:inherit;font-size:var(--fs-compact);max-width:min(100%,var(--field-max));text-align:left}.status-text{background:none;border:1px dashed transparent;color:var(--text);padding:3px var(--space-6);border-radius:var(--r-sm);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;cursor:text}.status-text:hover{border-color:var(--border)}.status-text-input{width:min(100%,var(--field-max));padding:var(--space-2) var(--space-6);border-radius:var(--r-sm)}.modal{border:var(--hairline);border-radius:var(--r-surface);background:var(--card);color:var(--text);padding:0;width:min(92vw,var(--modal-w));max-height:85dvh;overflow:hidden;display:flex;flex-direction:column}.modal.wide{width:min(92vw,var(--settings-max))}.modal::backdrop{background:var(--scrim)}.modal-head{display:flex;align-items:center;gap:var(--space-12);padding:var(--space-14) var(--space-18);border-bottom:var(--hairline)}.modal-head h2{margin:0;font-size:var(--fs-title)}.modal-close{margin-left:auto;font-size:22px;line-height:1;text-decoration:none;color:var(--muted)}.modal-body{padding:var(--space-18);overflow-y:auto;display:grid;gap:var(--gutter)}.user-card{display:flex;gap:var(--space-18);align-items:flex-start}.user-card-info{display:flex;flex-direction:column;gap:var(--space-6);min-width:0}.user-card-name{font-size:var(--fs-lead);font-weight:var(--fw-semibold)}.user-card-status{padding:var(--space-8) var(--space-10);background:var(--bg);border:var(--hairline);border-radius:var(--r-md);word-break:break-word}@media(max-width:520px){.workspace{grid-template-columns:1fr}.workspace>.main{display:none}.workspace.has-peer>.main{display:flex;position:absolute;inset:var(--gutter);z-index:1}.main.auth-main{display:grid}}.chat{flex:1;min-height:0}.chat-head{display:flex;align-items:baseline;gap:var(--space-10);padding:var(--space-10) var(--gutter);border-bottom:var(--hairline);font-size:var(--fs-small)}.chat-head .typing{margin-left:auto;font-style:italic}.chat-back{display:none;place-items:center;align-self:center;flex:0 0 auto;width:var(--control-h);height:var(--control-h);margin-left:calc(var(--space-6) * -1);text-decoration:none;border-radius:var(--r-md)}.chat-back:hover{background:var(--bg);color:var(--accent-ink)}.peer-name{align-self:baseline;background:none;border:none;padding:0;color:inherit;font:inherit;font-size:var(--fs-base);font-weight:var(--fw-semibold);cursor:pointer}.peer-name:hover{color:var(--accent-ink)}.peer-status{flex:1;min-width:0}.messages{flex:1;overflow-y:auto;padding:var(--gutter)}.messages-inner{display:flex;flex-direction:column;gap:var(--space-6);min-height:100%;justify-content:flex-end}.bubble{max-width:var(--bubble-max);padding:var(--space-8) var(--space-12);border-radius:var(--r-bubble);display:flex;align-items:flex-end;gap:var(--space-10)}.bubble .text{white-space:pre-wrap;word-break:break-word}.bubble .meta{font-size:var(--fs-micro);opacity:.7;white-space:nowrap;display:flex;gap:var(--space-4)}.bubble.mine{align-self:flex-end;background:var(--accent);color:var(--accent-text)}.bubble.theirs{align-self:flex-start;background:var(--bg);border:var(--hairline)}.bubble.mine .muted{color:var(--on-accent-muted)}.bubble.mine .attach-file{background:var(--on-accent-wash)}.bubble.notice{color:var(--muted);font-size:var(--fs-small);font-style:italic}.ticks{display:inline-flex;align-items:center}.ticks.read{color:var(--tick-read)}.composer{display:flex;align-items:flex-end;gap:var(--space-8);padding:var(--space-8) var(--gutter) var(--space-10);border-top:var(--hairline)}.composer-field{flex:1;min-width:0;display:flex;align-items:flex-end;background:var(--bg);border:var(--hairline);border-radius:var(--r-bubble);padding-right:var(--space-4)}.composer-field:focus-within{outline:var(--focus-ring);outline-offset:-1px}.composer textarea{resize:none;overflow-y:auto;min-height:var(--control-h);max-height:var(--composer-max-h);line-height:var(--lh-input);background:none;border:none;padding:var(--field-pad-y) var(--space-4) var(--field-pad-y) var(--field-pad-x)}.composer textarea:focus{outline:none}.composer .send-btn{align-self:flex-end;flex:0 0 auto;width:var(--control-h);height:var(--control-h);padding:0;display:grid;place-items:center;border-radius:var(--r-round)}.bubble .body{display:flex;flex-direction:column;gap:var(--space-6);min-width:0}.bubble.with-attach{max-width:var(--bubble-attach-max)}.attach-image{padding:0;border:none;cursor:pointer;border-radius:var(--r-pill);overflow:hidden;display:block;max-width:var(--image-box);background:var(--wash-strong)}.attach-image img{width:100%;height:100%;object-fit:cover;display:block}.attach-image:not([style]) img{max-height:var(--image-loose-max-h);height:auto;object-fit:contain}.attach-file{display:flex;align-items:center;gap:var(--space-8);background:var(--wash);color:inherit;border-radius:var(--r-md);padding:var(--space-8) var(--space-10);cursor:pointer;text-align:left}.attach-name{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:var(--attach-name-max)}.attach-icon{flex:0 0 auto}.attach-btn{align-self:flex-end;flex:0 0 auto;width:var(--control-h);height:var(--control-h);display:grid;place-items:center;font-size:22px;line-height:1;padding:0;border-radius:var(--r-md);text-decoration:none;color:var(--muted)}.attach-btn:hover:not(:disabled){background:var(--bg);color:var(--accent-ink)}@media(max-width:720px){.bubble{max-width:85%}}@media(max-width:520px){.chat-back{display:grid}}