* {
  box-sizing: border-box;
}

html,
body {
  margin: 0;
  min-height: 100%;
  background: #020914;
}

body {
  display: grid;
  place-items: start center;
  overflow-x: hidden;
  font-family: Arial, sans-serif;
}

.events-shell {
  position: relative;
  width: min(100vw, 1536px);
  aspect-ratio: 1536 / 1024;
  min-width: 320px;
  background: #020914;
  box-shadow: 0 0 48px rgba(235, 154, 44, 0.14);
}

.events-art {
  display: block;
  width: 100%;
  height: auto;
  user-select: none;
  -webkit-user-drag: none;
}

.events-hotspots {
  position: absolute;
  inset: 0;
  pointer-events: none;
}

.events-hotspot {
  position: absolute;
  display: block;
  pointer-events: auto;
  border-radius: 8px;
  color: transparent;
  text-decoration: none;
}

.events-hotspot:focus-visible {
  outline: 3px solid rgba(255, 194, 72, 0.95);
  outline-offset: 2px;
}

.nav-home { left: 18.5547%; top: 0%; width: 5.4688%; height: 7.1289%; }
.nav-news { left: 24.1536%; top: 0%; width: 5.5339%; height: 7.1289%; }
.nav-info { left: 29.7526%; top: 0%; width: 6.7057%; height: 7.1289%; }
.nav-download { left: 36.5234%; top: 0%; width: 7.6823%; height: 7.1289%; }
.nav-topup { left: 44.2708%; top: 0%; width: 5.7292%; height: 7.1289%; }
.nav-ranking { left: 50.0651%; top: 0%; width: 5.9245%; height: 7.1289%; }
.nav-event { left: 56.0547%; top: 0%; width: 5.6641%; height: 7.1289%; }
.nav-contact { left: 61.7839%; top: 0%; width: 7.0964%; height: 7.1289%; }
.nav-discord { left: 78.7760%; top: 1.1719%; width: 9.5703%; height: 4.4922%; }
.nav-login { left: 89.0625%; top: 1.0742%; width: 8.6589%; height: 4.6875%; }

.category-all { left: 1.1719%; top: 26.7578%; width: 13.6068%; height: 5.3711%; }
.category-woe { left: 1.1719%; top: 33.6914%; width: 13.6068%; height: 5.3711%; }
.category-gvg { left: 1.1719%; top: 39.8438%; width: 13.6068%; height: 5.3711%; }
.category-daily { left: 1.1719%; top: 45.9961%; width: 13.6068%; height: 5.3711%; }
.category-weekly { left: 1.1719%; top: 52.1484%; width: 13.6068%; height: 5.3711%; }
.category-seasonal { left: 1.1719%; top: 58.3008%; width: 13.6068%; height: 5.3711%; }
.category-special { left: 1.1719%; top: 64.4531%; width: 13.6068%; height: 5.3711%; }
.view-rewards { left: 2.4089%; top: 83.1055%; width: 11.1979%; height: 4.1016%; }

.woe-card { left: 16.8620%; top: 29.3945%; width: 22.6563%; height: 26.6602%; }
.gvg-card { left: 40.2995%; top: 29.3945%; width: 22.6563%; height: 26.6602%; }
.daily-mission { left: 17.2526%; top: 65.0391%; width: 18.1641%; height: 3.7109%; }
.kill-monsters { left: 17.2526%; top: 69.0430%; width: 18.1641%; height: 3.7109%; }
.mvp-hunting { left: 17.2526%; top: 73.0469%; width: 18.1641%; height: 3.7109%; }
.zeny-quest { left: 17.2526%; top: 77.0508%; width: 18.1641%; height: 3.7109%; }
.weekly-mission { left: 44.5964%; top: 65.0391%; width: 16.4714%; height: 3.7109%; }
.instance-dungeon { left: 44.5964%; top: 69.0430%; width: 16.4714%; height: 3.7109%; }
.guild-contribution { left: 44.5964%; top: 73.0469%; width: 16.4714%; height: 3.7109%; }
.weekly-mvp { left: 44.5964%; top: 77.0508%; width: 16.4714%; height: 3.7109%; }

.full-calendar { left: 88.8672%; top: 26.0742%; width: 8.2031%; height: 4.0039%; }
.summer-festival { left: 64.5833%; top: 50.1953%; width: 32.2917%; height: 9.4727%; }
.double-exp { left: 64.5833%; top: 67.1875%; width: 32.2917%; height: 6.4453%; }
.daily-login { left: 64.5833%; top: 73.9258%; width: 32.2917%; height: 6.4453%; }
.hunting-event { left: 64.5833%; top: 80.6641%; width: 32.2917%; height: 6.4453%; }

.footer-patch { left: 16.6016%; top: 91.2109%; width: 14.1927%; height: 4.8828%; }
.footer-guide { left: 32.2266%; top: 91.2109%; width: 13.2813%; height: 4.8828%; }
.footer-ranking { left: 48.2422%; top: 91.2109%; width: 14.1927%; height: 4.8828%; }
.footer-discord { left: 65.2995%; top: 91.2109%; width: 16.2760%; height: 4.8828%; }