.documentation-shell{
  width:100%;
  max-width:100%;
}
.documentation-area-switch,
.documentation-toolbar,
.documentation-project-meta,
.documentation-upload-actions,
.documentation-scope-switch{
  display:flex;
  flex-wrap:wrap;
  gap:12px;
}
.documentation-area-switch{
  align-items:center;
}
.documentation-toolbar{
  align-items:flex-end;
  gap:14px;
}
.documentation-toolbar__project{
  flex:1 1 260px;
}
.documentation-toolbar__search{
  flex:1 1 240px;
}
.documentation-toolbar__scope{
  flex:0 0 auto;
}
.documentation-toolbar__upload{
  flex:0 0 auto;
  display:flex;
  align-items:flex-end;
}
.documentation-project-meta{
  align-items:center;
  gap:10px 12px;
}
.documentation-form-wrap{
  margin-top:6px;
}
.documentation-form-card{
  padding:22px;
}
.documentation-form-card__head{
  gap:14px;
}
.documentation-form-card__date,
.documentation-form-card__select{
  min-width:180px;
  max-width:220px;
}
.documentation-area-switch .btn,
.documentation-scope-switch .btn,
.documentation-actions-menu__trigger{
  min-height:44px;
}
.documentation-list{
  display:grid;
  gap:20px;
}
.documentation-list--grid{
  grid-template-columns:repeat(auto-fit, minmax(260px, 1fr));
}
.documentation-card{
  display:flex;
  flex-direction:column;
  border:1px solid var(--line);
  border-radius:18px;
  overflow:visible;
  position:relative;
  background:linear-gradient(180deg, rgba(255,255,255,.98), rgba(248,250,252,.94));
  box-shadow:var(--shadow2);
  min-height:100%;
}
.documentation-card.is-trash{
  opacity:.85;
}
.documentation-card__media{
  position:relative;
  aspect-ratio:4 / 3;
  border-radius:18px 18px 0 0;
  background:linear-gradient(135deg, rgba(226,232,240,.75), rgba(241,245,249,.98));
  display:flex;
  align-items:center;
  justify-content:center;
  overflow:visible;
}
.documentation-card__menu{
  position:absolute;
  top:12px;
  right:12px;
  z-index:8;
}
.documentation-card__image{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}
.documentation-card__fileicon{
  font-size:28px;
  font-weight:900;
  letter-spacing:.08em;
  color:#475569;
}
.documentation-card__body{
  display:flex;
  flex-direction:column;
  justify-content:space-between;
  gap:16px;
  padding:20px;
  flex:1 1 auto;
}
.documentation-card__title{
  margin:0;
  overflow-wrap:anywhere;
}
.documentation-card__head{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:16px;
}
.documentation-card__titlewrap{
  min-width:0;
  flex:1 1 auto;
}
.documentation-card__actions{
  display:flex;
}
.documentation-card__expanded{
  margin-top:4px;
  padding:12px 18px 2px;
  border-top:1px dashed rgba(148,163,184,.35);
}
.documentation-detail-meta{
  display:grid;
  gap:8px;
  flex:1 1 auto;
}
.documentation-detail-meta__row{
  display:grid;
  gap:4px;
}
.documentation-detail-meta__value{
  overflow-wrap:anywhere;
  word-break:break-word;
  line-height:1.55;
}
.documentation-actions-menu{
  position:relative;
  flex:0 0 auto;
}
.documentation-actions-menu summary{
  list-style:none;
}
.documentation-actions-menu summary::-webkit-details-marker{
  display:none;
}
.documentation-actions-menu[open] .documentation-actions-menu__list{
  display:grid;
}
.documentation-actions-menu__list{
  display:none;
  position:absolute;
  right:0;
  top:calc(100% + 8px);
  min-width:180px;
  gap:8px;
  padding:10px;
  border:1px solid var(--line);
  border-radius:14px;
  background:#fff;
  box-shadow:var(--shadow2);
  z-index:40;
}
.documentation-actions-menu__trigger{
  min-width:44px;
  padding-inline:12px;
  border-color:rgba(255,255,255,.82);
  background:rgba(255,255,255,.92);
  backdrop-filter:blur(8px);
}
.documentation-preview-inlinehead{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  margin-bottom:14px;
}
.documentation-preview-frame{
  width:100%;
  min-height:560px;
  border:1px solid var(--line);
  border-radius:14px;
  background:#fff;
}
.documentation-text-preview{
  margin:0;
  padding:16px;
  border-radius:14px;
  border:1px solid var(--line);
  background:#fff;
  white-space:pre-wrap;
  word-break:break-word;
  font-family:ui-monospace, SFMono-Regular, Consolas, monospace;
  font-size:13px;
  line-height:1.6;
}
.documentation-comments{
  margin-top:12px;
}
.documentation-comment-list{
  display:grid;
  gap:10px;
}
.documentation-comment{
  padding:12px;
  border-radius:14px;
  border:1px solid rgba(226,232,240,.95);
  background:#fff;
}
.documentation-comment__meta{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:8px 12px;
}
.documentation-comment__text{
  margin-top:8px;
  line-height:1.55;
}
.documentation-comment-empty{
  padding:6px 0;
}
.documentation-comment-actions{
  gap:10px;
}
.documentation-file-chips{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
}
.documentation-empty{
  width:100%;
}
.documentation-status--info{ background:#dbeafe; color:#1d4ed8; }
.documentation-status--offen{ background:#fef3c7; color:#92400e; }
.documentation-status--mangel{ background:#fee2e2; color:#b91c1c; }
.documentation-status--erledigt{ background:#dcfce7; color:#166534; }

@media (max-width: 720px){
  .documentation-area-switch,
  .documentation-toolbar,
  .documentation-project-meta,
  .documentation-upload-actions,
  .documentation-scope-switch{
    width:100%;
    align-items:stretch;
  }
  .documentation-area-switch > *,
  .documentation-toolbar > *,
  .documentation-upload-actions > *,
  .documentation-scope-switch > *{
    flex:1 1 100%;
    width:100%;
    min-width:0;
  }
  .documentation-list--grid{
    grid-template-columns:1fr;
  }
  .documentation-form-card{
    padding:18px 16px;
  }
  .documentation-card__body{
    padding:18px 16px;
    gap:16px;
  }
  .documentation-actions-menu,
  .documentation-actions-menu__list{
    width:auto;
  }
  .documentation-actions-menu__list{
    right:0;
    left:auto;
    max-width:min(240px, calc(100vw - 48px));
  }
  .documentation-preview-inlinehead{
    flex-direction:column;
    align-items:stretch;
  }
  .documentation-comment-actions > *{
    flex:1 1 100%;
  }
  .documentation-preview-frame{
    min-height:68vh;
  }
  .documentation-card__expanded{
    padding:10px 14px 2px;
  }
  .documentation-card__menu{
    top:10px;
    right:10px;
  }
}