/* Operate: Filmklappen und Rollenpunkte aus dem abgenommenen Entwurf. */
.project-shell { max-width: 1160px; margin: auto; padding: 0 24px 48px; }
.project-page main { padding: 0; }
.project-page h1 { font: italic 700 32px/1.2 'Sansita', serif; color: var(--petrol); }
.project-page .registration-header { padding-inline: 0; }
.project-page .registration-header .nav-link { margin-left: auto; }
#project-app { padding-bottom: 24px; }
#project-app > .project-field { max-width: 220px; }
#project-app .project-field { display: flex; flex-direction: column; gap: 6px; min-width: 0; font-size: 14px; }
#project-app :is(input, select, textarea) { width: 100%; min-width: 0; min-height: 44px; padding: 10px; border: 1px solid var(--ink); border-radius: 0; background: var(--paper); color: var(--ink); font-size: 16px; }
#project-app textarea { resize: vertical; }
#project-app :is(button, summary) { min-height: 44px; }
#project-app .action { padding: 9px 12px; font-size: 15px; }
#project-app .action:disabled { opacity: .55; cursor: default; }
#project-app .action:hover:not(:disabled) { background: var(--petrol); color: var(--cream) !important; }
#project-app .action:active:not(:disabled) { transform: translateY(1px); }
#project-app .feedback:empty, .project-notice:empty, .project-undo:empty { display: none; }
.project-notice { font-size: 14px; color: var(--petrol); margin: 10px 0; }
.project-undo { position: sticky; top: 0; z-index: 8; padding: 8px 12px; background: var(--sun); border: 1px solid var(--ink); }
.project-undo p { margin: 0; }
.new-project { display: flex; align-items: end; gap: 12px; margin: 18px 0; }
.new-project .project-field { flex: 1; }
.new-project button { flex: none; }
.project-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; margin-top: 24px; align-items: start; }
.project-card { min-width: 0; border: 1px solid var(--ink); background: var(--paper); overflow-wrap: anywhere; }
.project-card::before { content: ''; display: block; height: 8px; background: repeating-linear-gradient(130deg, var(--cream) 0 13px, var(--ink) 13px 27px); border-bottom: 1px solid var(--ink); }
.project-heading { background: var(--ink); color: var(--cream); padding: 16px; }
#project-app .project-heading h2 { margin: 0; font: italic 700 26px/1.2 'Sansita', serif; }
.project-heading p { margin: 8px 0 0; font-size: 14px; }
.project-body { padding: 16px; }
.project-body > p { margin: 0 0 12px; }
.project-logline { line-height: 1.5; white-space: pre-line; }
.project-round-note { font-weight: 600; }
.project-card.is-current { grid-column: 1 / -1; }
#project-app .is-current .project-heading h2 { font-size: 32px; }
.current-label { display: block; color: var(--sun); margin-bottom: 10px; font-size: 18px; }
.project-actions, .need-line, .team-person, .own-request { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; }
.project-actions { margin-bottom: 12px; }
.project-actions .action:first-child { margin-right: auto; }
.project-editor, .need-catalog { border-top: 1px solid var(--ink); margin-top: 12px; }
#project-app summary { cursor: pointer; padding: 12px 0; font-weight: 600; }
.project-edit-fields { display: grid; gap: 12px; margin-bottom: 16px; }
.project-needs { margin: 12px 0; }
.project-need { padding: 12px 0; border-top: 1px solid var(--ink); }
.need-line strong { margin-right: auto; font-size: 15px; }
.need-dots { display: flex; align-items: center; gap: 5px; flex-wrap: wrap; }
.need-dots span { font-size: 13px; }
.role-dot { --role: var(--ink); display: inline-block; width: 14px; height: 14px; flex: 0 0 14px; border: 2px solid var(--role); border-radius: 50%; vertical-align: middle; }
.role-dot.filled { background: var(--role); }
.role-dot.pending { border-width: 4px; animation: project-request 1.2s ease-in-out 3; }
.role-cerise { --role: var(--cerise); }.role-tomato { --role: var(--tomato); }.role-petrol { --role: var(--petrol); }
.role-grape { --role: var(--grape); }.role-sun { --role: var(--sun); outline: 1px solid var(--ink); }.role-cream { --role: var(--cream); outline: 1px solid var(--ink); }
.role-chips { display: flex; gap: 6px; flex-wrap: wrap; padding-bottom: 12px; }
.role-chips button { display: flex; align-items: center; gap: 6px; }
.person-search { margin: 12px 0 0; }
.person-results { display: grid; }
.person-results:empty { display: none; }
.person-results button { display: flex; align-items: center; text-align: left; flex-wrap: wrap; gap: 6px; width: 100%; border-top: 0; }
.person-results img { object-fit: cover; }
.person-results small { font-size: 12px; }
.search-status { font-size: 13px; }
.project-team { display: grid; gap: 8px; }
.team-person > span { flex: 1; min-width: 100px; font-size: 14px; }
.own-request { padding-block: 8px; }
.project-join { margin-top: 16px; border-top: 1px solid var(--ink); }
.join-form .project-field { margin-bottom: 12px; }
.orga-tabs { overflow-x: auto; }
#my-films { margin-block: 20px; padding-block: 16px; border-block: 1px solid var(--ink); }
#my-films h2 { margin-top: 0; }
#my-films ul { padding-left: 20px; }
#my-films li { margin-bottom: 10px; }
@keyframes project-request { 50% { opacity: .4; } }
@media (max-width: 819px) {
  .project-shell { padding-inline: 16px; }
  .project-list { grid-template-columns: minmax(0, 1fr); gap: 16px; }
  .project-heading, .project-body { padding: 12px; }
  .new-project { gap: 8px; }
}
