#project-share-dialog { width: min(720px, calc(100vw - 32px)); max-height: 90dvh; overflow: auto; color: var(--mx-ink); background: var(--mx-surface); border: 1px solid var(--mx-line); border-radius: var(--mx-radius-panel); padding: var(--mx-space-24); font-family: var(--mx-font-sans); }
#project-share-dialog::backdrop { background: color-mix(in srgb, var(--mx-ink) 42%, transparent); }
#project-share-dialog p { font-size: var(--mx-text-ui); line-height: 1.5; }
#project-share-dialog h2 { font-size: 28px; letter-spacing: -0.022em; font-weight: 600; margin: 0; }
.project-share-head, .project-share-actions { display: flex; align-items: center; justify-content: space-between; gap: var(--mx-space-12); flex-wrap: wrap; }
.project-share-identity { display: grid; grid-template-columns: 1fr 1fr; gap: var(--mx-space-16); }
#project-share-dialog label { display: block; margin: var(--mx-space-16) 0 var(--mx-space-08); font-size: var(--mx-text-ui); line-height: 1.5; font-weight: 500; }
#project-share-dialog input:not([type=checkbox]), #project-share-dialog textarea { display: block; width: 100%; min-width: 0; min-height: 44px; box-sizing: border-box; margin-top: var(--mx-space-08); border: 1px solid var(--mx-line); border-radius: var(--mx-radius-control); padding: var(--mx-space-12); background: var(--mx-bg); color: var(--mx-ink); font: inherit; font-size: 16px; }
#project-share-dialog textarea { resize: vertical; line-height: 1.5; }
#project-share-dialog .project-share-check { display: flex; align-items: flex-start; gap: var(--mx-space-12); min-height: 44px; font-weight: 400; cursor: pointer; }
#project-share-dialog input[type=checkbox] { flex: 0 0 20px; width: 20px; height: 20px; margin-top: 2px; accent-color: var(--mx-action); }
.project-share-note { color: var(--mx-ink-muted); }
.project-share-button { display: inline-flex; justify-content: center; align-items: center; min-height: 44px; border: 1px solid var(--mx-line); padding: var(--mx-space-12) var(--mx-space-16); border-radius: var(--mx-radius-pill); background: var(--mx-surface); color: var(--mx-ink); font: inherit; font-weight: 500; cursor: pointer; }
.project-share-primary { background: var(--mx-action); color: var(--mx-ink); border-color: var(--mx-action); }
.project-share-button:disabled { opacity: .6; cursor: default; }
#project-share-dialog :focus-visible { outline: 2px solid var(--mx-action); outline-offset: 3px; }
#project-share-dialog .project-share-trap { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); }
#project-share-status { min-height: 1.5em; font-weight: 500; }
@media (max-width: 600px) { .project-share-identity { grid-template-columns: 1fr; gap: 0; } #project-share-dialog { padding: var(--mx-space-16); } }