/* =========================================================
   Rozetler: Discord profilindeki gibi küçük kutu + koyu baloncuk
   (ana sayfa, kişisel sayfa ve panel aynı dosyayı kullanır)
   ========================================================= */
.bdgs, .bdgs-in, .pmbdg { display: flex; flex-wrap: wrap; align-items: center; gap: 2px; width: fit-content; max-width: 100%; padding: 3px 4px; border-radius: 8px; background: rgba(0, 0, 0, .34); border: 1px solid rgba(255, 255, 255, .07); box-shadow: 0 1px 0 rgba(255, 255, 255, .03) inset; }
.bdg { position: relative; flex: none; display: inline-grid; place-items: center; width: 26px; height: 26px; border-radius: 6px; outline: none; cursor: default; -webkit-tap-highlight-color: transparent; transition: background .12s; }
.bdg .bico { display: block; width: 22px; height: 22px; filter: drop-shadow(0 1px 1.2px rgba(0, 0, 0, .4)); transition: transform .14s cubic-bezier(.3, 1.5, .5, 1); }
.bdg:hover { background: rgba(255, 255, 255, .07); }
.bdg:hover .bico { transform: scale(1.12); }
.bdg:focus-visible { box-shadow: 0 0 0 2px var(--bc, #fff); }
.bdg.sm { width: 22px; height: 22px; border-radius: 5px; }
.bdg.sm .bico { width: 18px; height: 18px; }
.bdg.lg { width: 32px; height: 32px; border-radius: 8px; }
.bdg.lg .bico { width: 28px; height: 28px; }
/* eski metin baloncuklarını kapat (yerine aşağıdaki geliyor) */
.bdg::after, .bdg::before { content: none !important; }

.bdg-tip { position: fixed; left: 0; top: 0; z-index: 2147483000; max-width: calc(100vw - 16px); padding: 8px 12px; border-radius: 8px; background: #111214; color: #f2f3f5; font: 600 14px/1.25 "gg sans", var(--font, system-ui), system-ui, -apple-system, "Segoe UI", sans-serif; letter-spacing: 0; text-transform: none; white-space: nowrap; -webkit-text-fill-color: #f2f3f5; box-shadow: 0 8px 16px rgba(0, 0, 0, .3), 0 0 0 1px rgba(255, 255, 255, .05); pointer-events: none; opacity: 0; transform: translateY(4px) scale(.94); transform-origin: var(--ax, 50%) 100%; transition: opacity .1s ease, transform .12s ease; }
.bdg-tip::after { content: ""; position: absolute; left: var(--ax, 50%); top: 100%; width: 0; height: 0; border: 6px solid transparent; border-top-color: #111214; transform: translateX(-50%); }
.bdg-tip.below { transform: translateY(-4px) scale(.94); transform-origin: var(--ax, 50%) 0; }
.bdg-tip.below::after { top: auto; bottom: 100%; border-top-color: transparent; border-bottom-color: #111214; }
.bdg-tip.on { opacity: 1; transform: none; }
@media (prefers-reduced-motion: reduce) { .bdg .bico, .bdg-tip { transition: none; } .bdg:hover .bico { transform: none; } }

/* havalı rozetler: renkli nabız gibi parlama (+ parıltılar ikonun içinde) */
.bdg.bc-havali .bico { animation: bdgGlow 2.6s ease-in-out infinite; }
.bdg.bc-havali:nth-child(2n) .bico { animation-delay: -1.3s; }
@keyframes bdgGlow { 0%, 100% { filter: drop-shadow(0 1px 1.2px rgba(0, 0, 0, .4)); } 50% { filter: drop-shadow(0 0 4px var(--bc)) drop-shadow(0 0 1px var(--bc)); } }
.bdg.b-efsane .bico { animation: bdgHue2 5s linear infinite; }
@keyframes bdgHue2 { 0% { filter: hue-rotate(0) drop-shadow(0 0 2px var(--bc)); } 50% { filter: hue-rotate(180deg) drop-shadow(0 0 5px var(--bc)); } 100% { filter: hue-rotate(360deg) drop-shadow(0 0 2px var(--bc)); } }
.bdg.b-banli:hover .bico { animation: bdgBonk .45s ease; }
@keyframes bdgBonk { 0%, 100% { transform: scale(1.12) rotate(0); } 35% { transform: scale(1.12) rotate(-22deg); } 65% { transform: scale(1.18) rotate(8deg); } }
.bdg.b-rage:hover .bico { animation: bdgShake .35s linear 2; }
@keyframes bdgShake { 0%, 100% { transform: scale(1.12) translateX(0); } 25% { transform: scale(1.12) translateX(-1.5px); } 75% { transform: scale(1.12) translateX(1.5px); } }
.bdg.b-troll:hover .bico, .bdg.b-palyaco:hover .bico, .bdg.b-patates:hover .bico { animation: bdgWob .5s ease; }
@keyframes bdgWob { 0%, 100% { transform: scale(1.12) rotate(0); } 30% { transform: scale(1.2) rotate(-12deg); } 60% { transform: scale(1.15) rotate(10deg); } }
.bdg.b-hayalet:hover .bico { animation: bdgFloat .9s ease-in-out infinite; opacity: .75; }
@keyframes bdgFloat { 0%, 100% { transform: scale(1.12) translateY(0); } 50% { transform: scale(1.12) translateY(-2px); } }
/* havalı rozetin baloncuğu kendi renginde parlar */
.bdg-tip.hv { box-shadow: 0 0 0 1px color-mix(in srgb, var(--tc) 60%, transparent), 0 0 16px -2px color-mix(in srgb, var(--tc) 70%, transparent), 0 8px 16px rgba(0, 0, 0, .35); }
.bdg-tip.hv::before { content: ""; display: inline-block; width: 6px; height: 6px; margin: 0 7px 1px 0; border-radius: 50%; background: var(--tc); box-shadow: 0 0 6px var(--tc); vertical-align: middle; }
@media (prefers-reduced-motion: reduce) { .bdg .bico { animation: none !important; } }

/* piksel rozetler: tam sayı ölçekte keskin dursun (16 → 24/16/32 px) */
.bico.px { image-rendering: pixelated; shape-rendering: crispEdges; }
.bdg .bico.px { width: 24px; height: 24px; filter: drop-shadow(0 1px 0 rgba(0, 0, 0, .35)); }
.bdg.sm .bico.px { width: 16px; height: 16px; }
.bdg.lg .bico.px { width: 32px; height: 32px; }
.bdg:hover .bico.px { transform: translateY(-1px) scale(1.08); }
.pgbdg button .bico.px { width: 24px; height: 24px; }

/* Discord sunucu etiketi */
.dtag { display: inline-flex; align-items: center; gap: 3px; height: 18px; padding: 0 5px; margin-left: 6px; border-radius: 5px; background: rgba(255, 255, 255, .1); border: 1px solid rgba(255, 255, 255, .08); vertical-align: middle; font: 700 11.5px/1 "gg sans", var(--font, system-ui), system-ui, sans-serif; letter-spacing: .02em; color: #f2f3f5; -webkit-text-fill-color: #f2f3f5; text-transform: none; white-space: nowrap; }
.dtag img { width: 13px; height: 13px; display: block; }
.k-name .dtag, .pc-name .dtag { position: relative; top: -2px; }
.bdg img.bico { object-fit: contain; -webkit-user-drag: none; }
.bdg img.cimg { object-fit: contain; border-radius: 4px; image-rendering: auto; }