/* Blog popup (feedback + download) — bottom-right button + tabbed dialog */
#fb-open {
  position: fixed; right: 22px; bottom: 22px; z-index: 9990;
  width: 52px; height: 52px; border-radius: 50%; border: none; cursor: pointer;
  background: #e63946; color: #fff; display: flex; align-items: center; justify-content: center;
  box-shadow: 0 6px 20px rgba(230, 57, 70, .4);
  transition: transform .15s ease, box-shadow .15s ease;
}
#fb-open:hover { transform: scale(1.08); box-shadow: 0 8px 26px rgba(230, 57, 70, .5); }

#fb-overlay {
  position: fixed; inset: 0; z-index: 9991;
  background: rgba(10, 10, 20, .45);
  display: flex; align-items: flex-end; justify-content: flex-end;
  padding: 22px;
}
#fb-overlay[hidden] { display: none; }

#fb-dialog {
  position: relative;
  width: 400px; max-width: 100%;
  background: #fff; border-radius: 14px; padding: 20px 24px 22px;
  box-shadow: 0 18px 60px rgba(0, 0, 0, .28);
  animation: fb-in .22s ease;
  max-height: calc(100vh - 44px); overflow-y: auto;
}
@keyframes fb-in { from { opacity: 0; transform: translateY(14px); } to { opacity: 1; transform: none; } }

#fb-close {
  position: absolute; top: 10px; right: 12px; z-index: 2;
  background: none; border: none; font-size: 26px; line-height: 1;
  color: #94a3b8; cursor: pointer;
}
#fb-close:hover { color: #334155; }

/* Tabs */
.fb-tabs {
  display: flex; gap: 4px; margin-bottom: 16px; padding-right: 30px;
  border-bottom: 1px solid #e2e8f0;
}
.fb-tab {
  flex: 1; background: none; border: none; cursor: pointer;
  padding: 8px 4px 10px; font: inherit; font-size: 14.5px; font-weight: 600;
  color: #64748b; border-bottom: 2.5px solid transparent; margin-bottom: -1px;
  transition: color .12s ease;
}
.fb-tab:hover { color: #334155; }
.fb-tab-active { color: #e63946; border-bottom-color: #e63946; }

.fb-title { margin: 0 0 4px; font-size: 19px; font-weight: 700; color: #0f172a; }
.fb-sub { margin: 0 0 14px; font-size: 13.5px; color: #64748b; }

/* Feedback form */
#fb-form label { display: block; font-size: 13px; font-weight: 600; color: #334155; margin-bottom: 12px; }
.fb-opt { font-weight: 400; color: #94a3b8; }
#fb-form input, #fb-form textarea {
  display: block; width: 100%; box-sizing: border-box; margin-top: 5px;
  border: 1px solid #e2e8f0; border-radius: 8px; padding: 9px 11px;
  font: inherit; font-size: 14px; color: #0f172a; background: #f8fafc;
}
#fb-form input:focus, #fb-form textarea:focus {
  outline: none; border-color: #e63946; background: #fff;
  box-shadow: 0 0 0 3px rgba(230, 57, 70, .12);
}
#fb-form textarea { resize: vertical; min-height: 96px; }

.fb-actions { text-align: right; margin-top: 4px; }
.fb-submit {
  background: #e63946; color: #fff; border: none; border-radius: 8px;
  padding: 10px 22px; font: inherit; font-size: 14px; font-weight: 600;
  cursor: pointer; transition: background .15s ease;
}
.fb-submit:hover { background: #d32836; }
.fb-submit:disabled { opacity: .6; cursor: default; }

#fb-thanks { text-align: center; padding: 26px 8px 14px; }
#fb-thanks p { margin: 12px 0 0; font-size: 15px; color: #0f172a; }

/* Download pane */
.fb-dl-list { list-style: none; margin: 0 0 18px; padding: 0; }
.fb-dl-list li {
  display: flex; align-items: center; gap: 9px;
  font-size: 14px; color: #334155; padding: 5px 0;
}
.fb-dl-list svg { flex-shrink: 0; }
.fb-dl-btn {
  display: flex; align-items: center; justify-content: center; gap: 9px;
  background: #e63946; color: #fff; text-decoration: none;
  border-radius: 9px; padding: 12px 20px;
  font-size: 15px; font-weight: 700;
  transition: background .15s ease, transform .12s ease;
}
.fb-dl-btn:hover { background: #d32836; transform: translateY(-1px); }
.fb-dl-note { margin: 12px 0 0; font-size: 12.5px; color: #94a3b8; text-align: center; }

@media (max-width: 640px) {
  #fb-open { right: 14px; bottom: 14px; width: 46px; height: 46px; }
  #fb-overlay { padding: 12px; align-items: flex-end; }
  #fb-dialog { width: 100%; }
}
