.p-cases .case-card .case-meta .case-meta-row {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
}

.p-cases .case-card .case-actions {
  display: flex;
  gap: 10px;
  margin-top: 10px;
}

.p-cases .case-card .case-actions .btn {
  padding: 8px 12px;
  border-radius: 10px;
  border: 1px solid var(--card-border);
  background: rgb(255 255 255 / 4%);
  color: var(--white-text);
  text-decoration: none;
}

.p-cases .case-card .case-actions .btn:hover {
  border-color: var(--accent-orange);
  color: var(--accent-orange);
}

/* Bottom half rows mirror the spec: stats above the footer, verification left, download right. */
.p-cases .case-stats-row,
.p-collections .case-stats-row {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  align-items: center;
  margin-top: 20px;
}

/* Prevent the bundle modal from reserving blank space when stats are unavailable. */
.p-cases #bundleCaseStatsRow:empty {
  display: none;
}

.p-cases .case-card .stat-chip,
.p-collections .case-card .stat-chip {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 6px 12px;
  border-radius: 999px;
  background: rgb(30 41 59 / 40%);
  font-size: 0.72rem;
  font-weight: 600;
  color: #e2e8f0;
}

.p-collections .case-stats-row {
  flex-wrap: nowrap;
  gap: 8px;
  justify-content: center;
}

.p-collections .case-card .stat-chip {
  gap: 5px;
  padding: 6px 10px;
  font-size: 0.68rem;
  white-space: nowrap;
  border: 1px solid rgb(148 163 184 / 14%);
  background: linear-gradient(180deg, rgb(15 23 42 / 38%) 0%, rgb(30 41 59 / 30%) 100%);
}

.p-cases .case-card .stat-label,
.p-collections .case-card .stat-label {
  font-size: 0.65rem;
  text-transform: uppercase;
  letter-spacing: 0.14em;
  opacity: 0.8;
}

.p-collections .case-card .stat-label {
  font-size: 0.6rem;
  letter-spacing: 0.11em;
}

body.light-mode.p-cases .case-card .stat-chip,
body.light-mode.p-collections .case-card .stat-chip {
  background: rgb(241 245 249);
  color: rgb(30 41 59);
}

.p-collections .case-card .stat-chip.warning {
  border-color: rgb(249 115 22 / 26%);
  color: #e2e8f0;
}

.p-collections .case-card .stat-chip.success {
  border-color: rgb(45 212 191 / 24%);
  color: #e2e8f0;
}

.p-collections .case-card .stat-chip.stat-chip-updated {
  border-color: rgb(96 165 250 / 24%);
  color: #e2e8f0;
}

.p-collections .case-card .stat-chip.warning .stat-label {
  color: rgb(255 204 170);
  opacity: 1;
}

.p-collections .case-card .stat-chip.success .stat-label {
  color: rgb(167 243 208);
  opacity: 1;
}

.p-collections .case-card .stat-chip.stat-chip-updated .stat-label {
  color: rgb(147 197 253);
  opacity: 1;
}

body.light-mode.p-collections .case-card .stat-chip.warning {
  border-color: rgb(253 186 116);
  color: rgb(30 41 59);
}

body.light-mode.p-collections .case-card .stat-chip.success {
  border-color: rgb(110 231 183);
  color: rgb(30 41 59);
}

body.light-mode.p-collections .case-card .stat-chip.stat-chip-updated {
  border-color: rgb(147 197 253);
  color: rgb(30 41 59);
}

body.light-mode.p-collections .case-card .stat-chip.warning .stat-label {
  color: rgb(194 65 12);
}

body.light-mode.p-collections .case-card .stat-chip.success .stat-label {
  color: rgb(4 120 87);
}

body.light-mode.p-collections .case-card .stat-chip.stat-chip-updated .stat-label {
  color: rgb(30 64 175);
}

@media (max-width: 900px) {
  .p-collections .case-stats-row {
    flex-wrap: wrap;
  }
}

.p-cases .case-card .case-footer {
  display: grid;
  grid-template-columns: max-content minmax(0, 1fr) max-content;
  align-items: center;
  gap: 12px;
  margin-top: 26px;
  padding-top: 20px;
  border-top: 1px solid rgb(255 255 255 / 12%);
  width: 100%;
}

