.short-feed { padding: 40px 6% 65px; background: #f1edde; }
.short-card, .short-empty, .short-pagination { width: min(100%, 720px); margin: 0 auto 20px; }
.short-card {
  background: #fffdf6;
  border: 1px solid #e1ddcf;
  border-radius: 24px;
  padding: clamp(20px, 4vw, 34px);
  box-shadow: 0 5px 20px #352a1609;
}
.short-author { display: flex; align-items: center; gap: 14px; }
.short-author img { border-radius: 50%; object-fit: contain; padding: 5px; background: #ecebdc; }
.short-author strong, .short-author small { display: block; }
.short-author small { color: #626852; font-size: 13px; }
.short-body { white-space: pre-wrap; overflow-wrap: anywhere; font-size: clamp(18px, 2.5vw, 23px); line-height: 1.6; margin: 22px 0 0; }
.short-media { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; margin-top: 20px; }
.short-media:has(> a:only-child), .short-video { grid-template-columns: 1fr; }
.short-media img, .short-media video { width: 100%; max-height: 520px; display: block; object-fit: contain; border-radius: 13px; background: #eeeade; }
.short-media:has(> a:nth-child(2)) img { aspect-ratio: 1; object-fit: cover; }
.short-video video { background: #242b20; }
.short-pagination { display: flex; justify-content: space-between; gap: 12px; }
.short-composer { max-width: 780px; padding: 24px; border: 1px solid #dedbcb; border-radius: 20px; background: #fffdf6; }
.short-composer fieldset { border: 1px solid #dedbcb; border-radius: 12px; margin: 20px 0; padding: 15px; }
.short-composer legend { padding-inline: 6px; font-weight: 700; }
.short-fields { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
.short-fields label { margin: 0; }
.short-fields input { width: 100%; max-width: 100%; padding: 8px; font-size: 13px; }
.short-composer small { display: block; margin-top: 5px; }
.short-composer .short-check { display: flex; gap: 8px; align-items: center; }
.short-composer .short-check input { width: auto; }
.short-status { padding: 12px; border-radius: 12px; background: #e7eddc; }
.short-admin-item { display: flex; flex-wrap: wrap; gap: 12px; align-items: center; border-bottom: 1px solid #dedbcb; padding: 8px 0; }
.short-admin-item p { flex: 1 1 220px; overflow-wrap: anywhere; }
@media (max-width: 600px) { .short-fields { grid-template-columns: 1fr; } }
.short-card {
  padding: clamp(42px, 8vw, 74px) clamp(14px, 4vw, 34px) clamp(42px, 7vw, 74px);
  background: #f8f1e7 url('/assets/fundo-post.webp') center / 100% 100% no-repeat;
}
.short-card-content {
  border-radius: 16px;
  background: #fffdf6f5;
  padding: clamp(14px, 3vw, 24px);
}
.short-workspace {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, .92fr);
  gap: clamp(18px, 3vw, 36px);
  align-items: start;
}
.short-preview-panel { min-width: 0; }
.short-preview-panel h2 { margin: 0 0 12px; }
.short-preview-panel .short-card { margin-bottom: 8px; }
.short-preview-note { margin: 0; }
.short-media[hidden] { display: none; }
.short-media:has(> span:only-child) { grid-template-columns: 1fr; }
.short-media:has(> span:nth-child(2)) img { aspect-ratio: 1; object-fit: cover; }
@media (max-width: 950px) {
  .short-workspace { grid-template-columns: 1fr; }
}
.short-card {
  box-sizing: border-box;
  aspect-ratio: 4 / 5;
  display: grid;
  grid-template-rows: minmax(0, 1fr);
  overflow: hidden;
}
.short-card-content {
  min-width: 0;
  min-height: 0;
  overflow: auto;
}
.short-author img {
  flex: 0 0 48px;
  height: 48px;
  padding: 0;
  object-fit: cover;
}

.short-author strong {
  font-size: clamp(16px, 2.4vw, 21px);
  font-weight: 800;
  line-height: 1.25;
  letter-spacing: -.025em;
}
.short-author small { margin-top: 3px; }
.short-card-content {
  background: linear-gradient(145deg, #fffdf4bd, #fffdf473);
  border: 1px solid #ffffff9e;
  box-shadow: inset 0 1px 0 #ffffffb5, 0 8px 24px #343f2117;
  -webkit-backdrop-filter: blur(12px) saturate(1.2);
  backdrop-filter: blur(12px) saturate(1.2);
}
.short-author strong {
  color: #22351b;
  font-weight: 600;
  letter-spacing: -.012em;
}
.short-export-unit { width: min(100%, 720px); margin: 0 auto 24px; }
.short-export-unit .short-card { margin-bottom: 8px; }
.short-export { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px; font-size: 14px; }
.short-export .short-download {
  background: #f6f6e9;
  border: 1px solid #b8c2a5;
  color: #2f4325;
  border-radius: 999px;
  padding: 8px 16px;
  font: inherit;
  cursor: pointer;
}
.short-export .short-download:hover { background: #e8eddc; }
.short-export .short-download:disabled { opacity: .65; cursor: wait; }
.short-card-content, .short-card .short-body, .short-card .short-author strong { color: #000; }
.short-card .short-author small { color: #5d5d5d; }
.short-card .short-body strong { font-weight: 700; }
.short-composer .short-bold { margin: 4px 0; padding: 5px 12px; font-size: 14px; font-weight: 700; }
.short-card {
  container-type: inline-size;
  padding-inline: 6%;
}
.short-card-content { padding-inline: 4.75cqw; }
.short-card .short-body {
  font-family: system-ui, sans-serif;
  font-size: 4.55cqw;
  line-height: 1.6;
}
.short-limit-exceeded { color: #8e3d2b; font-weight: 600; }
.short-card { position: relative; padding-bottom: max(clamp(42px, 7vw, 74px), 13%); }
.short-card-emblem {
  position: absolute;
  bottom: 2%;
  left: 50%;
  transform: translateX(-50%);
  width: 28%;
  height: auto;
  pointer-events: none;
}
/* The glass follows the 4:5 artwork safe area. */
.short-card {
  display: block;
  padding: 0;
}
.short-card-content {
  position: absolute;
  inset: auto 10%;
  top: 50%;
  transform: translateY(-50%);
  max-height: 84%;
  box-sizing: border-box;
  padding: 3.7cqw 2.6cqw 2.6cqw;
}
.short-card .short-body { font-size: 3.98cqw; }
.short-format-label { display: block; margin-bottom: 4px; }
#short-format {
  margin-bottom: 14px;
  padding: 7px 11px;
  border: 1px solid #b8c2a5;
  border-radius: 8px;
  background: #fffdf6;
  color: #25351f;
  font: inherit;
}
.short-card[data-format="story"] { aspect-ratio: 9 / 16; border: 0; }
.short-card[data-format="story"] .short-card-content { max-height: 88%; }
.short-card[data-format="story"] .short-card-emblem { top: 95%; bottom: auto; }

.short-card[data-format="story"] { background-image: url("/assets/fundo-story.svg"); }