.noabase-feedback-nav { display: flex; align-items: center; gap: 8px; }
#feedback-open { display: inline-flex; flex: 0 0 32px; align-items: center; justify-content: center; width: 32px; height: 32px; min-height: 0; padding: 5px; margin: 0; border: 0; border-radius: 6px; background: transparent; color: #222b38; box-shadow: none; cursor: pointer; }
#feedback-open svg { width: 20px; height: 20px; }
#feedback-open:hover { background: #f0f2f5; color: #222b38; }
#feedback-open:focus-visible { outline: 2px solid #7256d8; outline-offset: 2px; }
/* 送信ボタンなどの色は、そのページのアクセント色に合わせる(data-app は feedback.js が付ける)。ページが --noabase-accent を決めていればそれを使う。 */
#feedback-dialog { --feedback-accent: #7256d8; --feedback-link: #4d3a9c; }
#feedback-dialog[data-app="home"] { --feedback-accent: #215e52; --feedback-link: #215e52; }
#feedback-dialog[data-app="pdf"] { --feedback-accent: #253247; --feedback-link: #253247; }
#feedback-dialog[data-app="thumbnail"] { --feedback-accent: #2563c5; --feedback-link: #2563c5; }
#feedback-dialog { position: fixed; inset: auto; box-sizing: border-box; width: min(320px, calc(100vw - 16px)); max-width: none; max-height: calc(100dvh - 32px); height: fit-content; min-height: 0; overflow: auto; margin: 0; padding: 14px; border: 1px solid #dfe4eb; border-radius: 12px; background: white; color: #222b38; font: 14px/1.6 system-ui, sans-serif; box-shadow: 0 8px 28px #17233726; }
#feedback-dialog::backdrop { background: transparent; pointer-events: none; }
#feedback-dialog * { box-sizing: border-box; }
#feedback-dialog header { position: static; display: flex; align-items: center; justify-content: space-between; gap: 12px; width: auto; height: auto; min-height: 0; margin: 0 0 12px; padding: 0; border: 0; background: transparent; }
#feedback-dialog h2 { margin: 0; padding: 0; color: inherit; font: 600 15px/1.5 system-ui, sans-serif; }
#feedback-dialog button { font-family: inherit; cursor: pointer; }
#feedback-close { display: inline-flex; align-items: center; justify-content: center; flex: 0 0 28px; padding: 0; width: 28px; height: 28px; min-height: 0; border: 0; border-radius: 4px; background: transparent; color: inherit; font-size: 24px; line-height: 1; }
#feedback-form { display: block; margin: 0; padding: 0; }
#feedback-dialog label { display: block; color: inherit; font-size: 13px; font-weight: 500; margin: 14px 0 6px; }
#feedback-dialog :is(select,textarea) { display: block; width: 100%; max-width: none; height: auto; border: 1px solid #d5dbe3; border-radius: 6px; padding: 9px; margin: 0; background: white; color: inherit; font: inherit; }
#feedback-dialog #feedback-message { resize: vertical; height: 120px; min-height: 100px; }
#feedback-status { font: 13px/1.6 system-ui, sans-serif; margin: 12px 0; color: inherit; }
#feedback-dialog .feedback-actions { display: flex; justify-content: flex-end; }
#feedback-dialog #feedback-turnstile:not(:empty) { margin: 10px 0 0; }
#feedback-send { width: auto; padding: 9px 18px; border: 0; border-radius: 6px; background: var(--noabase-accent, var(--feedback-accent)); color: white; font-size: 14px; line-height: 1.5; }
#feedback-send:disabled { opacity: .6; cursor: wait; }
#feedback-dialog .feedback-privacy { margin: 8px 0 0; font: 13px/1.6 system-ui, sans-serif; }
#feedback-dialog .feedback-privacy a { color: var(--feedback-link); text-decoration: underline; text-underline-offset: 3px; }
#feedback-dialog .feedback-privacy a:focus-visible { outline: 2px solid var(--feedback-accent); outline-offset: 3px; border-radius: 2px; }
