.project-savebar { display:flex; align-items:center; justify-content:space-between; gap:20px; padding:10px 24px; border-bottom:1px solid #ffffff18; background:#101b23; }
.project-savebar[hidden] { display:none; }
.project-savebar>div { display:flex; flex-wrap:wrap; align-items:center; gap:8px 20px; min-width:0; }
.project-savebar strong { font-size:14px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; max-width:50vw; }
#projectSaveStatus { font-size:12px; color:#a9c0b8; }
.project-savebar[data-state=unsaved] #projectSaveStatus,.project-savebar[data-state=error] #projectSaveStatus { color:#f4cf72; }
#projectsDialog { width:min(960px,calc(100vw - 32px)); max-height:90vh; box-sizing:border-box; overflow:auto; border:1px solid #38534e; border-radius:20px; background:#101b23; color:#eaf2f1; padding:28px; }
#projectsDialog::backdrop { background:#03090dd9; }
.projects-heading { display:flex; justify-content:space-between; align-items:flex-start; gap:24px; }
.projects-heading h2 { font-size:28px; margin:4px 0; }
.projects-heading p,.projects-footer p { color:#a8bab9; line-height:1.5; }
#projectsDialog .project-library-card { background:none; border:0; padding:0; }
#projectsDialog .current-project-card { margin:16px 0 28px; padding:20px; background:#16252d; border:1px solid #ffffff18; border-radius:12px; }
#projectsDialog .project-list { display:grid; gap:12px; }
#projectsDialog .project-card { display:flex; justify-content:space-between; align-items:center; gap:20px; padding:20px; border-radius:12px; }
#projectsDialog .project-card strong { font-size:16px; }
#projectsDialog .project-card span,#projectsDialog .project-card small { display:block; margin-top:8px; line-height:1.5; }
#projectsDialog .project-card-actions { display:flex; flex-wrap:wrap; gap:8px; flex-shrink:0; }
.projects-footer { display:flex; justify-content:space-between; gap:24px; align-items:center; margin-top:24px; border-top:1px solid #ffffff18; padding-top:16px; }
#projectsAccess:empty { display:none; }
.account-grid { grid-template-columns:1fr; }
body:has(#codeView.code-focus) .project-savebar, body:has(#annotateView.annotate-focus) .project-savebar { display:none; }
@media(max-width:650px) { .projects-heading,.projects-footer,#projectsDialog .project-card { flex-direction:column; align-items:stretch; } #projectsDialog { padding:18px; } .project-savebar { padding:10px 12px; } .project-savebar strong { max-width:55vw; } }
#projectsDialog button { width:auto; flex:0 0 auto; }
#projectsDialog .projects-heading>div { flex:1; }
#projectsDialog .project-card-actions { flex-direction:row; }
#projectsDialog .project-card>div:first-child { min-width:0; flex:1; overflow-wrap:anywhere; }
#projectsDialog .projects-heading { margin-bottom:24px; }
#projectsDialog .current-project-card p { margin:12px 0 0; }
#projectsDialog .current-project-card p:empty { display:none; }
#projectsSaveStatus { color:#9ee9c6; font-size:13px; }
#projectsDialog .project-card-actions button { min-width:68px; }
@media(max-width:650px) { #projectsDialog .projects-heading>div { flex:auto; } #projectsDialog .project-card-actions { flex-wrap:wrap; } }