.p-cases .case-card .case-footer > * {
  font-size: 0.78rem;
  line-height: 1.15;
}

@media (max-width: 720px) {
  .p-cases .case-card .case-footer {
    grid-template-columns: 1fr;
    justify-items: center;
  }
}

/* Verification + download row endpoints for the spec's "badge bottom left" requirement. */
.p-cases .case-footer-status {
  display: inline-flex;
  align-items: center;
}

/* Verification badge now mirrors the proposal pill treatment for clarity. */
.p-cases .verification-indicator {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  padding: 6px 14px;
  border-radius: 999px;
  border: 1px solid rgb(255 255 255 / 18%);
  background: rgb(15 23 42 / 65%);
  font-size: 0.78rem;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: rgb(226 232 240 / 92%);
}

.p-cases .verification-indicator.verified {
  background: linear-gradient(135deg, rgb(16 185 129 / 28%) 0%, rgb(5 150 105 / 24%) 100%);
  border-color: rgb(45 212 191 / 55%);
  color: rgb(190 242 227);
}

.p-cases .verification-indicator.unverified {
  background: linear-gradient(135deg, rgb(248 113 113 / 32%) 0%, rgb(239 68 68 / 26%) 100%);
  border-color: rgb(248 113 113 / 60%);
  color: rgb(254 226 226);
}

.p-cases .verification-indicator.pending {
  background: linear-gradient(135deg, rgb(148 163 184 / 28%) 0%, rgb(100 116 139 / 24%) 100%);
  border-color: rgb(148 163 184 / 50%);
  color: rgb(226 232 240 / 82%);
}

body.light-mode.p-cases .verification-indicator {
  background: rgb(248 250 252);
  border-color: rgb(203 213 225);
  color: rgb(71 85 105);
}

body.light-mode.p-cases .verification-indicator.verified {
  background: rgb(208 250 231);
  border-color: rgb(134 239 172);
  color: rgb(4 120 87);
}

body.light-mode.p-cases .verification-indicator.unverified {
  background: rgb(254 226 226);
  border-color: rgb(248 113 113 / 55%);
  color: rgb(185 28 28);
}

body.light-mode.p-cases .verification-indicator.pending {
  background: rgb(241 245 249);
  border-color: rgb(203 213 225);
  color: rgb(100 116 139);
}

.p-cases .case-meta-final,
.p-collections .case-meta-final {
  order: 2;
  display: block;
  width: 100%;
  margin-top: 16px;
  padding-top: 12px;
  border-top: 1px solid rgb(255 255 255 / 8%);
  text-align: center;
  font-size: 0.76rem;
  line-height: 1.45;
  letter-spacing: 0.04em;
  color: rgb(148 163 184 / 78%);
  background: transparent;
  box-shadow: none;
  border-radius: 0;
}

.p-cases .case-meta-final .case-meta-label,
.p-collections .case-meta-final .case-meta-label {
  display: inline;
  font-weight: 700;
  color: rgb(203 213 225 / 88%);
}

.p-cases .case-meta-final .case-meta-value,
.p-collections .case-meta-final .case-meta-value {
  display: inline;
  font-weight: 500;
  color: rgb(226 232 240 / 92%);
  overflow-wrap: anywhere;
}

.p-cases .case-card .card-surface,
.p-collections .case-card .card-surface {
  display: flex;
  flex-direction: column;
}

.p-cases .case-card .case-meta-final > * + *,
.p-collections .case-card .case-meta-final > * + * {
  margin-left: 0.28rem;
}

.p-cases .case-meta-final .case-meta-divider,
.p-collections .case-meta-final .case-meta-divider {
  margin: 0 0.32rem;
  color: rgb(148 163 184 / 60%);
}

body.light-mode.p-cases .case-meta-final,
body.light-mode.p-collections .case-meta-final {
  color: rgb(100 116 139 / 86%);
  border-top-color: rgb(203 213 225 / 55%);
}

body.light-mode.p-cases .case-meta-final .case-meta-label,
body.light-mode.p-collections .case-meta-final .case-meta-label {
  color: rgb(71 85 105 / 88%);
}

