.pattern-preview.badge-preview{position:relative;display:grid;place-content:center stretch;padding:18px;height:180px;overflow:hidden;isolation:isolate}.pattern-preview.badge-preview.pattern-preview--inspector{height:auto;min-height:220px;gap:14px}.badge-preview__hint{margin:0;font-size:.78rem;color:rgba(203,213,225,.72);text-align:center}.badge-preview__controls{display:flex;gap:8px;justify-content:center}.badge-preview__button{padding:7px 14px;border-radius:999px;border:1px solid color-mix(in srgb,var(--badge-accent,#7dd3fc) 40%,rgba(148,163,184,.18));background:color-mix(in srgb,var(--badge-accent,#7dd3fc) 14%,rgba(15,23,42,.9));color:rgba(241,245,249,.96);font:inherit;font-size:.78rem;font-weight:600;letter-spacing:.01em;cursor:pointer;transition:background-color .16s ease,border-color .16s ease}.badge-preview__button:hover{background:color-mix(in srgb,var(--badge-accent,#7dd3fc) 24%,rgba(15,23,42,.9))}.badge-preview__button--ghost{background:rgba(15,23,42,.4);border-color:rgba(148,163,184,.18);color:rgba(203,213,225,.85)}.badge-preview__button--ghost:hover{background:rgba(15,23,42,.6)}.badge-trigger{display:inline-flex;align-items:center;gap:10px;margin:0 auto;padding:8px 14px;border:1px solid rgba(148,163,184,.18);background:linear-gradient(180deg,rgba(15,23,42,.86),rgba(2,6,23,.86));color:rgba(241,245,249,.94);font:inherit;font-size:.86rem;font-weight:600;letter-spacing:.01em;cursor:pointer;border-radius:12px;transition:border-color .18s ease,transform .18s ease}.badge-trigger:focus-visible{outline:2px solid var(--badge-accent,#7dd3fc);outline-offset:3px}.badge-trigger:hover{border-color:color-mix(in srgb,var(--badge-accent,#7dd3fc) 40%,rgba(148,163,184,.18))}.badge-host{position:relative}.badge-host,.badge-host__icon{display:inline-flex;align-items:center;justify-content:center}.badge-host__icon{width:36px;height:36px;border-radius:10px;background:rgba(2,6,23,.5);border:1px solid rgba(148,163,184,.16);color:rgba(226,232,240,.92)}.badge{position:absolute;top:-12px;right:-10px;display:inline-flex;align-items:center;justify-content:center;min-width:20px;height:20px;padding:0 6px;border-radius:999px;background:var(--badge-accent,#7dd3fc);color:#0f172a;font-size:11px;font-weight:800;letter-spacing:.02em;box-shadow:0 4px 12px color-mix(in srgb,var(--badge-accent,#7dd3fc) 40%,transparent);transform-origin:center;animation:badgePop var(--badge-duration,.42s) cubic-bezier(.34,1.56,.64,1)}.badge__digit{display:inline-block;line-height:1}@keyframes badgePop{0%,to{transform:scale(1) rotate(0)}45%{transform:scale(var(--badge-scale,1.25)) rotate(calc(-1 * var(--badge-rotate, 0deg)))}}.badge-trigger--inbox{width:100%;max-width:220px;justify-content:flex-start;padding:10px 14px;border-radius:10px}.badge-trigger--inbox .badge-trigger__label{flex:1 1;text-align:left}.badge-trigger--cart{border-radius:999px;padding:9px 18px 9px 22px;background:linear-gradient(180deg,color-mix(in srgb,#f0abfc 18%,rgba(15,23,42,.92)),rgba(15,23,42,.92));border-color:color-mix(in srgb,#f0abfc 35%,rgba(148,163,184,.22))}.badge-trigger--cart .badge-trigger__label{letter-spacing:.04em;text-transform:uppercase;font-size:.74rem}.badge-trigger--cart .badge-host__icon{width:32px;height:32px;border-radius:999px;background:rgba(2,6,23,.7);animation:cartIconPop var(--badge-duration,.55s) cubic-bezier(.34,1.56,.64,1)}@keyframes cartIconPop{0%,to{transform:translateY(0)}45%{transform:translateY(-2px)}}.badge-trigger--bell{background:linear-gradient(180deg,rgba(15,23,42,.92),rgba(2,6,23,.92));border:1px solid rgba(253,224,71,.18);border-radius:999px;padding:8px 8px 8px 18px;width:100%;max-width:260px;display:inline-flex;align-items:center;justify-content:space-between;gap:12px}.badge-trigger__label-leading{font-size:.74rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:rgba(254,240,138,.78)}.badge-bell-button{display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;padding:0;border:0;background:transparent;cursor:pointer;border-radius:12px}.badge-bell-button:focus-visible{outline:2px solid var(--badge-accent,#fde047);outline-offset:3px}.badge-trigger--bell .badge-host__icon{border-radius:999px;background:rgba(2,6,23,.6);border-color:rgba(253,224,71,.24);animation:bellShake var(--badge-duration,.6s) cubic-bezier(.36,.07,.19,.97)}@keyframes bellShake{0%,to{transform:rotate(0)}20%{transform:rotate(-12deg)}45%{transform:rotate(10deg)}70%{transform:rotate(-4deg)}}.visually-hidden{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}@media (prefers-reduced-motion:reduce){.badge,.badge-trigger--bell .badge-host__icon,.badge-trigger--cart .badge-host__icon{animation:none}}