update docs for portrait

docs/02-setup-main-game/05-main-scene.md

@@ -483,7 +483,7 @@ The game logo is a crucial branding element that must be consistently displayed
 | Mobile | Landscape | ![Landscape View](./img/05-main-scene/logo-overview.png) |
 | Mobile | Portrait | ![Portrait View](./img/05-main-scene/logo-overview-portrait.png) |
 
-### Animation Configuration
+### Logo Configuration
 
 #### 1. Core Setup
 Location: `assets\core-assets\hyper-core\packages\logo-animation`
@@ -527,14 +527,17 @@ onLoad: function () {
 
    ![Provider Setup](./img/05-main-scene/logo-anim-loop.png)
 
-### Platform-Specific Setup
+### Platform Setup
 
 #### Desktop Configuration
+
 1. Base Settings        
 
    ![Desktop Settings](./img/05-main-scene/logo-setting-desktop.png)
 
-   *Node Setup*
+🔗 Click [Here](#platform-node-spawner-settings) to follow `platform-ui-controller`
+
+2. Node Setup
    ```typescript
    Components: {
      animation: 'hyper-logo-animation',
@@ -542,34 +545,35 @@ onLoad: function () {
    ```
    ![Desktop Setup](./img/05-main-scene/logo-script-desktop.png)
 
-
+:::tip
-2. Position Guidelines
+   - **Position And Size**: Follow Game Design.
-   - Follow design specifications
+:::
-   - Avoid UI element overlap
-   - Consider screen layout
 
 #### Mobile Configuration
 
 ##### Landscape Mode
+
 1. Node Setup
-   ```typescript
+  
-   Components: {
+    | Component                                 | Description                                      |
-     animation: 'hyper-logo-animation',
+    |-------------------------------------------|--------------------------------------------------|
-     scaling: 'landscape-logo-spine-aspect-ratio-keeper'
+    | `hyper-logo-animation`                    | Plays and manages the logo animation             |
-   }
+    | `node-position-by-jackpot`                | Moves the logo based on the jackpot display state |
-   ```
+    | `landscape-logo-spine-aspect-ratio-keeper`| Keeps the logo size consistent on all screens  (**Exp: 1.0**)   |
+   
     ![Landscape Setup](./img/05-main-scene/logo-mobile-landcape.png)
 
 ##### Portrait Mode
 
-1. Node Configuration
+1. Node Setup
 
     | Component                  | Description                                      |
     |----------------------------|--------------------------------------------------|
     | `hyper-logo-animation`     | Plays and manages the logo animation             |
     | `node-position-by-jackpot` | Moves the logo based on the jackpot display state |
-| `spine-aspect-ratio-keeper`| Keeps the logo size consistent on all screens    |
+    | `spine-aspect-ratio-keeper`| Keeps the logo size consistent on all screens (**Exp: 1.0** ) |
 
+    ![Portrait Setup](./img/05-main-scene/logo-mobile-portrait.png)
 
 2. Position Settings
 
@@ -578,9 +582,17 @@ onLoad: function () {
    | Jackpot Active | Upper position | ![Active](./img/05-main-scene/logo-portrait-jackpot.png) |
    | Jackpot Inactive | Default position | ![Inactive](./img/05-main-scene/logo-portrait-no-jackpot.png) |
 
-:::tip Best Practices
+3. Size Settings
-- Test on multiple device sizes
+
-- Verify animations load properly
+    Using componet `spine-aspect-ratio-keeper` :
-- Check positioning in all game states
+
-- Ensure consistent scaling
+    ![Portrait Logo Configuration](./img/05-main-scene/logo-center-align.png)    
+
+    | Setting           | Description                                  | Default Value         |
+    | ----------------- | -------------------------------------------- | --------------------- |
+    | **Default Scale** | Initial scale factor applied to the node     | Configurable per game (**Exp: 1.0**) |
+    | **Default Size**  | Base width and height used for scaling logic | Configurable per game (**Exp: 1050 x 1680**) |
+
+:::tip
+- Check Logo Static when is lowest Network
 :::