@import "https://fonts.googleapis.com/css2?family=Gowun+Batang:wght@700&display=swap";

/* Korean popup headings use the selected storybook typeface. */
html[lang="ko"] #rulesTitle,
html[lang="ko"] #betLimitsTitle,
html[lang="ko"] #ledgerTitle{
  font-family:"Gowun Batang","Noto Serif KR","Batang",serif;
  font-weight:700;
}
#rulesModal{padding:8px}
#rulesModal,#betLimitsModal{
  background:rgba(3,2,4,.6);
  backdrop-filter:blur(12px);
  -webkit-backdrop-filter:blur(12px);
}
#rulesModal .rulesCard{
  width:min(1100px,96vw);height:min(92vh,860px);height:min(92dvh,860px);
  max-height:none;padding:0;border:0;border-radius:0;background:none;
  box-shadow:none;overflow:hidden;isolation:isolate;
}
#rulesModal .rulesCard::before{
  content:"";position:absolute;inset:0;width:auto;height:auto;border-radius:0;
  background:linear-gradient(145deg,rgba(139,84,48,.96),rgba(42,16,30,.98) 12%,rgba(14,6,12,.98) 88%,rgba(139,84,48,.96));
  border:2px solid #b78750;border-radius:24px;
  pointer-events:none;z-index:2;
}
#rulesModal .rulesCard::after{
  content:"";position:absolute;inset:14% 7% 17%;z-index:-1;
  background:rgba(14,6,12,.75);border-radius:20px;
}
#rulesModal .rulesModalHeader{position:absolute;top:24%;left:11%;right:15%}
#rulesModal .rulesTitle{margin:5px 0 8px;font-size:clamp(23px,3.5vw,38px)}
#rulesModal .rulesScroll{
  position:absolute;top:35%;bottom:20%;left:10%;right:10%;
  min-height:0;overflow-y:auto;padding-right:10px;
}
#rulesModal .rulesGrid{grid-template-columns:minmax(0,1fr)}
#rulesModal .rulesSection{background:transparent;box-shadow:none}
#rulesModal .rulesPaytable th{background:transparent}
#rulesModal .rulesClose{
  top:19%;right:7.1%;width:7.3%;height:11%;min-width:32px;min-height:32px;
  z-index:3;padding:0;border:0;background:transparent;box-shadow:none;
  color:transparent;text-shadow:none;border-radius:8px;
}
#rulesModal .rulesClose:hover{background:rgba(255,200,90,.15)}
#rulesModal .rulesClose:focus-visible{outline:2px solid #ffe6a4;outline-offset:2px}
#rulesModal .rulesPaytable{min-width:0}
@media(max-width:599px){
  #rulesModal .rulesSection{padding:10px 8px}
  #rulesModal .rulesSymbolCell{gap:4px}
  #rulesModal .rulesSymbolCell img{width:26px;height:26px}
  #rulesModal .rulesPaytable{font-size:11px}
  #rulesModal .rulesKicker{letter-spacing:.15em}
}
@media(max-height:550px){
  #rulesModal .rulesTitle{font-size:24px;margin:3px 0}
  #rulesModal .rulesKicker{font-size:8px}
  #rulesModal .rulesScroll{top:37%}
}