body
{
   background-color: #000000;
   color: #000000;
   font-family: Arial;
   font-weight: normal;
   font-size: 13px;
   line-height: 1.1875;
   margin: 0;
   padding: 0;
   overflow-x: hidden;
}
.wb-theme-header
{
   background-color: #333333;
   background-image: none;
   border: 1px solid #A3A3A3;
   border-radius: 0px;
   color: #EEEEEE;
   --background-color: rgba(51,51,51,1.00);
   --border-color: #A3A3A3;
   --border-width: 1px;
   --color: #EEEEEE;
}
.wb-theme-content
{
   background-color: #F9F9F9;
   background-image: none;
   border: 1px solid #CCCCCC;
   border-radius: 0px;
   color: #222222;
   --background-color: rgba(249,249,249,1.00);
   --border-color: #CCCCCC;
   --border-width: 1px;
   --color: #222222;
   --icon-color: #222222;
   --colorize: invert(2%) sepia(1%) saturate(2541%) hue-rotate(335deg) brightness(108%) contrast(76%);
}
.wb-theme-button, .wb-theme-static
{
   background-color: #111111;
   background-image: none;
   border: 1px solid #777777;
   border-radius: 0px;
   color: #E3E3E3;
   --background-color: rgba(17,17,17,1.00);
   --border-color: #777777;
   --border-width: 1px;
   --color: #E3E3E3;
}
.wb-theme-button:hover
{
   background-color: #1C1C1C;
   background-image: none;
   border: 1px solid #000000;
   border-radius: 0px;
   color: #FFFFFF;
   --background-color: rgba(28,28,28,1.00);
   --border-color: #000000;
   --border-width: 1px;
   --color: #FFFFFF;
}
.wb-theme-button.active, .wb-theme-button:active, .active > .wb-theme-button
{
   background-color: #FFFFFF;
   background-image: none;
   border: 1px solid #CCCCCC;
   border-radius: 0px;
   color: #222222;
   --background-color: rgba(255,255,255,1.00);
   --border-color: #CCCCCC;
   --border-width: 1px;
   --color: #222222;
}
#wb_LayoutGrid1
{
   clear: both;
   position: relative;
   table-layout: fixed;
   display: table;
   text-align: center;
   width: 100%;
   background-color: transparent;
   background-image: none;
   border: 0px solid #CCCCCC;
   border-radius: 0px;
   box-sizing: border-box;
   margin: 0;
}
#LayoutGrid1
{
   box-sizing: border-box;
   padding: 0;
   margin-right: auto;
   margin-left: auto;
}
#LayoutGrid1 > .row
{
   margin-right: 0;
   margin-left: 0;
}
#LayoutGrid1 > .row > .col-1
{
   box-sizing: border-box;
   font-size: 0;
   min-height: 1px;
   padding-right: 0px;
   padding-left: 0px;
   position: relative;
}
#LayoutGrid1 > .row > .col-1
{
   float: left;
}
#LayoutGrid1 > .row > .col-1
{
   background-color: transparent;
   background-image: none;
   border: 0px solid #FFFFFF;
   border-radius: 0px;
   width: 100%;
   text-align: left;
}
#LayoutGrid1:before,
#LayoutGrid1:after,
#LayoutGrid1 .row:before,
#LayoutGrid1 .row:after
{
   display: table;
   content: " ";
}
#LayoutGrid1:after,
#LayoutGrid1 .row:after
{
   clear: both;
}
@media (max-width: 768px)
{
#LayoutGrid1 > .row > .col-1
{
   float: none;
   width: 100% !important;
}
}
#wb_Text1 
{
   background-color: transparent;
   background-image: none;
   border: 0px solid #000000;
   border-radius: 0px;
   padding: 0;
   margin: 0;
   text-align: center;
}
#wb_Text1
{
   color: #FFFFFF;
   font-family: Arial;
   font-weight: 400;
   font-size: 27px;
   line-height: 31px;
}
#wb_Text1 p, #wb_Text1 ul
{
   margin: 0;
   padding: 0;
}
#wb_Text1
{
   display: block;
   margin: 0;
   box-sizing: border-box;
   width: 100%;
}
#Html1
{
   display: inline-block;
   width: 100%;
   height: 1325px;
   overflow: auto;
   z-index: 1;
}
#slot-history
{
   max-height: 520px;
   overflow-y: auto;
}
@media only screen and (max-width: 768px)
{
body
{
   background-color: #000000;
   background-image: none;
}
#MasterPage1
{
   left: 0px;
   top: 0px;
   width: 768px;
   height: 1725px;
   visibility: visible;
   display: inline;
}
#wb_LayoutGrid1
{
   visibility: visible;
   display: table;
   background-color: #000000;
   background-image: none;
   background-image: none;
   border: 0px solid #CCCCCC;
}
#wb_LayoutGrid1
{
   height: auto;
   margin-top: 0px;
   margin-bottom: 0px;
}
#LayoutGrid1
{
   height: auto;
   padding: 0;
}
#LayoutGrid1 .row
{
   margin-right: 0px;
   margin-left: 0px;
}
#LayoutGrid1 > .row > .col-1
{
   padding-right: 0px;
   padding-left: 0px;
}
#LayoutGrid1 > .row > .col-1
{
   display: block;
   width: 100%;
   border: 0px solid #FFFFFF;
   border-radius: 0px;
   text-align: left;
}
#Html1
{
   visibility: visible;
   display: block;
}
#wb_Text1
{
   width: 100%;
   visibility: visible;
   display: block;
   margin: 0;
}
#wb_Text1
{
   font-size: 21px;
   margin: 0;
   padding: 0;
   text-align: center;
   line-height: 24px;
}
}
@media only screen and (max-width: 480px)
{
body
{
   background-color: #000000;
   background-image: none;
}
#MasterPage1
{
   left: 0px;
   top: 0px;
   width: 480px;
   height: 1725px;
   visibility: visible;
   display: inline;
}
#wb_LayoutGrid1
{
   visibility: visible;
   display: table;
   background-color: transparent;
   background-image: none;
   border: 0px solid #DEE2E6;
}
#wb_LayoutGrid1
{
   height: auto;
   margin-top: 0px;
   margin-bottom: 0px;
}
#LayoutGrid1
{
   height: auto;
   padding: 0;
}
#LayoutGrid1 .row
{
   margin-right: 0px;
   margin-left: 0px;
}
#LayoutGrid1 > .row > .col-1
{
   padding-right: 0px;
   padding-left: 0px;
}
#LayoutGrid1 > .row > .col-1
{
   display: block;
   width: 100%;
   border: 0px solid #FFFFFF;
   border-radius: 0px;
   text-align: left;
}
#Html1
{
   visibility: visible;
   display: block;
}
#wb_Text1
{
   width: 100%;
   visibility: visible;
   display: block;
   margin: 0;
}
#wb_Text1
{
   font-size: 27px;
   margin: 0;
   padding: 0;
   text-align: center;
   line-height: 30px;
}
}
@media only screen and (max-width: 320px)
{
body
{
   background-color: #000000;
   background-image: none;
}
#MasterPage1
{
   left: 0px;
   top: 0px;
   width: 320px;
   height: 1725px;
   visibility: visible;
   display: inline;
}
#wb_LayoutGrid1
{
   visibility: visible;
   display: table;
   background-color: #000000;
   background-image: none;
   background-image: none;
   border: 0px solid #CCCCCC;
}
#wb_LayoutGrid1
{
   height: auto;
   margin-top: 0px;
   margin-bottom: 0px;
}
#LayoutGrid1
{
   height: auto;
   padding: 0;
}
#LayoutGrid1 .row
{
   margin-right: 0px;
   margin-left: 0px;
}
#LayoutGrid1 > .row > .col-1
{
   padding-right: 0px;
   padding-left: 0px;
}
#LayoutGrid1 > .row > .col-1
{
   display: block;
   width: 100%;
   border: 0px solid #FFFFFF;
   border-radius: 0px;
   text-align: left;
}
#Html1
{
   visibility: visible;
   display: block;
}
#wb_Text1
{
   width: 100%;
   visibility: visible;
   display: block;
   margin: 0;
}
#wb_Text1
{
   font-size: 21px;
   margin: 0;
   padding: 0;
   text-align: center;
   line-height: 24px;
}
}
/* Forces the website to never exceed the screen width and hides horizontal overflow */
html, body {
    max-width: 100vw !important;
    overflow-x: hidden !important;
}

