/*
 * SBOTOTO R6.9.0.23 — Mobile Reference Reconstruction V18
 * Scope: homepage <=700px only. Desktop and website background are intentionally untouched.
 * One mobile layer replaces the former incremental V10-V17 mobile overlays.
 */
@media (max-width:700px){
  :root{
    --m18-red:#ad0009;
    --m18-red2:#7d0007;
    --m18-deep:#2b0003;
    --m18-yellow:#ffe000;
    --m18-gold:#eeb900;
    --m18-line:#a32127;
    --m18-panel:rgba(52,0,5,.90);
  }
  html,body{margin:0!important;padding:0!important;overflow-x:hidden!important}
  body.reference-portal.page-home{padding:0!important;color:#fff!important;background-attachment:scroll!important}
  body.reference-portal.page-home .container{width:100%!important;max-width:none!important;margin:0!important;padding:0!important}
  .skip-link,.portal-nav,.mobile-menu,#main,.footer,.mobile-dock{display:none!important}
  #mobileV18Root{display:block!important;width:100%!important;max-width:700px!important;margin:0 auto!important;min-height:100vh!important;overflow:hidden!important}

  /* application banner */
  #appBanner.app-banner{position:relative!important;inset:auto!important;transform:none!important;display:grid!important;grid-template-columns:24px 46px minmax(0,1fr) 126px!important;align-items:center!important;gap:7px!important;width:100%!important;min-width:0!important;margin:0!important;padding:8px 9px!important;border:0!important;border-bottom:2px solid #ff3434!important;border-radius:0 0 16px 16px!important;background:linear-gradient(180deg,#ef0b0b,#b20000 72%,#790000)!important;box-shadow:inset 0 -3px rgba(255,255,255,.12),0 3px 8px rgba(0,0,0,.34)!important;color:#fff!important;backdrop-filter:none!important;z-index:auto!important}
  #appBanner #appClose{display:block!important;width:24px!important;height:34px!important;padding:0!important;border:0!important;background:transparent!important;color:#ffe63a!important;font-size:20px!important}
  #appBanner .app-icon{display:grid!important;place-items:center!important;width:46px!important;height:46px!important;border-radius:4px!important;background:#260004!important;overflow:hidden!important}
  #appBanner .app-icon img{display:block!important;width:44px!important;height:44px!important;object-fit:contain!important}
  #appBanner strong{display:block!important;color:#ffe23d!important;font:900 18px/1.05 Arial,sans-serif!important}
  #appBanner small{display:block!important;margin-top:4px!important;color:#fff!important;font:500 11px/1.15 Arial,sans-serif!important}
  #appBanner .app-action{height:42px!important;padding:0 17px!important;border:2px solid rgba(255,255,255,.64)!important;border-radius:24px!important;background:linear-gradient(180deg,#eb1414,#940000)!important;color:#fff!important;font:700 15px/1 Arial,sans-serif!important;box-shadow:inset 0 0 0 3px rgba(255,255,255,.07)!important}

  /* brand header */
  .topbar{position:relative!important;top:auto!important;z-index:auto!important;margin:0!important;border:0!important;background:linear-gradient(180deg,#3d0004,#220002)!important;box-shadow:none!important}
  .topbar-inner{min-height:94px!important;display:flex!important;align-items:center!important;justify-content:space-between!important;gap:12px!important;padding:13px 32px!important;border:0!important;background:transparent!important;box-shadow:none!important}
  .sbototo-native-brand{display:flex!important;align-items:center!important;width:auto!important;min-width:0!important;margin:0!important;padding:0!important}
  .brand-logo-native{display:block!important;width:245px!important;max-width:62vw!important;height:auto!important;max-height:66px!important;object-fit:contain!important;filter:drop-shadow(0 3px 5px rgba(0,0,0,.65))!important}
  .brand-tagline,.mobile-toggle{display:none!important}
  .mobile-livechat-v18{display:flex!important;align-items:center!important;justify-content:center!important;flex:0 0 auto!important;min-width:94px!important;height:48px!important;padding:0 16px!important;border:2px solid #fff!important;border-radius:28px!important;background:linear-gradient(180deg,#ffe238,#dfac00)!important;color:#2c1700!important;text-decoration:none!important;font:700 14px/1 Arial,sans-serif!important;box-shadow:0 2px 5px rgba(0,0,0,.35)!important}

  /* info strip */
  .ticker-wrap{margin:0!important;border:1px solid #8c2529!important;border-left:0!important;border-right:0!important;background:#4b0005!important;box-shadow:none!important}
  .ticker-grid{height:31px!important;display:block!important;border:0!important;background:#4b0005!important}
  .ticker-label{display:none!important}
  .ticker-track{height:31px!important;display:flex!important;align-items:center!important;padding:0 10px!important;overflow:hidden!important;background:#500005!important;color:#fff!important;font:500 13px/1 Arial,sans-serif!important;text-transform:uppercase!important}
  .ticker-content{white-space:nowrap!important;animation:r690Ticker 27s linear infinite!important}

  /* first hero fixed to the supplied independence banner */
  .hero{position:relative!important;width:100%!important;height:auto!important;min-height:0!important;aspect-ratio:840/480!important;margin:0!important;border:0!important;border-radius:0!important;background:#280003!important;box-shadow:none!important;overflow:hidden!important}
  .hero::before,.hero::after,.hero-arrow,.hero-dots{display:none!important}
  .hero-slide{display:none!important}
  .hero-slide:first-of-type{position:absolute!important;inset:0!important;display:block!important;width:100%!important;height:100%!important;min-height:0!important;padding:0!important;opacity:1!important;pointer-events:auto!important;transform:none!important}
  .hero-banner-link,.hero-banner-media,.hero-banner-media img{display:block!important;width:100%!important;height:100%!important}
  .hero-banner-media img{object-fit:cover!important;object-position:center!important}

  /* five visual shortcut tiles */
  .mobile-quick-v18{position:relative!important;z-index:3!important;display:grid!important;grid-template-columns:repeat(5,minmax(0,1fr))!important;gap:4px!important;margin:-3px 10px 0!important;padding:0!important}
  .mobile-quick-v18 a{position:relative!important;min-width:0!important;aspect-ratio:1/1!important;display:flex!important;flex-direction:column!important;align-items:center!important;justify-content:flex-end!important;gap:3px!important;padding:7px 3px!important;overflow:hidden!important;border:2px solid #d5a418!important;border-radius:0!important;background:linear-gradient(160deg,#d51b21,#790007)!important;color:#fff!important;text-decoration:none!important;box-shadow:inset 0 0 0 3px rgba(255,198,39,.12),0 2px 4px rgba(0,0,0,.28)!important}
  .mobile-quick-v18 a::before{content:"";position:absolute!important;inset:7px 9px 24px!important;border:1px solid rgba(255,218,100,.55)!important;background:radial-gradient(circle at 50% 40%,rgba(255,213,74,.24),transparent 55%)!important}
  .mobile-quick-v18 .ui-icon-host{position:relative!important;z-index:2!important;width:34px!important;height:34px!important;color:#ffe969!important;filter:drop-shadow(0 2px 3px rgba(0,0,0,.5))!important}
  .mobile-quick-v18 b{position:relative!important;z-index:2!important;display:block!important;font:900 7.2px/1.05 Arial,sans-serif!important;text-align:center!important;text-transform:uppercase!important}

  /* login */
  .mobile-login-section-v18{padding:13px 23px 8px!important;background:transparent!important}
  .mobile-login-title-v18{margin:0 0 10px!important;color:#eee6e6!important;font:500 17px/1.2 Arial,sans-serif!important;text-align:center!important;text-shadow:0 1px 2px #000!important}
  #loginForm.login-form{display:flex!important;flex-direction:column!important;gap:10px!important;width:100%!important;margin:0!important;padding:0!important}
  #loginForm>input{display:none!important}
  .mobile-login-field-v18{position:relative!important;display:grid!important;grid-template-columns:58px minmax(0,1fr)!important;align-items:center!important;width:100%!important;height:54px!important;border:1px solid #d4b238!important;border-radius:29px!important;background:#fff!important;overflow:hidden!important;box-shadow:0 2px 7px rgba(0,0,0,.30)!important}
  .mobile-login-icon-v18{display:grid!important;place-items:center!important;width:58px!important;height:100%!important;border-right:1px solid #d4b238!important;background:#070707!important;color:#ffec00!important;font-size:23px!important}
  .mobile-login-field-v18 input{display:block!important;width:100%!important;height:100%!important;margin:0!important;padding:0 42px 0 16px!important;border:0!important;background:#fff!important;color:#3d3436!important;font:500 16px/1 Arial,sans-serif!important;box-shadow:none!important;outline:0!important;text-align:center!important}
  .mobile-login-field-v18 input::placeholder{color:#958b8e!important;opacity:1!important}
  .mobile-pass-eye-v18{position:absolute!important;right:11px!important;top:50%!important;transform:translateY(-50%)!important;width:34px!important;height:34px!important;border:0!important;background:transparent!important;color:#706a6c!important;font-size:20px!important}
  .mobile-lite-v18{display:flex!important;align-items:center!important;gap:10px!important;width:max-content!important;margin:0 0 1px 3px!important;color:#eee4e4!important;font:500 16px/1 Arial,sans-serif!important}
  .mobile-lite-v18 input{position:absolute!important;opacity:0!important;pointer-events:none!important}
  .mobile-lite-v18 i{position:relative!important;width:44px!important;height:20px!important;border-radius:20px!important;background:#6c6c6c!important;box-shadow:inset 0 1px 3px rgba(0,0,0,.55)!important}
  .mobile-lite-v18 i::after{content:"";position:absolute!important;left:2px!important;top:2px!important;width:16px!important;height:16px!important;border-radius:50%!important;background:#fff!important;transition:.18s!important}
  .mobile-lite-v18 input:checked+i{background:#d8ad11!important}.mobile-lite-v18 input:checked+i::after{left:26px!important}
  #loginForm .btn{display:flex!important;align-items:center!important;justify-content:center!important;width:100%!important;height:51px!important;min-height:51px!important;margin:0!important;padding:0 18px!important;border-radius:28px!important;text-decoration:none!important;font:500 22px/1 Arial,sans-serif!important;letter-spacing:0!important}
  #loginForm .btn .ui-icon-host{display:none!important}
  #loginForm .btn-login{order:90!important;border:1px solid #d7a600!important;background:linear-gradient(180deg,#ffec00,#f3ca00)!important;color:#211700!important;box-shadow:inset 0 1px rgba(255,255,255,.75),0 2px 6px rgba(0,0,0,.35)!important}
  #loginForm .btn-register{order:91!important;border:1px solid #ff333c!important;background:linear-gradient(180deg,#e40c15,#a5000a)!important;color:#fff!important;box-shadow:inset 0 1px rgba(255,255,255,.16),0 2px 6px rgba(0,0,0,.35)!important}

  .mobile-search-brand-v18{display:flex!important;flex-direction:column!important;align-items:center!important;gap:9px!important;margin:8px 23px 15px!important;color:#fff!important;text-decoration:none!important;font:500 16px/1.2 Arial,sans-serif!important}
  .mobile-search-brand-v18 b{display:flex!important;align-items:center!important;justify-content:center!important;width:92%!important;min-height:46px!important;padding:0 16px!important;border:3px solid #ffe000!important;border-radius:26px!important;background:#070707!important;color:#ffe000!important;font:800 18px/1 Arial,sans-serif!important;letter-spacing:1.4px!important;overflow:hidden!important;white-space:nowrap!important}

  /* member help block */
  .mobile-help-v18{padding:8px 18px 15px!important;background:transparent!important}
  .mobile-help-v18 .help-pill{display:flex!important;align-items:center!important;justify-content:center!important;width:88%!important;min-height:53px!important;margin:0 auto 9px!important;padding:0 14px!important;border:1px solid #ffc800!important;border-radius:30px!important;background:linear-gradient(180deg,#ffed00,#f2c600)!important;color:#382000!important;text-decoration:none!important;font:500 21px/1 Arial,sans-serif!important;box-shadow:0 3px 7px rgba(0,0,0,.30)!important}
  .mobile-help-v18>p{margin:3px 0 11px!important;color:#fff!important;font:500 15px/1.3 Arial,sans-serif!important;text-align:center!important;text-shadow:0 1px 2px #000!important}
  .mobile-help-grid-v18{display:grid!important;grid-template-columns:1fr 1fr!important;gap:9px!important}
  .mobile-help-card-v18{display:grid!important;grid-template-columns:56px minmax(0,1fr)!important;align-items:center!important;min-height:65px!important;padding:4px 7px!important;border:2px solid #fff!important;border-radius:7px!important;background:linear-gradient(180deg,#f6f6f6,#b7b7b7)!important;color:#111!important;text-decoration:none!important;box-shadow:0 2px 6px rgba(0,0,0,.42)!important;overflow:hidden!important}
  .mobile-help-card-v18 .help-logo{display:grid!important;place-items:center!important;width:50px!important;height:50px!important;border-radius:50%!important;background:#178f35!important;color:#fff!important;font:900 24px/1 Arial,sans-serif!important;box-shadow:inset 0 0 0 4px rgba(255,255,255,.8)!important}
  .mobile-help-card-v18.fb .help-logo{background:#2468bd!important}.mobile-help-card-v18.chat .help-logo{background:#dc7300!important}.mobile-help-card-v18.tg .help-logo{background:#249bd2!important}
  .mobile-help-card-v18 strong{display:block!important;font:900 11px/1.05 Arial,sans-serif!important;text-transform:uppercase!important}.mobile-help-card-v18 b{display:block!important;margin-top:5px!important;font:1000 16px/1 Arial,sans-serif!important;text-transform:uppercase!important}

  /* results board */
  .mobile-results-v18{margin:0 13px!important;padding:14px 13px 18px!important;border:1px solid rgba(255,184,28,.48)!important;border-radius:14px!important;background:linear-gradient(180deg,rgba(57,0,6,.94),rgba(31,0,3,.94))!important;box-shadow:0 3px 10px rgba(0,0,0,.38),inset 0 0 20px rgba(167,0,10,.12)!important}
  .mobile-results-title-v18{display:flex!important;align-items:center!important;justify-content:space-between!important;gap:10px!important;margin:0 0 14px!important;padding:0 1px!important}
  .mobile-results-title-v18 h2{margin:0!important;color:#fff!important;font:500 24px/1 Arial,sans-serif!important}.mobile-results-title-v18 time{color:#fff!important;font:500 16px/1 Arial,sans-serif!important}
  .mobile-market-search-v18{display:grid!important;grid-template-columns:48px minmax(0,1fr)!important;height:51px!important;margin:0 0 14px!important;border:4px solid #ffe000!important;border-radius:8px!important;background:#050505!important;overflow:hidden!important}
  .mobile-market-search-v18 span{display:grid!important;place-items:center!important;background:#ffdc00!important;color:#fff!important;font-size:27px!important}.mobile-market-search-v18 input{width:100%!important;height:100%!important;padding:0 13px!important;border:0!important;background:#050505!important;color:#fff!important;font:500 17px/1 Arial,sans-serif!important;outline:0!important}.mobile-market-search-v18 input::placeholder{color:#c2b8ba!important}
  .mobile-result-grid-v18{display:grid!important;grid-template-columns:repeat(4,minmax(0,1fr))!important;gap:10px 8px!important}
  .mobile-result-card-v18{display:grid!important;grid-template-rows:27px 20px 1fr!important;min-width:0!important;min-height:105px!important;border:1px solid #bf252d!important;border-radius:9px!important;background:linear-gradient(180deg,#710009,#480005)!important;overflow:hidden!important;color:#fff!important;text-decoration:none!important;box-shadow:0 2px 5px rgba(0,0,0,.30)!important}
  .mobile-result-card-v18 strong{display:flex!important;align-items:center!important;justify-content:center!important;padding:2px 3px!important;background:linear-gradient(180deg,#ffec00,#f4ca00)!important;color:#331800!important;font:900 7.2px/1 Arial,sans-serif!important;text-align:center!important;text-transform:uppercase!important;overflow:hidden!important}
  .mobile-result-date-v18{display:flex!important;align-items:center!important;justify-content:center!important;color:#fff!important;font:700 7.4px/1 Arial,sans-serif!important}
  .mobile-result-number-v18{display:flex!important;align-items:center!important;justify-content:center!important;padding-bottom:7px!important;color:#fff000!important;font:1000 22px/1 Arial,sans-serif!important;letter-spacing:.4px!important;text-shadow:0 1px 2px #000!important}
  .mobile-result-card-v18[hidden]{display:none!important}
  .mobile-show-more-v18{display:block!important;min-width:220px!important;height:51px!important;margin:22px auto 0!important;padding:0 24px!important;border:0!important;border-radius:7px!important;background:linear-gradient(180deg,#e71a1a,#a40000)!important;color:#fff!important;font:700 17px/1 Arial,sans-serif!important;box-shadow:0 3px 7px rgba(0,0,0,.38)!important}

  /* news */
  .mobile-news-v18{margin:10px 13px 0!important;overflow:hidden!important;border:1px solid rgba(255,185,30,.42)!important;border-radius:11px!important;background:rgba(48,0,5,.92)!important}
  .mobile-news-v18 h2{margin:0!important;padding:9px 12px!important;background:linear-gradient(180deg,#a8101a,#720008)!important;color:#fff3d0!important;font:900 15px/1 Arial,sans-serif!important}
  .mobile-news-v18 article{display:grid!important;grid-template-columns:minmax(0,1fr) auto!important;gap:8px!important;padding:12px!important;border-top:1px solid rgba(255,255,255,.07)!important}.mobile-news-v18 a{color:#fff!important;text-decoration:none!important;font:800 10px/1.2 Arial,sans-serif!important}.mobile-news-v18 time{color:#ac9b9e!important;font:500 8px/1 Arial,sans-serif!important}

  /* full-width supplied promo artwork only */
  .mobile-promos-v18{display:grid!important;grid-template-columns:1fr!important;gap:3px!important;width:100%!important;margin:10px 0 0!important;padding:0!important;background:#220003!important}
  .mobile-promos-v18 a{display:block!important;width:100%!important;margin:0!important;padding:0!important;border:0!important}
  .mobile-promos-v18 img{display:block!important;width:100%!important;height:auto!important;aspect-ratio:840/480!important;object-fit:cover!important;border:0!important;border-radius:0!important}

  /* bank */
  .mobile-bank-v18{margin:0!important;padding:21px 17px 17px!important;background:rgba(28,0,3,.90)!important}
  .mobile-bank-v18 h2{margin:0 0 14px!important;color:#fff!important;font:500 26px/1 Arial,sans-serif!important;text-align:center!important}
  .mobile-bank-grid-v18{display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:9px!important}
  .mobile-bank-item-v18{position:relative!important;display:flex!important;align-items:center!important;justify-content:center!important;min-height:48px!important;padding:12px 5px 5px!important;border-radius:7px!important;background:#fff!important;box-shadow:0 1px 4px rgba(0,0,0,.30)!important;overflow:hidden!important}
  .mobile-bank-item-v18 img{display:block!important;max-width:91%!important;max-height:28px!important;object-fit:contain!important}
  .mobile-online-badge-v18{position:absolute!important;left:5px!important;top:4px!important;color:#14a92e!important;font:900 6.2px/1 Arial,sans-serif!important}
  .mobile-bank-legend-v18{display:flex!important;align-items:center!important;justify-content:space-around!important;gap:8px!important;margin:17px 0 0!important;padding:13px 8px!important;border-radius:8px!important;background:#171717!important;color:#fff!important;font:700 12px/1 Arial,sans-serif!important}
  .mobile-bank-legend-v18 span{display:flex!important;align-items:center!important;gap:7px!important}.mobile-bank-legend-v18 i{width:14px!important;height:14px!important;border-radius:50%!important}.mobile-bank-legend-v18 .on{background:#118d25!important}.mobile-bank-legend-v18 .warn{background:#726b00!important}.mobile-bank-legend-v18 .off{background:#8b1117!important}

  /* footer */
  .mobile-footer-v18{padding:22px 17px 16px!important;border-top:4px solid #f0c800!important;background:linear-gradient(180deg,rgba(40,0,4,.96),rgba(18,0,2,.98))!important;color:#fff!important}
  .mobile-footer-v18 h1{margin:0 0 9px!important;font:800 19px/1.15 Arial,sans-serif!important}.mobile-footer-v18 p{margin:0!important;color:#d0c1c3!important;font:500 10px/1.55 Arial,sans-serif!important}
  .mobile-footer-v18 h2{margin:19px 0 10px!important;color:#f1ca54!important;font:900 11px/1 Arial,sans-serif!important;text-transform:uppercase!important}
  .mobile-footer-social-v18{display:grid!important;grid-template-columns:repeat(4,minmax(0,1fr))!important;gap:7px!important}.mobile-footer-social-v18 a{display:flex!important;align-items:center!important;justify-content:center!important;min-height:43px!important;border:1px solid #8c1c22!important;border-radius:5px!important;background:#470006!important;color:#fff!important;text-decoration:none!important;font:800 8px/1 Arial,sans-serif!important;text-align:center!important}
  .mobile-footer-nav-v18{display:grid!important;grid-template-columns:repeat(4,minmax(0,1fr))!important;gap:5px!important;margin-top:20px!important}.mobile-footer-nav-v18 a{display:flex!important;align-items:center!important;justify-content:center!important;min-height:38px!important;border:1px solid #5b1418!important;background:#310004!important;color:#d8c8ca!important;text-decoration:none!important;font:700 7px/1 Arial,sans-serif!important;text-align:center!important}
  .mobile-footer-copy-v18{margin-top:14px!important;padding-top:11px!important;border-top:1px solid rgba(255,255,255,.07)!important;color:#796a6d!important;font:500 7px/1 Arial,sans-serif!important;text-align:center!important}

  /* floating menu, reference left side */
  .asean-circle-menu{position:fixed!important;left:13px!important;right:auto!important;bottom:58px!important;z-index:160!important}.asean-circle-menu__toggle{width:55px!important;height:55px!important;border:2px solid rgba(255,255,255,.55)!important;border-radius:9px!important;background:linear-gradient(180deg,#d30c17,#910007)!important;color:#fff!important;box-shadow:0 3px 9px rgba(0,0,0,.48)!important}.asean-circle-menu__toggle span{font-size:29px!important;line-height:1!important}.asean-circle-menu__items{left:0!important;right:auto!important;bottom:62px!important}.asean-circle-menu__link{background:#3e0005!important;border-color:#9f1b23!important}
  .app-banner[hidden]{display:none!important}
  .mobile-lite-active-v18 .mobile-promos-v18 img{filter:saturate(.86) brightness(.9)!important}.mobile-lite-active-v18 *{animation:none!important;transition:none!important}
}
@media (max-width:420px){
  #appBanner.app-banner{grid-template-columns:20px 40px minmax(0,1fr) 105px!important;padding:7px!important}.app-banner strong{font-size:15px!important}.app-banner small{font-size:9px!important}.topbar-inner{padding:10px 22px!important;min-height:82px!important}.brand-logo-native{width:205px!important}.mobile-livechat-v18{min-width:82px!important;height:43px!important;padding:0 12px!important;font-size:12px!important}.mobile-result-grid-v18{gap:7px 5px!important}.mobile-result-card-v18{min-height:94px!important;grid-template-rows:24px 18px 1fr!important}.mobile-result-number-v18{font-size:18px!important}.mobile-result-card-v18 strong{font-size:6.4px!important}.mobile-help-card-v18{grid-template-columns:45px minmax(0,1fr)!important;min-height:58px!important}.mobile-help-card-v18 .help-logo{width:40px!important;height:40px!important;font-size:19px!important}.mobile-help-card-v18 strong{font-size:8.5px!important}.mobile-help-card-v18 b{font-size:13px!important}
}
