/* Carry the Assistant's reading rhythm into the working pages. */
.preview-label { margin:0; padding:8px 22px; font-size:.69rem; line-height:1.5; color:var(--muted); background:var(--surface-2) }
body:not([data-page=chat]) .page-canvas { width:100%; max-width:1136px; padding:36px 44px 150px; margin-inline:auto }
body:not([data-page=chat]) .page-header { display:flex; align-items:flex-start; justify-content:space-between; gap:28px; margin-bottom:30px }
body:not([data-page=chat]) .page-header h1 { font:400 2.25rem/1.2 Georgia,"Times New Roman",serif; letter-spacing:-.025em; text-wrap:balance; overflow-wrap:anywhere }
body:not([data-page=chat]) .page-header p { font-size:.87rem; line-height:1.7; max-width:70ch; color:var(--muted); margin-top:10px }
body:not([data-page=chat]) .page-header>.primary { flex:none; margin-top:3px }
.page-canvas h2 { text-wrap:balance }
.page-canvas .empty-panel,.page-canvas .empty-feature,.page-canvas .empty-state { display:flex; flex-direction:column; align-items:center; justify-content:center; gap:13px; padding:54px 24px; text-align:center; min-height:240px }
.page-canvas .empty-panel strong,.page-canvas .empty-feature h2,.page-canvas .empty-state h2 { font-size:1.1rem; font-weight:550; margin:0 }
.page-canvas .empty-panel>span,.page-canvas .empty-feature>p,.page-canvas .empty-state>p { max-width:58ch; color:var(--muted); font-size:.86rem; line-height:1.8; margin:0 }
.page-canvas .empty-symbol { width:42px; height:42px; display:grid; place-items:center; background:var(--surface-2); color:var(--accent); border-radius:12px }
.page-canvas .policy-strip { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:20px; padding:20px 24px; border-radius:12px; background:var(--surface-2) }
.policy-strip strong { font-size:.87rem; font-weight:550 }
.policy-strip small { display:block; margin-top:5px; font-size:.79rem; line-height:1.6; color:var(--muted) }
.policy-items { display:flex; flex-wrap:wrap; gap:8px 15px; font-size:.76rem; color:var(--muted) }
.project-card,.draft-row,.member-row { min-width:0 }
.project-card h2,.draft-row strong,.member-main strong,.member-main span { overflow-wrap:anywhere }
.draft-row { display:flex; align-items:center; gap:15px; padding:22px 0; border-bottom:1px solid var(--line); color:var(--ink); text-decoration:none; font-size:.87rem }
.draft-row:hover strong { color:var(--accent) }
.draft-row>.icon { flex:none; color:var(--muted) }
.draft-row strong { font-weight:550 }
.draft-row>div { min-width:0; flex:1 }
.draft-row small { display:block; margin-top:5px; line-height:1.5; color:var(--muted); font-size:.76rem }
.back-link { display:inline-flex; align-items:center; gap:8px; margin-bottom:22px; font-size:.8rem; color:var(--muted); text-underline-offset:4px }
.back-link>.icon { transform:rotate(180deg) }
.draft-detail-layout { display:grid; grid-template-columns:minmax(0,1fr) 280px; gap:48px; margin-top:34px; align-items:start }
.draft-content { white-space:pre-wrap; overflow-wrap:anywhere; font-size:.95rem; line-height:1.85; max-width:72ch }
.review-panel { border-top:1px solid var(--line); padding-top:20px; min-width:0 }
.review-panel h2 { font-size:1rem; font-weight:550; margin-bottom:12px }
.review-panel p,.review-panel small { font-size:.8rem; line-height:1.8; color:var(--muted) }
.review-panel small { display:block; margin-top:10px }
.review-panel .account-form { display:flex; flex-direction:column; gap:15px; margin:22px 0 }
.review-panel label { display:flex; flex-direction:column; gap:8px; font-size:.8rem }
.project-header { align-items:center!important }
.project-mark { width:46px; height:46px; flex:none; display:grid; place-items:center; color:var(--accent); border-radius:12px; background:var(--surface-2) }
.project-mark>.icon { width:24px; height:24px }
.project-header>div:nth-child(2) { flex:1; min-width:0 }
.project-columns { display:grid; grid-template-columns:minmax(0,1fr) 260px; gap:42px; margin-top:40px }
.project-columns h2 { font-size:1rem; font-weight:550; margin:0 0 18px }
.project-chats .section-heading { display:flex; justify-content:space-between; gap:20px; align-items:baseline }
.project-chats .section-heading>a { font-size:.8rem; color:var(--accent); text-underline-offset:4px }
.project-chat-list>a { display:flex; align-items:center; gap:16px; padding:20px 0; border-bottom:1px solid var(--line); color:var(--ink); text-decoration:none; font-size:.86rem }
.project-chat-list>a>span { flex:1; overflow-wrap:anywhere }
.project-chat-list small { color:var(--muted); font-size:.72rem }
.project-members { border-top:1px solid var(--line); padding-top:20px }
.project-members .member-row { display:flex; gap:12px; padding:16px 0; align-items:center }
.project-members .member-row strong { font-size:.82rem; font-weight:550 }
.project-members .member-row small { display:block; font-size:.72rem; color:var(--muted); margin-top:5px }
.project-members .person-avatar { display:grid; place-items:center; width:32px; height:32px; flex:none; border-radius:50%; background:var(--surface-2); color:var(--accent); font-size:.7rem }
.source-content { max-width:72ch; font-size:.95rem; line-height:1.85; overflow-wrap:anywhere }
.source-content p { white-space:pre-wrap }
.connection-policy { display:flex; gap:13px; align-items:flex-start; color:var(--muted); max-width:78ch; margin:5px 0 38px }
.connection-policy>.icon { flex:none; color:var(--accent); margin-top:2px }
.connection-policy p { font-size:.83rem; line-height:1.8 }
.page-canvas .connection-group { margin:40px 0 0 }
.connection-group>h2 { font-size:1.08rem; font-weight:550; margin-bottom:10px }
.connection-group>p { font-size:.82rem; line-height:1.75; color:var(--muted); max-width:70ch; margin-bottom:20px }
.connection-row { display:flex; align-items:center; gap:17px; padding:23px 0; border-bottom:1px solid var(--line); min-width:0 }
.connection-symbol { width:40px; height:40px; flex:none; display:grid; place-items:center; color:var(--accent); background:var(--surface-2); border-radius:10px }
.connection-copy { flex:1; min-width:0 }
.connection-copy h3 { font-size:.9rem; font-weight:550 }
.connection-copy p { color:var(--muted); font-size:.8rem; line-height:1.7; margin-top:5px; max-width:62ch }
.connection-copy small { display:block; color:var(--muted); font-size:.72rem; margin-top:7px; overflow-wrap:anywhere }
.connect-options { flex:0 0 124px }
.connect-options>summary { list-style:none; cursor:pointer; display:flex; align-items:center; justify-content:center; gap:8px; font-size:.78rem }
.connect-options>summary::-webkit-details-marker { display:none }
.connect-options[open] { flex-basis:280px }
.connect-options .form-stack { padding-top:17px }
.connect-options p { font-size:.75rem; line-height:1.7; color:var(--muted) }
.form-stack .check-label { display:flex; flex-direction:row; align-items:flex-start; gap:10px; font-size:.82rem; line-height:1.7 }
.check-label input[type=checkbox] { width:18px; height:18px; min-height:18px; flex:none; padding:0; margin-top:4px; accent-color:var(--accent) }
.review-action-row { display:flex; gap:15px; align-items:center; padding:17px 0; border-bottom:1px solid var(--line); text-decoration:none; color:var(--ink); font-size:.85rem }
.review-action-row>span:first-child { flex:1 }
.review-action-row small { display:block; font-size:.72rem; margin-top:5px; color:var(--muted) }
.quiet-empty { padding:24px 0; color:var(--muted); font-size:.83rem }
.action-review-page,.connected-app-page { max-width:950px!important }
.action-details { margin:28px 0; border-top:1px solid var(--line) }
.action-details>div { display:grid; grid-template-columns:120px minmax(0,1fr); gap:20px; padding:19px 0; border-bottom:1px solid var(--line) }
.action-details dt { color:var(--muted); font-size:.8rem }
.action-details dd { font-size:.88rem; line-height:1.8; white-space:pre-wrap; overflow-wrap:anywhere }
.cancel-action { margin:14px 0 28px }
.connected-app-page .form-stack { max-width:640px }
[data-app-result] { margin-top:20px }
[data-app-result] pre { white-space:pre-wrap; overflow-wrap:anywhere; font-size:.76rem; padding:18px; background:var(--surface-2); max-height:420px; overflow:auto }
.chat-connection-label { display:flex; align-items:center; gap:6px; max-width:220px; color:var(--muted) }
.chat-connection-label select { background:transparent; border:0; padding:6px 4px; font-size:.74rem; max-width:190px; min-height:32px }
.chat-connection-label .icon { width:15px; height:15px }
.work-status { color:var(--muted); font-size:.83rem; line-height:1.8 }
.work-status::after { content:""; display:inline-block; width:22px; height:2px; margin-left:10px; vertical-align:middle; background:var(--accent); animation:work-breathe 2.8s linear infinite }
@keyframes work-breathe { 0%,100% { opacity:1 } 50% { opacity:.58 } }
@media(prefers-reduced-motion:reduce) { .work-status::after { animation:none } }
html[data-motion=reduced] .work-status::after { animation:none }
@media(max-width:1000px) { body:not([data-page=chat]) .page-canvas { padding-inline:30px } .connection-row { flex-wrap:wrap } .connect-options[open] { flex-basis:100%; margin-left:57px } }
@media(max-width:760px) {
 body:not([data-page=chat]) .page-canvas { padding:26px 20px 145px }
 body:not([data-page=chat]) .page-header { flex-wrap:wrap; gap:18px; margin-bottom:25px }
 body:not([data-page=chat]) .page-header h1 { font-size:1.85rem }
 body:not([data-page=chat]) .page-header p { font-size:.82rem }
 .page-canvas .policy-strip { padding:18px; gap:14px }
 .member-row { flex-wrap:wrap; gap:10px }
 .member-main { flex:1; min-width:150px }
 .member-actions { width:100% }
 .draft-row { flex-wrap:wrap; gap:10px }
 .draft-row>.status-badge { margin-left:32px }
 .draft-detail-layout,.project-columns { grid-template-columns:1fr; gap:35px }
 .project-header { align-items:flex-start!important }
 .project-header>.project-mark { display:none }
 .project-header>div:nth-child(2) { flex-basis:100% }
 .connection-row { gap:12px; padding-block:20px }
 .connection-symbol { width:34px; height:34px }
 .connection-copy { min-width:200px }
 .connect-options,.connect-options[open] { flex-basis:100%; margin-left:46px }
 .connection-row>.secondary { margin-left:46px }
 .connection-group { margin-top:30px }
 .action-details>div { grid-template-columns:1fr; gap:6px }
 .chat-connection-label select { font-size:.8rem; min-height:44px; max-width:145px }
 .composer-actions>div { flex-wrap:wrap }
 .page-canvas button,.page-canvas summary.secondary { min-height:44px }
}