.fcdash-comments, .fcdash-comments-menu { font: 14px/1.5 ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; color: #202326; background: #fff; letter-spacing: 0; box-sizing: border-box; }
.fcdash-comments { width: min(580px, calc(100vw - 24px)); max-width: calc(100vw - 24px); max-height: calc(100dvh - 32px); margin: auto; padding: 20px; border: 1px solid #d5d9df; border-radius: 12px; overflow-x: hidden; overflow-y: auto; }
.fcdash-comments *, .fcdash-comments *::before, .fcdash-comments *::after { box-sizing: border-box; min-width: 0; }
.fcdash-comments::backdrop { background: #0006; }
.fcdash-comments header { display: flex; justify-content: space-between; align-items: flex-start; gap: 12px; }
.fcdash-comments__header-copy { display: grid; justify-items: start; gap: 3px; }
.fcdash-comments .fcdash-issue-reporter__toolbar-action--icon-only::after { left: auto; right: 0; transform: none; }
.fcdash-comments h2 { color: #66717d; font-size: 12px !important; font-weight: 600; line-height: 1.3; margin: 0; }
.fcdash-comments button, .fcdash-comments-menu button { font: inherit; cursor: pointer; color: inherit; background: transparent; border: 1px solid #d5d9df; border-radius: 4px; padding: 8px 10px; }
.fcdash-comments button:hover, .fcdash-comments-menu button:hover { background: #eef5f8; }
.fcdash-comments button:focus-visible, .fcdash-comments-menu button:focus-visible { outline: 2px solid #007cab; outline-offset: 2px; }
.fcdash-comments button:disabled { opacity: .5; cursor: default; }
.fcdash-comments__header-actions { display: flex; align-items: center; gap: 4px; margin-left: auto; }
.fcdash-comments header > button, .fcdash-comments__header-actions > button { display: inline-flex; align-items: center; justify-content: center; width: 28px; height: 28px; padding: 4px; border: 0; border-radius: 4px; background: transparent; line-height: 1; }
.fcdash-comments header > button { margin-left: auto; }
.fcdash-comments__header-actions > button { margin: 0; }
.fcdash-comments header > button:hover, .fcdash-comments header > button:focus, .fcdash-comments__header-actions > button:hover, .fcdash-comments__header-actions > button:focus { color: #111820; background: #eef5f8; }
.fcdash-comments header > button .fcdash-issue-reporter__toolbar-icon, .fcdash-comments__header-actions > button .fcdash-issue-reporter__toolbar-icon { display: block; flex: 0 0 16px; width: 16px; height: 16px; margin: 0; }
.fcdash-comments .fcdash-comments__archive { color: #66717d; }
.fcdash-comments .fcdash-comments__back { width: auto; margin: 0; padding: 0; color: #66717d; background: transparent; border: 0; border-radius: 0; font-size: 12px; line-height: 1.3; text-align: left; }
.fcdash-comments .fcdash-comments__back:hover, .fcdash-comments .fcdash-comments__back:focus { color: #202326; background: transparent; text-decoration: underline; }
.fcdash-comments__content { width: 100%; max-height: 48dvh; overflow-x: hidden; overflow-y: auto; overflow-wrap: anywhere; }
.fcdash-comments img { display: block; width: 100%; max-width: 100%; max-height: 240px; object-fit: contain; margin: 8px 0; }
.fcdash-comments__metadata { display: flex; align-items: center; gap: 6px; margin-top: 6px; }
.fcdash-comments .fcdash-comments__metadata-trigger { display: inline-flex; align-items: center; justify-content: center; width: 28px; height: 28px; padding: 4px; color: inherit; background: transparent; border: 1px solid currentColor; border-radius: 4px; text-decoration: none; }
.fcdash-comments .fcdash-comments__metadata-trigger:hover, .fcdash-comments .fcdash-comments__metadata-trigger:focus-visible { color: #202326; background: rgba(0, 124, 171, .1); border-color: currentColor; }
.fcdash-comments .fcdash-comments__message-row.is-current-user .fcdash-comments__metadata-trigger:hover, .fcdash-comments .fcdash-comments__message-row.is-current-user .fcdash-comments__metadata-trigger:focus-visible { color: #fff; background: rgba(255, 255, 255, .18); border-color: #fff; }
.fcdash-comments .fcdash-comments__metadata-trigger::after { display: none !important; }
.fcdash-comments .fcdash-comments__metadata-trigger .fcdash-issue-reporter__toolbar-icon { width: 17px; height: 17px; }
.fcdash-comments__metadata-tooltip { position: fixed; z-index: 2147483647; inset: auto; display: block; width: max-content; max-width: min(340px, calc(100vw - 16px)); max-height: min(260px, calc(100dvh - 16px)); margin: 0; padding: 9px 10px; overflow: auto; color: #202326; background: #fff; border: 1px solid #d5d9df; border-radius: 6px; box-shadow: 0 8px 24px #0003; font: 400 12px/1.35 ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; text-align: left; white-space: normal; }
.fcdash-comments__metadata-tooltip strong, .fcdash-comments__metadata-tooltip span, .fcdash-comments__metadata-tooltip code { display: block; color: #202326; overflow-wrap: anywhere; }
.fcdash-comments__metadata-tooltip strong { font-family: system-ui, sans-serif; font-weight: 700; }
.fcdash-comments__metadata-tooltip strong:not(:first-child) { margin-top: 7px; }
.fcdash-comments__metadata-tooltip .fcdash-comments__metadata-preview { display: block; width: min(300px, calc(100vw - 38px)); height: auto; max-height: 190px; margin: 0; object-fit: contain; object-position: top center; border-radius: 5px; background: #fff; }
.fcdash-comments article { padding: 6px 0; }
.fcdash-comments__message-row { display: flex; align-items: flex-end; gap: 7px; width: 100%; }
.fcdash-comments__message-row.is-other-user { justify-content: flex-start; }
.fcdash-comments__message-row.is-current-user { justify-content: flex-end; }
.fcdash-comments__bubble { width: fit-content; max-width: min(86%, calc(100% - 39px)); padding: 10px 12px; border-radius: 14px; background: #eef3f6; color: #202326; }
.fcdash-comments .fcdash-comments__avatar { flex: 0 0 32px; display: inline-flex; align-items: center; justify-content: center; width: 32px; height: 32px; padding: 0; border: 0; border-radius: 50%; color: #4d5965; background: #e9eef2; font-size: 11px; font-weight: 700; letter-spacing: .02em; }
.fcdash-comments .fcdash-comments__avatar::after { display: none !important; }
.fcdash-comments .fcdash-comments__message-row.is-current-user .fcdash-comments__avatar { color: #fff; background: #007cab; }
.fcdash-comments__message-row.is-other-user .fcdash-comments__bubble { border-bottom-left-radius: 4px; }
.fcdash-comments__message-row.is-current-user .fcdash-comments__bubble { border-bottom-right-radius: 4px; background: #0798cf; color: #fff; }
.fcdash-comments__byline { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 8px; margin-bottom: 5px; font-size: 12px; }
.fcdash-comments__message-row.is-current-user .fcdash-comments__meta { color: rgba(255, 255, 255, .78); }
.fcdash-comments__message-row.is-current-user a { color: #fff; text-decoration-color: rgba(255, 255, 255, .65); }
.fcdash-comments__message-row.is-current-user code { color: rgba(255, 255, 255, .86); }
.fcdash-comments__bubble img { border-radius: 8px; background: #fff; }
.fcdash-comments article a, .fcdash-comments code { display: block; overflow-wrap: anywhere; font-size: 12px; }
.fcdash-comments__meta { color: #66717d; font-size: 12px; }
.fcdash-comments__message { white-space: pre-wrap; margin: 5px 0 0; }
.fcdash-comments .fcdash-comments__thread { display: block; text-align: left; width: 100%; margin: 8px 0; overflow-wrap: anywhere; }
.fcdash-comments form { margin-top: 12px; }
.fcdash-comments label { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }
.fcdash-comments__composer { position: relative; min-width: 0; }
.fcdash-comments textarea { width: 100%; height: 56px; min-height: 56px; max-height: 120px; box-sizing: border-box; overflow-y: auto; font: inherit; font-size: 16px; line-height: 1.45; color: inherit; background: #fff; border: 1px solid #b8c2cb; border-radius: 18px; margin: 0; padding: 15px 58px 15px 16px; resize: none; }
.fcdash-comments textarea:focus { border-color: #0099d8; outline: 2px solid rgba(0, 153, 216, .12); outline-offset: 0; }
.fcdash-comments .fcdash-comments__send { position: absolute; right: 8px; top: 50%; display: inline-flex; align-items: center; justify-content: center; width: 40px; height: 40px; padding: 0; transform: translateY(-50%); border: 0; border-radius: 50%; background: #0099d8; color: white; }
.fcdash-comments .fcdash-comments__send:hover, .fcdash-comments .fcdash-comments__send:focus { background: #007cab; color: white; }
.fcdash-comments .fcdash-comments__send:disabled { background: #d5d9df; color: #fff; opacity: 1; }
.fcdash-comments .fcdash-comments__send.is-sending:disabled { background: #0099d8; }
.fcdash-comments .fcdash-comments__send .fcdash-issue-reporter__toolbar-icon { width: 18px; height: 18px; }
.fcdash-comments__send-spinner { display: block; width: 18px; height: 18px; border: 2px solid rgba(255, 255, 255, .4); border-top-color: #fff; border-radius: 50%; animation: fcdash-comments-send-spin 760ms linear infinite; }
@keyframes fcdash-comments-send-spin { to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) { .fcdash-comments__send-spinner { animation: none; } }
.fcdash-comments.is-compose-only { width: min(620px, calc(100vw - 24px)); padding: 10px 12px 14px; overflow: visible; }
.fcdash-comments.is-compose-only header { min-height: 28px; }
.fcdash-comments.is-compose-only h2 { color: #66717d; font-size: 12px !important; font-weight: 600; line-height: 1.3; }
.fcdash-comments.is-compose-only .fcdash-comments__content { display: none; }
.fcdash-comments.is-compose-only form { margin-top: 2px; }
.fcdash-comments.is-compose-only .fcdash-comments__status:empty { display: none; }
.fcdash-comments__status { color: #b83c1e; overflow-wrap: anywhere; margin: 8px 0; }
.fcdash-comments--identity { width: min(420px, calc(100vw - 24px)); }
.fcdash-comments--identity .fcdash-comments__identity-intro { margin: 16px 0; color: #56616c; }
.fcdash-comments--identity .fcdash-comments__identity-form { display: grid; gap: 8px; margin-top: 0; }
.fcdash-comments--identity .fcdash-comments__identity-form label { position: static; width: auto; height: auto; padding: 0; margin: 4px 0 0; overflow: visible; clip: auto; white-space: normal; color: #303942; font-weight: 600; }
.fcdash-comments--identity .fcdash-comments__identity-form input { width: 100%; min-height: 44px; padding: 9px 11px; color: #202326; background: #fff; border: 1px solid #b8c2cb; border-radius: 6px; font: inherit; font-size: 16px; }
.fcdash-comments--identity .fcdash-comments__identity-form input:focus { border-color: #0099d8; outline: 2px solid rgba(0, 153, 216, .12); outline-offset: 0; }
.fcdash-comments--identity .fcdash-comments__identity-submit { justify-self: end; min-width: 96px; margin-top: 4px; color: #fff; background: #0099d8; border-color: #0099d8; }
.fcdash-comments--identity .fcdash-comments__identity-submit:hover, .fcdash-comments--identity .fcdash-comments__identity-submit:focus { color: #fff; background: #007cab; }
.fcdash-comments-menu { position: fixed; z-index: 2147483646; width: 224px; padding: 6px; border: 1px solid #d5d9df; border-radius: 6px; box-shadow: 0 8px 24px #0002; }
.fcdash-comments-menu[hidden], .fcdash-comments [hidden] { display: none !important; }
.fcdash-comments-menu button { display: block; width: 100%; text-align: left; border: 0; }
.fcdash-comments-menu .fcdash-tool-menu-toggle { display: flex; padding: 7px 8px; border-radius: 4px !important; }
.fcdash-comments-pin { position: fixed; z-index: 0; width: 32px; height: 32px; padding: 7px; border: 2px solid #fff; border-radius: 50%; background: #007cab; color: white; box-shadow: 0 2px 6px #0004; cursor: pointer; }
.fcdash-comments-pin svg { width: 100%; height: 100%; }

/* Prevent host-theme button and typography rules from changing Studio UI. */
.fcdash-comments,
.fcdash-comments-menu,
.fcdash-comments[class] :where(button, input, textarea, select, option),
.fcdash-comments-menu[class] :where(button, input, textarea, select, option) {
  font-family: ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important;
}

.fcdash-comments .fcdash-comments__metadata-trigger {
  border-radius: 4px !important;
}

.fcdash-comments .fcdash-comments__avatar,
.fcdash-comments .fcdash-comments__send,
.fcdash-issue-reporter.fcdash-comments-pins .fcdash-comments-pin {
  aspect-ratio: 1 / 1;
  border-radius: 50% !important;
}

.fcdash-issue-reporter.fcdash-comments-pins .fcdash-comments-pin {
  min-width: 32px;
  min-height: 32px;
}