/* Messages only: existing theme tokens and existing conversation controls. */
.messages-page {container-type:inline-size;max-width:1680px;margin:0 auto;}
.messages-page .page-heading {margin-bottom:16px;}
.messages-toolbar {display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:12px;padding:10px 14px;background:var(--surface-solid);border:1px solid var(--border-subtle);border-radius:var(--radius-card);}
.messages-channels {display:flex;flex-wrap:wrap;gap:8px;}
.messages-channels .button {min-height:40px;padding:9px 16px;border-radius:var(--radius-round);font-size:13px;}
.messages-owner-filter {display:flex;align-items:center;gap:10px;font-size:12px;color:var(--text-secondary);}
.messages-owner-filter select {width:150px;min-height:40px;font-size:13px;}
.messages-connection-note {font-size:12px;line-height:1.6;color:var(--text-secondary);margin:0 4px 14px;}
.messages-layout {display:grid;grid-template-columns:minmax(260px,.95fr) minmax(420px,1.85fr) minmax(250px,.8fr);gap:0;align-items:start;overflow:hidden;background:var(--surface-solid);border:1px solid var(--border-subtle);border-radius:var(--radius-card);}
.messages-page .panel {box-shadow:none;}
.messages-list,.messages-page .messages-chat {height:clamp(520px,calc(100dvh - 258px),900px);overflow:hidden;min-width:0;background:var(--surface-solid);border:0;border-radius:0;}
.messages-list,.messages-page .messages-chat {border-right:1px solid var(--border-subtle);}
.messages-list {display:flex;flex-direction:column;}
.messages-list-header {padding:18px 16px 14px;border-bottom:1px solid var(--border-subtle);}
.messages-list-header .search-field {display:block;width:100%;max-width:none;min-width:0;background:var(--surface-soft);}
.messages-list-header input {min-width:0;width:100%;font-size:13px;background:transparent;}
.messages-status-filter {display:flex;align-items:center;gap:10px;margin-top:12px;font-size:12px;color:var(--text-secondary);}
.messages-status-filter select {min-width:0;width:100%;font-size:12px;min-height:36px;padding:8px;}
.messages-list-count {display:flex;justify-content:space-between;gap:8px;color:var(--text-secondary);font-size:10px;margin:14px 4px 0;}
.messages-list-items {flex:1;overflow:auto;min-height:0;padding:10px;}
.messages-page .conversation-item {align-items:center;padding:14px 12px;gap:12px;border:0;border-radius:var(--radius-control);margin-bottom:4px;background:transparent;color:var(--text-primary);}
.messages-page .conversation-item:hover {background:var(--surface-soft);}
.messages-page .conversation-item.active {background:color-mix(in srgb,var(--action) 9%,var(--surface-solid));box-shadow:inset 3px 0 var(--action);}
.messages-avatar-wrap {position:relative;flex:none;}
.messages-page .avatar {width:40px;height:40px;background:linear-gradient(135deg,var(--brand-royal),var(--brand-primary));color:#fff;border:1px solid var(--brand-royal);font-size:14px;border-radius:50%;flex:none;}
.messages-channel-icon {display:inline-flex;align-items:center;color:var(--action);}
.messages-channel-icon .icon {width:14px;height:14px;}
.messages-avatar-wrap .messages-channel-icon {position:absolute;bottom:-3px;right:-4px;background:var(--surface-solid);border-radius:50%;padding:2px;border:1px solid var(--border-subtle);}
.messages-page .conversation-summary {min-width:0;flex:1;}
.messages-list-line {display:flex;align-items:center;justify-content:space-between;gap:8px;}
.messages-page .conversation-summary strong {font-size:13px;max-width:none;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.messages-page .conversation-summary time {font-size:10px;white-space:nowrap;color:var(--text-secondary);flex:none;}
.messages-page .conversation-summary p {max-width:none;margin:6px 0;color:var(--text-secondary);font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.messages-page .conversation-summary small {font-size:10px;color:var(--text-secondary);}
.messages-page .unread-dot {width:7px;height:7px;background:var(--action);flex:none;}
.messages-list .table-footer {padding:12px;display:flex;align-items:center;justify-content:space-between;gap:12px;border-top:1px solid var(--border-subtle);font-size:12px;color:var(--text-secondary);}
.messages-list .table-footer .button {padding:5px 10px;min-height:32px;}
.messages-page .chat-header {padding:18px 20px;display:flex;align-items:center;gap:12px;flex-wrap:nowrap;background:var(--surface-solid);border-color:var(--border-subtle);}
.messages-page .messages-chat-person {display:flex;align-items:center;gap:12px;min-width:160px;flex:1;background:transparent;color:var(--text-primary);border:0;text-align:left;padding:0;cursor:pointer;}
.messages-page .chat-header h2 {font-size:15px;font-weight:600;overflow-wrap:anywhere;}
.messages-page .chat-header p {display:flex;align-items:center;gap:5px;font-size:11px;color:var(--text-secondary);margin-top:5px;}
.coagent-dashboard .messages-page .messages-header-actions {display:flex;flex-direction:row;gap:7px;flex-wrap:nowrap;flex:none;}
.messages-header-actions .button {min-height:36px;font-size:12px;padding:8px 12px;}
.messages-page .chat-messages {background:var(--canvas);padding:24px;gap:18px;}
.messages-page .message {max-width:88%;}
.messages-page .message-label {font-size:10px;line-height:1.5;margin-bottom:6px;}
.messages-page .messages-card-row {width:min(100%,560px);max-width:100%;min-width:0;}
.messages-card-carousel {display:flex;gap:12px;overflow-x:auto;max-width:100%;padding:2px 2px 8px;scroll-snap-type:x proximity;}
.messages-template-card,.messages-order-card {border:1px solid var(--border-subtle);border-radius:16px;background:var(--surface-solid);overflow:hidden;min-width:0;}
.messages-card-carousel .messages-template-card {flex:0 0 min(260px,75vw);scroll-snap-align:start;}
.messages-order-card {width:min(100%,320px);}
.messages-page .messages-card-image {display:block;width:100%;height:180px;max-height:none;object-fit:cover;border-radius:0;margin:0;}
.messages-card-body {display:grid;gap:10px;padding:14px;min-width:0;font-size:13px;overflow-wrap:anywhere;}
.messages-card-body p {margin:0;white-space:pre-wrap;line-height:1.6;color:var(--text-secondary);}
.messages-card-body header,.messages-order-total,.messages-card-body li {display:flex;justify-content:space-between;align-items:baseline;gap:12px;}
.messages-card-body ul {display:grid;gap:7px;list-style:none;padding:0;margin:2px 0;}
.messages-card-body li strong {white-space:nowrap;}
.messages-order-total {border-top:1px solid var(--border-subtle);padding-top:10px;}
.messages-order-status {font-size:11px;padding:4px 8px;border-radius:20px;background:var(--surface-soft);color:var(--text-secondary);}
.messages-card-action {display:block;width:100%;box-sizing:border-box;text-align:center;border:1px solid var(--border-subtle);border-radius:9px;background:var(--surface-soft);color:var(--action);padding:9px 12px;font:inherit;text-decoration:none;cursor:pointer;}
.messages-card-action:disabled {cursor:default;color:var(--text-secondary);opacity:1;}
.messages-card-delivery {display:block;margin-top:4px;font-size:10px;color:var(--text-secondary);}
.messages-page .message-bubble {padding:12px 16px;font-size:14px;border-radius:16px 16px 16px 5px;}
.messages-page .composer {background:var(--surface-solid);padding:16px 20px;border-color:var(--border-subtle);}
.messages-composer-tools {display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:12px;}
.messages-composer-tools strong {font-size:13px;color:var(--action);}
.messages-composer-tools .link-button {font-size:12px;}
.messages-page .composer form {align-items:flex-end;}
.messages-page .composer textarea {font-size:14px;min-height:64px;max-height:180px;background:var(--surface-soft);border-radius:var(--radius-control);}
.messages-page .composer p {font-size:10px;line-height:1.6;color:var(--text-secondary);margin-top:10px;}
.messages-details {display:block;height:clamp(520px,calc(100dvh - 258px),900px);overflow:auto;min-width:0;background:var(--surface-solid);}
.messages-detail-card {padding:20px;min-width:0;border:0;border-bottom:1px solid var(--border-subtle);border-radius:0;}
.messages-detail-card h2 {font-size:14px;font-weight:600;margin:0 0 18px;}
.messages-customer {display:flex;align-items:center;gap:10px;margin-bottom:18px;}
.messages-customer>div {min-width:0;}
.messages-customer strong {display:block;font-size:13px;overflow-wrap:anywhere;}
.messages-customer small {display:block;font-size:11px;color:var(--text-secondary);margin-top:5px;}
.messages-detail-card dl {display:grid;gap:12px;margin:0 0 18px;font-size:12px;}
.messages-detail-card dl>div {display:grid;grid-template-columns:72px minmax(0,1fr);gap:12px;align-items:baseline;}
.messages-detail-card dt {color:var(--text-secondary);}
.messages-detail-card dd {margin:0;color:var(--text-primary);overflow-wrap:anywhere;line-height:1.6;}
.messages-assignment {display:grid;gap:8px;font-size:12px;color:var(--text-secondary);margin-bottom:14px;}
.messages-assignment select {width:100%;min-width:0;font-size:13px;}
.messages-detail-card .button {min-height:32px;font-size:12px;padding:7px 10px;}
.messages-card-title {display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:16px;}
.messages-card-title h2 {margin:0;}
.messages-tags {display:flex;gap:8px;flex-wrap:wrap;}
.messages-tags .pill {white-space:normal;overflow-wrap:anywhere;}
.messages-muted {font-size:12px;color:var(--text-secondary);line-height:1.7;}
.messages-empty {display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:12px;padding:40px 24px;flex:1;color:var(--text-secondary);font-size:13px;}
.messages-empty h2,.messages-empty p {margin:0;line-height:1.7;}
.messages-empty h2 {font-size:18px;color:var(--text-primary);}
.messages-empty .icon {width:32px;height:32px;color:var(--action);}
@container (max-width:1080px) {
  .messages-layout {grid-template-columns:minmax(220px,.8fr) minmax(300px,1.5fr);}
  .messages-details {grid-column:1/-1;grid-template-columns:repeat(3,minmax(0,1fr));max-height:none;overflow:visible;}
}
@container (max-width:560px) {
  .messages-toolbar {align-items:flex-start;flex-direction:column;gap:12px;}
  .messages-owner-filter,.messages-owner-filter select {width:100%;}
  .messages-layout {display:flex;flex-direction:column;gap:16px;}
  .messages-list {width:100%;height:330px;}
  .messages-page .messages-chat {width:100%;height:600px;min-height:0;}
  .messages-details {width:100%;grid-template-columns:1fr;}
  .messages-page .messages-header-actions {flex-direction:row;}
  .messages-page .message {max-width:95%;}
}
@media(prefers-reduced-motion:no-preference) {.messages-page button {transition:background-color .15s,border-color .15s;}}

.messages-channels {flex:1;min-width:0;}
.messages-channels .button {gap:8px;white-space:nowrap;background:var(--surface-soft);color:var(--text-secondary);border:1px solid transparent;}
.messages-channels .button[aria-pressed="true"] {background:var(--surface-selected);color:var(--action);border-color:var(--border-control);}
.messages-channel-count {display:inline-flex;align-items:center;justify-content:center;min-width:23px;height:23px;padding:0 6px;background:var(--surface-soft);color:var(--text-secondary);border-radius:var(--radius-round);font-size:12px;}
.messages-channels [aria-pressed="true"] .messages-channel-count {background:var(--action);color:var(--on-action);}
.messages-toolbar-actions {display:flex;align-items:center;gap:8px;flex:none;}
.messages-page .messages-icon-action {width:34px;min-height:34px;padding:7px;justify-content:center;flex:none;}
.messages-filters,.messages-more {position:relative;}
.messages-filters summary,.messages-more summary {display:flex;align-items:center;justify-content:center;gap:7px;list-style:none;cursor:pointer;border:1px solid var(--border-subtle);border-radius:var(--radius-control);background:var(--surface-solid);color:var(--text-secondary);padding:9px;font-size:12px;min-height:36px;}
.messages-filters summary::-webkit-details-marker,.messages-more summary::-webkit-details-marker {display:none;}
.messages-filters summary .icon,.messages-more summary .icon,.messages-sort .icon {width:16px;height:16px;}
.messages-filters summary i {width:6px;height:6px;background:var(--action);border-radius:50%;}
.messages-filters>div,.messages-more>div {position:absolute;right:0;top:calc(100% + 8px);width:230px;background:var(--surface-solid);padding:16px;border:1px solid var(--border-subtle);border-radius:var(--radius-control);box-shadow:var(--shadow-dialog);z-index:5;}
.messages-filters .messages-owner-filter,.messages-filters .messages-status-filter {display:grid;gap:8px;font-size:12px;}
.messages-filters select {width:100%;min-height:38px;}
.messages-sort {display:flex;gap:6px;align-items:center;font-size:12px;color:var(--text-secondary);white-space:nowrap;}
.messages-quick-tabs {display:flex;gap:6px;margin-top:12px;}
.messages-quick-tabs .button {flex:1;font-size:11px;min-height:32px;padding:6px;justify-content:center;}
.messages-quick-tabs .icon {width:14px;height:14px;}
.messages-page .messages-chat-person>span:last-child {min-width:0;}
.messages-page .messages-chat-person strong {display:block;font-size:15px;line-height:1.5;font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.messages-page .messages-chat-person small {display:block;color:var(--text-secondary);font-size:11px;margin-top:3px;}
.messages-more>div {display:flex;flex-direction:column;gap:6px;width:190px;padding:8px;}
.messages-more>div .button {width:100%;border:0;justify-content:flex-start;}
.messages-more summary {width:34px;height:34px;padding:7px;}
.messages-day {display:flex;align-items:center;gap:12px;color:var(--text-secondary);font-size:11px;align-self:stretch;margin:0 0 4px;}
.messages-day:before,.messages-day:after {content:"";flex:1;height:1px;background:var(--border-subtle);}
.messages-day span {padding:4px 10px;border:1px solid var(--border-subtle);border-radius:var(--radius-round);background:var(--surface-solid);}
.messages-page .message-label {display:block;margin:6px 2px 0;font-size:11px;}
.messages-page .message:is(.assistant,.admin) .message-label {text-align:right;}
.coagent-dashboard .messages-page .message:is(.assistant,.admin) .message-bubble {background:var(--brand-royal);color:#fff;border:1px solid var(--brand-royal);border-radius:16px 16px 5px 16px;}
.messages-page .message.user .message-bubble {background:var(--surface-soft);border-color:var(--border-subtle);}
.messages-page .system-message {align-self:center;width:max-content;max-width:95%;padding:6px 12px;border-radius:var(--radius-round);background:var(--surface-soft);font-size:11px;line-height:1.5;color:var(--text-secondary);}
.messages-page :is(.messages-list-items,.chat-messages,.messages-details) {scrollbar-width:thin;scrollbar-color:var(--border-control) transparent;}
.messages-meta-more {font-size:11px;color:var(--text-secondary);}
.messages-meta-more summary {cursor:pointer;padding:4px 0;}
.messages-meta-more dl {margin-top:12px;}
.messages-details .messages-detail-card h2 {margin-bottom:14px;}
.messages-details .messages-customer {margin-bottom:14px;}
.messages-details .messages-detail-card dl {gap:9px;margin-bottom:14px;}
.messages-details .messages-card-title h2 {margin-bottom:0;}
.messages-details .messages-card-title {margin-bottom:12px;}
.messages-ticket-mobile,.messages-mobile-action,.messages-mobile-profile,.messages-back,.messages-details-back {display:none;}
.messages-page .messages-back {display:none;}

@container (max-width:1080px) {
  .messages-layout {gap:16px;overflow:visible;background:transparent;border:0;border-radius:0;}
  .messages-list,.messages-page .messages-chat {border:1px solid var(--border-subtle);border-radius:var(--radius-card);}
  .messages-page .chat-header {flex-wrap:wrap;}
  .coagent-dashboard .messages-page .messages-header-actions {width:100%;justify-content:flex-end;}
  .messages-details {height:auto;display:grid;gap:12px;background:transparent;}
  .messages-detail-card {background:var(--surface-solid);border:1px solid var(--border-subtle);border-radius:var(--radius-card);}
}

@media(max-width:720px) {
  .messages-page .page-heading {margin-bottom:20px;}
  .messages-toolbar {flex-direction:row;align-items:center;gap:8px;margin-bottom:16px;}
  .messages-channels {flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;}
  .messages-channels .button {flex:none;font-size:12px;padding:8px 12px;min-height:38px;}
  .messages-toolbar-actions>.messages-icon-action,.messages-sort,.messages-filters summary>span {display:none;}
  .messages-toolbar-actions {gap:0;}
  .messages-filters>div {right:0;max-width:calc(100vw - 32px);}
  .messages-layout {display:flex;flex-direction:column;gap:0;overflow:visible;background:transparent;border:0;}
  .messages-list {width:100%;height:auto;min-height:calc(100dvh - 340px);}
  .messages-list-items {overflow:visible;}
  .messages-page[data-pane="list"] :is(.messages-chat,.messages-details),
  .messages-page[data-pane="chat"] :is(.messages-list,.messages-details),
  .messages-page[data-pane="details"] :is(.messages-list,.messages-chat) {display:none;}
  .coagent-dashboard:has(.messages-page:is([data-pane="chat"],[data-pane="details"])) {padding:0;background:var(--canvas);}
  .coagent-dashboard:has(.messages-page:is([data-pane="chat"],[data-pane="details"])) .app-shell {height:100dvh;min-height:100dvh;border:0;border-radius:0;overflow:hidden;}
  .coagent-dashboard:has(.messages-page:is([data-pane="chat"],[data-pane="details"])) :is(.topbar,.bottom-nav,.main-footer) {display:none;}
  .coagent-dashboard:has(.messages-page:is([data-pane="chat"],[data-pane="details"])) .main-shell {padding-bottom:0;margin:0;width:100%;}
  .coagent-dashboard:has(.messages-page:is([data-pane="chat"],[data-pane="details"])) main {padding:0!important;}
  .messages-page:is([data-pane="chat"],[data-pane="details"]) :is(.page-heading,.messages-toolbar,.messages-connection-note) {display:none;}
  .messages-page[data-pane="chat"] .messages-chat {display:flex;height:100dvh;min-height:0;border-radius:0;border:0;width:100%;}
  .messages-page .chat-header {padding:12px;gap:8px;flex-wrap:nowrap;}
  .messages-page .messages-chat-person {gap:8px;min-width:0;}
  .messages-page .messages-chat-person strong {font-size:13px;}
  .messages-page .messages-chat-person .avatar {width:34px;height:34px;font-size:12px;}
  .coagent-dashboard .messages-page .messages-header-actions {gap:6px;flex-wrap:nowrap;width:auto;}
  .messages-page .messages-header-actions .button {padding:7px 8px;font-size:11px;min-height:34px;}
  .messages-header-actions :is(.messages-desktop-action,.messages-header-handoff),.messages-ticket-desktop {display:none;}
  .messages-ticket-mobile,.messages-mobile-action {display:inline-block;}
  .messages-more summary {width:28px;padding:5px;}
  .messages-page .messages-back {display:inline-flex;width:28px;min-height:34px;padding:4px;border:0;font-size:20px;justify-content:center;flex:none;}
  .messages-page .chat-messages {padding:16px 14px;gap:18px;}
  .messages-mobile-profile {display:flex;align-items:center;gap:12px;text-align:left;padding:14px;background:var(--surface-solid);border:1px solid var(--border-subtle);border-radius:var(--radius-control);color:var(--text-primary);flex:none;}
  .messages-mobile-profile>span:not(.messages-avatar-wrap) {flex:1;min-width:0;}
  .messages-mobile-profile strong,.messages-mobile-profile small {display:block;font-size:13px;overflow-wrap:anywhere;}
  .messages-mobile-profile small {font-size:11px;color:var(--text-secondary);margin-top:5px;}
  .messages-mobile-profile>.icon {width:16px;height:16px;}
  .messages-page .composer {padding:12px 14px max(12px,env(safe-area-inset-bottom));}
  .messages-page .composer textarea {min-height:60px;}
  .messages-page[data-pane="details"] .messages-details {display:grid;grid-template-columns:1fr;padding:0 12px 20px;background:var(--canvas);height:100dvh;max-height:100dvh;overflow:auto;gap:12px;align-content:start;}
  .messages-details-back {display:flex;align-items:center;gap:10px;padding:12px 0;background:var(--canvas);position:sticky;top:0;z-index:1;font-size:14px;}
}

/* The workspace frame stays put; each message pane owns its scrolling. */
html:has(.messages-page) {height:100%;overflow:hidden;}
.coagent-dashboard:has(.messages-page) {height:100dvh;overflow:hidden;}
.coagent-dashboard:has(.messages-page) {display:flow-root;}
.coagent-dashboard:has(.messages-page) .app-shell {height:calc(100dvh - 32px);min-height:0;overflow:hidden;}
.coagent-dashboard:has(.messages-page) .main-shell {height:100%;min-height:0;display:flex;flex-direction:column;}
.coagent-dashboard:has(.messages-page) #content {flex:1;min-height:0;overflow:hidden;max-width:none;padding:14px 22px 18px;}
.coagent-dashboard:has(.messages-page) .main-footer {display:none;}
.messages-page {height:100%;min-height:0;display:flex;flex-direction:column;}
.messages-toolbar,.messages-connection-note {flex:none;}
.messages-toolbar {margin-bottom:10px;}
.messages-connection-note {margin-bottom:10px;}
.messages-layout {flex:1;min-height:0;position:relative;align-items:stretch;}
.messages-list,.messages-page .messages-chat,.messages-details {height:100%;min-height:0;max-height:none;}
.messages-list-header {padding:12px;}
.messages-page .chat-header {padding:12px 16px;}
.messages-page .composer {padding:12px 16px;}
.messages-page .composer textarea {min-height:52px;}
.messages-page .chat-messages {min-height:0;overflow:auto;}

/* Compact composer; growth is bounded so the conversation keeps its own scroll. */
.messages-page #reply-form {display:flex;flex-direction:column;gap:8px;align-items:stretch;}
.messages-input-row {display:flex;align-items:flex-end;gap:8px;padding:7px;background:var(--surface-soft);border:1px solid var(--border-control);border-radius:26px;}
.messages-input-row:focus-within {border-color:var(--action);}
.messages-page .messages-input-row textarea {flex:1;min-width:0;min-height:38px;max-height:180px;line-height:1.5;padding:9px 4px;border:0;border-radius:0;background:transparent;resize:none;box-shadow:none;}
.messages-page .messages-input-row textarea:focus {outline:none;}
.messages-attach {display:flex;align-items:center;justify-content:center;flex:none;width:38px;height:38px;padding:8px;border:0;border-radius:50%;background:transparent;color:var(--text-secondary);cursor:pointer;}
.messages-attach:hover {background:var(--surface-selected);color:var(--action);}
.messages-input-row>.button {min-height:38px;border-radius:22px;flex:none;padding:9px 14px;}
.messages-attachment-preview:not([hidden]) {display:flex;align-items:center;gap:10px;padding:8px 10px;border:1px solid var(--border-subtle);border-radius:var(--radius-control);}
.messages-attachment-preview img {width:52px;height:52px;object-fit:cover;border-radius:8px;}
.messages-attachment-preview span {flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:12px;}
.messages-attachment-preview button {border:0;background:transparent;color:var(--text-primary);font-size:22px;cursor:pointer;}
.messages-page .message-bubble {overflow-wrap:anywhere;min-width:0;}
.messages-message-image {display:block;max-width:min(100%,300px);max-height:300px;object-fit:contain;border-radius:10px;margin-top:6px;}
.messages-facebook-id {font-size:10px!important;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.messages-list-items,.messages-page .chat-messages,.messages-details {overscroll-behavior:contain;scrollbar-width:thin;}
.messages-load-more {width:calc(100% - 24px);margin:12px;justify-content:center;font-size:12px;}
@media (min-width:721px) {
  .messages-page[data-details-hidden="true"] .messages-layout {grid-template-columns:minmax(240px,.8fr) minmax(0,2fr);}
  .messages-page[data-details-hidden="true"] .messages-details {display:none!important;}
}
@media (max-width:720px) {
  .messages-page .messages-input-row textarea {font-size:16px;}
  .messages-input-row>.button span {display:none;}
}

@media (min-width:721px) {
  @container (max-width:1080px) {
    .messages-layout {gap:0;overflow:hidden;background:var(--surface-solid);border:1px solid var(--border-subtle);border-radius:var(--radius-card);}
    .messages-list,.messages-page .messages-chat {height:100%;border:0;border-radius:0;}
    .messages-details {display:none;}
    .messages-page[data-pane="details"] .messages-details {display:block;position:absolute;inset:0 0 0 auto;width:min(350px,100%);height:100%;overflow:auto;background:var(--surface-solid);box-shadow:var(--shadow-dialog);z-index:3;}
    .messages-page[data-pane="details"] .messages-details-back {display:flex;align-items:center;gap:10px;padding:12px 16px;border-bottom:1px solid var(--border-subtle);}
    .messages-detail-card {border:0;border-bottom:1px solid var(--border-subtle);border-radius:0;}
  }
}

@media (max-width:720px) {
  .coagent-dashboard:has(.messages-page) .app-shell {height:100dvh;}
  .coagent-dashboard:has(.messages-page) #content {padding:10px 12px 76px;}
  .messages-layout {overflow:hidden;}
  .messages-list {height:100%;min-height:0;}
  .messages-list-items {overflow:auto;}
  .messages-page:is([data-pane="chat"],[data-pane="details"]) .messages-layout {height:100%;}
  .coagent-dashboard:has(.messages-page:is([data-pane="chat"],[data-pane="details"])) #content {padding:0;}
  .messages-page[data-pane="chat"] .messages-chat {height:100%;}
  .messages-page[data-pane="details"] .messages-details {height:100%;max-height:none;}
}

/* One-row conversation header and a floating composer over the message canvas. */
.messages-page .messages-chat {position:relative;}
.messages-page .chat-header {min-height:66px;padding:10px 14px;gap:10px;flex-wrap:nowrap;}
.messages-page .chat-header .messages-chat-person {min-width:0;gap:9px;}
.messages-page .chat-header .messages-chat-person small {margin-top:2px;}
.coagent-dashboard .messages-page .messages-header-actions {width:auto;gap:6px;margin-left:auto;}
.messages-page .messages-header-actions .button {min-height:34px;padding:6px 9px;}
.messages-page .messages-header-actions .messages-icon-action {width:34px;padding:7px;}
.messages-page .chat-messages {padding-bottom:calc(var(--messages-composer-height,100px) + 18px);}
.messages-page .composer {position:absolute;left:0;right:0;bottom:0;z-index:2;padding:26px 16px 14px;background:linear-gradient(transparent,var(--canvas) 24%,var(--canvas));border:0;pointer-events:none;}
.messages-page .composer form {pointer-events:auto;}
.messages-page .composer>.sr-only {position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0;}
.messages-page .messages-input-row {align-items:flex-end;padding:6px 7px;background:var(--surface-soft);border-color:var(--border-control);box-shadow:0 10px 32px rgba(0,0,0,.16);}
.messages-page .messages-input-row textarea {min-height:38px;padding:9px 4px;}
.messages-composer-icon {width:34px;height:38px;display:inline-flex;align-items:center;justify-content:center;flex:none;color:var(--text-secondary);border:0;border-radius:50%;background:transparent;cursor:pointer;}
.messages-composer-icon:hover,.messages-composer-icon[data-recording="true"] {color:var(--action);background:var(--surface-selected);}
.messages-composer-icon[data-recording="true"] {color:#f87171;}
.messages-page .messages-send {width:38px;height:38px;min-height:38px;padding:9px;border-radius:50%;justify-content:center;}
.messages-page .messages-send .icon {margin:0;}
.messages-message-video {display:block;width:min(100%,320px);max-height:240px;margin-top:6px;border-radius:10px;}
.messages-message-audio {display:block;width:min(100%,300px);margin-top:6px;}
.messages-message-file {display:inline-flex;margin-top:8px;padding:8px 12px;border:1px solid currentColor;border-radius:10px;color:inherit;max-width:100%;overflow-wrap:anywhere;}
@media (max-width:720px) {
  .messages-page .composer {padding:22px 10px max(10px,env(safe-area-inset-bottom));}
  .messages-page .chat-header {min-height:62px;padding:9px 10px;}
  .messages-page .messages-header-actions .button[data-action="chat-support"] {display:none;}
  .messages-page .chat-messages {padding-bottom:calc(var(--messages-composer-height,100px) + 18px);}
}
