.feedback-open { display:flex; align-items:center; justify-content:space-between; gap:12px; width:calc(100% - 40px); min-height:44px; padding:10px 12px; margin:0 20px; border:1px solid var(--border-strong); border-radius:6px; color:var(--text-soft); background:var(--surface); font:400 13px var(--font-body); white-space:nowrap; cursor:pointer; }
.feedback-open:hover { color:var(--blue); border-color:var(--blue); background:var(--blue-soft); }
.feedback-open:active { background:var(--blue-soft); }
.feedback-primary:hover { background:#0e5cda; }
.feedback-primary:active { background:#114caa; }
.feedback-dialog { width:calc(100% - 32px); max-width:540px; max-height:calc(100dvh - 32px); margin:auto; padding:24px; border:1px solid var(--border-strong); border-radius:12px; background:var(--surface); color:var(--text); overflow-y:auto; overscroll-behavior:contain; box-shadow:0 20px 70px #0003; }
.feedback-dialog::backdrop { background:rgb(7 17 32 / 48%); }
html:has(.feedback-dialog[open]) { overflow:hidden; }
.feedback-head { display:flex; align-items:flex-start; justify-content:space-between; gap:12px; }
.feedback-kicker { color:var(--blue); font-size:12px; margin:0 0 8px; }
.feedback-head h2 { font-size:24px; line-height:1.4; margin:0; letter-spacing:-.5px; }
.feedback-close { flex:none; display:grid; place-items:center; width:40px; height:40px; border:1px solid var(--border); border-radius:6px; color:var(--text-soft); background:var(--surface); font-size:26px; cursor:pointer; }
.feedback-intro { color:var(--text-soft); font-size:14px; line-height:1.7; margin:12px 0 18px; }
.feedback-types { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; border:0; margin:0 0 18px; padding:0; }
.feedback-types legend { margin-bottom:10px; font-size:14px; font-weight:600; }
.feedback-types label { display:flex; align-items:center; gap:8px; padding:11px 12px; min-height:44px; border:1px solid var(--border-strong); border-radius:6px; font-size:13px; cursor:pointer; }
.feedback-types label:has(:checked) { background:var(--blue-soft); border-color:var(--blue); color:var(--blue); }
.feedback-types input { accent-color:var(--blue); margin:0; }
.feedback-field { display:grid; gap:8px; margin:0 0 14px; font-size:14px; font-weight:600; }
.feedback-field small { margin-left:6px; color:var(--text-soft); font-size:12px; font-weight:400; }
.feedback-field input,.feedback-field textarea { width:100%; min-width:0; border:1px solid var(--border-strong); border-radius:6px; padding:11px 12px; background:var(--surface-subtle); color:var(--text); font:400 16px/1.6 var(--font-body); }
.feedback-field textarea { resize:vertical; min-height:112px; max-height:260px; }
.feedback-field input::placeholder,.feedback-field textarea::placeholder { color:var(--text-soft); font-size:13px; }
.feedback-dialog :focus-visible,.feedback-open:focus-visible { outline:2px solid var(--blue); outline-offset:3px; }
.feedback-privacy { margin:2px 0 20px; color:var(--text-soft); font-size:12px; line-height:1.7; }
.feedback-actions { display:flex; align-items:center; justify-content:space-between; gap:12px; border-top:1px solid var(--border); padding-top:18px; }
.feedback-actions>span { font-size:12px; color:var(--text-soft); }
.feedback-primary { border:1px solid #1769e8; border-radius:6px; padding:12px 22px; min-height:44px; background:#1769e8; color:#fff; font:600 14px var(--font-body); cursor:pointer; white-space:nowrap; }
.feedback-primary:disabled { opacity:.65; cursor:wait; }
.feedback-error { padding:12px; color:var(--red); background:var(--red-soft); border-radius:6px; font-size:13px; line-height:1.7; }
.feedback-trap { position:absolute; width:1px; height:1px; clip-path:inset(50%); overflow:hidden; }
.feedback-success { text-align:center; padding:18px 0 6px; }
.feedback-success-mark { display:grid; place-items:center; width:48px; height:48px; margin:0 auto 20px; border-radius:50%; background:var(--blue-soft); color:var(--blue); font-size:24px; }
.feedback-success h3 { font-size:22px; margin:0 0 12px; }
.feedback-success p { font-size:14px; color:var(--text-soft); line-height:1.8; }
#feedback-reference { font-family:var(--font-numeric); font-size:12px; margin-bottom:24px; }
@media(max-width:1199px) {
  /* Keep the trigger in normal flow: backdrop-filter on the sidebar traps fixed descendants. */
  .page-heading:has(.feedback-open) { display:grid; grid-template-columns:minmax(0,1fr) auto; align-items:center; gap:4px 12px; }
  .page-heading > .feedback-open { grid-column:2; grid-row:1 / span 2; width:auto; margin:0; }
  .page-heading:has(.feedback-open) > h1 { grid-column:1; grid-row:1; }
  .page-heading:has(.feedback-open) > p { grid-column:1; grid-row:2; max-width:none; text-align:left; margin:0; }
}
@media(max-width:639px) {
  .feedback-dialog { padding:22px 18px; max-height:calc(100dvh - 20px); width:calc(100% - 20px); border-radius:10px; }
  .feedback-head h2 { font-size:21px; }
  .feedback-intro { margin-bottom:18px; font-size:13px; }
  .feedback-types label { padding:10px 8px; font-size:12px; }
  .page-heading > .feedback-open { padding:10px; gap:8px; }
}

.feedback-context-details { margin:0 0 18px; font-size:13px; color:var(--text-soft); }
.feedback-context-details summary { cursor:pointer; line-height:1.8; padding:5px 0; }
.feedback-context-details summary span { margin-left:6px; font-size:12px; }
.feedback-context-details[open] .feedback-field { margin-top:12px; }
.feedback-verification { margin:0 0 18px; min-width:0; }
#feedback-challenge { min-width:0; }
#feedback-verification-state { margin:8px 0; font-size:12px; line-height:1.7; color:var(--text-soft); }
.feedback-verification-retry { min-height:44px; padding:8px 12px; border:1px solid var(--border-strong); border-radius:6px; background:var(--surface); color:var(--blue); font:inherit; font-size:13px; cursor:pointer; }