.project-actions .project-feedback-button { display: inline-flex; align-items: center; justify-content: center; gap: 10px; font: inherit; font-size: 14px; }
.project-feedback-button svg { width: 19px; height: 19px; flex: none; }
.project-feedback { margin: 24px 0; scroll-margin-top: 115px; }
.feedback-inline-toggle { display: inline-flex; align-items: center; gap: 16px; cursor: pointer; list-style: none; }
.feedback-inline-toggle::-webkit-details-marker { display: none; }
.project-feedback[open] .feedback-shell { margin-top: 18px; }
.feedback-shell { position: relative; padding: 28px 30px; color: var(--site-tone-f0edf5, #f5edee); border: 1px solid var(--site-tone-715369, #715356); border-radius: 16px; background: var(--site-tone-100b15, #150b0c); text-align: left; }
.feedback-heading { padding: 0 44px 20px 0; border-bottom: 1px solid var(--site-tone-4e3a50, #503a3c); margin-bottom: 20px; }
.feedback-heading h2 { font-size: 25px; font-weight: 400; line-height: 1.4; letter-spacing: -.02em; margin: 0 0 8px; text-align: left; }
.feedback-project-name { margin: 0 0 10px; font-size: 14px; line-height: 1.6; color: var(--site-tone-efb4d2, #efb4ba); overflow-wrap: anywhere; }
.feedback-intro { font-size: 13px; line-height: 1.8; color: var(--site-tone-b9aaba, #baaaac); margin: 0; max-width: none; }
.feedback-field { display: flex; flex-direction: column; min-width: 0; gap: 8px; }
.feedback-field > span { font-family: CenturyGothicBold, CenturyGothic, Arial, sans-serif; font-size: 14px; line-height: 1.6; }
.feedback-field textarea { display: block; width: 100%; min-height: 88px; max-height: 240px; resize: vertical; border: 1px solid var(--site-tone-4e3a50, #503a3c); border-radius: 9px; padding: 11px 13px; background: #0005; color: inherit; font: inherit; font-size: 14px; line-height: 1.8; transition: border-color .2s; }
.feedback-field textarea::placeholder { color: var(--site-tone-8e8899, #99888a); }
.feedback-field textarea:focus { outline: 2px solid var(--site-tone-d7889e40, #d7889040); outline-offset: 2px; border-color: var(--site-tone-d7889e, #d78890); }
.feedback-character-count { margin-top: -4px; text-align: right; color: var(--site-tone-ab9aaf, #af9a9c); font-size: 11px; line-height: 1.5; font-variant-numeric: tabular-nums; }
.feedback-rating { border: 0; padding: 16px 0 0; margin: 20px 0 0; border-top: 1px solid var(--site-tone-4e3a50, #503a3c); }
.feedback-rating legend { float: none; font-family: CenturyGothicBold, CenturyGothic, Arial, sans-serif; font-size: 14px; width: auto; margin: 0 0 12px; display: flex; align-items: baseline; flex-wrap: wrap; gap: 10px; padding: 0; }
.feedback-rating legend > span { font-family: CenturyGothic, Arial, sans-serif; font-size: 11px; color: var(--site-tone-ab9aaf, #af9a9c); }
.feedback-rating-options { grid-template-columns: repeat(10, minmax(0, 1fr)); gap: 6px; }
.feedback-rating-options span { min-height: 42px; font-size: 14px; }
.feedback-rating-note { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 10px; margin-top: 12px; }
.feedback-rating-note > label { display: inline-flex; align-items: center; gap: 7px; font-size: 12px; line-height: 1.7; color: var(--site-tone-cdbdd1, #d1bdbf); cursor: pointer; }
.feedback-rating-note input { width: 16px; height: 16px; accent-color: var(--site-tone-efb4d2, #efb4ba); margin: 0; }
.feedback-rating-note > small { font-size: 11px; color: var(--site-tone-ab9aaf, #af9a9c); line-height: 1.7; }
.feedback-footer { display: flex; align-items: center; justify-content: space-between; gap: 18px; margin-top: 22px; }
.feedback-footer > p { display: flex; align-items: flex-start; gap: 8px; font-size: 11px; line-height: 1.8; color: var(--site-tone-b9aaba, #baaaac); margin: 0; }
.feedback-footer > p > svg { width: 16px; height: 16px; flex: none; margin-top: 2px; }
.feedback-footer > p small { display: block; font-size: inherit; color: var(--site-tone-ab9aaf, #af9a9c); }
.feedback-submit.link-button, .feedback-success .link-button { display: inline-flex; align-items: center; justify-content: center; gap: 10px; border: 1px solid var(--site-tone-e4a0cc, #e4a0a7); border-radius: 9px; background: var(--site-tone-e4a0cc, #e4a0a7); color: #1c1012; padding: 13px 18px; min-height: 46px; font: 14px CenturyGothicBold, CenturyGothic, Arial, sans-serif; cursor: pointer; white-space: nowrap; }
.feedback-submit svg { width: 18px; height: 18px; }
.feedback-submit:disabled { opacity: .6; cursor: wait; }
.feedback-close { position: absolute; top: 20px; right: 20px; display: flex; align-items: center; justify-content: center; width: 38px; height: 38px; border: 1px solid var(--site-tone-4e3a50, #503a3c); border-radius: 50%; color: var(--site-tone-cdbdd1, #d1bdbf); background: #0003; cursor: pointer; }
.feedback-close svg { width: 18px; height: 18px; }
.feedback-close:hover { border-color: var(--site-tone-efb4d2, #efb4ba); color: #fff; }
.feedback-submit:hover, .feedback-success .link-button:hover { filter: brightness(1.1); }
.feedback-shell button:focus-visible { outline: 2px solid var(--site-tone-efb4d2, #efb4ba); outline-offset: 3px; }
.feedback-message { color: #b7e8cd; padding: 12px 15px; background: #0c211a99; border: 1px solid #426558; border-radius: 9px; font-size: 13px; line-height: 1.8; overflow-wrap: anywhere; margin: 18px 0 0; }
.feedback-message:empty { display: none; }
.feedback-message.is-error { color: var(--site-tone-efa6c6, #efa6ad); background: var(--site-tone-39102133, #39101433); border-color: var(--site-tone-9e6b8d, #9e6b70); }
.feedback-trap { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); pointer-events: none; }
.feedback-dialog { width: min(680px, calc(100vw - 40px)); max-width: none; max-height: calc(100svh - 48px); padding: 0; border: 0; border-radius: 16px; background: transparent; color: inherit; overscroll-behavior: contain; scrollbar-width: thin; scrollbar-color: #93545d transparent; }
.feedback-dialog::backdrop { background: #000b; backdrop-filter: blur(5px); }
.feedback-dialog[open] { animation: feedback-appear .24s ease-out; }
.feedback-modal-open { overflow: hidden !important; }
.feedback-success { padding: 28px 0 14px; text-align: center; }
.feedback-success-icon { display: inline-flex; align-items: center; justify-content: center; width: 58px; height: 58px; border: 1px solid #426558; background: #0c211a99; color: #b7e8cd; border-radius: 50%; font-size: 26px; margin-bottom: 20px; }
.feedback-success h3 { font-size: 25px; font-weight: 400; margin: 0 0 14px; }
.feedback-success p { font-size: 14px; line-height: 1.9; color: var(--site-tone-b9aaba, #baaaac); margin: 0 0 24px; }
.feedback-shell [hidden] { display: none !important; }
.feedback-identity.comment-editor-identity { width: 100%; margin-bottom: 20px; }
.feedback-identity-label { display: flex; align-items: baseline; flex-wrap: wrap; gap: 10px; font: 14px CenturyGothicBold, CenturyGothic, Arial, sans-serif; margin-bottom: 8px; }
.feedback-identity-label > small, .feedback-review-field > span > small { font: 11px CenturyGothic, Arial, sans-serif; color: var(--site-tone-ab9aaf, #af9a9c); margin-left: 4px; }
.feedback-identity .comment-name-control input { flex: 1; width: 100%; min-width: 0; min-height: 38px; padding: 7px 4px; border: 0; outline: none; background: transparent; color: inherit; font: inherit; font-size: 14px; }
.feedback-identity .comment-name-control input::placeholder { color: var(--site-tone-8e8899, #99888a); }
.feedback-identity .comment-identity-avatar { position: relative; }
.feedback-identity.comment-editor-identity .comment-identity-avatar > fieldset { width: 310px; max-width: calc(100vw - 80px); }
.feedback-review-field textarea { min-height: 138px; }
.feedback-media-tools.comment-media-tools { margin-top: 8px; gap: 10px; }
.feedback-media-tools .comment-media-picker { position: relative; }
.feedback-media-tools .comment-media-picker > summary { font-size: 13px; }
.feedback-media-tools .feedback-emoji-picker, .feedback-media-tools .feedback-sticker-picker { flex: none; width: 46px; }
.feedback-media-tools .feedback-emoji-picker > summary, .feedback-media-tools .feedback-sticker-picker > summary { width: 44px; height: 44px; min-height: 44px; padding: 0; justify-content: center; }
.feedback-media-tools .feedback-emoji-picker > summary > svg, .feedback-media-tools .feedback-sticker-picker > summary > svg { width: 20px; height: 20px; }
.feedback-media-tools .comment-media-count { flex-basis: auto; align-self: center; font-size: 11px; }
.feedback-media-tools .comment-media-picker > fieldset { width: 310px; max-width: calc(100vw - 80px); }
.feedback-media-tools .comment-selected-stickers { gap: 10px; }
.feedback-media-tools .comment-selected-sticker { width: 88px; height: 88px; }
.feedback-emoji-grid { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 5px; position: absolute; bottom: calc(100% + 10px); left: 0; z-index: 14; width: 288px; max-width: calc(100vw - 80px); border: 1px solid var(--site-tone-715369, #715356); border-radius: 12px; padding: 12px; background: var(--site-tone-100b15, #150b0c); box-shadow: 0 12px 35px #000a; }
.feedback-emoji-grid button { display: flex; justify-content: center; align-items: center; border: 0; border-radius: 7px; min-height: 38px; padding: 4px; background: transparent; font-size: 23px; cursor: pointer; }
.feedback-emoji-grid button:hover { background: var(--site-tone-39102133, #39101433); }
.feedback-survey { margin-top: 22px; border: 1px solid var(--site-tone-4e3a50, #503a3c); border-radius: 10px; background: #0003; }
.feedback-survey > summary { display: flex; align-items: center; gap: 11px; padding: 14px 16px; cursor: pointer; list-style: none; font-size: 14px; color: var(--site-tone-ead8e7, #ead8da); }
.feedback-survey > summary::-webkit-details-marker { display: none; }
.feedback-survey > summary > svg { width: 22px; height: 22px; flex: none; color: var(--site-tone-efb4d2, #efb4ba); }
.feedback-survey > summary > span > small { display: block; font-size: 11px; line-height: 1.7; color: var(--site-tone-ab9aaf, #af9a9c); margin-top: 3px; }
.feedback-survey-chevron { margin-left: auto; transition: transform .2s; }
.feedback-survey[open] .feedback-survey-chevron { transform: rotate(180deg); }
.feedback-survey > summary:focus-visible { outline: 2px solid var(--site-tone-efb4d2, #efb4ba); outline-offset: 3px; border-radius: 10px; }
.feedback-survey-body { padding: 0 16px 16px; }
.feedback-survey-body > fieldset { border: 0; padding: 16px 0 0; margin: 0; min-width: 0; border-top: 1px solid var(--site-tone-4e3a50, #503a3c); }
.feedback-survey-body > fieldset + fieldset { margin-top: 18px; }
.feedback-survey-body legend { float: none; width: auto; max-width: 100%; overflow-wrap: anywhere; padding: 0; margin-bottom: 12px; font: 13px CenturyGothicBold, CenturyGothic, Arial, sans-serif; }
.feedback-survey-options { display: flex; flex-wrap: wrap; gap: 8px; }
.feedback-survey-options > label { position: relative; max-width: 100%; cursor: pointer; }
.feedback-survey-options input { position: absolute; width: 1px; height: 1px; clip-path: inset(50%); }
.feedback-survey-options span { display: flex; align-items: center; min-height: 40px; padding: 8px 12px; border: 1px solid var(--site-tone-4e3a50, #503a3c); border-radius: 8px; font-size: 12px; line-height: 1.5; overflow-wrap: anywhere; color: var(--site-tone-cdbdd1, #d1bdbf); }
.feedback-survey-options input:checked + span { border-color: var(--site-tone-e4a0cc, #e4a0a7); background: var(--site-tone-5c2c4e88, #5c2c3188); color: #fff; }
.feedback-survey-options input:focus-visible + span { outline: 2px solid var(--site-tone-efb4d2, #efb4ba); outline-offset: 2px; }
.feedback-survey-skip { display: flex; align-items: center; gap: 6px; margin-top: 12px; font-size: 11px; color: var(--site-tone-ab9aaf, #af9a9c); }
.feedback-survey-skip input { margin: 0; accent-color: var(--site-tone-efb4d2, #efb4ba); }
@keyframes feedback-appear { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: translateY(0); } }
@media(max-width:575px) { .feedback-dialog { width: calc(100vw - 24px); max-height: calc(100svh - 28px); border-radius: 14px; } .feedback-shell { padding: 24px 20px; border-radius: 14px; } .feedback-heading { padding-right: 24px; } .feedback-heading h2 { font-size: 23px; } .feedback-project-name { font-size: 13px; } .feedback-close { top: 15px; right: 15px; width: 34px; height: 34px; } .feedback-field textarea, .feedback-identity .comment-name-control input { font-size: 16px; } .feedback-rating-options { grid-template-columns: repeat(5, minmax(0, 1fr)); } .feedback-footer { flex-direction: column; align-items: stretch; gap: 16px; } .feedback-media-tools .comment-media-count { flex-basis: 100%; } .feedback-media-tools .feedback-sticker-picker, .feedback-media-tools .feedback-emoji-picker { position: static; } .feedback-survey > summary { font-size: 13px; padding: 12px; } .feedback-survey-body { padding: 0 12px 14px; } }
@media(prefers-reduced-motion:reduce) { .feedback-dialog[open] { animation: none; } .feedback-field textarea { transition: none; } }
.feedback-owner-note, .feedback-survey-change { color: var(--site-tone-efb4d2, #efb4ba); font-size: 12px; line-height: 1.8; margin: 0 0 16px; }
.feedback-images { margin-top: 10px; }
.feedback-image-upload { position: relative; display: inline-flex; align-items: center; gap: 8px; padding: 10px 12px; margin: 0; border: 1px solid var(--site-tone-4e3a50, #503a3c); border-radius: 8px; font-size: 12px; cursor: pointer; background: #0003; overflow: hidden; }
.feedback-image-upload svg { width: 19px; height: 19px; flex: none; }
.feedback-image-upload-icon { flex: none; width: 46px; height: 46px; padding: 0; align-items: center; justify-content: center; border-radius: 9px; }
.feedback-image-upload-icon:hover { border-color: var(--site-tone-efb4d2, #efb4ba); }
.feedback-image-upload input { position: absolute; inset: 0; width: 100%; height: 100%; opacity: 0; cursor: pointer; }
.feedback-image-upload:focus-within { outline: 2px solid var(--site-tone-efb4d2, #efb4ba); outline-offset: 3px; }
.feedback-image-upload:has(input:disabled) { opacity: .5; cursor: default; }
.feedback-image-hint { color: var(--site-tone-ab9aaf, #af9a9c); font-size: 11px; line-height: 1.8; margin: 10px 0 0; }
.feedback-image-previews { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 10px; }
.feedback-image-previews:has(> *) { margin-top: 12px; }
.feedback-image-preview { position: relative; min-width: 0; border: 1px solid var(--site-tone-4e3a50, #503a3c); border-radius: 9px; overflow: hidden; background: #0005; }
.feedback-image-preview > a { display: block; }
.feedback-image-preview img { width: 100%; aspect-ratio: 4/3; display: block; object-fit: cover; }
.feedback-image-preview button { position: absolute; top: 6px; right: 6px; display: grid; place-items: center; width: 29px; height: 29px; padding: 0; border: 1px solid #e4a0a780; border-radius: 50%; background: #180c0de8; color: #fff; font: 22px/1 Arial,sans-serif; cursor: pointer; }
.feedback-image-keep { display: flex; align-items: center; gap: 6px; padding: 8px; color: #d1bdbf; font-size: 11px; }
.feedback-images-enhanced .feedback-image-keep { display: none; }
.feedback-survey-body legend > small { display: block; color: var(--site-tone-ab9aaf, #af9a9c); font: 11px CenturyGothic,Arial,sans-serif; line-height: 1.8; margin-top: 4px; }
.feedback-survey-clear { display: inline-flex; border: 0; padding: 0; margin-top: 12px; background: transparent; color: var(--site-tone-ab9aaf, #af9a9c); font: 11px/1.8 CenturyGothic,Arial,sans-serif; text-decoration: underline; text-underline-offset: 3px; cursor: pointer; }
.feedback-survey-clear:hover { color: #fff; }
.feedback-success-actions { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 18px; margin-top: 28px; }
.feedback-success-actions .link-button { margin: 0; }
.feedback-return-link { color: var(--site-tone-cdbdd1, #d1bdbf); font: 13px/1.8 CenturyGothic,Arial,sans-serif; background: none; border: 0; padding: 4px; text-decoration: underline; text-underline-offset: 4px; cursor: pointer; }
.feedback-return-link:hover { color: #fff; }
@media(max-width:575px) { .feedback-image-previews { gap: 6px; } .feedback-success-actions { flex-direction: column; } }