Stor8

<!--

╭━━╮╱╱╱╱╱╱╱╱╱╱╱╱╱╭━╮╱╱╭╮
┃━┳┫╭━┳┳┳┳━┳┳┳╮╭┳┫╋┣━╮┃╰╮
┃╭┫╰┫╋┃┃┃┃┻┫╭┫╰┫┃┃╮┫╋╰┫╭┫
╰╯╰━┻━┻━━┻━┻╯╰━╋╮┣┻┻━━┻━╯
△▽/╱╱╱╱╱╱╱╱╱╱╱╰━╯

Sky: Children of the Light candles UI: code by FlowerlyRat || Graphics by ThatGameCompany, recreated by FlowerlyRat

Credits not required but appreciated!

Please do keep in mind that the graphics no longer align properly with the avatar if there are too many tags!
If you manually move it on desktop, it might look weird on mobile devices

        > If used for the Ultimate Sky: CotL bundle, please delete the "style" element in line 22

Code is compatible with the Sky: Children of the Light avatar frame

-->

    <div class="row no-gutters" style="position: absolute; top: 105px; left: 10%; z-index: 10">
        
        <!--/// Normal candles ///-->
        <div class="col-auto">
            <div class="card border-0 rounded-0 bg-transparent" style="height: 60px; width: 55px; z-index: 5">
                <img src="https://f2.toyhou.se/file/f2-toyhou-se/images/75494411_V96EeOZulDSU5u5.png" style="width: 35px">
                <p style="position: absolute; bottom: 4px; left: 30px">
                  
                    {{!Normal candle count!}}
                    
                </p>
            </div>
        </div>
        <!--/// Normal candles end ///-->
        
        <!--/// Normal hearts ///-->
        <div class="col-auto">
            <div class="card border-0 rounded-0 bg-transparent" style="height: 60px; width: 55px; z-index: 5">
                <img src="https://f2.toyhou.se/file/f2-toyhou-se/images/75494403_C3pGYROCXwXXIZa.png" style="width: 35px">
                <p style="position: absolute; bottom: 4px; left: 30px">
                  
                    {{!Normal heart count!}}
                  
                </p>
            </div>
        </div>
        <!--/// Normal hearts end ///-->
        
        <!--/// Seasonal candles ///-->
        <div class="col-auto">
            <div class="card border-0 rounded-0 bg-transparent" style="height: 60px; width: 55px; z-index: 5">
                <img src="https://f2.toyhou.se/file/f2-toyhou-se/images/75494394_vq7IhsL39lZ1ZeT.png" style="width: 35px">
                <p style="position: absolute; bottom: 4px; left: 30px">
                    
                    {{!Seasonal candle count!}}
                    
                </p>
            </div>
        </div>
        <!--/// Seasonal candles end ///-->
        
        <!--/// Seasonal hearts ///-->
        <div class="col-auto">
            <div class="card border-0 rounded-0 bg-transparent" style="height: 60px; width: 55px; z-index: 5">
                <img src="https://f2.toyhou.se/file/f2-toyhou-se/images/75494381_j2yEPrT8a3kb2Rp.png" style="width: 35px">
                <p style="position: absolute; bottom: 4px; left: 30px">
                    
                    {{!Seasonal heart count!}}
                    
                </p>
            </div>
        </div>
        <!--/// Seasonal hearts end ///-->
        
        <!--/// Ascended candles ///-->
        <div class="col-auto">
            <div class="card border-0 rounded-0 bg-transparent" style="height: 60px; width: 55px; z-index: 5">
                <img src="https://f2.toyhou.se/file/f2-toyhou-se/images/75494375_NQOL1hw2Z7bNzCE.png" style="width: 35px">
                <p style="position: absolute; bottom: 4px; left: 30px">
                  
                    {{!Ascended candle count!}}
                  
                </p>
            </div>
        </div>
        <!--/// Ascended candles end ///-->
        
        <!--/// Event tickets ///-->
        <div class="col-auto">
            <div class="card border-0 rounded-0 bg-transparent" style="height: 60px; z-index: 5">
                <img src="https://f2.toyhou.se/file/f2-toyhou-se/images/75494352_hF8BUmBTCIjWfsv.png" style="width: 35px">
                <p style="position: absolute; bottom: 4px; left: 30px">
                  
                    {{!Event ticket count!}}
                  
                </p>
            </div>
        </div>
        <!--/// Event tickets end ///-->
        
    </div>