.ff-vault-visibility {
  margin: 1rem 0;
  padding: .9rem 1rem;
  border: 2px solid #f0a500;
  border-radius: 10px;
  background: #fff8e6;
}

.ff-vault-visibility-title {
  margin: 0 0 .6rem;
  font-weight: 700;
  color: #111;
}

.ff-vault-visibility-options {
  display: flex;
  gap: .75rem;
  flex-wrap: wrap;
}

.ff-vault-radio {
  flex: 1 1 200px;
  display: flex;
  align-items: center;
  gap: .5rem;
  padding: .6rem .8rem;
  border: 2px solid #ddd;
  border-radius: 8px;
  cursor: pointer;
  background: #fff;
  transition: border-color .15s, background .15s;
}

.ff-vault-radio input {
  width: 18px;
  height: 18px;
  cursor: pointer;
}

.ff-vault-radio:has(input:checked) {
  border-color: #f0a500;
  background: #fff3d6;
}

.ff-vault-radio-yes:has(input:checked) {
  border-color: #28a745;
  background: #e9f9ee;
}

.ff-vault-radio-no:has(input:checked) {
  border-color: #6c757d;
  background: #f1f2f3;
}

.ff-vault-visibility-hint {
  display: block;
  margin-top: .5rem;
  color: #6c757d;
}

#ffVaultLoad:disabled {
  opacity: .5;
  cursor: not-allowed;
}
.ff-vault { max-width: 980px; margin: 0 auto; }
.ff-vault-card { background:#fff; border:1px solid rgba(0,0,0,.08); border-radius:8px; padding:1rem; box-shadow:0 10px 30px rgba(0,0,0,.05); }
.ff-vault-login { display:grid; gap:.75rem; margin:1rem 0; }
.ff-vault-provider { display:flex; flex-wrap:wrap; gap:.5rem; }
.ff-vault-provider button { display:inline-flex; align-items:center; justify-content:center; min-width:88px; height:38px; border-radius:6px; border:1px solid #ddd; background:#f8f9fa; color:#111; font-weight:700; cursor:pointer; }
.ff-vault-input { display:flex; gap:.5rem; }
.ff-vault-input input { flex:1; min-width:0; border:1px solid #ced4da; border-radius:6px; padding:.55rem .7rem; font-family:monospace; font-size:.82rem; }
.ff-vault-input button, .ff-vault-clear { border:0; border-radius:6px; padding:.55rem .9rem; background:#f49d16; color:#111; font-weight:800; cursor:pointer; }
.ff-vault-clear { background:#e9ecef; color:#333; }
.ff-vault-status { font-size:.9rem; color:#6c757d; min-height:22px; }
.ff-vault-processing { display:none; gap:.75rem; align-items:flex-start; margin:.8rem 0; padding:.85rem; border:1px solid #ffe0a3; border-radius:8px; background:#fff8e8; color:#5f3b00; }
.ff-vault-processing.is-active { display:flex; }
.ff-vault-spinner { width:32px; height:32px; border:4px solid #ffe0a3; border-top-color:#f49d16; border-radius:50%; animation:ffVaultSpin .85s linear infinite; flex:0 0 auto; }
.ff-vault-processing strong { display:block; color:#111; margin-bottom:.2rem; }
.ff-vault-processing a { color:#111; font-weight:800; text-decoration:underline; }
@keyframes ffVaultSpin { to { transform:rotate(360deg); } }
.ff-vault-public { display:flex; gap:.5rem; align-items:flex-start; margin:.1rem 0; color:#495057; font-size:.92rem; }
.ff-vault-public input { margin-top:.2rem; }
.ff-vault-summary { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:.65rem; margin:1rem 0; }
.ff-vault-stat { background:#171717; color:#fff; border-radius:8px; padding:.8rem; }
.ff-vault-stat span { display:block; color:#adb5bd; font-size:.72rem; text-transform:uppercase; font-weight:700; }
.ff-vault-stat strong { display:block; font-size:1.35rem; line-height:1.2; margin-top:.25rem; }
.ff-vault-categories { margin:1rem 0; border:1px solid #e9ecef; border-radius:8px; overflow:hidden; }
.ff-vault-categories h3 { margin:0; padding:.7rem .85rem; background:#f8f9fa; color:#111; font-size:1rem; font-weight:800; }
.ff-vault-categories table { width:100%; border-collapse:collapse; }
.ff-vault-categories th, .ff-vault-categories td { padding:.65rem .85rem; border-top:1px solid #e9ecef; text-align:left; }
.ff-vault-categories th { color:#6c757d; font-size:.72rem; text-transform:uppercase; }
.ff-vault-categories td { font-weight:700; }
.ff-vault-cache { display:none; margin:.75rem 0; padding:.65rem .8rem; border:1px solid #d1e7dd; border-radius:8px; background:#f0fff7; color:#0f5132; font-size:.9rem; }
.ff-vault-cache a { color:#0f5132; font-weight:800; }
.ff-vault-tools { display:grid; grid-template-columns:1fr 190px; gap:.6rem; margin:1rem 0; }
.ff-vault-tools input, .ff-vault-tools select { border:1px solid #ced4da; border-radius:6px; padding:.5rem .65rem; }
.ff-vault-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(210px,1fr)); gap:.75rem; }
.ff-vault-item { background:#222; color:#fff; border-radius:8px; padding:.7rem; display:grid; grid-template-columns:64px 1fr; gap:.7rem; align-items:center; min-height:90px; }
.ff-vault-item img { width:64px; height:64px; object-fit:contain; border-radius:6px; background:#111; }
.ff-vault-item strong { display:block; font-size:.92rem; line-height:1.2; }
.ff-vault-item small { display:block; color:#adb5bd; margin-top:.25rem; }
.ff-vault-badge { display:inline-block; border-radius:999px; padding:.12rem .45rem; margin-top:.35rem; background:#0ca678; color:#fff; font-size:.68rem; font-weight:800; }
.ff-vault-empty { border:1px dashed #ced4da; color:#6c757d; border-radius:8px; padding:1rem; text-align:center; }
.ff-vault-more { display:none; width:100%; margin-top:1rem; border:0; border-radius:6px; padding:.7rem .9rem; background:#111; color:#fff; font-weight:800; cursor:pointer; }
.ff-vault-login-required { background:#111; color:#fff; border-radius:8px; padding:1.2rem; margin-bottom:1rem; }
.ff-vault-login-required h2 { color:#fff; font-size:1.35rem; margin:0 0 .4rem; }
.ff-vault-login-required p { color:#d7d7d7; margin:0 0 1rem; }
.ff-vault-recent, .ff-vault-seo { max-width:980px; margin:1.25rem auto 0; }
.ff-vault-recent-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(210px,1fr)); gap:.75rem; }
.ff-vault-recent-card { display:block; border:1px solid #e9ecef; border-radius:8px; padding:.8rem; color:#111; text-decoration:none; background:#fff; }
.ff-vault-recent-card strong { display:block; font-size:1.05rem; }
.ff-vault-recent-card span { display:block; color:#6c757d; font-size:.86rem; margin-top:.2rem; }
.ff-vault-seo { color:#2b2b2b; line-height:1.65; }
.ff-vault-seo h2, .ff-vault-recent h2 { font-size:1.35rem; font-weight:800; color:#111; }
@media (max-width:720px) {
  .ff-vault-summary { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .ff-vault-tools, .ff-vault-input { grid-template-columns:1fr; display:grid; }
}