:root {
  color-scheme: light;
  --ink: #242824;
  --muted: #898e87;
  --line: #eceee9;
  --soft: #f7f8f5;
  --green: #2f7252;
  --green-dark: #245c40;
  --green-soft: #edf5ef;
  --sidebar: #f8f9f7;
  font-family: "DM Sans", sans-serif;
}

* { box-sizing: border-box; }
button[hidden] { display: none; }
body { margin: 0; min-width: 320px; background: #fff; color: var(--ink); font-size: 13px; }
button, input, textarea, select { font: inherit; }
button { color: inherit; }
.app-shell { display: flex; min-height: 100vh; }
.app-shell[hidden], .account-screen[hidden] { display: none; }
.skip-link { background: #fff; border: 2px solid var(--green); color: var(--green-dark); left: 12px; padding: 8px 12px; position: fixed; top: 12px; transform: translateY(-160%); z-index: 20; }
.skip-link:focus { transform: translateY(0); }

.account-screen { align-items: center; background: radial-gradient(ellipse at 50% 20%, #f5f8f3 0, #fff 62%); display: flex; flex-direction: column; justify-content: center; min-height: 100vh; padding: 34px 18px; }
.account-brand { margin: 0 0 25px; }
.account-card { background: #fff; border: 1px solid #ecefe9; border-radius: 14px; box-shadow: 0 12px 50px #253b250b; display: flex; flex-direction: column; max-width: 400px; padding: 30px; position: relative; width: 100%; }
.account-icon { margin-bottom: 15px; }
.account-eyebrow { color: #849080; font-size: 8px; font-weight: 700; letter-spacing: 1.1px; margin: 0 0 8px; }
.account-card h1 { font: 700 21px Manrope, sans-serif; letter-spacing: -.6px; margin: 0 0 7px; }
.account-description { color: #858b83; font-size: 10px; line-height: 1.6; margin: 0 0 21px; }
.account-card > label, .account-card form > label { color: #636a61; font-size: 9px; font-weight: 600; margin: 0 0 6px; }
.account-card > input, .account-card form > input { background: #fff; border: 1px solid #e3e7e0; border-radius: 7px; color: #454b44; font-size: 10px; margin: 0 0 14px; outline: 0; padding: 11px; width: 100%; }
.account-card > input:focus, .account-card form > input:focus { border-color: #9bb59d; }
.account-submit { margin-top: 5px; min-height: 38px; width: 100%; }
.account-switch { color: #858b83; font-size: 9px; margin: 17px 0 0; text-align: center; }
.account-switch button, .account-signout { background: transparent; border: 0; color: #39734f; cursor: pointer; font-size: inherit; font-weight: 600; padding: 0; }
.account-footnote { border-top: 1px solid #eff0ed; color: #a0a59e; font-size: 8px; margin: 18px 0 0; padding-top: 13px; text-align: center; }
.account-error { background: #fbf1ed; border: 1px solid #f3e3dc; border-radius: 7px; color: #915945; font-size: 9px; line-height: 1.5; margin: -7px 0 15px; padding: 9px 10px; }
.account-error[hidden] { display: none; }
.account-card [hidden], .demo-banner[hidden] { display: none; }
.account-card button:disabled { cursor: wait; opacity: .7; }
.workspace-card { padding-top: 26px; }
.workspace-choice-list { display: flex; flex-direction: column; gap: 7px; margin-bottom: 17px; }
.workspace-choice { align-items: center; background: #fff; border: 1px solid #e8ebe5; border-radius: 8px; cursor: pointer; display: flex; gap: 10px; padding: 10px; text-align: left; width: 100%; }
.workspace-choice:hover { background: #f7f9f6; border-color: #cad9ca; }
.workspace-choice-icon { align-items: center; background: #eaf2eb; border-radius: 6px; color: #39734f; display: flex; font: 700 12px Manrope; height: 29px; justify-content: center; width: 29px; }
.workspace-choice span:last-child { color: #41473f; font-size: 10px; font-weight: 600; }
.workspace-card form { border-top: 1px solid #eff0ed; display: flex; flex-direction: column; padding-top: 16px; }
.workspace-signout { align-self: center; color: #868d84; font-size: 9px; margin-top: 19px; }
.workspace-connected .presence-stack, .workspace-connected .online-label { display: none; }
.workspace-connected .identity-picker, .workspace-connected .plan-card { display: none; }
.workspace-connected .connected-empty { align-items: center; color: #858b83; display: flex; flex-direction: column; font-size: 10px; gap: 8px; margin: 55px auto; max-width: 300px; text-align: center; }
.workspace-connected .connected-empty strong { color: #434a41; font: 600 13px Manrope, sans-serif; }
.workspace-connected .connected-empty .button { margin-top: 8px; }
.connected-banner { background: #f4f8f3; color: #687365; }
.connected-banner[hidden] { display: none; }
.project-overview { flex: 1; min-height: 0; overflow-y: auto; padding: 30px clamp(18px, 5vw, 64px) 48px; }
.project-overview[hidden] { display: none; }
.project-overview-heading { align-items: flex-start; display: flex; gap: 16px; justify-content: space-between; margin: 0 auto 24px; max-width: 1000px; }
.project-overview-actions { align-items: center; display: flex; flex-wrap: wrap; gap: 8px; justify-content: flex-end; }
.project-overview-eyebrow { color: #879183; font-size: 9px; font-weight: 700; margin: 0 0 7px; }
.project-overview-heading h1 { color: #29312a; font: 700 22px Manrope, sans-serif; margin: 0 0 6px; }
.project-overview-description { color: #788075; font-size: 11px; margin: 0; }
.project-task-summary { align-items: center; border-bottom: 1px solid #eceee9; color: #737b70; display: flex; flex-wrap: wrap; font-size: 9px; gap: 14px; margin: 0 auto 12px; max-width: 1000px; padding: 0 0 12px; }
.project-task-summary strong { color: #48664a; }
.project-task-toolbar { align-items: center; display: flex; gap: 7px; margin: 0 auto 6px; max-width: 1000px; }
.project-task-toolbar label { color: #81897d; font-size: 8px; }
.project-task-toolbar select { background: #fff; border: 1px solid #e4e8e1; border-radius: 6px; color: #586356; font-size: 8px; max-width: 180px; padding: 5px 7px; }
.project-task-list { margin: 0 auto; max-width: 1000px; }
.project-task-row { align-items: center; border-bottom: 1px solid #eff0ed; display: grid; gap: 14px; grid-template-columns: minmax(180px, 1fr) minmax(95px, 140px) minmax(100px, 150px) minmax(95px, 120px); min-height: 64px; padding: 10px 4px; }
.project-task-title strong { color: #41483f; display: block; font-size: 10px; font-weight: 600; }
.project-task-title small { color: #8d9589; display: block; font-size: 8px; line-height: 1.4; margin-top: 3px; white-space: pre-wrap; overflow-wrap: anywhere; }
.project-task-dependency { color: #866c4a; display: block; font-size: 8px; line-height: 1.4; margin-top: 4px; }
.project-task-actions { display: flex; gap: 8px; margin-top: 4px; }
.project-task-actions button { background: transparent; border: 0; color: #68806b; cursor: pointer; font-size: 8px; padding: 1px 0; }
.project-task-actions .project-task-delete { color: #9a6d61; }
.project-task-actions button:hover { text-decoration: underline; }
.project-task-status { background: #fff; border: 1px solid #e4e8e1; border-radius: 6px; color: #5a6558; font-size: 9px; padding: 6px 7px; width: 100%; }
.project-task-assignee, .project-task-due { color: #7d8579; font-size: 9px; overflow-wrap: anywhere; }
.project-task-empty { color: #8b9388; font-size: 10px; margin: 28px auto; max-width: 1000px; }
.project-task-empty[hidden] { display: none; }
.project-checkpoints { margin: 42px auto 0; max-width: 1000px; }
.project-checkpoints-heading { align-items: flex-start; border-bottom: 1px solid #eceee9; display: flex; gap: 12px; justify-content: space-between; padding-bottom: 11px; }
.project-checkpoints-heading h2 { color: #41483f; font: 700 13px Manrope, sans-serif; margin: 0 0 4px; }
.project-checkpoints-heading p { color: #899184; font-size: 9px; margin: 0; }
.project-checkpoint-list { display: flex; flex-direction: column; }
.project-checkpoint-row { align-items: center; border-bottom: 1px solid #eff0ed; display: flex; gap: 12px; justify-content: space-between; min-height: 48px; padding: 8px 4px; }
.project-checkpoint-row strong { color: #4a5148; display: block; font-size: 9px; }
.project-checkpoint-row small { color: #8d9589; display: block; font-size: 8px; margin-top: 3px; }
.project-checkpoint-empty { color: #8b9388; font-size: 9px; margin: 12px 4px; }
.project-checkpoint-empty[hidden] { display: none; }
.checkpoint-snapshot-note { background: #f7f8f6; border-left: 2px solid #89a488; color: #71796f; font-size: 8px; line-height: 1.5; margin: 0 0 12px; padding: 7px 9px; }
.checkpoint-view-form { max-height: min(760px, 90vh); }
.project-checkpoint-snapshot { background: #f7f8f6; border: 1px solid #e8ebe5; border-radius: 7px; color: #596156; font: 9px/1.5 "DM Sans", sans-serif; margin: 0 0 12px; max-height: min(470px, 55vh); overflow: auto; padding: 10px; }
.checkpoint-snapshot-section + .checkpoint-snapshot-section { border-top: 1px solid #e7eae4; margin-top: 12px; padding-top: 10px; }
.checkpoint-snapshot-section h3 { align-items: baseline; color: #495449; display: flex; font: 700 10px Manrope, sans-serif; gap: 6px; margin: 0 0 7px; }
.checkpoint-snapshot-section h3 span { color: #8c9589; font: 8px "DM Sans", sans-serif; }
.checkpoint-snapshot-section p { color: #6f776d; line-height: 1.5; margin: 4px 0; overflow-wrap: anywhere; white-space: pre-wrap; }
.checkpoint-snapshot-section ul, .checkpoint-snapshot-section ol { margin: 0; padding-left: 17px; }
.checkpoint-snapshot-section li { margin: 0 0 8px; padding-left: 2px; }
.checkpoint-snapshot-section li > strong { color: #4a5148; }
.checkpoint-snapshot-section li > small { color: #858d81; display: block; font-size: 8px; margin-top: 2px; }
.checkpoint-diff-content { display: flex; flex-direction: column; gap: 12px; max-height: min(460px, 55vh); overflow-y: auto; }
.checkpoint-diff-section { border-bottom: 1px solid #e7eae4; padding-bottom: 9px; }
.checkpoint-diff-section h3 { color: #495449; font: 700 10px Manrope, sans-serif; margin: 0 0 6px; }
.checkpoint-diff-section ul { margin: 0; padding-left: 16px; }
.checkpoint-diff-section li { color: #687166; font-size: 9px; line-height: 1.5; margin: 4px 0; overflow-wrap: anywhere; }
.checkpoint-history-diff li { margin-bottom: 8px; }
.checkpoint-history-diff li > strong { color: #4a5148; font-size: 9px; }
.checkpoint-history-diff li > p { color: #818a7e; font-size: 8px; margin: 2px 0 0; white-space: pre-wrap; }
.checkpoint-diff-added { color: #47764f; font-weight: 600; }
.checkpoint-diff-removed { color: #a16659; font-weight: 600; }
.checkpoint-diff-changed { color: #8a7049; font-weight: 600; }
.checkpoint-diff-empty { color: #818a7e; font-size: 10px; text-align: center; }
.workspace-connected #messages:empty::after { content: ""; }
.workspace-connected .workspace-placeholder { align-items: center; color: #858b83; display: flex; flex-direction: column; font-size: 10px; gap: 8px; margin: 55px auto; max-width: 300px; text-align: center; }
.workspace-connected .workspace-placeholder strong { color: #434a41; font: 600 13px Manrope, sans-serif; }
.workspace-connected .workspace-placeholder .button { margin-top: 8px; }

.sidebar { background: var(--sidebar); border-right: 1px solid #eeefec; display: flex; flex: 0 0 252px; flex-direction: column; min-height: 100vh; padding: 23px 15px 13px; }
.brand { align-items: center; color: #242824; display: flex; font: 800 17px Manrope, sans-serif; gap: 9px; letter-spacing: -.75px; margin: 0 0 28px 5px; text-decoration: none; }
.brand-mark { align-items: center; background: #2f7252; border-radius: 9px; display: flex; gap: 2px; height: 24px; justify-content: center; transform: rotate(-8deg); width: 24px; }
.brand-mark span { background: #fff; border-radius: 2px; display: block; height: 9px; transform: skew(-15deg); width: 3px; }
.brand-mark span:nth-child(2) { height: 14px; }
.workspace-picker { align-items: center; background: #fff; border: 1px solid #e8eae5; border-radius: 10px; cursor: pointer; display: flex; margin-bottom: 30px; padding: 9px; text-align: left; width: 100%; }
.workspace-icon { align-items: center; background: #dcebe1; border-radius: 7px; color: #35684b; display: flex; font: 700 13px Manrope; height: 32px; justify-content: center; margin-right: 10px; width: 32px; }
.workspace-name, .profile-name { display: flex; flex: 1; flex-direction: column; gap: 3px; }
.workspace-name strong, .profile-name strong { font-size: 12px; font-weight: 600; }
.workspace-name small, .profile-name small { color: #858b83; font-size: 10px; }
.chevron { color: #858b83; font-size: 16px; }
.sidebar-section { margin-bottom: 27px; }
.projects-section { margin-bottom: 20px; }
.project-list { display: flex; flex-direction: column; gap: 4px; }
.project-link { align-items: center; background: transparent; border: 0; border-radius: 7px; color: #687166; cursor: pointer; display: flex; font-size: 10px; gap: 8px; min-width: 0; padding: 6px 7px; text-align: left; width: 100%; }
.project-link:hover, .project-link.active { background: #e9f0e9; color: #315e42; }
.project-link span:last-child { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.project-link-icon { align-items: center; background: #e7ede6; border-radius: 5px; color: #57765b; display: inline-flex; flex: 0 0 20px; font-size: 9px; height: 20px; justify-content: center; }
.workstreams-group > summary { align-items: center; color: #8d958b; cursor: pointer; display: flex; font-size: 8px; justify-content: space-between; list-style: none; margin: -3px 7px 5px; padding: 2px 0; }
.workstreams-group > summary::-webkit-details-marker { display: none; }
.workstreams-group > summary::before { content: "▸"; font-size: 9px; margin-right: 5px; transition: transform .15s; }
.workstreams-group[open] > summary::before { transform: rotate(90deg); }
.workstreams-group > summary span:first-of-type { flex: 1; }
.workstream-links { display: flex; flex-direction: column; gap: 3px; }
.workstream-item { align-items: center; display: flex; gap: 2px; min-width: 0; }
.workstream-item .conversation-link { flex: 1; min-width: 0; padding-left: 12px; }
.workstream-rename { background: transparent; border: 0; border-radius: 5px; color: #858d81; cursor: pointer; flex: 0 0 23px; font-size: 13px; height: 24px; opacity: 0; }
.workstream-item:hover .workstream-rename, .workstream-item:focus-within .workstream-rename { opacity: 1; }
.workstream-rename:hover { background: #e9f0e9; color: #315e42; }
@media (hover: none) { .workstream-rename { opacity: 1; } }
.workstream-private { color: #8e8272; font-size: 9px; margin-left: auto; }
.sidebar-empty { color: #9aa198; font-size: 9px; margin: 4px 7px; }
.section-label { align-items: center; color: #92978f; display: flex; font-size: 9px; font-weight: 700; justify-content: space-between; letter-spacing: .9px; margin: 0 7px 10px; }
.icon-button { align-items: center; background: transparent; border: 0; border-radius: 6px; cursor: pointer; display: inline-flex; font-size: 18px; height: 29px; justify-content: center; line-height: 1; width: 29px; }
.icon-button:hover { background: #f0f2ed; }
.icon-button.subtle { color: #899087; font-size: 17px; }
.section-label .icon-button { height: 21px; width: 22px; }
.nav-link, .conversation-link { align-items: center; background: transparent; border: 0; border-radius: 7px; color: #62685f; cursor: pointer; display: flex; font-size: 12px; gap: 11px; margin: 2px 0; min-height: 35px; padding: 0 9px; text-align: left; width: 100%; }
.nav-link.active, .conversation-link.active { background: #eaf1eb; color: #316447; font-weight: 600; }
.nav-icon { color: #838a81; font-size: 16px; text-align: center; width: 17px; }
.nav-link.active .nav-icon { color: #3d7552; }
.nav-count { color: #a0a49d; font-size: 10px; margin-left: auto; }
.conversations-section { margin-top: 3px; }
.conversation-link { font-size: 11px; gap: 9px; min-height: 33px; }
.conversation-dot { background: #bdc3bb; border-radius: 50%; height: 6px; width: 6px; }
.conversation-link.active .conversation-dot { background: #4a8960; }
.conversation-menu { color: #a0a69e; font-size: 16px; margin-left: auto; opacity: 0; }
.conversation-link:hover .conversation-menu { opacity: 1; }
.sidebar-bottom { margin-top: auto; }
.plan-card { background: #eef4ee; border: 1px solid #e6eee6; border-radius: 9px; display: flex; gap: 9px; margin-bottom: 12px; padding: 11px 9px; }
.plan-icon { align-items: center; background: #fff; border-radius: 6px; color: #568167; display: flex; flex: 0 0 25px; font-size: 16px; height: 25px; justify-content: center; }
.plan-card strong { font-size: 10px; font-weight: 600; }
.plan-card p { color: #777f75; font-size: 9px; line-height: 1.5; margin: 4px 0 7px; }
.upgrade-button { background: none; border: 0; color: #3c7250; cursor: pointer; font-size: 9px; font-weight: 600; padding: 0; }
.upgrade-button span { margin-left: 3px; }
.profile-button { align-items: center; background: transparent; border: 0; border-top: 1px solid #e9ebe7; cursor: pointer; display: flex; gap: 9px; padding: 13px 3px 4px; text-align: left; width: 100%; }
.avatar { align-items: center; border: 2px solid #fff; border-radius: 50%; display: inline-flex; flex: 0 0 auto; font-size: 9px; font-weight: 700; height: 27px; justify-content: center; width: 27px; }
.avatar-olivia { background: #e7c7b5; color: #744f3d; }
.avatar-marcus { background: #d3ddce; color: #48604a; }
.avatar-priya { background: #d9c9e6; color: #655177; }
.avatar-jamie { background: #f0d7a8; color: #806334; }

.main-content { display: flex; flex: 1; flex-direction: column; min-width: 0; }
.topbar { align-items: center; border-bottom: 1px solid #f0f1ee; display: flex; height: 61px; justify-content: space-between; padding: 0 29px; }
.breadcrumbs, .topbar-actions { align-items: center; display: flex; }
.breadcrumbs { color: #969a94; font-size: 11px; gap: 10px; }
.breadcrumbs strong { color: #323630; font-size: 11px; font-weight: 600; }
.breadcrumb-separator { color: #c6c9c2; }
.topbar-actions { gap: 11px; }
.presence-stack { display: flex; padding-left: 5px; }
.presence-stack .avatar { height: 26px; margin-left: -6px; width: 26px; }
.online-label { color: #838981; font-size: 10px; }
.online-label i { background: #66a777; border-radius: 50%; display: inline-block; height: 6px; margin-right: 4px; vertical-align: 1px; width: 6px; }
.button { align-items: center; border: 1px solid transparent; border-radius: 7px; cursor: pointer; display: inline-flex; font-size: 11px; font-weight: 600; justify-content: center; min-height: 33px; padding: 0 12px; }
.button-outline { background: #fff; border-color: #e4e7e1; color: #40463f; gap: 5px; }
.button-outline:hover { background: #f8f9f6; }
.invite-button span { color: #537c60; font-size: 15px; font-weight: 400; }
.mobile-artifacts { display: none; }
.demo-banner { align-items: center; background: #f5f8f3; border-bottom: 1px solid #edf1e9; color: #687365; display: flex; font-size: 10px; gap: 8px; min-height: 34px; padding: 0 30px; }
.demo-banner strong { color: #547252; font-weight: 700; }
.demo-sparkle { color: #6a9367; font-size: 12px; }
.demo-banner button { background: transparent; border: 0; color: #8b9488; cursor: pointer; font-size: 16px; margin-left: auto; }
.content-grid { display: grid; flex: 1; grid-template-columns: minmax(0, 1fr) 294px; min-height: 0; }
.conversation-panel { display: flex; flex-direction: column; min-height: calc(100vh - 95px); min-width: 0; }
.conversation-scroll { flex: 1; margin: 0 auto; max-width: 760px; overflow-y: auto; padding: 34px 43px 18px; width: 100%; }
.conversation-heading { margin: 0 auto 29px; text-align: center; }
.heading-icon { align-items: center; background: #f0f5ef; border-radius: 13px; color: #598166; display: flex; font-size: 20px; height: 42px; justify-content: center; margin: 0 auto 10px; width: 42px; }
h1, h2, p { margin-top: 0; }
.conversation-heading h1 { font: 700 20px Manrope, sans-serif; letter-spacing: -.55px; margin-bottom: 5px; }
.conversation-heading > p { color: #90958e; font-size: 11px; margin-bottom: 12px; }
.conversation-meta { align-items: center; color: #93988f; display: flex; font-size: 9px; gap: 9px; justify-content: center; }
.date-divider { align-items: center; color: #a2a69f; display: flex; font-size: 9px; gap: 11px; justify-content: center; margin: 0 0 24px; }
.date-divider::before, .date-divider::after { background: #eff0ed; content: ""; height: 1px; width: 45px; }
.messages { display: flex; flex-direction: column; gap: 24px; }
.message-history-load { align-self: center; background: #fff; border: 1px solid #e4e8e1; border-radius: 6px; color: #647563; cursor: pointer; font-size: 9px; padding: 6px 10px; }
.message-history-load:hover { background: #f5f8f4; }
.message-history-load:disabled { cursor: wait; opacity: .7; }
.message { align-items: flex-start; display: flex; gap: 10px; }
.message .avatar { border: 0; height: 29px; width: 29px; }
.message-content { flex: 1; min-width: 0; }
.message-head { align-items: baseline; display: flex; gap: 7px; margin: 2px 0 5px; }
.message-head strong { color: #333831; font-size: 11px; font-weight: 600; }
.message-head time { color: #a1a59e; font-size: 9px; }
.message-body { color: #535951; font-size: 11px; line-height: 1.65; overflow-wrap: anywhere; }
.message-body p { margin: 0 0 8px; }
.message-body p:last-child { margin-bottom: 0; }
.message-body strong { color: #343a34; font-weight: 600; }
.message-body ul { margin: 7px 0 7px; padding-left: 17px; }
.message-body li { margin: 3px 0; padding-left: 2px; }
.message-file-attachments { display: flex; flex-direction: column; gap: 5px; margin-top: 8px; max-width: 360px; }
.message-file-attachments button { align-items: center; background: #f7f8f6; border: 1px solid #e5e9e2; border-radius: 6px; color: #475547; cursor: pointer; display: flex; flex-wrap: wrap; font-size: 9px; gap: 8px; justify-content: space-between; max-width: 100%; padding: 7px 9px; text-align: left; }
.message-file-attachments button span { overflow-wrap: anywhere; }
.message-file-attachments button small { color: #859083; font-size: 8px; white-space: nowrap; }
.message-reaction { align-items: center; background: #fafbf9; border: 1px solid #eff0ed; border-radius: 5px; color: #7d827a; display: inline-flex; font-size: 9px; gap: 5px; margin-top: 7px; padding: 3px 7px; }
.message-reaction span { color: #a3a89f; }
.ai-file-attachment { align-items: center; background: #f6f8f5; border: 1px solid #e1e7df; border-radius: 6px; display: flex; gap: 18px; justify-content: space-between; margin-top: 10px; max-width: 360px; padding: 8px 10px; }
.ai-file-attachment span { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.ai-file-attachment strong { color: #39483d; font-size: 11px; }
.ai-file-attachment small { color: #758076; font-size: 9px; }
.ai-file-attachment button { background: transparent; border: 0; color: #376447; cursor: pointer; flex: 0 0 28px; font-size: 15px; height: 28px; }
.save-deliverable-button { background: transparent; border: 0; color: #58795c; cursor: pointer; font-size: 8px; margin: 6px 2px 0; padding: 3px 0; }
.priority-exchange-action { color: #9a7a36; }
.save-deliverable-button:hover { color: #315e42; text-decoration: underline; }
.assistant-message .message-body { background: #fafbf9; border: 1px solid #f0f1ee; border-radius: 0 9px 9px 9px; padding: 10px 12px; }
.ai-context-meta { color: #91988e; display: flex; flex-wrap: wrap; font-size: 8px; gap: 4px 11px; line-height: 1.45; margin: 6px 2px 0; }
.assistant-label { align-items: center; background: #eaf2eb; border-radius: 4px; color: #4a7655; display: inline-flex; font-size: 8px; margin-left: 3px; padding: 2px 5px; vertical-align: 1px; }
.request-status { align-items: center; color: #737b71; display: flex; font-size: 10px; gap: 8px; margin: 17px 0 0 39px; }
.request-status[hidden] { display: none; }
.status-spinner { animation: spin 1s linear infinite; border: 2px solid #e1e9df; border-radius: 50%; border-top-color: #679171; height: 13px; width: 13px; }
@keyframes spin { to { transform: rotate(360deg); } }
.request-status button { background: none; border: 0; color: #828980; cursor: pointer; font-size: 9px; margin-left: 3px; text-decoration: underline; }
.queue-list { margin: 14px 0 0 39px; }
.queue-card { background: #fff; border: 1px solid #eceee9; border-radius: 8px; margin-bottom: 7px; padding: 9px 11px; }
.queue-header { align-items: center; color: #92988f; display: flex; font-size: 9px; gap: 6px; margin-bottom: 5px; }
.queue-position { align-items: center; background: #f1f3ef; border-radius: 50%; color: #697267; display: inline-flex; height: 17px; justify-content: center; width: 17px; }
.queue-header button { background: none; border: 0; color: #92988f; cursor: pointer; font-size: 14px; margin-left: auto; }
.queue-body { color: #4f554d; font-size: 10px; line-height: 1.5; }
.composer-area { margin: 0 auto; max-width: 760px; padding: 0 43px 13px; width: 100%; }
.context-toolbar { align-items: center; display: flex; gap: 11px; margin-bottom: 8px; }
.context-toolbar[hidden], #send-button[hidden], #ask-ai-button[hidden] { display: none; }
.context-select-wrap { align-items: center; color: #657160; cursor: pointer; display: inline-flex; font-size: 9px; gap: 5px; position: relative; }
.context-icon { color: #60906b; font-size: 13px; }
.context-label { color: #969c92; }
.context-select-wrap select, .identity-picker select { appearance: none; background: transparent; border: 0; color: #4b684d; cursor: pointer; font-size: 9px; font-weight: 600; max-width: 97px; outline: 0; padding: 2px 10px 2px 0; }
.select-chevron { color: #969d94; font-size: 12px; pointer-events: none; position: absolute; right: 0; top: 0; }
.context-hint { color: #a0a59e; font-size: 9px; }
.composer-attach { color: #888f85; font-size: 17px; margin-left: auto; transform: rotate(-35deg); }
.selected-context-artifacts { align-items: center; color: #607560; display: flex; flex-wrap: wrap; font-size: 9px; gap: 5px; line-height: 1.5; margin: -2px 0 7px; overflow-wrap: anywhere; }
.prompt-file-chip { align-items: center; background: #f3f6f2; border: 1px solid #e4e9e2; border-radius: 5px; color: #5e6f5c; display: inline-flex; gap: 5px; max-width: 100%; padding: 3px 6px; }
.prompt-file-chip button { background: transparent; border: 0; color: #778273; cursor: pointer; font-size: 12px; line-height: 1; padding: 0 1px; }
.composer { background: #fff; border: 1px solid #e1e5de; border-radius: 11px; box-shadow: 0 3px 14px #253b2510; padding: 11px 11px 9px 14px; transition: border-color .15s, box-shadow .15s; }
.composer:focus-within { border-color: #a9c1aa; box-shadow: 0 3px 16px #2b62301a; }
.composer.is-drop-target { background: #f5faf5; border-color: #4e875b; border-style: dashed; box-shadow: 0 0 0 3px #4e875b22; }
.composer textarea { border: 0; color: #3a4039; display: block; font-size: 11px; line-height: 1.5; max-height: 110px; min-height: 33px; outline: 0; padding: 2px 0; resize: none; width: 100%; }
.composer textarea::placeholder { color: #a4a9a2; }
.composer-footer { align-items: center; display: flex; justify-content: space-between; }
.composer-actions { align-items: center; display: flex; gap: 7px; }
.composer-tools { align-items: center; display: flex; gap: 9px; }
.identity-picker { align-items: center; display: inline-flex; gap: 5px; position: relative; }
.identity-picker .avatar { border: 0; height: 19px; width: 19px; }
.identity-picker select { color: #737a70; font-size: 9px; font-weight: 500; max-width: 94px; }
.identity-picker .select-chevron { font-size: 10px; top: 2px; }
.composer-divider { background: #e9ebe7; height: 13px; width: 1px; }
.shortcut-hint { color: #a4a8a2; font-size: 9px; }
.ask-ai-button { align-items: center; background: #edf4ee; border: 1px solid #dce8dd; border-radius: 7px; color: #376447; cursor: pointer; display: inline-flex; font-size: 10px; font-weight: 600; gap: 5px; height: 29px; padding: 0 9px; }
.ask-ai-button:hover { background: #e2eee4; }
.ask-ai-button:disabled { cursor: default; opacity: .6; }
.send-button { align-items: center; background: #347550; border: 0; border-radius: 7px; color: #fff; cursor: pointer; display: flex; font-size: 17px; height: 29px; justify-content: center; transition: background .15s; width: 31px; }
.send-button:hover { background: #245c40; }
.send-button:disabled { background: #a8b8a8; cursor: default; }
.composer-note { color: #a4a9a2; font-size: 8px; margin: 7px 0 0; text-align: center; }

.artifacts-panel { background: #fff; border-left: 1px solid #eff0ed; min-height: 100%; }
.panel-tabs { align-items: center; border-bottom: 1px solid #eff0ed; display: flex; gap: 20px; height: 47px; padding: 0 18px; }
.panel-tab { align-items: center; background: none; border: 0; color: #969b93; cursor: pointer; display: inline-flex; font-size: 10px; gap: 5px; height: 100%; position: relative; }
.panel-tab.active { color: #3d654a; font-weight: 600; }
.panel-tab.active::after { background: #558362; bottom: -1px; content: ""; height: 2px; left: 0; position: absolute; right: 0; }
.panel-tab span { align-items: center; background: #eff3ee; border-radius: 8px; color: #788478; display: inline-flex; font-size: 8px; height: 16px; justify-content: center; min-width: 16px; padding: 0 4px; }
.panel-close { display: none; margin-left: auto; }
.panel-content { padding: 20px 17px; }
.panel-intro { align-items: flex-start; display: flex; justify-content: space-between; margin-bottom: 14px; }
.panel-intro h2 { font: 700 11px Manrope, sans-serif; letter-spacing: -.15px; margin: 0 0 4px; }
.panel-intro p { color: #9a9f98; font-size: 9px; margin: 0; }
.artifact-header-actions { align-items: center; display: flex; gap: 4px; }
.export-deliverables { color: #697768; font-size: 15px; height: 24px; width: 25px; }
.export-deliverables:disabled { cursor: default; opacity: .4; }
.add-artifact { background: #f5f7f3; color: #65816a; font-size: 15px; height: 24px; width: 25px; }
.priority-inputs-component { border-bottom: 1px solid #e8ebe5; margin: 0 0 12px; padding: 0 0 12px; }
.priority-inputs-heading h3 { color: #41473f; font: 700 10px Manrope, sans-serif; margin: 0 0 4px; }
.priority-inputs-heading h3 span { color: #7d897b; font: 600 8px "DM Sans", sans-serif; margin-left: 4px; }
.priority-inputs-heading p { color: #92988f; font-size: 8px; line-height: 1.4; margin: 0 0 8px; }
.priority-input-list { display: flex; flex-direction: column; gap: 5px; margin-bottom: 8px; }
.priority-input-row { align-items: flex-start; display: flex; gap: 6px; justify-content: space-between; min-width: 0; }
.priority-input-row span { color: #50584f; font-size: 8px; line-height: 1.4; min-width: 0; overflow-wrap: anywhere; }
.priority-input-row small { color: #8c9389; display: block; font-size: 7px; }
.priority-input-row button { background: transparent; border: 0; color: #7d897b; cursor: pointer; flex: 0 0 18px; font-size: 11px; line-height: 1; padding: 2px; }
.priority-input-compose-label { color: #697768; display: block; font-size: 8px; margin: 7px 0 4px; }
.priority-inputs-component input, .priority-inputs-component textarea { background: #fff; border: 1px solid #e6e9e3; border-radius: 5px; color: #454b44; font: 8px/1.45 "DM Sans", sans-serif; margin: 0 0 5px; padding: 6px 7px; width: 100%; }
.priority-inputs-component textarea { max-height: 70px; min-height: 42px; resize: vertical; }
.priority-input-compose-actions { display: flex; gap: 6px; }
.priority-input-compose-actions .button { flex: 1; font-size: 8px; min-height: 27px; padding: 5px 6px; }
.artifact-kind-filter { background: #f2f4f0; border-radius: 6px; display: flex; gap: 2px; margin: 0 0 10px; padding: 3px; }
.artifact-kind-filter button { background: transparent; border: 0; border-radius: 4px; color: #80887c; cursor: pointer; flex: 1; font-size: 8px; min-width: 0; padding: 6px 3px; }
.artifact-kind-filter button.active { background: #fff; box-shadow: 0 1px 3px #1f2c1f12; color: #47664c; font-weight: 600; }
.artifact-search-label { color: #788375; display: block; font-size: 8px; margin: 3px 0 5px; }
.artifact-search { background: #fff; border: 1px solid #e6e9e3; border-radius: 6px; color: #454b44; font-size: 9px; margin: 0 0 10px; outline: 0; padding: 8px 9px; width: 100%; }
.artifact-search:focus { border-color: #9bb59d; }
.artifact-list { display: flex; flex-direction: column; gap: 8px; }
.artifact-empty { color: #92988f; font-size: 9px; line-height: 1.5; margin: 8px 2px; }
.artifact-card { border: 1px solid #eceee9; border-radius: 8px; padding: 10px 10px 9px; }
.artifact-top { align-items: flex-start; display: flex; gap: 8px; }
.artifact-icon { align-items: center; background: #f1f5ef; border-radius: 6px; color: #63836a; display: flex; flex: 0 0 27px; font-size: 12px; height: 27px; justify-content: center; }
.artifact-icon.link { background: #f1f0f7; color: #766d96; }
.artifact-icon.doc { background: #f8f3e9; color: #ad8b4f; }
.artifact-copy { min-width: 0; }
.artifact-copy strong { color: #41473f; display: block; font-size: 9px; font-weight: 600; margin: 2px 0 4px; }
.artifact-type-tag { color: #68806b; display: inline-block; font-size: 7px; margin: 0 0 4px; }
.artifact-type-tag.deliverable { color: #7b654a; }
.artifact-copy p { color: #92988f; font-size: 8px; line-height: 1.5; margin: 0; overflow-wrap: anywhere; }
.artifact-footer { align-items: center; color: #a0a59c; display: flex; font-size: 8px; justify-content: space-between; margin: 9px 0 0 35px; }
.visibility-tag { align-items: center; color: #7e887b; display: inline-flex; gap: 3px; }
.visibility-tag.private { color: #9a7f64; }
.artifact-actions { align-items: center; display: inline-flex; gap: 5px; }
.artifact-pdf, .artifact-view, .artifact-priority-toggle, .artifact-edit, .artifact-delete { background: transparent; border: 0; color: #858d81; cursor: pointer; font-size: 12px; line-height: 1; padding: 3px; }
.artifact-pdf { font-size: 8px; font-weight: 700; }
.artifact-view { font-size: 8px; }
.artifact-priority-toggle { color: #547a58; font-size: 13px; }
.artifact-pdf:hover, .artifact-view:hover, .artifact-priority-toggle:hover, .artifact-edit:hover, .artifact-delete:hover { color: #376447; }
.artifact-delete { background: transparent; border: 0; color: #a6aaa3; cursor: pointer; font-size: 12px; opacity: 0; }
.artifact-card:hover .artifact-delete, .artifact-card:focus-within .artifact-delete { opacity: 1; }
@media (hover: none) { .artifact-actions button { opacity: 1; } }
.add-artifact-row, .invite-row { align-items: center; background: transparent; border: 0; color: #788375; cursor: pointer; display: flex; font-size: 9px; gap: 7px; padding: 10px 2px 4px; }
.add-artifact-row span, .invite-row span { color: #6c9070; font-size: 14px; }
.panel-divider { background: #eff0ed; height: 1px; margin: 19px 0 18px; }
.members-heading { align-items: center; margin-bottom: 10px; }
.text-button { background: none; border: 0; color: #70816f; cursor: pointer; font-size: 9px; padding: 4px 0; }
.member-list { display: flex; flex-direction: column; gap: 11px; }
.member-row { align-items: center; display: flex; gap: 8px; }
.member-row .avatar { border: 0; height: 24px; width: 24px; }
.members-dialog-form { gap: 0; }
.member-management-list { display: flex; flex-direction: column; gap: 7px; margin: 0 0 14px; max-height: min(390px, 55vh); min-width: 0; overflow-x: hidden; overflow-y: auto; width: 100%; }
.managed-member-row { align-items: center; border-bottom: 1px solid #eff0ed; display: flex; gap: 9px; min-height: 48px; min-width: 0; padding: 6px 0; width: 100%; }
.managed-member-row .avatar { border: 0; flex: 0 0 26px; height: 26px; width: 26px; }
.managed-member-row .member-info { flex: 1 1 auto; min-width: 0; }
.managed-member-row .member-info strong, .managed-member-row .member-info small { overflow-wrap: anywhere; word-break: normal; }
.members-dialog-form .member-role-select { background: #fff; border: 1px solid #e3e7e0; border-radius: 6px; color: #53614f; flex: 0 0 88px; font-size: 9px; margin: 0; max-width: 88px; padding: 6px 5px; width: 88px; }
.member-role-label { color: #81887e; flex: 0 0 auto; font-size: 9px; }
.member-remove { background: transparent; border: 0; color: #9a6d61; cursor: pointer; flex: 0 0 25px; font-size: 16px; height: 25px; }
.member-remove:hover { color: #a23f32; }
.members-dialog-form > #manage-invite { margin-top: 2px; width: 100%; }
.member-info { display: flex; flex: 1; flex-direction: column; gap: 2px; }
.member-info strong { color: #535950; font-size: 9px; font-weight: 500; }
.member-info small { color: #a1a69e; font-size: 8px; }
.member-status { color: #6a9c71; font-size: 8px; }
.member-status.offline { color: #b6bbb4; }
.invite-row { margin-top: 4px; padding-top: 11px; }
.context-card { background: #f6f8f4; border: 1px solid #edf1e9; border-radius: 8px; display: flex; gap: 8px; margin-top: 22px; padding: 10px; }
.context-card-icon { align-items: center; background: #e9f0e7; border-radius: 6px; color: #618064; display: flex; flex: 0 0 24px; font-size: 13px; height: 24px; justify-content: center; }
.context-card strong { color: #586953; font-size: 9px; font-weight: 600; }
.context-card p { color: #899184; font-size: 8px; line-height: 1.5; margin: 5px 0 7px; }
.context-card button { background: none; border: 0; color: #58795c; cursor: pointer; font-size: 8px; padding: 0; }
.context-card button span { margin-left: 3px; }
.workspace-guidance-card { margin-top: 10px; }
.workspace-guidance-content { flex: 1; min-width: 0; }
.ai-usage-list { border-block: 1px solid #e8ebe5; margin: 0 0 12px; }
.ai-usage-list > div { align-items: center; display: flex; justify-content: space-between; padding: 10px 0; }
.ai-usage-list > div + div { border-top: 1px solid #eff0ed; }
.ai-usage-list dt { color: #596156; font-size: 10px; font-weight: 600; }
.ai-usage-list dd { color: #41483f; font-size: 11px; font-weight: 700; margin: 0; text-align: right; }
.ai-usage-list dd small { color: #858b83; font-size: 9px; font-weight: 400; }
.workspace-guidance-details { margin-top: 6px; }
.workspace-guidance-details summary { color: #58795c; cursor: pointer; font-size: 8px; }
.workspace-guidance-details[open] { max-height: 220px; overflow-y: auto; }
.context-card .workspace-context-label { color: #777f73; display: block; font-size: 7px; font-weight: 600; margin-top: 8px; }
.context-card .workspace-guidance-details p { overflow-wrap: anywhere; white-space: pre-wrap; }
#edit-workspace-context { margin-top: 6px; }

.app-dialog { border: 0; border-radius: 13px; box-shadow: 0 20px 80px #19251935; max-width: min(420px, calc(100vw - 30px)); padding: 0; width: 100%; }
.app-dialog::backdrop { background: #1d281f66; backdrop-filter: blur(2px); }
.dialog-form { display: flex; flex-direction: column; padding: 28px; position: relative; }
.dialog-close { background: none; border: 0; color: #969c94; cursor: pointer; font-size: 21px; position: absolute; right: 15px; top: 12px; }
.dialog-icon { align-items: center; background: #edf4ed; border-radius: 10px; color: #588063; display: flex; font-size: 17px; height: 38px; justify-content: center; margin-bottom: 14px; width: 38px; }
.artifact-dialog-icon { background: #f2f4ee; }
.context-artifact-options { display: flex; flex-direction: column; gap: 5px; max-height: min(320px, 45vh); overflow-y: auto; }
.prompt-file-upload { background: #f7f8f6; border: 1px dashed #d8dfd5; border-radius: 6px; display: flex; flex-direction: column; gap: 5px; margin: 0 0 10px; padding: 9px; }
.prompt-file-upload .button { align-self: flex-start; min-height: 28px; }
.prompt-file-upload small { color: #858b83; font-size: 8px; line-height: 1.45; }
.dialog-form .context-artifact-option { align-items: flex-start; border-bottom: 1px solid #eff0ed; cursor: pointer; display: flex; gap: 10px; margin: 0; padding: 9px 2px; }
.dialog-form .context-artifact-option input[type="checkbox"] { accent-color: #347550; flex: 0 0 16px; height: 16px; margin: 1px 0 0; padding: 0; width: 16px; }
.dialog-form .workstream-context-option { align-items: center; display: flex; gap: 8px; margin: 0 0 10px; }
.dialog-form .workstream-context-option input[type="checkbox"] { accent-color: #347550; flex: 0 0 15px; height: 15px; margin: 0; padding: 0; width: 15px; }
.dialog-form .workstream-context-option span { color: #636a61; font-size: 9px; font-weight: 500; }
.context-artifact-option > span { display: flex; flex: 1; flex-direction: column; gap: 4px; min-width: 0; }
.context-artifact-option strong { color: #454b44; font-size: 10px; }
.context-artifact-option small { color: #858b83; font-size: 9px; font-weight: 400; line-height: 1.45; overflow-wrap: anywhere; }
.context-artifact-empty { color: #858b83; font-size: 10px; }
.deliverable-preview { background: #f7f8f6; border: 1px solid #e8ebe5; border-radius: 7px; color: #596156; font-size: 9px; line-height: 1.55; margin: 0 0 14px; max-height: 180px; overflow-y: auto; padding: 10px; white-space: pre-wrap; overflow-wrap: anywhere; }
.saved-chat-preview { background: #f7f8f6; border: 1px solid #e8ebe5; border-radius: 7px; color: #596156; font-size: 10px; line-height: 1.55; max-height: 240px; overflow: auto; padding: 10px; white-space: pre-wrap; overflow-wrap: anywhere; }
.priority-exchange-form { max-height: min(760px, 90vh); overflow-y: auto; }
.saved-chat-view-form { max-height: min(760px, 90vh); }
.saved-chat-view-content { background: #f7f8f6; border: 1px solid #e8ebe5; border-radius: 7px; color: #3e463f; font: 10px/1.6 "DM Sans", sans-serif; margin: 0; max-height: min(480px, 60vh); overflow: auto; padding: 12px; white-space: pre-wrap; overflow-wrap: anywhere; }
.dialog-form .deliverable-publish-option { align-items: flex-start; display: flex; gap: 8px; margin: 0 0 4px; }
.dialog-form .deliverable-publish-option input[type="checkbox"] { accent-color: #347550; flex: 0 0 15px; height: 15px; margin: 0; padding: 0; width: 15px; }
.dialog-form .deliverable-publish-option span { color: #636a61; font-size: 9px; font-weight: 500; line-height: 1.4; }
.dialog-form .artifact-priority-option { align-items: flex-start; display: flex; gap: 8px; margin: 0 0 5px; }
.dialog-form .artifact-priority-option input[type="checkbox"] { accent-color: #347550; flex: 0 0 15px; height: 15px; margin: 0; padding: 0; width: 15px; }
.dialog-form .artifact-priority-option span { color: #636a61; font-size: 9px; font-weight: 500; line-height: 1.4; }
.progress-dialog-form { max-height: min(720px, 90vh); overflow-y: auto; }
.progress-deliverables-fieldset { border: 1px solid #e8ebe5; border-radius: 7px; margin: 0 0 13px; min-width: 0; padding: 9px 10px; }
.progress-deliverables-fieldset legend { color: #636a61; font-size: 9px; font-weight: 600; padding: 0 4px; }
.progress-deliverables { display: flex; flex-direction: column; gap: 5px; max-height: 130px; overflow-y: auto; }
.dialog-form .progress-deliverable-option { align-items: flex-start; display: flex; gap: 8px; margin: 0; padding: 4px 0; }
.dialog-form .progress-deliverable-option input[type="checkbox"] { accent-color: #347550; flex: 0 0 14px; height: 14px; margin: 0; padding: 0; width: 14px; }
.dialog-form .progress-deliverable-option span { color: #636a61; font-size: 9px; font-weight: 500; line-height: 1.4; overflow-wrap: anywhere; }
.progress-deliverables-fieldset p { color: #92988f; font-size: 8px; margin: 4px 0; }
.project-task-dependencies-fieldset { border: 1px solid #e8ebe5; border-radius: 7px; margin: 0 0 14px; min-width: 0; padding: 9px 10px; }
.project-task-dependencies-fieldset legend { color: #636a61; font-size: 9px; font-weight: 600; padding: 0 4px; }
.project-task-dependencies-fieldset p { color: #92988f; font-size: 8px; margin: 4px 0 7px; }
.project-task-dependencies { display: flex; flex-direction: column; gap: 5px; max-height: 150px; overflow-y: auto; }
.dialog-form .project-task-dependencies label { align-items: flex-start; display: flex; gap: 8px; line-height: 1.4; margin: 0; padding: 3px 0; }
.dialog-form .project-task-dependencies input[type="checkbox"] { accent-color: #347550; flex: 0 0 14px; height: 14px; margin: 0; padding: 0; width: 14px; }
.project-task-dependencies span { color: #636a61; font-size: 9px; font-weight: 500; overflow-wrap: anywhere; }
.project-task-dependencies > small { color: #92988f; font-size: 8px; }
.progress-preview-wrap { margin: 0 0 12px; }
.progress-preview-wrap > strong { color: #636a61; display: block; font-size: 9px; margin: 0 0 5px; }
.progress-preview { background: #f7f8f6; border: 1px solid #e8ebe5; border-radius: 7px; color: #596156; font: 9px/1.5 "DM Sans", sans-serif; margin: 0; max-height: 170px; overflow: auto; padding: 9px; white-space: pre-wrap; overflow-wrap: anywhere; }
.progress-preview:empty::before { color: #92988f; content: "Add a summary to preview the update."; }
.project-update-label { background: #e9f0e9; border-radius: 4px; color: #527252; display: inline-flex; font-size: 8px; margin-left: 4px; padding: 2px 5px; vertical-align: 1px; }
.project-update-message .message-body { border-left: 2px solid #a8c0a8; }
.dialog-form h2 { font: 700 17px Manrope, sans-serif; letter-spacing: -.4px; margin: 0 0 6px; }
.dialog-form > p { color: #858b83; font-size: 10px; margin: 0 0 18px; }
.dialog-form label { color: #636a61; font-size: 9px; font-weight: 600; margin: 0 0 6px; }
.dialog-form input, .dialog-form select, .dialog-form textarea { background: #fff; border: 1px solid #e3e7e0; border-radius: 7px; color: #454b44; font-size: 10px; margin-bottom: 14px; outline: 0; padding: 10px; width: 100%; }
.dialog-form input:focus, .dialog-form select:focus, .dialog-form textarea:focus { border-color: #9bb59d; }
.dialog-form textarea { line-height: 1.5; resize: vertical; }
.button-primary { background: #347550; color: #fff; }
.button-primary:hover { background: #245c40; }
.dialog-submit { margin-top: 3px; width: 100%; }
.dialog-form > small { color: #a1a69f; font-size: 8px; margin-top: 10px; text-align: center; }
.dialog-form [hidden] { display: none; }
.invite-link-result { display: flex; flex-direction: column; }
.invite-link-row { align-items: center; display: flex; gap: 7px; margin-bottom: 4px; }
.invite-link-row input { flex: 1; margin: 0; min-width: 0; }
.invite-link-row .button { flex: 0 0 auto; }
.invite-link-result > small { color: #8d9589; font-size: 8px; margin: 5px 0 7px; text-align: left; }
.invite-another { align-self: flex-start; }
.toast { background: #283a2d; border-radius: 8px; bottom: 20px; box-shadow: 0 6px 24px #17291d30; color: #fff; font-size: 10px; left: 50%; opacity: 0; padding: 11px 16px; pointer-events: none; position: fixed; transform: translate(-50%, 8px); transition: opacity .2s, transform .2s; z-index: 5; }
.toast.visible { opacity: 1; transform: translate(-50%, 0); }

@media (min-width: 1500px) {
  .content-grid { grid-template-columns: minmax(0, 1fr) 320px; }
  .conversation-scroll, .composer-area { max-width: 800px; }
}
@media (max-width: 1050px) {
  .sidebar { flex-basis: 218px; }
  .content-grid { grid-template-columns: minmax(0, 1fr) 270px; }
  .conversation-scroll, .composer-area { padding-left: 27px; padding-right: 27px; }
}
@media (max-width: 800px) {
  .sidebar { flex-basis: 205px; }
  .content-grid { grid-template-columns: minmax(0, 1fr); }
  .artifacts-panel { background: #fff; bottom: 0; box-shadow: -10px 0 40px #1c2a1c12; max-width: 320px; overflow-y: auto; position: fixed; right: 0; top: 0; transform: translateX(105%); transition: transform .2s; width: 85vw; z-index: 3; }
  .artifacts-panel.open { transform: translateX(0); }
  .panel-close, .mobile-artifacts { display: inline-flex; }
  .mobile-artifacts { color: #718071; font-size: 16px; }
}
@media (max-width: 600px) {
  .sidebar { display: none; }
  .project-overview { padding: 22px 14px 36px; }
  .project-overview-heading { flex-direction: column; gap: 12px; }
  .project-overview-actions { justify-content: flex-start; width: 100%; }
  .project-task-row { gap: 8px; grid-template-columns: minmax(0, 1fr) minmax(76px, 100px); min-height: 60px; }
  .project-task-status { font-size: 8px; padding: 6px 4px; }
  .project-task-assignee, .project-task-due { font-size: 8px; }
  .topbar { height: 54px; padding: 0 15px; }
  .breadcrumbs { gap: 7px; }
  .topbar-actions { gap: 8px; }
  .presence-stack .avatar { height: 23px; width: 23px; }
  .online-label { display: none; }
  .invite-button { min-height: 29px; padding: 0 8px; }
  .demo-banner { align-items: flex-start; font-size: 9px; line-height: 1.4; padding: 9px 13px; }
  .demo-sparkle { margin-top: 1px; }
  .conversation-panel { min-height: calc(100vh - 90px); }
  .conversation-scroll { padding: 25px 17px 18px; }
  .conversation-heading { margin-bottom: 25px; }
  .conversation-heading h1 { font-size: 18px; }
  .messages { gap: 21px; }
  .composer-area { padding: 0 12px 10px; }
  .context-hint { font-size: 8px; }
  .context-toolbar { gap: 7px; }
  .composer { padding-left: 11px; }
  .composer-note { font-size: 7px; }
}

:is(button, a, input, select, textarea, [tabindex]):focus-visible {
  outline: 2px solid var(--green);
  outline-offset: 2px;
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation: none !important;
    scroll-behavior: auto !important;
    transition: none !important;
  }
}