/* 1. AGGRESSIVE MOBILE OVERFLOW LOCK */
html, body, #wb_Workspace { 
    overflow-x: hidden !important; 
    max-width: 100vw !important; 
    margin: 0 !important; 
}

/* 2. FORCE THE 4D WIDGETS TO SQUISH ON MOBILE */
@media (max-width: 480px) {
    .f4dk-top-bar { flex-wrap: wrap !important; }
    .fourd-grid-container, .f4dk-board-grid { 
        grid-template-columns: 1fr !important; 
        min-width: 0 !important;
        width: 100% !important;
    }
    table, .mg-matrix-table, .sg-shares-table, .plain-data-table { 
        table-layout: fixed !important; 
        width: 100% !important; 
        word-break: break-all !important; 
    }
    .f4dk-widget-header { padding: 8px 5px !important; }
    .toto-balls-row { gap: 2px !important; }
    .mg-box { width: 17px !important; height: 17px !important; font-size: 10px !important; }
}

/* 3. MASTER PAGE STRETCH FIX */
@media (max-width: 1024px) {
    html, body {
        width: 100% !important;
        overflow-x: hidden !important;
    }
    #wb_Layer1, #Layer1, #Layer1_Container, 
    #wb_ContentPlaceHolder1, 
    #wb_LayoutGrid1, #LayoutGrid1 {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 100% !important;
        left: 0 !important;
        margin: 0 !important;
        padding: 0 !important;
        box-sizing: border-box !important;
    }
}

