jason.woltje
266f3a45ff
Review finding 1: a hire start refusal the apply step can also raise after the decision is consumed (decision-stale, organization-instance-*, organization-refused, definition-missing, invalid-request and the rest) no longer says "Nothing was applied". It says that part may be applied when the inbox shows the proposal as answered, and to check Agents first. Only codes that prepare() or the route checks alone raise keep "Nothing was applied". Review P3: a failed workflows or autonomy read keeps the last good read, so an open editor or a dirty form stays through it. Focus holds a section only in a field being typed in; a focused button is rebuilt and gets focus back by data-focus-key. Autonomy has Discard changes. The project tab fade is 0px when every tab fits. s8 and s9 header pins at 1440 now measure from the content edge: 1418 was 100vw-based, ran under the page scrollbar and is the P2-11 clipping itself. Correction to the previous commit's message: P1-2 is the unknown project, agent or harness wording; P2-4 names the refused field; P2-6 is the Queue refusal reason; P2-8 is "bus stopped".
520 lines
44 KiB
CSS
520 lines
44 KiB
CSS
/* Project cards share a readable width as the content area grows. */
|
||
.chat-projects { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, var(--project-grid-min)), 1fr)); gap: var(--project-grid-gap); }
|
||
.project-card { display:flex; flex-direction:column; gap:8px; min-width:0; padding:20px; border:1px solid var(--line); border-radius:10px; background:var(--surface); color:var(--muted); text-decoration:none; }
|
||
.project-card:hover { border-color:var(--border); }
|
||
.project-card strong { color:var(--strong); font-size:18px; font-weight:700; }
|
||
.project-card-icon { display:grid; place-items:center; width:44px; height:44px; border-radius:8px; background:var(--raised); color:var(--action); font-size:24px; }
|
||
.project-header { display:flex; align-items:center; justify-content:space-between; gap:20px; margin:16px 0; }
|
||
.project-heading { display:flex; align-items:center; gap:16px; min-width:0; }
|
||
.project-heading h1 { margin:0; overflow-wrap:anywhere; }
|
||
.project-heading p { color:var(--muted); margin:4px 0 0; }
|
||
.project-header-icon { display:grid; place-items:center; width:56px; height:56px; flex:none; border-radius:10px; background:var(--raised); color:var(--action); font-size:28px; }
|
||
.project-actions { display:flex; flex-wrap:wrap; gap:12px; }
|
||
.project-actions .btn { display:inline-flex; align-items:center; text-decoration:none; }
|
||
.project-tabs { display:flex; gap:4px; overflow-x:auto; border-bottom:1px solid var(--line); }
|
||
.project-tabs a { display:flex; align-items:center; flex:none; min-height:44px; padding:0 16px; color:var(--muted); font-weight:600; text-decoration:none; }
|
||
.project-tabs a[aria-current] { color:var(--strong); background:var(--nav-active); border-bottom:2px solid var(--action); }
|
||
@media (max-width:699px) { .project-header { display:block; } .project-header-icon { width:44px; height:44px; } .project-actions { margin-top:12px; } }
|
||
.project-tree-list,.project-tree-children { list-style:none; margin:0; padding:0; }
|
||
#sections #project-tree { display:block !important; }
|
||
.project-tree-row { display:flex; align-items:center; min-width:0; min-height:44px; border-radius:6px; }
|
||
.project-tree-row.active,.project-tree-children a[aria-current] { background:var(--nav-active); color:var(--strong); }
|
||
.project-tree-row button { flex:none; width:44px; height:44px; color:var(--muted); border:0; background:none; cursor:pointer; font-size:20px; }
|
||
.project-tree-row a,.project-tree-children a { display:flex; align-items:center; min-height:44px; min-width:0; color:var(--text); text-decoration:none; overflow:hidden; }
|
||
.project-tree-row a span,.project-tree-children a span { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
|
||
.project-tree-children { margin-left:22px; border-left:1px solid var(--line); }
|
||
.project-tree-children a { padding:0 10px 0 20px; flex-direction:column; align-items:flex-start; justify-content:center; }
|
||
.project-tree-children small { color:var(--muted); }
|
||
.project-panel,.project-work,.project-row,.project-metrics { background:var(--surface); border:1px solid var(--line); border-radius:10px; }
|
||
.project-panel,.project-work { padding:20px; margin:12px 0; }
|
||
.project-decision { border-left:4px solid var(--warning); display:flex; align-items:center; justify-content:space-between; gap:12px; flex-wrap:wrap; }
|
||
.project-panel h2,.project-panel h3 { margin-top:0; }
|
||
.project-panel > h3:not(:first-child) { border-top:1px solid var(--line); padding-top:16px; margin-top:16px; }
|
||
.project-panel details { border-bottom:1px solid var(--line); }
|
||
.project-panel summary { min-height:44px; display:flex; align-items:center; cursor:pointer; font-weight:600; }
|
||
.project-columns { display:grid; grid-template-columns:minmax(0, 1.7fr) minmax(280px,1fr); gap:24px; margin-top:20px; }
|
||
.project-columns > * { min-width:0; }
|
||
.project-section-title,.project-work-head,.project-work-bottom { display:flex; justify-content:space-between; gap:12px; align-items:center; }
|
||
.project-work-head p,.project-work p,.project-panel p { color:var(--muted); }
|
||
.project-work-bottom { border-top:1px solid var(--line); padding-top:12px; flex-wrap:wrap; }
|
||
.project-row { display:flex; flex-direction:column; padding:16px; margin:12px 0; text-decoration:none; color:var(--strong); }
|
||
.project-row small { color:var(--muted); }
|
||
.project-stepper { display:flex; justify-content:space-between; gap:8px; margin:20px 0; }
|
||
.project-stepper span { padding:6px; color:var(--muted); }
|
||
.project-stepper .done { color:var(--success); }.project-stepper .current { color:var(--strong); background:var(--nav-active); border-radius:99px; }
|
||
.project-chip,.project-count { display:inline-flex; align-items:center; min-height:24px; border-radius:999px; padding:0 9px; font-size:12px; font-weight:600; background:var(--raised); color:var(--muted); }
|
||
.project-chip.success { color:var(--success); background:color-mix(in srgb,var(--success) 16%,var(--surface)); }.project-chip.warning { color:var(--warning); background:color-mix(in srgb,var(--warning) 16%,var(--surface)); }.project-chip.danger { color:var(--danger); background:color-mix(in srgb,var(--danger) 16%,var(--surface)); }
|
||
.project-metrics { display:grid; grid-template-columns:repeat(4,1fr); margin-top:20px; padding:16px 0 8px; }
|
||
.project-metrics a { display:flex; flex-direction:column; min-width:0; padding:0 20px; text-decoration:none; color:var(--text); border-right:1px solid var(--line); }
|
||
.project-metrics a:hover { background:var(--raised); }.project-metrics strong { font-size:30px; color:var(--strong); }.project-metrics small { color:var(--muted); }
|
||
.project-metrics p { grid-column:1/-1; border-top:1px solid var(--line); margin:12px 20px 0; padding-top:8px; font-size:12px; color:var(--muted); }
|
||
.project-file-list > div,.project-file-row { display:flex; justify-content:space-between; gap:10px; align-items:center; min-height:44px; border-bottom:1px solid var(--line); overflow-wrap:anywhere; }
|
||
.project-file-row small { display:block; color:var(--muted); }
|
||
@media (max-width:1100px) { .project-columns { grid-template-columns:1fr; }.project-metrics { grid-template-columns:repeat(2,1fr); } }
|
||
@media (max-width:699px) { .project-stepper span { flex:1; text-align:center; font-size:12px; overflow-wrap:anywhere; }.project-work-bottom .btn { width:100%; }.project-metrics strong { font-size:26px; } }
|
||
.project-list-head p { color:var(--muted); font-size:16px; }
|
||
.project-create { margin:12px 0; }.project-create > summary { display:inline-flex; align-items:center; cursor:pointer; }
|
||
.chat-area:has(.project-list-head) { position:relative; }
|
||
@media(min-width:700px) { .project-create { position:absolute; top:0; right:0; z-index:1; } .project-create[open] { background:var(--surface); padding:12px; border:1px solid var(--line); border-radius:10px; } }
|
||
.project-archived-filter ul#project-archive-list { display:grid; grid-template-columns:repeat(auto-fill,minmax(min(100%, var(--project-grid-min)),1fr)); gap:var(--project-grid-gap); }
|
||
.project-archived-filter li { display:flex; flex-direction:column; align-items:stretch; background:var(--surface); border:1px solid var(--line); border-radius:10px; padding:0 0 16px; }
|
||
.project-archived-filter .project-card { border:0; color:var(--muted); }
|
||
.project-archived-filter li > button { align-self:flex-start; margin:0 20px; }
|
||
.project-header .btn,.project-work .btn,.project-panel .btn,.project-section-title .btn { display:inline-flex; align-items:center; justify-content:center; min-height:44px; text-decoration:none; }
|
||
@media(max-width:699px) { .project-crumb-current { display:none; }.project-create > summary { display:flex; width:100%; justify-content:center; } }
|
||
.project-dialog { position:fixed; inset:0 0 0 auto; margin:0; width:min(400px,100vw); max-width:100vw; max-height:100vh; height:100vh; overflow:auto; box-sizing:border-box; background:var(--surface); color:var(--text); border:1px solid var(--line); padding:20px; }
|
||
.project-dialog::backdrop { background:rgb(0 0 0 / .55); }
|
||
.project-dialog > [data-dialog-close] { position:absolute; right:16px; top:16px; }
|
||
.project-chat .chat-log { border:0; padding:0; max-height:56vh; }
|
||
.project-chat .chat-log > li { border:0; display:flex; flex-direction:column; align-items:flex-start; }
|
||
.project-chat .chat-log > li.chat-message-human { align-items:flex-end; }
|
||
.project-chat .chat-log > li > .chat-body { background:var(--surface); border:1px solid var(--line); border-radius:12px; padding:12px 16px; max-width:min(720px,100%); }
|
||
.project-chat .chat-log > li.chat-message-human > .chat-body { background:var(--accent-fill); color:var(--on-accent); }
|
||
.project-chat #chat-send-form,.project-chat #chat-room-send-form { background:var(--surface); border:1px solid var(--line); border-radius:10px; padding:16px; }
|
||
@media(max-width:699px) { .project-dialog { width:100vw; } }
|
||
.project-chat .chat-room-picker { display:flex; align-items:center; flex-wrap:wrap; gap:8px; border:0; padding:0; }
|
||
.project-chat .chat-room-picker legend { float:left; margin-right:8px; }.project-chat .chat-room-picker label { display:inline-flex; align-items:center; min-height:44px; border-radius:999px; padding:0 12px; background:var(--raised); }
|
||
.project-chat .chat-room-picker input { margin-right:6px; }
|
||
.project-request-intro { padding:8px; }.request-details > summary { cursor:pointer; color:var(--action); min-height:44px; }
|
||
.room-chip-input { position:absolute; width:1px; height:1px; opacity:0; pointer-events:none; }
|
||
.room-chip { min-height:44px; padding:0 14px; color:var(--text); background:var(--surface); border:1px solid var(--line); border-radius:999px; }
|
||
.room-chip[aria-pressed=true] { background:var(--nav-active); border-color:var(--nav-active-border); color:var(--strong); }
|
||
.project-card-icon svg,.project-header-icon svg,.project-tree-row svg { width:55%; height:55%; fill:none; stroke:currentColor; stroke-width:1.7; stroke-linejoin:round; }
|
||
.project-tree-row svg { width:16px; height:16px; flex:none; margin-right:6px; }
|
||
.breadcrumbs:has(.project-crumb-current) a { position:relative; display:inline-flex; align-items:center; min-height:44px; }
|
||
/* The 44px target width comes from an overlay, not the layout box: a short name such as "work" must not leave blank space that reads as an empty crumb. */
|
||
.breadcrumbs:has(.project-crumb-current) a::after { content:''; position:absolute; top:0; bottom:0; left:50%; width:max(100%,44px); transform:translateX(-50%); }
|
||
.chat-area:has(.project-header),.chat-area:has(.project-list-head) { max-width:none; margin-inline:0; }
|
||
.project-tabs { scrollbar-width:none; } .project-tabs::-webkit-scrollbar { display:none; }
|
||
/* E2E6 P2-12: a strip wider than the screen fades out over its last 48px, so a cut tab reads as "more
|
||
this way". Where scroll timelines exist the fade runs only while there is more to scroll: a strip that
|
||
fits has an inactive timeline and keeps the 0px initial value (review P3), and the fade goes once the
|
||
strip is scrolled to its end. Without scroll timelines the 48px fade is static. */
|
||
@property --tabs-fade { syntax:'<length>'; inherits:false; initial-value:0px; }
|
||
@keyframes project-tabs-cue { 0%, 92% { --tabs-fade:48px; } 100% { --tabs-fade:0px; } }
|
||
@media (max-width:699px) {
|
||
.project-tabs { mask-image:linear-gradient(to right, #000 calc(100% - var(--tabs-fade)), transparent 100%); }
|
||
@supports (animation-timeline: scroll()) { .project-tabs { animation:project-tabs-cue linear both; animation-timeline:scroll(self inline); } }
|
||
@supports not (animation-timeline: scroll()) { .project-tabs { --tabs-fade:48px; } }
|
||
}
|
||
.project-chip { white-space:nowrap; flex:none; }
|
||
@media(max-width:699px) { .project-stepper span { white-space:nowrap; font-size:10.5px; padding:4px 1px; }.project-work-head { align-items:flex-start; } }
|
||
|
||
.project-chat .chat-message-meta .chat-avatar { display:inline-grid; place-items:center; width:36px; height:36px; margin-right:8px; border-radius:50%; background:var(--raised); color:var(--action); font-weight:700; }
|
||
.project-chat .chat-message-human .chat-avatar { background:var(--accent-fill); color:var(--on-accent); }
|
||
.project-panel a,.project-work a:not(.btn),.project-chat .chat-room-log a { display:inline-flex; align-items:center; min-height:44px; }
|
||
.project-prd-preview { max-height:9.6em; overflow:hidden; line-height:1.6; mask-image:linear-gradient(to bottom,#000 88%,transparent); }
|
||
.project-prd-preview.expanded { max-height:none; mask-image:none; }
|
||
.project-prd-toggle[hidden] { display:none; }
|
||
.project-provenance-row { display:flex; justify-content:space-between; gap:12px; min-height:40px; align-items:center; overflow-wrap:anywhere; }
|
||
.project-provenance-row code { font-family:var(--mono); }
|
||
.project-text-link { display:inline-flex; align-items:center; min-height:44px; }
|
||
|
||
.project-chat .chat-log { overflow-y:auto; max-height:calc(100vh - 430px); min-height:100px; }
|
||
.project-chat #chat-send-form,.project-chat #chat-room-send-form { position:sticky; bottom:0; z-index:2; padding:10px 16px; }
|
||
.project-chat textarea { min-height:52px; height:52px; }
|
||
.project-chat .chat-message-agent > .chat-body { margin-left:44px; }
|
||
.project-chat .project-composer-hint { display:inline; margin:0 8px; font-size:12px; }
|
||
@media(max-width:699px) { .project-chat .chat-log > li > .chat-body { max-width:80%; } }
|
||
/* Project review: responsive layouts and controls. */
|
||
.project-conversation-row { display:flex; align-items:center; min-height:64px; gap:12px; padding:8px 16px; color:var(--text); text-decoration:none; border-bottom:1px solid var(--line); }
|
||
.project-conversation-row > span:nth-child(2) { flex:1; }.project-conversation-row small { display:block; color:var(--muted); }
|
||
.project-conversation-icon,.project-delivery-icon { display:inline-grid; place-items:center; width:44px; height:44px; flex:none; border-radius:8px; background:var(--raised); color:var(--action); font-size:22px; }
|
||
.project-work strong { font-size:18px; color:var(--strong); }.project-work-head > div > .project-conversation-icon { float:left; margin-right:12px; }
|
||
.project-stepper { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); }.project-stepper span { display:flex; gap:6px; align-items:center; justify-content:center; font-size:12px; font-weight:600; }.project-stepper span i { font-style:normal; font-size:20px; line-height:1; }.project-stepper span b { font-size:12px; }.project-stepper .current { border:1px solid var(--line); }
|
||
.project-card [data-project-status] { display:flex; flex-direction:column; align-items:flex-start; gap:8px; }.project-card-status-line { display:block; }
|
||
.project-create { position:static; }.project-create[open] { position:static; }
|
||
.project-file-row { min-height:52px; color:var(--text); text-decoration:none; }.project-delivery-actions { display:flex; flex-wrap:wrap; gap:8px; }.project-delivery-icon { margin-right:12px; }.project-file-list code { font-family:var(--mono); font-size:14px; }
|
||
.project-tabs a[aria-current] { border:1px solid var(--line); border-bottom:2px solid var(--action); border-radius:8px 8px 0 0; }
|
||
.project-dialog { top:64px; height:calc(100vh - 64px); }.project-dialog::backdrop { background:var(--project-backdrop); }
|
||
.project-dialog input,.project-dialog select,.project-dialog button,.project-dialog a,.project-create input,.project-create select,.project-create button,.project-new-conversation input,.project-new-conversation select,.project-new-conversation button,.project-request-intro a { min-height:44px; box-sizing:border-box; }
|
||
.project-request-intro a { display:inline-flex; align-items:center; }.project-room-warning { padding:12px; border-left:4px solid var(--warning); background:var(--surface); }
|
||
.project-action-icon { display:none; }.project-tree-children a { position:relative; border:1px solid transparent; border-radius:6px; padding-left:44px; }.project-tree-children a[href*="threads"] { min-height:52px; }.project-tree-children svg { position:absolute; left:15px; width:18px; height:18px; fill:none; stroke:currentColor; stroke-width:1.7; }.project-tree-children a[aria-current] { border-color:var(--nav-active-border); }
|
||
.chat-area:has(.project-header) > p:first-child,.project-chat > p:first-child { display:none; }
|
||
[data-project-content] h2 { font-size:23px; font-weight:700; }
|
||
@media(max-width:1309px) { .project-columns { grid-template-columns:1fr; } }
|
||
@media(max-width:1100px) { .project-metrics a:nth-child(-n+2) { border-bottom:1px solid var(--line); padding-bottom:12px; }.project-metrics a:nth-child(n+3) { padding-top:12px; } }
|
||
@media(max-width:699px) { .project-stepper span { flex-direction:column; white-space:normal; font-size:12px; padding:6px 1px; }.project-action-label { display:none; }.project-action-icon { display:inline; }.project-dialog { top:0; height:100vh; }.project-delivery-actions > a { flex:1 1 calc(50% - 8px); }.project-delivery-actions > a:nth-child(3) { flex-basis:100%; } }
|
||
.project-dialog a,.project-panel a,.project-work a,.project-request-intro a { min-width:44px; }
|
||
.project-new-conversation:not([open]) > :not(summary) { display:none; }
|
||
@media(max-width:699px) { .project-header[data-project-conversation="true"] { display:flex; align-items:flex-start; }.project-header[data-project-conversation="true"] .project-actions { margin:0; }.project-header[data-project-conversation="true"] .project-actions .btn { min-width:44px; padding:0; }.project-chat textarea { min-height:52px; height:52px; }.project-stepper span b { overflow-wrap:normal; word-break:normal; font-size:12px; } }
|
||
#sections a.project-tree-ancestor { color:var(--strong); font-weight:700; }
|
||
[data-project-content] select { min-height:44px; min-width:44px; }
|
||
.project-chat #chat-room-send-form .project-composer-hint { display:block; margin:4px 0; }
|
||
.project-chat .request-details a,.project-chat .request-details button,.project-chat .request-details input,.project-chat .request-details select { display:inline-flex; align-items:center; min-height:44px; min-width:44px; box-sizing:border-box; }
|
||
.project-room-status { display:flex; flex-wrap:wrap; gap:8px; align-items:center; color:var(--muted); }
|
||
.project-room-status a { display:inline-flex; align-items:center; min-height:44px; min-width:44px; }
|
||
.project-room-status button { min-height:44px; }
|
||
|
||
/* Slice 4: project headers, phase labels and request summary. */
|
||
.content .chat-area:has(.project-header) h2 { font-size:23px; font-weight:700; }
|
||
.project-stepper { gap:0; }
|
||
.project-stepper span { position:relative; flex-direction:column; gap:4px; min-width:0; text-align:center; border-radius:8px; }
|
||
.project-stepper span b { font-size:12px; font-weight:600; line-height:1.25; overflow-wrap:normal; }
|
||
.project-stepper span i { font-size:20px; }
|
||
|
||
.project-work-row { display:flex; align-items:center; justify-content:space-between; gap:12px; border-top:1px solid var(--line); min-height:44px; }
|
||
.project-work-row > span { min-width:0; }
|
||
.agent-start-hint { display:inline-block; color:var(--muted); font-size:12px; }
|
||
@media(max-width:699px) {
|
||
.project-header[data-project-conversation="true"] .project-heading { flex:1; }
|
||
.project-header[data-project-conversation="true"] .project-actions { flex:none; }
|
||
.project-header[data-project-section="room"] { display:flex; align-items:flex-start; }
|
||
.project-header[data-project-section="room"] .project-heading { flex:1; }
|
||
.project-header[data-project-section="room"] .project-actions { display:none; }
|
||
.project-header[data-project-section="room"] .project-primary-action { display:none; }
|
||
.project-chat { position:relative; }
|
||
.project-chat .project-section-title [data-project-dialog="room"] { position:absolute; top:0; right:0; display:inline-flex; width:44px; padding:0; }
|
||
.project-request-intro { width:100%; box-sizing:border-box; }
|
||
}
|
||
/* Keep the breadcrumb's 44px links without adding their hit area and two margins to the header gap. */
|
||
body:has(.chat-area .project-header) .breadcrumbs { margin-bottom:-4px; }
|
||
.project-header { margin-top:0; }
|
||
.project-chat { display:flex; flex-direction:column; height:calc(100dvh - 160px); min-height:420px; }
|
||
.project-chat > .project-header,.project-chat > .project-tabs,.project-chat > .chat-paging,.project-chat > form { flex:none; }
|
||
.project-chat .chat-log { flex:1 1 auto; min-height:60px; max-height:none; }
|
||
.project-chat #chat-send-form,.project-chat #chat-room-send-form { position:static; display:grid; grid-template-columns:1fr auto; align-items:center; gap:4px 12px; }
|
||
.project-chat #chat-send-form > label { position:absolute; width:1px; height:1px; overflow:hidden; clip-path:inset(50%); }
|
||
.project-chat #chat-send-form > .chat-audience,.project-chat #chat-room-send-form > .chat-room-picker { grid-column:1 / -1; grid-row:1; margin:0; }
|
||
.project-chat #chat-send-form > textarea,.project-chat #chat-room-send-form > textarea { grid-column:1 / -1; grid-row:2; box-sizing:border-box; min-height:44px; height:44px; margin:0; }
|
||
.project-chat #chat-send-form > .project-composer-hint,.project-chat #chat-room-send-form > .project-composer-hint { grid-column:1; grid-row:3; margin:0; }
|
||
.project-chat #chat-send-form > button[type="submit"],.project-chat #chat-room-send-form > button[type="submit"] { grid-column:2; grid-row:3; }
|
||
@media(max-width:699px) {
|
||
.project-chat { height:calc(100dvh - 120px); }
|
||
}
|
||
|
||
.project-chat .chat-message-human > .request-mount { align-self:flex-start; width:min(720px,100%); }
|
||
@media(max-width:699px) {
|
||
.project-header[data-project-section="room"] .project-heading { box-sizing:border-box; padding-right:52px; }
|
||
}
|
||
|
||
/* Conversation layout consumes the space left by the shell, breadcrumb and composer. */
|
||
body:has(.project-chat) { height:100dvh; min-height:0; display:flex; flex-direction:column; }
|
||
body:has(.project-chat) .frame { flex:1 1 0; min-height:min-content; grid-template-rows:minmax(0,1fr); }
|
||
body:has(.project-chat) .content { display:flex; flex-direction:column; min-height:min-content; }
|
||
body:has(.project-chat) #bus-view, body:has(.project-chat) .chat-area { flex:1 1 0; min-height:min-content; display:flex; flex-direction:column; }
|
||
.project-chat { height:auto; min-height:min-content; flex:1 1 0; }
|
||
.project-chat .chat-log { flex:1 1 0; min-height:160px; margin:8px 0; padding:0; }
|
||
.project-chat .chat-log > li { padding-block:4px; }
|
||
.project-chat .chat-message-meta { display:flex; align-items:center; gap:8px; }
|
||
.project-chat .chat-message-meta .chat-avatar { display:grid; flex:none; margin-right:0; }
|
||
.project-chat .chat-message-meta strong { margin-right:4px; }
|
||
.project-chat .project-request-item > .request-mount { width:min(720px,calc(100% - 44px)); margin-left:44px; }
|
||
.project-chat .request-panel { background:var(--surface); border:1px solid var(--line); border-radius:10px; padding:8px 16px; }
|
||
.project-chat .project-request-intro { padding:0; }
|
||
.project-chat .project-request-intro p { margin:2px 0; font-size:13px; }
|
||
.project-chat .project-request-intro .project-stepper { margin:6px 0; }
|
||
.project-chat .chat-paging p { margin:2px 0; text-align:center; font-size:12px; }
|
||
.project-chat #chat-receipt:empty,.project-chat #chat-room-receipt:empty { display:none; }
|
||
.project-chat #chat-receipt,.project-chat #chat-room-receipt { margin:2px 0; }
|
||
.project-chat #chat-room-offer:empty,.project-chat #chat-room-tags:empty { display:none; }
|
||
.project-panel a.project-file-row { display:flex; width:100%; }
|
||
.project-stepper .current { border-color:var(--nav-active-border); border-radius:8px; }
|
||
.project-stepper span i { display:grid; place-items:center; width:20px; height:20px; box-sizing:border-box; border:1.5px solid currentColor; border-radius:50%; font-size:14px; line-height:1; }
|
||
@media(max-width:699px) {
|
||
.project-header[data-project-conversation="true"] { gap:4px; }
|
||
.project-header[data-project-conversation="true"] .project-heading { gap:12px; }
|
||
.project-header[data-project-conversation="true"] .project-header-icon { width:40px; height:40px; }
|
||
.project-header[data-project-conversation="true"] .project-heading p { white-space:nowrap; font-size:14px; }
|
||
.project-header:not([data-project-conversation="true"]):not([data-project-section="room"]) .project-heading { display:grid; grid-template-columns:44px minmax(0,1fr); gap:0 12px; }
|
||
.project-header:not([data-project-conversation="true"]):not([data-project-section="room"]) .project-heading > div { display:contents; }
|
||
.project-header:not([data-project-conversation="true"]):not([data-project-section="room"]) .project-heading p { grid-column:1 / -1; margin-top:4px; }
|
||
.project-metrics { padding:8px 0 6px; }
|
||
.project-metrics a { padding-left:12px; padding-right:12px; line-height:1.3; }
|
||
.project-metrics a span { font-size:13px; font-weight:600; }
|
||
.project-metrics a small { font-size:12px; }
|
||
.project-metrics a:nth-child(-n+2) { padding-bottom:8px; }
|
||
.project-metrics a:nth-child(n+3) { padding-top:8px; }
|
||
.project-metrics p { margin:8px 12px 0; padding-top:6px; }
|
||
.project-chat .project-request-item > .request-mount { width:100%; margin-left:0; }
|
||
.project-stepper .current { border-radius:8px; border-color:var(--nav-active-border); }
|
||
}
|
||
.project-chat .chat-log > li { padding-block:1px; }
|
||
.project-chat { margin-bottom:0; }
|
||
.project-chat .chat-paging { margin-bottom:0; }
|
||
.project-chat #chat-room-send-form > .chat-room-picker { grid-column:1; }
|
||
.project-chat #chat-room-send-form > #chat-room-tags { grid-column:2; grid-row:1; font-size:12px; }
|
||
@media(max-width:699px) {
|
||
body:has(.project-chat) footer.foot { padding:6px 12px; min-height:33px; align-items:center; }
|
||
.project-chat .chat-message-agent > .chat-body { max-width:calc(100% - 44px); box-sizing:border-box; }
|
||
}
|
||
@media(max-width:699px) {
|
||
.project-header:not([data-project-conversation="true"]):not([data-project-section="room"]) .project-heading p { font-size:12px; }
|
||
.project-chat .chat-log > li.chat-message-agent > .chat-body { max-width:calc(100% - 44px); }
|
||
.project-work-head > div { min-width:0; flex:1; }
|
||
.project-work-head p { font-size:13px; width:calc(100% + 80px); max-width:calc(100vw - 56px); }
|
||
.project-work { padding:16px; }
|
||
.project-work .project-stepper { margin:10px 0; }
|
||
}
|
||
@media(max-width:699px) {
|
||
.project-chat .chat-log > li > .chat-body { padding:8px 12px; }
|
||
.project-chat .chat-message-meta .chat-avatar { width:32px; height:32px; }
|
||
.project-chat .project-request-intro .project-stepper { margin:2px 0; }
|
||
}
|
||
@media(max-width:699px) {
|
||
.project-chat .chat-room-picker { gap:4px; min-width:0; }
|
||
.project-chat .chat-room-picker legend { margin-right:4px; }
|
||
.project-chat .room-chip { padding:0 8px; font-size:12px; }
|
||
}
|
||
/* Project list rows use the available content width. */
|
||
.chat-area:has(.project-list-head) .chat-projects { grid-template-columns:minmax(0,1fr); }
|
||
.chat-area:has(.project-list-head) .project-card { display:grid; grid-template-columns:52px minmax(0,1fr) auto; gap:2px 20px; align-items:center; }
|
||
.chat-area:has(.project-list-head) .project-card-icon { grid-row:1 / span 3; }
|
||
.chat-area:has(.project-list-head) .project-card > strong,.chat-area:has(.project-list-head) .project-card > span:not(.project-card-icon) { grid-column:2; }
|
||
.chat-area:has(.project-list-head) .project-card::after { content:'›'; grid-column:3; grid-row:1 / span 3; font-size:24px; }
|
||
.chat-area:has(.project-list-head) .project-card [data-project-status] { display:flex; flex-direction:row; flex-wrap:wrap; align-items:center; }
|
||
@media (min-width:700px) { .chat-area:has(.project-list-head) .project-create:not([open]) { position:absolute; top:0; right:0; margin:0; } }
|
||
|
||
.project-chat .chat-audience .room-chip { display:inline-flex; align-items:center; min-height:32px; margin-left:6px; background:var(--nav-active); border-color:var(--nav-active-border); }
|
||
|
||
.chat-conversation.project-chat > .project-header { margin-bottom:0; }
|
||
.project-chat [data-conversation-request-status] { min-height:16px; line-height:16px; margin:0; }
|
||
.project-work-wait { min-height:1.5em; }
|
||
/* Conversation fidelity and single-line tree labels. */
|
||
.project-tree-row a { font-size:14px; font-weight:600; }
|
||
.project-tree-children a { font-size:14px; font-weight:500; }
|
||
.project-tree-children a span,.project-tree-children a small { display:block; max-width:100%; overflow:hidden; white-space:nowrap; text-overflow:ellipsis; }
|
||
.project-tree-children small { font-size:12px; font-weight:400; line-height:16px; }
|
||
.project-tabs a { font-size:15px; }
|
||
.content .project-heading h1 { font-weight:700; }
|
||
.project-heading p { font-size:16px; }
|
||
.project-chat .chat-message-meta { opacity:1; font-size:12px; line-height:16px; }
|
||
.project-chat .chat-message-meta strong { font-size:13px; font-weight:600; }
|
||
.project-chat .chat-body { font-size:14px; }
|
||
@media(max-width:699px) { .project-heading p { font-size:14px; } }
|
||
|
||
.project-tree-children a { padding-left:40px; }
|
||
#sections:has(#project-tree) { grid-template-columns:minmax(0,1fr); }
|
||
#sections > li:has(#project-tree),.project-tree-list,.project-tree-list > li,.project-tree-children,.project-tree-children > li { min-width:0; }
|
||
.project-tree-children a span,.project-tree-children a small { max-width:100%; }
|
||
/* Align the conversation header and reserve the specified composer height. */
|
||
body:has(.project-chat) .breadcrumbs { margin-bottom:-6px; }
|
||
.project-header[data-project-conversation="true"] .project-heading { align-items:flex-start; }
|
||
@media(min-width:700px) {
|
||
body:has(.project-chat) .content { padding-bottom:9px; }
|
||
}
|
||
@media(max-width:699px) {
|
||
body:has(.project-chat) .breadcrumbs { margin-bottom:-12px; }
|
||
.project-chat #chat-send-form { padding:8px 16px; gap:2px 12px; }
|
||
.project-chat #chat-send-form > textarea { min-height:32px; height:32px; }
|
||
.project-chat .chat-audience .room-chip { min-height:28px; }
|
||
}
|
||
body:has(.chat-area .project-header):has(.project-chat) .breadcrumbs { margin-bottom:-6px; }
|
||
.project-chat .project-actions [data-project-dialog="conversation"] { gap:8px; }
|
||
.project-chat .project-actions [data-project-dialog="conversation"] .project-action-icon { display:inline-flex; }
|
||
.project-chat .chat-message-agent > .chat-body { margin-left:48px; }
|
||
.project-chat .project-request-item > .request-mount { width:min(744px,calc(100% - 48px)); margin-left:48px; }
|
||
.project-chat #chat-send-form > button[type="submit"] { min-width:80px; }
|
||
@media(max-width:699px) {
|
||
body:has(.chat-area .project-header):has(.project-chat) .breadcrumbs { margin-bottom:-12px; }
|
||
.project-chat .chat-message-agent > .chat-body { margin-left:40px; }
|
||
.project-chat .project-request-item > .request-mount { width:100%; margin-left:0; }
|
||
.project-chat #chat-send-form > button[type="submit"] { min-width:72px; }
|
||
}
|
||
.project-chat .chat-log { margin-top:12px; }
|
||
.project-chat .chat-paging p { flex:1; }
|
||
.project-chat .request-panel { padding:20px; }
|
||
.project-chat .chat-message-human .chat-message-meta strong { font-size:12px; }
|
||
.project-chat .project-actions .btn,.project-chat #chat-send-form > button[type="submit"] { font-size:14px; }
|
||
@media(max-width:699px) { .project-chat .request-panel { padding:16px; } }
|
||
.project-chat .project-work-head strong { font-size:16px; font-weight:700; }
|
||
.project-chat #chat-send-form { box-sizing:border-box; min-height:150px; align-content:space-between; }
|
||
.project-chat #chat-send-form > .chat-audience { font-size:13px; font-weight:600; }
|
||
.project-chat .chat-audience .room-chip { min-height:28px; font-size:13px; font-weight:600; }
|
||
.project-chat #chat-send-form > textarea { min-height:32px; height:32px; }
|
||
@media(max-width:699px) { .project-chat #chat-send-form { min-height:128px; } }
|
||
|
||
/* Desktop stepper follows the horizontal request phase treatment. */
|
||
.project-step-separator { display:none; }
|
||
@media(min-width:700px) {
|
||
.project-stepper { display:flex; align-items:center; justify-content:space-between; gap:4px; }
|
||
.project-stepper span { flex-direction:row; gap:6px; white-space:nowrap; }
|
||
.project-stepper span b { font-size:14px; }
|
||
.project-stepper .current { border-radius:999px; }
|
||
.project-stepper .done b { color:var(--text); }
|
||
.project-stepper .current i { color:var(--action); }
|
||
.project-step-separator { display:block; width:16px; height:16px; flex:none; fill:none; stroke:var(--muted); stroke-width:1.5; }
|
||
.project-chat .chat-message-agent .chat-message-meta { gap:12px; }
|
||
.project-chat .chat-log > li.chat-message-agent > .chat-body { width:min(744px,calc(100% - 48px)); max-width:min(744px,calc(100% - 48px)); box-sizing:border-box; }
|
||
}
|
||
.project-chat .chat-message-meta .chat-avatar { font-size:14px; }
|
||
.project-chat #chat-send-form > textarea { padding:4px 0; border:0; border-top:1px solid var(--line); border-radius:0; background:transparent; }
|
||
.project-chat #chat-send-form > textarea::placeholder { color:var(--muted); opacity:1; }
|
||
|
||
/* Decorative action icons share the shell icon treatment. */
|
||
.project-primary-action,.project-section-title .btn { gap:8px; }
|
||
/* Header actions use the specified compact widths while retaining 44px targets. */
|
||
.project-primary-action { box-sizing:border-box; flex:none; }
|
||
@media (min-width:1200px) {
|
||
/* E2E6 P2-11: 100vw counts the page scrollbar; max-width keeps the header inside its column. */
|
||
.project-header:not([data-project-conversation="true"]) { width:calc(100vw - 270px); max-width:100%; box-sizing:border-box; }
|
||
.project-header:not([data-project-conversation="true"]) .project-actions { align-self:flex-start; margin-top:4px; }
|
||
.project-primary-action:nth-of-type(1) { width:130px; }
|
||
.project-primary-action:nth-of-type(2) { width:88px; }
|
||
.project-primary-action:nth-of-type(3) { width:116px; }
|
||
}
|
||
@media (max-width:699px) {
|
||
.project-primary-action:nth-of-type(1) { width:120px; }
|
||
.project-primary-action:nth-of-type(2) { width:80px; }
|
||
.project-primary-action:nth-of-type(3) { width:112px; }
|
||
}
|
||
@media (max-width:699px) {
|
||
.project-primary-action { padding-inline:4px; white-space:nowrap; }
|
||
}
|
||
@media (max-width:699px) {
|
||
.project-header:not([data-project-conversation="true"]):not([data-project-section="room"]) .project-actions { gap:8px; margin-top:16px; }
|
||
}
|
||
|
||
/* Allow conversation text to shrink and keep its trailing control in view. */
|
||
.project-conversation-row > span:nth-child(2) { min-width:0; overflow-wrap:anywhere; }
|
||
.project-conversation-row > span:last-child { flex:none; }
|
||
.project-header[data-project-conversation="true"] .project-heading > div { min-width:0; }
|
||
@media (max-width:699px) {
|
||
.project-header[data-project-conversation="true"] { flex-wrap:wrap; }
|
||
.project-header[data-project-conversation="true"] .project-heading { flex:1 1 120px; }
|
||
.project-header[data-project-conversation="true"] .project-heading p { white-space:normal; overflow-wrap:anywhere; }
|
||
.project-metrics p { margin-top:6px; padding-top:0; }
|
||
.project-metrics + .project-columns { margin-top:8px; }
|
||
.project-columns > section > .project-section-title .btn { box-sizing:border-box; }
|
||
}
|
||
@media (min-width:1310px) {
|
||
.project-metrics + .project-columns { grid-template-columns:minmax(0,1.75fr) minmax(280px,1fr); margin-top:24px; }
|
||
.project-columns > section > .project-section-title .btn { box-sizing:border-box; min-width:176px; }
|
||
}
|
||
|
||
@media (min-width:320px) and (max-width:699px) {
|
||
.project-columns > section > .project-section-title .btn { min-width:172px; }
|
||
}
|
||
@media (max-width:319px) {
|
||
.project-conversation-row { display:grid; grid-template-columns:44px minmax(0,1fr) auto; }
|
||
.project-conversation-row > span:nth-child(2) { grid-column:2; }
|
||
.project-conversation-row > span:nth-child(3) { grid-column:1 / 3; min-width:0; }
|
||
.project-conversation-row > span:nth-child(3) .project-chip { max-width:100%; white-space:normal; overflow-wrap:anywhere; border-radius:12px; }
|
||
.project-conversation-row > span:last-child { grid-column:3; grid-row:1 / span 2; }
|
||
}
|
||
/* Narrow or very short viewports (phones, 200% tab zoom) read the transcript in page flow. */
|
||
@media (max-width:319px), (max-height:540px) {
|
||
body:has(.project-chat) { height:auto; min-height:100dvh; }
|
||
body:has(.project-chat) .frame { flex:1 0 auto; grid-template-rows:auto; }
|
||
body:has(.project-chat) footer.foot { position:static; }
|
||
body:has(.project-chat) .content, body:has(.project-chat) #bus-view, body:has(.project-chat) .chat-area { display:block; min-height:auto; }
|
||
.project-chat { display:block; min-height:0; }
|
||
.project-chat .chat-log { min-height:120px; }
|
||
}
|
||
|
||
/* Keep short names on one line when tab zoom leaves a very narrow heading. */
|
||
@media (max-width:319px) {
|
||
.content .project-heading h1 { font-size:16px; }
|
||
.project-header[data-project-section="room"] .project-heading { padding-right:0; }
|
||
.project-chat .project-section-title [data-project-dialog="room"] { position:static; flex:none; min-width:44px; }
|
||
}
|
||
|
||
/* In narrow page flow, give room composer controls the full available width. */
|
||
@media (max-width:319px) {
|
||
.project-chat #chat-room-send-form { grid-template-columns:minmax(0,1fr); }
|
||
.project-chat #chat-room-send-form > .chat-room-picker { grid-column:1; grid-row:1; }
|
||
.project-chat #chat-room-send-form > #chat-room-tags { grid-column:1; grid-row:2; }
|
||
.project-chat #chat-room-send-form > textarea { grid-column:1; grid-row:3; }
|
||
.project-chat #chat-room-send-form > .project-composer-hint { grid-column:1; grid-row:4; }
|
||
.project-chat #chat-room-send-form > button[type="submit"] { grid-column:1; grid-row:5; }
|
||
.project-chat #chat-room-send-form > #chat-room-offer,
|
||
.project-chat #chat-room-send-form > #chat-room-completion { grid-column:1; }
|
||
}
|
||
|
||
/* Keep the Room composer and a readable transcript in short desktop windows. */
|
||
@media (min-width:700px) and (min-height:541px) and (max-height:759px), (min-width:700px) and (max-width:959px) and (min-height:760px) and (max-height:760px) {
|
||
body:has(.chat-room.project-chat) .frame, body:has(.chat-room.project-chat) .content, body:has(.chat-room.project-chat) #bus-view, body:has(.chat-room.project-chat) .chat-area { min-height:0; }
|
||
.chat-room.project-chat { min-height:0; display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); grid-template-rows:auto minmax(45px,auto) minmax(44px,auto) auto auto auto minmax(168px,1fr) auto auto auto; }
|
||
.chat-room.project-chat > * { grid-column:1 / -1; }
|
||
.chat-room.project-chat > .project-header { grid-column:1 / -1; grid-row:1; margin-bottom:0; }
|
||
.chat-room.project-chat > .project-tabs { grid-column:1 / -1; grid-row:2; }
|
||
.chat-room.project-chat > .project-section-title { grid-column:1 / -1; grid-row:3; }
|
||
.chat-room.project-chat .project-section-title [data-project-dialog="room"] { width:128px; box-sizing:border-box; padding-inline:8px; white-space:nowrap; }
|
||
/* Full member names stay in Room details; the summary keeps one line, left of the Room details button. */
|
||
.chat-room.project-chat > p:nth-of-type(3) { grid-column:2; grid-row:3; justify-self:end; margin:0 140px 0 12px; min-width:0; max-width:calc(100% - 152px); box-sizing:border-box; align-self:center; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
|
||
.chat-room.project-chat > .project-room-warning { grid-row:4; padding:4px 12px; }
|
||
.chat-room.project-chat > .chat-library { grid-row:5; }
|
||
.chat-room.project-chat > p:nth-of-type(2) { grid-column:1 / -1; grid-row:6; margin:0; }
|
||
.chat-room.project-chat > .chat-log { grid-column:1 / -1; grid-row:7; min-height:160px; margin:4px 0; overflow-anchor:none; }
|
||
.chat-room.project-chat > .chat-paging { grid-column:1 / -1; grid-row:8; }
|
||
.chat-room.project-chat > .chat-paging + * { grid-row:9; }
|
||
.chat-room.project-chat > #chat-room-receipt { grid-row:10; }
|
||
.chat-room.project-chat > #chat-room-send-form { grid-column:1 / -1; grid-template-columns:fit-content(50%) minmax(120px,1fr) auto; }
|
||
.chat-room.project-chat #chat-room-send-form > .chat-room-picker { grid-column:1; grid-row:1; min-width:0; max-height:96px; overflow-y:auto; }
|
||
.chat-room.project-chat .chat-room-picker .room-chip { max-width:16em; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
|
||
.chat-room.project-chat #chat-room-send-form > textarea { grid-column:2; grid-row:1; }
|
||
.chat-room.project-chat #chat-room-send-form > button[type="submit"] { grid-column:3; grid-row:1; }
|
||
.chat-room.project-chat #chat-room-send-form > .project-composer-hint { grid-column:2 / -1; grid-row:2; }
|
||
.chat-room.project-chat #chat-room-send-form > #chat-room-tags { grid-column:1 / -1; grid-row:3; }
|
||
.chat-room.project-chat #chat-room-send-form > #chat-room-offer,
|
||
.chat-room.project-chat #chat-room-send-form > #chat-room-completion { grid-column:1 / -1; }
|
||
}
|
||
@media (min-width:700px) and (min-height:541px) and (max-height:649px), (min-width:700px) and (max-width:959px) and (min-height:650px) and (max-height:699px) {
|
||
.chat-room.project-chat { grid-template-rows:minmax(44px,auto) minmax(44px,auto) auto auto auto minmax(168px,1fr) auto auto auto; }
|
||
.chat-room.project-chat > .project-header { grid-column:1; grid-row:1; min-width:0; width:100%; box-sizing:border-box; margin:0; }
|
||
.chat-room.project-chat > .project-tabs { grid-column:2; grid-row:1; min-width:0; max-width:50vw; }
|
||
.chat-room.project-chat > .project-header { overflow-x:auto; gap:8px; }
|
||
.chat-room.project-chat .project-heading { flex:none; gap:8px; }
|
||
.chat-room.project-chat .project-heading h1 { font-size:20px; white-space:nowrap; }
|
||
.chat-room.project-chat .project-heading p { font-size:12px; line-height:16px; margin:0; white-space:nowrap; }
|
||
.chat-room.project-chat .project-header-icon { width:36px; height:36px; }
|
||
.chat-room.project-chat .project-actions { flex:none; flex-wrap:nowrap; gap:4px; }
|
||
.chat-room.project-chat .project-primary-action { width:44px; min-width:44px; padding:0; font-size:0; }
|
||
.chat-room.project-chat .project-action-label { display:none; }
|
||
.chat-room.project-chat .project-action-icon { display:inline; }
|
||
.chat-room.project-chat .project-section-title [data-project-dialog="room"] { min-width:44px; width:44px; }
|
||
.chat-room.project-chat .project-heading > div { max-width:135px; }
|
||
.chat-room.project-chat .project-heading h1, .chat-room.project-chat .project-heading p { overflow:hidden; text-overflow:ellipsis; }
|
||
.chat-room.project-chat > #chat-room-send-form { padding-block:4px; }
|
||
.chat-room.project-chat > .project-section-title { grid-row:2; }
|
||
.chat-room.project-chat > p:nth-of-type(3) { grid-row:2; margin-right:56px; max-width:calc(100% - 68px); }
|
||
.chat-room.project-chat > .project-room-warning { grid-row:3; }
|
||
.chat-room.project-chat > .chat-library { grid-row:4; }
|
||
.chat-room.project-chat > p:nth-of-type(2) { grid-row:5; }
|
||
.chat-room.project-chat > .chat-log { grid-row:6; }
|
||
.chat-room.project-chat > .chat-paging { grid-row:7; }
|
||
.chat-room.project-chat > .chat-paging + * { grid-row:8; }
|
||
.chat-room.project-chat > #chat-room-receipt { grid-row:9; }
|
||
}
|
||
@media (min-width:700px) and (min-height:541px) and (max-height:649px) {
|
||
.chat-room.project-chat { grid-template-rows:minmax(44px,auto) minmax(44px,auto) auto auto auto minmax(143px,1fr) auto auto auto; }
|
||
.chat-room.project-chat > .chat-log { min-height:135px; }
|
||
.chat-room.project-chat #chat-room-send-form > .chat-room-picker { max-height:44px; }
|
||
/* A closed room shows its recovery notice above the messages; the transcript gives up the room it needs. */
|
||
.chat-room.project-chat:has(> .project-room-warning) { grid-template-rows:minmax(44px,auto) minmax(44px,auto) auto auto auto minmax(72px,1fr) auto auto auto; }
|
||
.chat-room.project-chat:has(> .project-room-warning) > .chat-log { min-height:64px; }
|
||
}
|
||
|
||
/* Keep the active section and message metadata legible at narrow tab zoom. */
|
||
@media (max-width:319px) {
|
||
.project-tabs { mask-image:none; }
|
||
.project-chat .chat-message-meta { flex-wrap:wrap; overflow-wrap:normal; word-break:normal; }
|
||
.project-chat .chat-message-meta time { flex:none; white-space:nowrap; }
|
||
}
|
||
/* Project names may shrink, while their full text remains in the link. */
|
||
@media (min-width:320px) and (min-height:541px) {
|
||
.breadcrumbs:has(.project-crumb-name) { flex-wrap:nowrap; }
|
||
.breadcrumbs .project-crumb-name { flex:0 0 auto; min-width:0; max-width:40%; }
|
||
.breadcrumbs .project-crumb-name span { display:block; overflow:hidden; white-space:nowrap; text-overflow:ellipsis; }
|
||
.breadcrumbs:has(.project-crumb-name) > :not(.project-crumb-name) { flex:none; }
|
||
/* The project name stops at 40%; a long current label takes what is left; the page heading carries it in full. */
|
||
.breadcrumbs:has(.project-crumb-name) > .project-crumb-current { flex:0 1000 auto; min-width:4em; overflow:hidden; white-space:nowrap; text-overflow:ellipsis; }
|
||
}
|
||
/* Under 700px the current label is hidden, so the project name is the one crumb that shrinks. */
|
||
@media (min-width:320px) and (max-width:699px) and (min-height:541px) {
|
||
.breadcrumbs .project-crumb-name { flex:0 1 auto; max-width:none; }
|
||
}
|
||
.project-chat .project-section-title [data-project-dialog="room"] .project-action-icon { display:inline-flex; }
|
||
@media (min-width:700px) and (min-height:761px), (min-width:960px) and (min-height:760px) {
|
||
.chat-room.project-chat .project-section-title { transform:translateY(11px); }
|
||
.chat-room.project-chat .project-section-title h2 { line-height:30px; transform:translateY(2.64px); }
|
||
.chat-room.project-chat .project-section-title [data-project-dialog="room"] { width:148px; box-sizing:border-box; }
|
||
}
|
||
/* A long Conversation title wraps beside Details instead of squeezing it. */
|
||
.project-header[data-project-conversation="true"] .project-actions { flex:none; }
|
||
|
||
/* Keep the action in flow when a read error occupies the top of the page. */
|
||
@media (min-width:700px) { .chat-area:has(.chat-error) .project-create:not([open]) { position:static; margin:12px 0; } }
|
||
/* E2E6 P2-15: inline code in a chat bubble keeps the bubble's text colour on a light tint. */
|
||
.project-chat .chat-body code { font-size:.92em; padding:0 .3em; border-radius:4px; background:color-mix(in srgb, currentColor 12%, transparent); color:inherit; }
|