body.light-mode.p-cases .case-meta-final .case-meta-value,
body.light-mode.p-collections .case-meta-final .case-meta-value {
  color: rgb(30 41 59 / 90%);
}

body.light-mode.p-cases .case-meta-final .case-meta-divider,
body.light-mode.p-collections .case-meta-final .case-meta-divider {
  color: rgb(148 163 184 / 60%);
}

.p-cases .case-card .bundle-download {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  padding: 6px 16px;
  border-radius: 999px;
  border: 1px solid rgb(96 165 250 / 65%);
  background: linear-gradient(135deg, rgb(30 64 175 / 18%) 0%, rgb(59 130 246 / 14%) 100%);
  color: rgb(191 219 254);
  font-weight: 700;
  font-size: 0.78rem;
  text-decoration: none;
  cursor: pointer;
  box-shadow: 0 10px 20px rgb(15 23 42 / 25%);
  transition: transform .18s ease, box-shadow .18s ease, background-color .18s ease, color .18s ease, border-color .18s ease;
  margin-left: 0;
}

.p-cases .case-card .case-updated-chip {
  text-align: center;
}

@media (max-width: 720px) {
  .p-cases .case-footer-status,
  .p-cases .case-card .bundle-download,
  .p-cases .case-card .case-updated-chip {
    grid-column: auto;
    justify-self: center;
  }
}

.p-cases .case-card .bundle-download .bundle-icon {
  width: 18px;
  height: 18px;
  fill: currentcolor;
}

.p-cases .case-card .bundle-download:hover {
  transform: translateY(-2px);
  box-shadow: 0 14px 24px rgb(37 99 235 / 32%);
  background: linear-gradient(135deg, rgb(37 99 235 / 36%) 0%, rgb(59 130 246 / 30%) 100%);
  border-color: rgb(59 130 246 / 85%);
  color: rgb(219 234 254);
}

body.light-mode.p-cases .case-card .bundle-download {
  background: rgb(239 246 255);
  border-color: rgb(191 219 254);
  color: rgb(30 64 175);
  box-shadow: 0 10px 18px rgb(148 163 184 / 18%);
}

body.light-mode.p-cases .case-card .bundle-download:hover {
  background: rgb(219 234 254);
  border-color: rgb(59 130 246 / 60%);
  color: rgb(30 64 175);
}

.p-cases .case-inline-auth-hint {
  margin-top: 14px;
  padding: 14px;
  border-radius: 16px;
  border: 1px solid rgb(96 165 250 / 42%);
  background:
    linear-gradient(145deg, rgb(17 24 39 / 88%) 0%, rgb(30 41 59 / 82%) 46%, rgb(15 23 42 / 90%) 100%),
    radial-gradient(circle at 16% 4%, rgb(96 165 250 / 24%), transparent 58%);
  box-shadow:
    0 16px 30px rgb(2 6 23 / 42%),
    inset 0 1px 0 rgb(255 255 255 / 12%);
  display: grid;
  gap: 10px;
  opacity: 0;
  transform: translateY(8px);
  transition: opacity .24s ease, transform .24s ease;
}

.p-cases .case-inline-auth-hint.is-visible {
  opacity: 1;
  transform: translateY(0);
}

.p-cases .case-inline-auth-hint-head {
  display: grid;
  gap: 6px;
}

.p-cases .case-inline-auth-hint-badge {
  width: fit-content;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 4px 10px;
  border-radius: 999px;
  border: 1px solid rgb(249 115 22 / 50%);
  background: linear-gradient(135deg, rgb(30 64 175 / 22%), rgb(59 130 246 / 28%));
  color: rgb(253 186 116);
  font-size: .68rem;
  font-weight: 700;
  letter-spacing: .06em;
  text-transform: uppercase;
}

.p-cases .case-inline-auth-hint-title {
  margin: 0;
  color: rgb(241 245 249);
  font-size: .95rem;
  font-weight: 700;
  letter-spacing: .01em;
}

.p-cases .case-inline-auth-hint-copy {
  margin: 0;
  color: rgb(203 213 225 / 88%);
  font-size: .8rem;
  line-height: 1.45;
}

