*{box-sizing:border-box}html,body{margin:0;max-width:100%;overflow-x:hidden;background:#070101;color:#fff6e4;font-family:Inter,system-ui,-apple-system,"Segoe UI",Arial,sans-serif}body{min-height:100dvh}.app{max-width:1180px;margin:auto;padding:8px}.head{min-height:44px;display:flex;justify-content:space-between;align-items:center;gap:8px;padding:6px 10px;border:1px solid #ffffff14;border-radius:11px;background:#0e0303}.brand{font-size:14px;font-weight:950;letter-spacing:.06em;color:#fff6e4;text-decoration:none;cursor:pointer}.brand small{display:block;font-size:14px;color:#ab8980;margin-top:2px}.nav,.markets{display:flex;gap:4px}.nav a,.markets button{border:1px solid #ffffff18;background:#ffffff06;color:#d6b7ad;border-radius:8px;font-size:14px;font-weight:900;min-height:34px;padding:0 10px;white-space:nowrap}.nav a{display:grid;place-items:center;text-decoration:none}.nav a.on{background:#a20c15;color:#fff}.markets{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));margin:6px 0}.markets button{min-width:0;padding:0 4px}.markets button.on{background:linear-gradient(#ffe197,#ffb33b);color:#280706;border-color:#ffd36a}.panel{background:#fff;color:#171717;border:1px solid #cfcfcf;border-radius:18px;padding:14px}.ptop{display:flex;justify-content:space-between;align-items:center;gap:8px}.ptop b,.meta,.stat,.src,.setTitle,.role,.extraHead,.hdate,.dateHistoryHead,.dateHistoryCount,.dateHistoryDates button,.historyExtraTitle,.ha button{font-size:14px!important}.meta,.src{color:#5e5e5e;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.stat{font-weight:950;color:#1f9d55}.resultBoard{display:grid;grid-template-rows:auto auto;gap:12px;min-width:0}.top3{width:min(440px,92vw);margin:auto;display:grid;grid-template-rows:repeat(3,84px);gap:2px}.lower{display:grid;grid-template-columns:minmax(0,1fr) 10px minmax(0,1fr)}.set{display:grid;grid-template-rows:auto auto;gap:6px;padding:8px;border:1px solid #bdbdbd;border-radius:12px;background:#fff;min-width:0;overflow:hidden}.set.left{grid-column:1}.set.right{grid-column:3}.setTitle{text-align:center;color:#8b1119;font-weight:950;letter-spacing:.08em}.setGrid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));grid-template-rows:repeat(5,64px);gap:1px}.cell{position:relative;display:grid;place-items:center;border:1px solid #b8b8b8;border-radius:7px;background:#fff;color:#111;min-width:0;overflow:hidden}.cell.top{height:84px}.cell:not(.top){height:64px}.role{position:absolute;left:10px;top:8px;color:#8b1119;font-weight:950}.val{display:block;width:100%;padding:0 1px;text-align:center;overflow:hidden;white-space:nowrap;font-size:clamp(28px,3vw,36px);font-weight:950;letter-spacing:.035em}.cell.top .val{font-size:clamp(38px,4vw,46px)}.macauExtras{display:none;gap:8px;margin-top:8px}.panel.macau-mode .macauExtras{display:grid}.extraCard{border:1px solid #bdbdbd;border-radius:14px;padding:8px 12px;background:#fff}.extraHead{display:flex;justify-content:flex-start;color:#8b1119;font-weight:950}.poolWrap{display:grid;place-items:center;padding:6px}.poolBall{width:80px;aspect-ratio:1;border-radius:50%;border:1px solid #9b9b9b;display:grid;place-items:center;font-size:30px;font-weight:950;color:#111}.sevenGrid{display:grid;grid-template-columns:repeat(6,minmax(0,1fr)) 22px minmax(0,1fr);grid-template-rows:68px;gap:1px;align-items:stretch}.sevenBox{border:1px solid #b8b8b8;border-radius:5px;display:grid;place-items:center;font-size:30px;font-weight:950;color:#111;min-width:0}.totoPlus{display:grid;place-items:center;font-size:28px;font-weight:950;line-height:1;color:#8b1119}.src{margin-top:8px}.hist>.markets{grid-template-columns:repeat(7,minmax(0,1fr))}.dateHistory,.histTop,.hboardWrap,.historyExtra{background:#fff;color:#171717;border:1px solid #bdbdbd;border-radius:12px}.dateHistory{padding:8px 9px;margin-bottom:5px}.dateHistoryHead{display:flex;justify-content:space-between;color:#8b1119;font-weight:950}.dateHistoryDates{display:flex;gap:5px;overflow-x:auto;margin-top:7px}.dateHistoryDates button{flex:0 0 auto;min-height:32px;padding:0 10px;border:1px solid #b8b8b8;border-radius:7px;background:#fff;color:#333;font-weight:900}.dateHistoryDates button.on{border-color:#8b1119;color:#8b1119}.histTop{padding:10px;text-align:center;margin-bottom:5px}.hdate{color:#8b1119;font-weight:900}.hboardWrap{padding:10px}.ha{display:flex;justify-content:center;gap:5px;margin-top:6px}.ha button{min-height:44px;padding:0 14px;border:1px solid #ffffff18;border-radius:7px;background:#160808;color:#fff;font-weight:900}@media(max-width:767px){.app{padding:5px}.head{padding:5px 7px}.brand,.brand small,.nav a,.ptop b,.meta,.stat,.src,.setTitle,.role,.extraHead,.hdate,.dateHistoryHead,.dateHistoryCount,.dateHistoryDates button,.historyExtraTitle,.ha button{font-size:12px!important}.nav a{padding:0 8px}.markets{gap:2px;grid-template-columns:repeat(7,minmax(0,1fr))}.markets button{font-size:clamp(6px,1.8vw,10px)!important;min-height:35px;padding:0 1px}.panel{padding:6px}.top3{width:min(344px,100%);grid-template-rows:repeat(3,70px)}.cell.top{height:70px}.cell.top .val{font-size:clamp(27px,8.5vw,38px)}.lower{grid-template-columns:minmax(0,1fr) 4px minmax(0,1fr)}.set{padding:3px;gap:2px}.setGrid{grid-template-rows:repeat(5,54px)}.cell:not(.top){height:54px}.val{font-size:clamp(18px,6vw,28px)}.hist>.markets{grid-template-columns:repeat(7,minmax(0,1fr))}.sevenGrid{grid-template-columns:repeat(6,minmax(0,1fr)) 18px minmax(0,1fr);grid-template-rows:54px}.sevenBox{font-size:30px}.totoPlus{font-size:22px}}
/* RESULT_V38_PUBLISHED_ROLL */
.rollDigits{display:inline-flex;align-items:center;justify-content:center;gap:.035em;height:1.12em;line-height:1.12em;vertical-align:middle}.rollDigit{position:relative;display:inline-block;width:.68em;height:1.12em;line-height:1.12em;overflow:hidden;text-align:center;vertical-align:middle;font:inherit;font-variant-numeric:tabular-nums}.rollDigit.locked{overflow:visible}.rollTrack{position:absolute;left:0;top:0;width:100%;display:block;will-change:transform;transform:translate3d(0,0,0)}.rollNum{display:block;width:100%;height:1.12em;line-height:1.12em;text-align:center;font:inherit}
.drawTimer{margin-left:auto;color:#5e5e5e;font-weight:950;font-variant-numeric:tabular-nums;letter-spacing:.04em}
/* RESULT_V40_EXTRA_ROLL */
.poolBall.extraRolling,.sevenBox.extraRolling{position:relative;overflow:hidden}.extraRollTrack{position:absolute;left:0;top:0;width:100%;display:block;will-change:transform;transform:translate3d(0,0,0);font:inherit}.extraRollNum{display:block;width:100%;text-align:center;font:inherit}
.categories{display:flex;gap:4px;margin:0 0 6px}.categories[hidden]{display:none!important}.categories button{border:1px solid #ffffff18;background:#ffffff06;color:#d6b7ad;border-radius:8px;font-size:14px;font-weight:900;min-height:34px;padding:0 14px}.categories button.on{background:#a20c15;color:#fff}.singaporeToto{margin-top:8px}.singaporeToto[hidden]{display:none!important}.src{display:none!important}@media(max-width:767px){.categories button{font-size:12px;min-height:32px}}

@media(max-width:380px){.markets button{font-size:6px!important}}

.singaporeToto{margin-top:8px}
.panel.macau-mode .singaporeToto{display:none!important}


/* MACAU RB + TOTO — PREMIUM BALL LAYOUT */
#macauExtras .rbPremiumBoard{
  display:grid;
  grid-template-rows:minmax(0,1fr) auto;
  gap:12px;
  padding:8px 0 4px;
  overflow:hidden;
}
#macauExtras .rbMainRow{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  align-items:center;
  justify-items:center;
  gap:0;
}
#macauExtras .rbSession{
  display:grid;
  place-items:center;
  gap:5px;
  min-width:0;
}
#macauExtras .rbMainBall,
#macauExtras #sevenGrid .sevenBox{
  position:relative;
  box-sizing:border-box;
  display:grid;
  place-items:center;
  overflow:hidden;
  border-radius:50%;
  border:2px solid rgba(112,0,10,.88);
  color:#fffdfa;
  font-family:Inter,Arial,Helvetica,sans-serif;
  font-weight:950;
  font-variant-numeric:tabular-nums;
  line-height:1;
  letter-spacing:-.045em;
  text-shadow:0 1px 0 rgba(0,0,0,.24),0 2px 5px rgba(0,0,0,.26);
  background:
    radial-gradient(circle at 31% 23%,rgba(255,255,255,.92) 0 5%,rgba(255,255,255,.34) 6% 10%,transparent 11%),
    radial-gradient(circle at 36% 30%,#ff4b48 0%,#df111d 38%,#a60715 70%,#4b0108 100%);
  box-shadow:inset -8px -10px 15px rgba(47,0,4,.48),inset 6px 6px 11px rgba(255,255,255,.12),0 5px 12px rgba(0,0,0,.34);
}
#macauExtras .rbMainBall{
  width:68px;
  height:68px;
  font-size:30px;
}
#macauExtras .rbMainValue{position:relative;z-index:1}
#macauExtras .rbSessionTime{
  color:#8b1119;
  font-size:11px;
  font-weight:950;
  letter-spacing:.05em;
  line-height:1;
  white-space:nowrap;
}
#macauExtras .rbHistoryRow{
  display:grid;
  grid-template-columns:repeat(10,minmax(0,1fr));
  justify-items:center;
  align-items:center;
  gap:4px;
  overflow:hidden;
}
#macauExtras .rbHistoryBall{
  display:grid;
  place-items:center;
  width:28px;
  height:28px;
  border-radius:50%;
  border:1px solid rgba(112,0,10,.72);
  color:#fffdfa;
  font-family:Inter,Arial,Helvetica,sans-serif;
  font-size:13px;
  font-weight:900;
  font-variant-numeric:tabular-nums;
  line-height:1;
  letter-spacing:-.035em;
  background:
    radial-gradient(circle at 31% 23%,rgba(255,255,255,.72) 0 5%,rgba(255,255,255,.22) 6% 10%,transparent 11%),
    radial-gradient(circle at 36% 30%,#e53a3b 0%,#b20c18 43%,#760611 73%,#2d0105 100%);
  box-shadow:inset -4px -5px 7px rgba(47,0,4,.42),inset 3px 3px 5px rgba(255,255,255,.08),0 2px 5px rgba(0,0,0,.26);
}
#macauExtras .rbHistoryBall:nth-child(3n+2){
  background:
    radial-gradient(circle at 31% 23%,rgba(255,255,255,.76) 0 5%,rgba(255,255,255,.24) 6% 10%,transparent 11%),
    radial-gradient(circle at 36% 30%,#f04d37 0%,#ca1715 42%,#8c0910 72%,#350104 100%);
}
#macauExtras .rbHistoryBall:nth-child(3n){
  background:
    radial-gradient(circle at 31% 23%,rgba(255,255,255,.70) 0 5%,rgba(255,255,255,.20) 6% 10%,transparent 11%),
    radial-gradient(circle at 36% 30%,#d92c42 0%,#a00a1b 43%,#670611 73%,#270104 100%);
}
#macauExtras #sevenGrid{
  position:relative;
  grid-template-columns:repeat(6,minmax(0,1fr)) 22px minmax(0,1fr);
  grid-template-rows:68px;
  gap:4px;
  align-items:center;
}
#macauExtras #sevenGrid .sevenBox{
  width:60px;
  height:60px;
  min-width:0;
  justify-self:center;
  font-size:27px;
}
#macauExtras #sevenGrid .sevenBox:last-child{
  border:3px solid #f0cf72;
  background:
    radial-gradient(circle at 31% 23%,rgba(255,255,255,.90) 0 5%,rgba(255,255,255,.28) 6% 10%,transparent 11%),
    radial-gradient(circle at 36% 30%,#b72b3c 0%,#760918 42%,#4a0610 72%,#1c0105 100%);
}
#macauExtras #sevenGrid .totoPlus{
  color:#d8b65b;
  font-size:28px;
  font-weight:950;
}
@media(max-width:767px){
  #macauExtras .rbPremiumBoard{gap:8px;padding:6px 0 2px}
  #macauExtras .rbMainBall{width:min(12vw,48px);height:min(12vw,48px);font-size:min(6.4vw,26px)}
  #macauExtras .rbSessionTime{font-size:min(2.55vw,10.5px)}
  #macauExtras .rbHistoryRow{gap:1vw}
  #macauExtras .rbHistoryBall{width:min(6.25vw,25px);height:min(6.25vw,25px);font-size:min(3.05vw,12.5px)}
  #macauExtras #sevenGrid{grid-template-columns:repeat(6,minmax(0,1fr)) 18px minmax(0,1fr);grid-template-rows:54px;gap:2px}
  #macauExtras #sevenGrid .sevenBox{width:min(11vw,46px);height:min(11vw,46px);font-size:min(5.6vw,24px)}
  #macauExtras #sevenGrid .totoPlus{font-size:22px}
}


