<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Gamma World Die Roller</title>
<link rel="stylesheet" type="text/css" href="../assets/css/styles.css">
<script src="../assets/js/config.js"></script>
<script src="../assets/js/rolldice.js" defer></script>
</head>
<body>
<h2>Roll Dice</h2>
<div class="content-container">
<form id="diceForm">
<div class="form-row">
<div class="form-field">
<label for="quantity">Quantity:</label>
<input type="number" name="quantity" id="quantity" min="1" max="100" value="4">
</div>
<div class="form-field">
<label for="geometry">Geometry:</label>
<input type="number" name="geometry" id="geometry" min="2" max="100" value="6">
</div>
</div>
<div class="form-row">
<div class="form-field">
<label for="discard">Discard Lowest Roll</label><input type="checkbox" name="discard" id="discard"/>
</div>
<div class="form-field">
<button type="submit">Roll</button>
</div>
</div>
</form>
</div>
<hr/>
<div id="results"></div>
</body>
</html>