.acs-inbox{--acs-inbox-sidebar-width:20rem;--acs-inbox-gap:.5rem;--acs-inbox-radius:.5rem;--acs-inbox-border:1px solid #0000001a;--acs-inbox-fg:#111827;--acs-inbox-muted-fg:#6b7280;--acs-inbox-hover-bg:#0000000a;--acs-inbox-selected-bg:#2563eb14;--acs-inbox-accent:#2563eb;--acs-inbox-accent-fg:#fff;height:100%;min-height:0;color:var(--acs-inbox-fg);display:flex;container:acs-inbox/inline-size}.acs-inbox-sidebar{flex-direction:column;flex:0 0 var(--acs-inbox-sidebar-width);border-right:var(--acs-inbox-border);min-height:0;display:flex}.acs-inbox-sidebar-header{justify-content:space-between;align-items:center;gap:var(--acs-inbox-gap);border-bottom:var(--acs-inbox-border);padding:.75rem 1rem;font-size:1.125rem;font-weight:600;display:flex}.acs-inbox-thread-list{min-height:0;padding:var(--acs-inbox-gap);gap:var(--acs-inbox-gap);flex-direction:column;flex:1;display:flex;overflow-y:auto}.acs-inbox-thread-item{text-align:left;border-radius:var(--acs-inbox-radius);width:100%;font:inherit;color:inherit;cursor:pointer;background:0 0;border:1px solid #0000;flex-direction:column;gap:.25rem;padding:.5rem;display:flex}.acs-inbox-thread-item:hover{background:var(--acs-inbox-hover-bg)}.acs-inbox-thread-item--selected{background:var(--acs-inbox-selected-bg);border-color:var(--acs-inbox-accent)}.acs-inbox-thread-item-row{align-items:center;gap:.5rem;display:flex}.acs-inbox-avatar{background:var(--acs-inbox-hover-bg);border-radius:9999px;flex:none;justify-content:center;align-items:center;width:2rem;height:2rem;font-size:.75rem;font-weight:600;display:inline-flex;overflow:hidden}.acs-inbox-avatar-image{object-fit:cover;width:100%;height:100%}.acs-inbox-thread-title{text-overflow:ellipsis;white-space:nowrap;flex:1;min-width:0;font-weight:500;overflow:hidden}.acs-inbox-unread-badge{background:var(--acs-inbox-accent,#2563eb);min-width:1.25rem;height:1.25rem;color:var(--acs-inbox-accent-fg,#fff);border-radius:9999px;justify-content:center;align-items:center;padding:0 .35rem;font-size:.75rem;font-weight:500;display:inline-flex}.acs-inbox-thread-preview,.acs-inbox-thread-time{color:var(--acs-inbox-muted-fg);text-overflow:ellipsis;white-space:nowrap;font-size:.8125rem;overflow:hidden}.acs-inbox-thread-time{font-size:.75rem}.acs-inbox-chat{flex-direction:column;flex:1;min-width:0;min-height:0;display:flex}.acs-inbox-chat-body{flex-direction:column;flex:1;min-height:0;display:flex}.acs-inbox-back{border:0;border-bottom:var(--acs-inbox-border);color:var(--acs-inbox-accent);font:inherit;text-align:start;cursor:pointer;background:0 0;align-items:center;gap:.25rem;padding:.625rem 1rem;font-size:.875rem;display:none}.acs-inbox-back:hover{background:var(--acs-inbox-hover-bg)}.acs-inbox-empty{color:var(--acs-inbox-muted-fg);text-align:center;margin:auto;padding:1rem;font-size:.875rem}@container acs-inbox (width<=48rem){.acs-inbox-sidebar{flex:100%}[data-pane=chat] .acs-inbox-sidebar,[data-pane=list] .acs-inbox-chat{display:none}.acs-inbox-back{display:flex}}:root{color:#111827;background:#f9fafb;font-family:system-ui,-apple-system,Segoe UI,sans-serif}body{margin:0}.demo{box-sizing:border-box;flex-direction:column;gap:.75rem;height:100vh;padding:1rem;display:flex}.demo-bar{flex-wrap:wrap;align-items:baseline;gap:.75rem;display:flex}.demo-note{color:#6b7280;max-width:90ch;margin:0;font-size:.8125rem;line-height:1.5}.demo-note code{background:#0000000f;border-radius:.25rem;padding:0 .25rem}.demo-total{color:#6b7280;align-items:center;gap:.375rem;margin-left:auto;font-size:.8125rem;display:flex}.demo-value{font-variant-numeric:tabular-nums;width:4rem;display:inline-block}.demo-controls select{width:6rem;font:inherit;color:inherit;background:#fff;border:1px solid #00000026;border-radius:.375rem;padding:.25rem .375rem}[data-badge=dot] [data-slot=unread-badge]{width:.5rem;min-width:.5rem;height:.5rem;padding:0;font-size:0}[data-badge=square] [data-slot=unread-badge]{border-radius:.25rem}[data-badge=outline] [data-slot=unread-badge]{border:1px solid var(--acs-inbox-accent);color:var(--acs-inbox-accent);background:0 0}.demo-controls{flex-wrap:wrap;align-items:center;gap:1rem;font-size:.8125rem;display:flex}.demo-controls label{color:#6b7280;align-items:center;gap:.375rem;display:flex}.demo-controls button{cursor:pointer;font:inherit;background:#fff;border:1px solid #00000026;border-radius:.375rem;padding:.375rem .75rem}.demo-controls button:hover:not(:disabled){background:#0000000a}.demo-controls button:disabled{opacity:.5;cursor:default}.demo-inbox{background:#fff;border:1px solid #0000001a;border-radius:.75rem;flex:1;min-height:0;overflow:hidden}.demo-chat{flex-direction:column;min-width:0;display:flex}.demo-messages{flex-direction:column;flex:1;gap:.5rem;padding:1rem;display:flex;overflow-y:auto}.demo-message{background:#0000000d;border-radius:.75rem;flex-direction:column;align-self:flex-start;gap:.125rem;max-width:32rem;padding:.5rem .75rem;display:flex}.demo-message[data-own=true]{background:color-mix(in srgb, var(--acs-inbox-accent) 12%, transparent);align-self:flex-end}.demo-message-sender{color:#6b7280;font-size:.6875rem}.demo-composer{border-top:1px solid #0000001a;gap:.5rem;padding:.75rem;display:flex}.demo-composer input{font:inherit;border:1px solid #00000026;border-radius:.5rem;flex:1;padding:.5rem .75rem}.demo-composer button{background:var(--acs-inbox-accent);color:#fff;font:inherit;cursor:pointer;border:0;border-radius:.5rem;padding:.5rem 1rem}.demo-controls label[data-disabled=true]{opacity:.5}