/* ACTIVE RB/TOTO ROLL — hide static value under vertical reel */
#macauExtras .rbMainBall.nanasUseResultContainerHost>.rbMainValue{
  color:transparent!important;
}
#macauExtras #sevenGrid.nanasUseResultContainerHost>.sevenBox{
  color:transparent!important;
}

/* RB CENTER LOCK — satu pusat untuk angka statis + spin */
#macauExtras .rbMainBall,
#macauExtras .rbHistoryBall{
  position:relative!important;
  text-indent:0!important;
  letter-spacing:0!important;
}
#macauExtras .rbMainValue,
#macauExtras .rbHistoryValue{
  position:absolute!important;
  inset:0!important;
  display:grid!important;
  place-items:center!important;
  margin:0!important;
  padding:0!important;
  text-align:center!important;
  line-height:1!important;
  letter-spacing:0!important;
  text-indent:0!important;
  font:inherit!important;
  font-variant-numeric:tabular-nums!important;
  font-feature-settings:"tnum" 1,"kern" 0!important;
  font-kerning:none!important;
  white-space:nowrap!important;
}
#macauExtras .rbMainBall .nanasSlotReel,
#macauExtras .rbMainBall .nanasSlotTrack{
  text-indent:0!important;
  letter-spacing:0!important;
  text-align:center!important;
  font-variant-numeric:tabular-nums!important;
  font-feature-settings:"tnum" 1,"kern" 0!important;
  font-kerning:none!important;
}
