/* Monatlicher Forum-Bonus im eigenen Profil. Keine globalen Styles. */
.ctf-wrap .ctf-fbonus{
  position:relative;
  overflow:hidden;
  padding:24px;
  border:1px solid #d5e3f2;
  border-radius:18px;
  background:linear-gradient(122deg,#fff 0%,#f4f8ff 68%,#edf5ff 100%);
  color:#15263e;
  box-shadow:0 14px 36px rgba(17,47,86,.08);
}
.ctf-wrap .ctf-fbonus:before{
  content:"";position:absolute;right:-84px;top:-104px;width:240px;height:240px;
  border-radius:50%;background:radial-gradient(circle,rgba(48,133,228,.12),transparent 72%);pointer-events:none
}
.ctf-fbonus-head{display:flex;justify-content:space-between;align-items:flex-start;gap:20px;position:relative}
.ctf-fbonus-head h2{margin:6px 0 5px!important;font-size:23px!important;line-height:1.25}
.ctf-fbonus-head p{margin:0!important;font-size:13px;line-height:1.55;color:#586e88}
.ctf-fbonus-kicker{display:block;color:#476aa3;font-size:10px;font-weight:850;letter-spacing:.12em;text-transform:uppercase}
.ctf-fbonus-coins{display:flex;flex-direction:column;align-items:flex-end;min-width:94px;line-height:1.1;white-space:nowrap}
.ctf-fbonus-coins strong{font-size:35px;line-height:1.05;letter-spacing:-.04em;color:#174b8f}
.ctf-fbonus-coins span{font-size:12px;font-weight:800;color:#325a8f}
.ctf-fbonus-coins small{font-size:11px;color:#5c738e;margin-top:4px}
.ctf-fbonus-meta{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;align-items:center;margin:24px 0 12px;font-size:13px}
.ctf-fbonus-meta strong{font-weight:800;color:inherit}
.ctf-fbonus-meta span{color:#426a9c}
.ctf-fbonus-track{height:15px;overflow:hidden;border-radius:100px;background:#dbe7f6;border:1px solid #c8d9ed;box-shadow:inset 0 2px 4px rgba(20,49,88,.08)}
.ctf-fbonus-fill{height:100%;min-width:0;border-radius:100px;background:linear-gradient(90deg,#2199dc,#2866cf 75%,#674bcd);box-shadow:0 1px 8px rgba(36,114,215,.22);transform-origin:left center;animation:ctf-fbonus-reveal .75s ease-out both;transition:width .45s ease}
@keyframes ctf-fbonus-reveal{from{transform:scaleX(0)}to{transform:scaleX(1)}}
.ctf-fbonus-steps{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:7px;margin:13px 0 0}
.ctf-fbonus-step{display:flex;flex-direction:column;gap:4px;min-width:0;padding:9px 7px;border:1px solid #dce7f3;border-radius:10px;background:rgba(255,255,255,.74);text-align:center;opacity:.77}
.ctf-fbonus-step b{font-size:12px;color:#3c5573}
.ctf-fbonus-step small{font-size:11px;color:#617a98}
.ctf-fbonus-step.is-reached{opacity:1;border-color:#a7d5c0;background:#e8f8ee}
.ctf-fbonus-step.is-reached b,.ctf-fbonus-step.is-reached small{color:#17633d}
.ctf-fbonus-footer{display:flex;justify-content:space-between;gap:12px;align-items:flex-end;margin-top:18px}
.ctf-fbonus-footer small{color:#60758e;line-height:1.5;max-width:470px;font-size:11px}
.ctf-fbonus-footer a{flex:none;font-size:12px;font-weight:850;text-decoration:none!important;color:#205fa9!important}
.ctf-fbonus-footer a:hover{text-decoration:underline!important}
.ctf-wrap.ctf-forum-dark .ctf-fbonus,.ctf-forum-dark-enabled .ctf-fbonus{
  background:linear-gradient(120deg,#122638,#132b44 70%,#202348)!important;
  color:#ebf3ff!important;border-color:#33506b!important;
  box-shadow:0 16px 40px rgba(0,0,0,.2)
}
.ctf-wrap.ctf-forum-dark .ctf-fbonus-head h2,.ctf-forum-dark-enabled .ctf-fbonus-head h2{color:#f3f8ff!important}
.ctf-wrap.ctf-forum-dark .ctf-fbonus-head p,.ctf-wrap.ctf-forum-dark .ctf-fbonus-coins small,
.ctf-wrap.ctf-forum-dark .ctf-fbonus-footer small,.ctf-forum-dark-enabled .ctf-fbonus-head p{color:#b5c7de!important}
.ctf-wrap.ctf-forum-dark .ctf-fbonus-kicker,.ctf-forum-dark-enabled .ctf-fbonus-kicker{color:#9cbfff!important}
.ctf-wrap.ctf-forum-dark .ctf-fbonus-coins strong,.ctf-wrap.ctf-forum-dark .ctf-fbonus-coins span{color:#b4ddff!important}
.ctf-wrap.ctf-forum-dark .ctf-fbonus-meta span{color:#b6d1f1}
.ctf-wrap.ctf-forum-dark .ctf-fbonus-track{background:#0d1e30;border-color:#36516e}
.ctf-wrap.ctf-forum-dark .ctf-fbonus-step{background:#193249;border-color:#3c5670;opacity:.9}
.ctf-wrap.ctf-forum-dark .ctf-fbonus-step b,.ctf-wrap.ctf-forum-dark .ctf-fbonus-step small{color:#c0d0e5}
.ctf-wrap.ctf-forum-dark .ctf-fbonus-step.is-reached{background:#153d35;border-color:#3e8065}
.ctf-wrap.ctf-forum-dark .ctf-fbonus-step.is-reached b,.ctf-wrap.ctf-forum-dark .ctf-fbonus-step.is-reached small{color:#a7f2cd}
.ctf-wrap.ctf-forum-dark .ctf-fbonus-footer a{color:#b1d8ff!important}
@media(max-width:650px){
  .ctf-wrap .ctf-fbonus{padding:18px;border-radius:14px}
  .ctf-fbonus-head h2{font-size:20px!important}
  .ctf-fbonus-coins strong{font-size:29px}
  .ctf-fbonus-meta{margin-top:18px;gap:5px;flex-direction:column;align-items:flex-start}
  .ctf-fbonus-footer{align-items:flex-start;flex-direction:column}
  .ctf-fbonus-step{padding:9px 4px}
  .ctf-fbonus-step b{font-size:11px}
  .ctf-fbonus-step small{font-size:10px}
}
@media(prefers-reduced-motion:reduce){.ctf-fbonus-fill{animation:none;transition:none}}


/* Admins/Moderatoren sehen den Fortschritt, aber bekommen keine Coins. */
.ctf-wrap .ctf-fbonus-team-note{max-width:520px;margin:12px 0 0!important;padding:10px 12px;border:1px solid #b8d3ef;border-radius:9px;background:#eaf4ff;color:#234e7e!important;font-size:12px;line-height:1.5}
.ctf-wrap.ctf-forum-dark .ctf-fbonus-team-note,.ctf-forum-dark-enabled .ctf-fbonus-team-note{background:#1e3b5a;border-color:#3c628a;color:#d4e6ff!important}