.p-cases .case-inline-auth-hint-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.p-cases .case-inline-auth-action {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 34px;
  padding: 7px 12px;
  border-radius: 999px;
  border: 1px solid rgb(148 163 184 / 45%);
  background: linear-gradient(135deg, rgb(51 65 85 / 44%), rgb(30 41 59 / 60%));
  color: rgb(226 232 240);
  font-size: .74rem;
  font-weight: 600;
  text-decoration: none;
  transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease, background-color .2s ease;
}

.p-cases .case-inline-auth-action.primary {
  border-color: rgb(249 115 22 / 55%);
  background: linear-gradient(145deg, rgb(249 115 22 / 92%), rgb(253 186 116 / 88%));
  color: rgb(15 23 42);
  font-weight: 700;
}

.p-cases .case-inline-auth-action:hover,
.p-cases .case-inline-auth-action:focus-visible {
  transform: translateY(-1px);
  box-shadow: 0 10px 20px rgb(15 23 42 / 35%);
  border-color: rgb(96 165 250 / 55%);
}

.p-cases .case-inline-auth-action.primary:hover,
.p-cases .case-inline-auth-action.primary:focus-visible {
  box-shadow: 0 12px 24px rgb(249 115 22 / 34%);
  border-color: rgb(253 186 116 / 70%);
}

body.light-mode.p-cases .case-inline-auth-hint {
  border-color: rgb(191 219 254);
  background:
    linear-gradient(140deg, rgb(255 255 255 / 96%) 0%, rgb(241 245 255 / 94%) 55%, rgb(234 243 255 / 96%) 100%),
    radial-gradient(circle at 16% 4%, rgb(59 130 246 / 16%), transparent 62%);
  box-shadow:
    0 14px 24px rgb(148 163 184 / 23%),
    inset 0 1px 0 rgb(255 255 255 / 88%);
}

body.light-mode.p-cases .case-inline-auth-hint-badge {
  border-color: rgb(249 115 22 / 45%);
  background: linear-gradient(135deg, rgb(219 234 254), rgb(191 219 254));
  color: rgb(194 65 12);
}

body.light-mode.p-cases .case-inline-auth-hint-title {
  color: rgb(30 41 59);
}

body.light-mode.p-cases .case-inline-auth-hint-copy {
  color: rgb(71 85 105 / 92%);
}

body.light-mode.p-cases .case-inline-auth-action {
  border-color: rgb(203 213 225);
  background: rgb(248 250 252);
  color: rgb(51 65 85);
}

body.light-mode.p-cases .case-inline-auth-action:hover,
body.light-mode.p-cases .case-inline-auth-action:focus-visible {
  border-color: rgb(59 130 246 / 46%);
  box-shadow: 0 10px 18px rgb(148 163 184 / 26%);
}

body.light-mode.p-cases .case-inline-auth-action.primary {
  border-color: rgb(30 64 175 / 35%);
  background: linear-gradient(135deg, rgb(239 246 255), rgb(219 234 254));
  color: rgb(30 64 175);
}

@media (max-width: 640px) {
  .p-cases .case-inline-auth-hint {
    margin-top: 12px;
    padding: 12px;
    border-radius: 14px;
  }

  .p-cases .case-inline-auth-hint-title {
    font-size: .9rem;
  }

  .p-cases .case-inline-auth-action {
    width: 100%;
  }
}

/* Skinny screens: stack footer, reduce meta font size */
@media (width <= 400px) {
  .p-cases .case-card .case-footer {
    grid-template-columns: 1fr;
    justify-items: center;
    gap: 10px;
    margin-top: 18px;
    padding-top: 14px;
  }

  .p-cases .case-meta-final {
    font-size: 0.68rem;
    margin-top: 10px;
    padding-top: 10px;
  }

  .p-cases .case-meta-final .case-meta-value {
    overflow-wrap: anywhere;
    word-break: break-all;
  }

  .p-cases .verification-indicator {
    padding: 5px 10px;
    font-size: 0.72rem;
    gap: 4px;
  }

  .p-cases .case-card .bundle-download {
    padding: 5px 12px;
    font-size: 0.72rem;
  }

  .p-cases .case-card .case-actions .btn {
    padding: 6px 10px;
    font-size: 0.78rem;
  }
}

