/* Shared bourbon-cream treatment for every feed comment dialog, including the
   standalone competition Highlights thread. The selector is intentionally
   limited to dialogs containing the app's comment composer. */
:root {
  --pn-comment-bourbon-surface:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.035'/%3E%3C/svg%3E"),
    radial-gradient(ellipse 85% 58% at 18% 0%, rgba(255,248,220,0.55), transparent 72%),
    radial-gradient(ellipse 72% 56% at 92% 78%, rgba(188,154,91,0.24), transparent 70%),
    linear-gradient(180deg, #E8DCC0 0%, #DDD0AE 48%, #CBB88D 100%);
}

[role="dialog"]:has(textarea[placeholder^="Add a comment"]) {
  background: var(--pn-comment-bourbon-surface) !important;
  border-color: rgba(94, 72, 20, 0.30) !important;
  color: #1D1A14 !important;
}

[role="dialog"]:has(textarea[placeholder^="Add a comment"]) * {
  color: #1D1A14 !important;
}

[role="dialog"]:has(textarea[placeholder^="Add a comment"]) > div:has(textarea) {
  background: rgba(248, 241, 222, 0.72) !important;
  border-color: rgba(94, 72, 20, 0.18) !important;
}

[role="dialog"]:has(textarea[placeholder^="Add a comment"]) textarea {
  background: rgba(29, 26, 20, 0.06) !important;
  border-color: rgba(94, 72, 20, 0.24) !important;
  color: #1D1A14 !important;
  caret-color: #5E4814 !important;
}

[role="dialog"]:has(textarea[placeholder^="Add a comment"]) textarea::placeholder {
  color: rgba(29, 26, 20, 0.45) !important;
}