/* ========================================================================= */
/* 4. SLEEK MOBILE HAMBURGER ICON AND CANVAS MENU STYLING                    */
/* ========================================================================= */
#wb_header { position: relative !important; z-index: 99999 !important; }
#wb_MegaMenu1 { position: relative !important; z-index: 100000 !important; }

/* Hide hamburger on desktop by default */
#MegaMenu1-hamburger { display: none; }

@media (max-width: 1024px) {
   /* Hamburger Icon */
   #MegaMenu1-hamburger { 
       display: flex !important; 
       flex-direction: column !important;
       justify-content: space-around !important;
       width: 35px !important;
       height: 28px !important;
       cursor: pointer !important; 
       pointer-events: auto !important; 
       position: absolute !important; 
       right: 20px !important;
       top: 15px !important; 
       z-index: 100001 !important; 
   }
   
   #MegaMenu1-hamburger .line {
       display: block !important;
       width: 100% !important;
       height: 3px !important;
       background-color: #fac814 !important; 
       border-radius: 3px !important;
   }

   /* Canvas Menu Hidden State */
   #wb_MegaMenu1:not(.open) #MegaMenu1-nav { 
       display: block !important; 
       visibility: hidden !important; 
       opacity: 0 !important; 
       transform: translateX(100%) !important; 
       transition: transform 0.3s ease-in-out, opacity 0.3s ease-in-out !important;
   }
   
   /* Canvas Menu Open State */
   #wb_MegaMenu1.open #MegaMenu1-nav { 
       display: block !important; 
       visibility: visible !important; 
       opacity: 1 !important; 
       position: fixed !important; 
       top: 0 !important; 
       right: 0 !important; 
       left: auto !important; 
       width: 285px !important; 
       height: 100vh !important; 
       background: #0f0f0f !important; /* Deep dark background */
       z-index: 200000 !important; 
       box-shadow: -8px 0 25px rgba(0,0,0,0.9) !important; 
       padding: 25px !important; 
       box-sizing: border-box !important; 
       transform: translateX(0) !important; 
       transition: transform 0.3s ease-in-out, opacity 0.3s ease-in-out !important; 
   }
   
   /* The Close 'X' Button */
   #MegaMenu1-close { 
       text-align: right !important; 
       margin-bottom: 25px !important; 
       width: 100% !important; 
   }
   #MegaMenu1-close a { 
       color: #fac814 !important; 
       font-size: 40px !important; 
       line-height: 1 !important;
       text-decoration: none !important; 
       font-weight: bold !important; 
       background: transparent !important;
       border: none !important;
       box-shadow: none !important;
   }
   
   /* Clean, modern navigation links (strips WYSIWYG button defaults) */
   ul#MegaMenu1 {
       display: flex !important;
       flex-direction: column !important;
       gap: 5px !important;
       padding: 0 !important;
       margin: 0 !important;
       list-style: none !important;
   }
   
   ul#MegaMenu1 li {
       background: transparent !important;
       border: none !important;
       margin: 0 !important;
       padding: 0 !important;
   }
   
   ul#MegaMenu1 li a,
   ul#MegaMenu1 li a.wb-theme-button,
   ul#MegaMenu1 li a.button {
       color: #ffffff !important;
       font-size: 15px !important;
       font-weight: bold !important;
       text-transform: uppercase !important;
       text-decoration: none !important;
       display: block !important;
       background: transparent !important; /* Strips the ugly white boxes */
       border: none !important; 
       border-bottom: 1px solid #222222 !important; /* Clean separator */
       padding: 15px 10px !important;
       box-shadow: none !important;
       text-align: left !important;
       letter-spacing: 0.05em !important;
       transition: color 0.2s, background 0.2s !important;
   }
   
   ul#MegaMenu1 li a:hover,
   ul#MegaMenu1 li a:active {
       color: #fac814 !important;
       background: rgba(255, 255, 255, 0.03) !important; /* Subtle highlight on tap */
   }
}
/* ========================================================================= */
/* HEADER CLEANUP: Hides any accidental text boxes placed in the header layer*/
/* ========================================================================= */
#Layer1_Container > div:not(#wb_Image2):not(#wb_MegaMenu1) {
    display: none !important;
}
 #wb_header { position: relative !important; z-index: 99999 !important; }
 #wb_MegaMenu1 { position: relative !important; z-index: 100000 !important; }
 #MegaMenu1-hamburger { cursor: pointer !important; pointer-events: auto !important; position: relative !important; z-index: 100001 !important; }

 @media (max-width: 1024px) {
   #wb_MegaMenu1:not(.open) #MegaMenu1-nav { display: none !important; visibility: hidden !important; opacity: 0 !important; transform: translateX(100%) !important; }
   #wb_MegaMenu1.open #MegaMenu1-nav { display: block !important; visibility: visible !important; opacity: 1 !important; position: fixed !important; top: 0 !important; right: 0 !important; left: auto !important; width: 285px !important; height: 100vh !important; background: #151515 !important; z-index: 200000 !important; box-shadow: -8px 0 25px rgba(0,0,0,0.8) !important; padding: 25px !important; box-sizing: border-box !important; transform: translateX(0) !important; transition: transform 0.3s ease-in-out !important; }
   #MegaMenu1-close { text-align: right !important; margin-bottom: 25px !important; width: 100% !important; }
   #MegaMenu1-close a { color: #fac814 !important; font-size: 32px !important; text-decoration: none !important; font-weight: bold !important; }
 }
  /* Base Container Layout */
  .f4dk-search-container { width: 100%; max-width: 100%; background: transparent; font-family: Arial, sans-serif; color: #ffffff; padding: 15px 10px; box-sizing: border-box; overflow-x: hidden; }
  .f4dk-search-layout { display: flex; flex-direction: row; gap: 20px; width: 100%; max-width: 1120px; margin: 0 auto; box-sizing: border-box; }
  
  .f4dk-search-sidebar { width: 340px; max-width: 100%; flex-shrink: 0; box-sizing: border-box; }
  .f4dk-search-content { flex-grow: 1; min-width: 0; max-width: 100%; box-sizing: border-box; }

  /* Mobile Flexbox Breakpoint */
  @media (max-width: 900px) {
      .f4dk-search-layout { flex-direction: column; }
      .f4dk-search-sidebar { width: 100% !important; flex-shrink: 1; }
      .f4dk-search-content { width: 100% !important; }
  }
  
  /* UI Components */
  .f4dk-search-card { background: rgba(17, 17, 17, 0.7) !important; backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px); border: 1px solid rgba(255, 255, 255, 0.1); border-radius: 6px; overflow: hidden; margin-bottom: 20px; box-shadow: 0 8px 32px 0 rgba(0, 0, 0, 0.4); width: 100%; box-sizing: border-box; }
  .f4dk-header { background: rgba(30, 58, 138, 0.85) !important; color: #ffffff; padding: 12px; font-weight: bold; text-transform: uppercase; border-bottom: 1px solid rgba(255, 255, 255, 0.1); font-size: 14px; letter-spacing: 0.03em; }
  
  .search-input-box { background: rgba(34, 34, 34, 0.8); border: 1px solid rgba(255, 255, 255, 0.2); color: #fac814; font-size: 18px; font-weight: bold; padding: 8px; text-align: center; width: 100%; border-radius: 4px; box-sizing: border-box; letter-spacing: 0.05em; }
  .search-btn { background: #fac814; color: #000000; border: none; padding: 11px 20px; font-weight: bold; font-size: 14px; text-transform: uppercase; cursor: pointer; width: 100%; border-radius: 4px; margin-top: 15px; transition: opacity 0.15s; }
  .search-btn:hover { opacity: 0.9; }
  .filter-group-title { font-size: 11px; color: #aaaaaa; text-transform: uppercase; font-weight: bold; display: block; margin: 12px 0 6px 0; border-bottom: 1px solid rgba(255,255,255,0.05); padding-bottom: 2px; }
  .checkbox-item { display: flex; align-items: center; gap: 8px; margin-bottom: 8px; font-size: 13px; font-weight: bold; cursor: pointer; color: #ffffff; }
  .checkbox-item input { margin: 0; vertical-align: middle; width: 16px; height: 16px; }

  .focus-num-banner { background: rgba(17, 17, 17, 0.7); border: 2px dashed #fac814; padding: 15px; text-align: center; margin-top: 0px; margin-bottom: 20px; border-radius: 6px; box-sizing: border-box; width: 100%; }
  .focus-num-banner h1 { margin: 0; font-size: 32px; color: #fac814; letter-spacing: 0.05em; }

  /* OVERRIDE: Table Wrapping & Mobile Horizontal Scrolling */
  .f4dk-pipeline-slot { 
      padding: 12px; 
      box-sizing: border-box; 
      width: 100%;
      overflow-x: auto; /* Enables native horizontal scrolling */
      -webkit-overflow-scrolling: touch; 
  }
  
  .f4dk-pipeline-slot table { 
      width: 100% !important; 
      min-width: 550px; /* Forces tables to remain wide so they scroll instead of squishing */
      border-collapse: collapse !important; 
      background: transparent !important; 
      margin-bottom: 5px !important; 
      border: 1px solid #555555 !important; 
      box-shadow: 0 4px 10px rgba(0, 0, 0, 0.4); 
  }
  
  /* FORCE VISIBILITY: Strips all legacy font colors, forcing crisp white text */
  .f4dk-pipeline-slot table td,
  .f4dk-pipeline-slot table td font,
  .f4dk-pipeline-slot table td span,
  .f4dk-pipeline-slot table td b { 
      color: #ffffff !important; 
      text-shadow: none !important;
  }
  
  /* Link Highlighter */
  .f4dk-num-link, 
  .f4dk-pipeline-slot table a, 
  .f4dk-pipeline-slot table a font, 
  .f4dk-pipeline-slot table a * { 
      color: #fac814 !important; 
      text-decoration: underline !important; 
      cursor: pointer !important; 
      pointer-events: auto !important; 
      font-weight: bold !important; 
  }
  .f4dk-num-link:hover, .f4dk-pipeline-slot table a:hover, .f4dk-pipeline-slot table a:hover * { color: #ff3344 !important; }

  /* Structural Cell Boundaries */
  .f4dk-pipeline-slot table th, .f4dk-pipeline-slot table thead td { background: rgba(40, 40, 40, 0.8) !important; color: #fac814 !important; font-size: 12px !important; font-weight: bold !important; text-transform: uppercase !important; border: 1px solid #555555 !important; padding: 8px 6px !important; text-align: center !important; }
  .f4dk-pipeline-slot table td { background: rgba(20, 20, 20, 0.45) !important; border: 1px solid #333333 !important; padding: 8px 6px !important; text-align: center !important; font-size: 13px !important; vertical-align: middle !important; }
  .f4dk-pipeline-slot table tr:hover td { background: rgba(255, 255, 255, 0.08) !important; }
  .f4dk-pipeline-slot table td br { display: none !important; }
  
  /* Legacy 4D2U Background Resets */
  .f4dk-pipeline-slot table td[bgcolor], .f4dk-pipeline-slot table th[bgcolor] { background-color: #141414 !important; }
  .f4dk-pipeline-slot table td[bgcolor="#eeeeee"], .f4dk-pipeline-slot table td[bgcolor="eeeeee"] { background-color: #262626 !important; }
  .f4dk-pipeline-slot table td[bgcolor="#dddddd"], .f4dk-pipeline-slot table td[bgcolor="dddddd"] { background-color: #333333 !important; }
  .f4dk-pipeline-slot table td[bgcolor="#bbbbbb"], .f4dk-pipeline-slot table td[bgcolor="bbbbbb"] { background-color: #1f1f1f !important; }
  
  /* Primary Prize Specific Colors Override */
  .f4dk-pipeline-slot table td[bgcolor="#FF0000"], .f4dk-pipeline-slot table td[bgcolor="red"] { background-color: #dc2626 !important; }
  .f4dk-pipeline-slot table td[bgcolor="#0000FF"], .f4dk-pipeline-slot table td[bgcolor="blue"] { background-color: #2563eb !important; }
  .f4dk-pipeline-slot table td[bgcolor="#008000"], .f4dk-pipeline-slot table td[bgcolor="green"] { background-color: #16a34a !important; }
  .f4dk-pipeline-slot table td[bgcolor="#FFFF00"], .f4dk-pipeline-slot table td[bgcolor="yellow"] { background-color: #ca8a04 !important; }
  
  /* Universal Inline Vector Badges */
  .f4dk-pipeline-slot table h2, .f4dk-pipeline-slot table h3, .f4dk-pipeline-slot table h4 { margin: 0 !important; font-size: 13px !important; color: #ffffff !important; display: inline-block !important; }
  .f4dk-pipeline-slot table img:not(.op-logo-img):not(.tbl-logo-img) { display: none !important; }
  
  .inline-logo-svg { width: 14px; height: 14px; vertical-align: middle; display: inline-block; margin-right: 4px; margin-bottom: 2px; }
  .op-badge { display: inline-flex; align-items: center; justify-content: center; padding: 4px 8px; font-size: 11px; font-weight: 900; border-radius: 3px; text-transform: uppercase; text-align: center; min-width: 95px; box-sizing: border-box; margin: 2px; text-shadow: none !important; }
  .badge-m { background: #fac814; color: #000000 !important; }
  .badge-pmp { background: #0099b3; color: #ffffff !important; }
  .badge-toto { background: #cc0000; color: #ffffff !important; }
  .badge-sg { background: #06b6d4; color: #ffffff !important; }
  .badge-cs { background: #10b981; color: #ffffff !important; }
  .badge-sabah { background: #6b7280; color: #ffffff !important; }
  .badge-stc { background: #f97316; color: #ffffff !important; }

  .f4dk-loader { text-align: center; color: #fac814; font-size: 15px; padding: 40px 0; font-weight: bold; }
  #slot-dreams table th, #slot-dreams table td { text-align: left !important; padding-left: 20px !important; }