/* Transparent theme artwork shares the existing character illustration family. */
.theme-card-heading { display: flex; align-items: center; gap: 16px; }
.theme-card-heading h3 { flex: 1; min-width: 0; }
.theme-card .theme-illustration {
  order: 2;
  flex: none;
  width: 120px;
  height: 120px;
  object-fit: contain;
  margin: 0;
}
.theme-card .tlab { clear: both; }
@media (max-width: 540px) {
  .theme-card .theme-illustration {
    width: 96px;
    height: 96px;
    margin: 0;
  }
}

.pl-theme-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 12px;
}
.pl-theme-heading h2 { margin: 0; }
.pl-theme-illustration {
  width: 88px;
  height: 88px;
  flex: none;
  object-fit: contain;
}
@media (max-width: 540px) {
  .pl-theme-illustration { width: 72px; height: 72px; }
}

/* Shared memory cues: shape and text always travel together. */
.theme-label {
  display: inline-flex;
  align-items: center;
  gap: .35em;
  max-width: 100%;
  vertical-align: middle;
  line-height: 1.35;
  text-align: left;
}
.theme-label-text { min-width: 0; overflow-wrap: anywhere; }
.theme-label .theme-symbol, img.theme-symbol {
  display: inline-block;
  flex: 0 0 auto;
  width: 24px;
  height: 24px;
  object-fit: contain;
  vertical-align: middle;
  margin: 0;
  float: none;
}
.theme-gather .theme-symbol { width: 38px; height: 38px; }
.theme-memory-cue { font-size: 12px; color: var(--theme-accent,#705c49); margin: -4px 0 12px; }
.theme-symbol-key { border: 1px solid var(--line, #d8cbb8); border-radius: 12px; padding: 16px 20px; margin: 20px 0 28px; background: var(--theme-surface,#faf6ee); }
.theme-symbol-key summary { cursor: pointer; font-weight: 600; }
.theme-symbol-key p { font-size: 14px; max-width: 64ch; }
.theme-symbol-key-grid { display: grid; grid-template-columns: repeat(auto-fit,minmax(190px,1fr)); gap: 16px; margin-top: 20px; }
.theme-symbol-key-grid small { display: block; margin: 5px 0 0 30px; color: var(--theme-accent,#705c49); }
.theme-filter-selection { display: block; margin-top: 5px; }
.themechips > span, .themes > span { max-width: 100%; }
/* Existing poetry pill rules target nested spans; scope them to the actual pill. */
.themes .theme-label, .themes .theme-label-text,
.themechips .theme-label, .themechips .theme-label-text {
  padding: 0; border: 0; background: none; border-radius: 0;
  font: inherit; color: inherit; letter-spacing: inherit; text-transform: inherit;
}
.themechips .theme-label, .themes .theme-label { display: inline-flex; }
.pl-theme-heading h2 small { display: block; font-size: .6em; margin-top: 10px; }
@media (max-width: 540px) {
  .theme-gather .theme-symbol { width: 30px; height: 30px; }
  .theme-symbol-key { padding: 14px; }
}
@media (forced-colors: active) {
  .theme-label { color: CanvasText; }
}
.theme-card h3 .theme-memory-cue { display: block; margin: 8px 0 0; font-family: var(--sans, sans-serif); font-weight: 400; line-height: 1.4; }
.figure-cue .theme-label { font-size: inherit; }
.figure-cue .theme-symbol { width: 20px; height: 20px; }
.pl-theme-tags { display: flex; flex-wrap: wrap; gap: 8px 16px; margin: 12px 0; font-size: 13px; }
