body{margin:0;font-size:var(--fontBasePx);background:var(--c-surface-base);color:var(--c-text-primary);font-family:system-ui,sans-serif}.screen{max-width:var(--desktopColumnMaxPx);margin:0 auto;padding:calc(var(--spaceUnitPx) * 3)}.bar{display:flex;align-items:center;gap:var(--spaceUnitPx)}.bar h1{flex:1;font-size:1.125rem;margin:0}button{min-height:var(--minTargetPx);min-width:var(--minTargetPx);border-radius:var(--radiusControlPx);border:1px solid var(--c-border-control);background:var(--c-brand-primary);color:var(--c-text-on-brand);padding:0 calc(var(--spaceUnitPx) * 4)}button.ghost{background:transparent;color:var(--c-brand-primary)}button:disabled{opacity:1;background:var(--c-surface-control-disabled);color:var(--c-text-inert)}button:focus-visible,input:focus-visible,textarea:focus-visible{outline:2px solid var(--c-focus-ring);outline-offset:2px}.rooms{list-style:none;margin:0;padding:0}.row{display:grid;grid-template-columns:1fr auto auto;width:100%;min-height:var(--homeRowMinHeightPx);text-align:left;background:transparent;color:var(--c-text-primary);border:0;border-bottom:1px solid var(--c-border-divider);border-radius:0}.row .preview{color:var(--c-text-secondary);grid-column:1}.row .stamp{color:var(--c-text-secondary)}.badge{background:var(--c-brand-primary);color:var(--c-text-on-brand);border-radius:var(--radiusControlPx);padding:0 var(--spaceUnitPx)}.notice{background:var(--c-surface-theirs);color:var(--c-text-primary);padding:var(--spaceUnitPx) calc(var(--spaceUnitPx) * 3)}.notice.offline{color:var(--c-status-offline);display:flex;justify-content:space-between;align-items:center}.bubbles{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:var(--spaceUnitPx)}.bubble{max-width:var(--bubbleMaxWidth);padding:var(--spaceUnitPx) calc(var(--spaceUnitPx) * 3);border-radius:var(--radiusBubblePx);display:flex;flex-direction:column;overflow-wrap:anywhere}.bubble.mine{align-self:flex-end;background:var(--c-surface-mine)}.bubble.theirs{align-self:flex-start;background:var(--c-surface-theirs)}.bubble .stamp{color:var(--c-text-secondary);font-size:.75rem}.bubble.failed .fail{color:var(--c-text-error)}.composer{display:flex;gap:var(--spaceUnitPx);margin-top:calc(var(--spaceUnitPx) * 3)}.composer input,textarea{flex:1;min-height:var(--controlHeightPx);border:1px solid var(--c-border-control);border-radius:var(--radiusControlPx);padding:0 calc(var(--spaceUnitPx) * 3);background:var(--c-surface-base);color:var(--c-text-primary)}textarea{display:block;width:100%;min-height:calc(var(--controlHeightPx) * 3);border-radius:var(--radiusCardPx);box-sizing:border-box}.dialog{position:fixed;inset:calc(var(--spaceUnitPx) * 4);max-width:var(--desktopColumnMaxPx);margin:0 auto;overflow:auto;background:var(--c-surface-base);border:1px solid var(--c-border-control);border-radius:var(--radiusCardPx);padding:calc(var(--spaceUnitPx) * 4)}.dialog pre{white-space:pre-wrap;overflow-wrap:anywhere}[role=alert]{color:var(--c-text-error)}.agent-card{margin-top:calc(var(--spaceUnitPx) * 3);padding:calc(var(--spaceUnitPx) * 4);border:1px solid var(--c-border-control);border-radius:var(--radiusCardPx);background:var(--c-surface-theirs)}.agent-card pre{white-space:pre-wrap;overflow-wrap:anywhere}.bubble.agent{align-self:flex-start;background:var(--c-surface-theirs);border:1px solid var(--c-border-divider)}.bubble .byline{color:var(--c-text-secondary);font-size:.75rem}.bubble input[type=checkbox]{min-width:var(--minTargetPx);min-height:var(--minTargetPx)}