<!doctype html>
<html lang="en">
	<head>
		<meta charset="utf-8">
		<meta name="description" content="A tool to simulate battles in Fire Emblem: Heroes.">
		<title>Fire Emblem: Heroes Damage Calculator</title>
		<link rel="icon" href="img/favicon.ico">
		<link rel="stylesheet" href="css/calc-style.css">
		<link rel="stylesheet" href="css/sorter.css">
		<link rel="stylesheet" href="css/select2.css">
		<link rel="stylesheet" href="css/multiple-select.css">
		<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
		<script type="text/javascript" src="scripts/select2.min.js"></script>
	</head>
	<body>
		<div id="calc-header">
			<h1>Fire Emblem: Heroes Damage Calculator</h1>
			<span>
				This calculator is no longer supported.
				<a href="https://github.com/winsomniak/kagero-calc">
					Click here to view the latest version.
				</a>
			</span>
		</div>
		<div id="wrapper">
			<div id="modes-container">
				<div id="modes" title="Select a mode of calculation.">
					<input id="one-vs-one" class="mode-button" type="radio" name="mode" value="one-vs-one" checked="checked" autocomplete="off">
					<label class="mode-button-label button-left" for="one-vs-one">One vs. One</label>
					<input id="one-vs-all" class="mode-button" type="radio" name="mode" value="one-vs-all" autocomplete="off">
					<label class="mode-button-label button-middle" for="one-vs-all">One vs. All</label>
					<input id="all-vs-one" class="mode-button" type="radio" name="mode" value="all-vs-one" autocomplete="off">
					<label class="mode-button-label button-right" for="all-vs-one">All vs. One</label>
				</div>
			</div>
			<div id="battle-result">
				<table id="result-table">
					<tr>
						<td>
							<div class="combat-char">
								<h3 class="attacker">Attacker</h3>
								<div class="combat-char-container">
									<img id="attacker-portrait" class="combat-portrait">
									<img id="attacker-weapon" class="weapon-icon">
									<img id="attacker-move" class="move-icon">
								</div><br>
								<span id="hp-remain-1" class="hp-remain"></span>
							</div>
						</td>
						<td>
							<div class="combat-char">
								<h3 class="defender">Defender</h3>
								<div class="combat-char-container">
									<img id="defender-portrait" class="combat-portrait">
									<img id="defender-weapon" class="weapon-icon">
									<img id="defender-move" class="move-icon">
								</div><br>
								<span id="hp-remain-2" class="hp-remain"></span>
							</div>
						</td>
					</tr>
				</table>
				<div>
					<p id="result-msg"></p>
				</div>
			</div>
			<div>
				<table id="calc">
					<tr id="char-panel">
						<td>
							<div class="char-info">
								<fieldset id="attack-panel" class="char-info-panel">
									<legend><h2 class="attacker">Attacker</h2></legend>
									<div class="char-slots-container">
										<div id="char-slots-1" class="info-section char-slots">
											<img id="atk-tab-0" class="char-tab-unselected" alt="A1" src="img/Portraits/Unselected.png" data-index="0" data-charnum="1">
											<img id="atk-tab-1" class="char-tab-unselected" alt="A2" src="img/Portraits/Unselected.png" data-index="1" data-charnum="1">
											<img id="atk-tab-2" class="char-tab-unselected" alt="A3" src="img/Portraits/Unselected.png" data-index="2" data-charnum="1">
											<img id="atk-tab-3" class="char-tab-unselected" alt="A4" src="img/Portraits/Unselected.png" data-index="3" data-charnum="1">
											<img id="atk-tab-4" class="char-tab-unselected" alt="A5" src="img/Portraits/Unselected.png" data-index="4" data-charnum="1">
										</div>
									</div>
									<div class="info-section character-select">
										<div>
											<label>
												<span id="extra-char-info-1-btn" class="collapse-button" data-section="extra-char-info-1">Character</span>
											</label>
											<select id="char-1" class="char-selector fancy-select" data-charnum="1"></select>
										</div>
										<div id="extra-char-info-1" class="collapsable">
											<div>
												<label>Color</label>
												<select id="color-1" class="color-selector" data-charnum="1">
													<option value="Red">Red</option>
													<option value="Green">Green</option>
													<option value="Blue">Blue</option>
													<option value="Colorless">Colorless</option>
												</select>
											</div>
											<div>
												<label>Weapon Type</label>
												<select id="weapon-type-1" class="weapon-type-selector" data-charnum="1">
													<option value="Sword">Sword</option>
													<option value="Red Tome">Red Tome</option>
													<option value="Red Breath">Red Breath</option>
													<option value="Axe">Axe</option>
													<option value="Green Tome">Green Tome</option>
													<option value="Green Breath">Green Breath</option>
													<option value="Lance">Lance</option>
													<option value="Blue Tome">Blue Tome</option>
													<option value="Blue Breath">Blue Breath</option>
													<option value="Bow">Bow</option>
													<option value="Dagger">Dagger</option>
													<option value="Staff">Staff</option>
												</select>
											</div>
											<div>
												<label>Move Type</label>
												<select id="move-type-1" class="move-type-selector" data-charnum="1">
													<option value="Infantry">Infantry</option>
													<option value="Cavalry">Cavalry</option>
													<option value="Flying">Flying</option>
													<option value="Armored">Armored</option>
												</select>
											</div>
										</div>
										<div id="char-build-info-1">
											<div>
												<label>Rarity</label>
												<select id="rarity-1" class="rarity-select build-select" data-charnum="1">
													<option value="5">5 Stars</option>
												</select>
											</div>
											<div>
												<label>Level</label>
												<select id="level-1" class="level-select build-select" data-charnum="1">
													<option value="40">Lvl. 40</option>
													<option value="1">Lvl. 1</option>
												</select><select id="merge-1" class="merge-select build-select" data-charnum="1" title="Merged units">
													<option value="0">+0</option>
													<option value="1">+1</option>
													<option value="2">+2</option>
													<option value="3">+3</option>
													<option value="4">+4</option>
													<option value="5">+5</option>
													<option value="6">+6</option>
													<option value="7">+7</option>
													<option value="8">+8</option>
													<option value="9">+9</option>
													<option value="10">+10</option>
												</select>
											</div>
											<div>
												<label>Boon/Bane</label>
												<select id="boon-1" class="boon-select build-select" data-charnum="1" title="Boon">
													<option value="neutral">Neutral</option>
													<option value="hp">+HP</option>
													<option value="atk">+ATK</option>
													<option value="spd">+SPD</option>
													<option value="def">+DEF</option>
													<option value="res">+RES</option>
												</select><select id="bane-1" class="bane-select build-select" data-charnum="1" title="Bane">
													<option value="neutral">Neutral</option>
													<option value="hp">-HP</option>
													<option value="atk">-ATK</option>
													<option value="spd">-SPD</option>
													<option value="def">-DEF</option>
													<option value="res">-RES</option>
												</select>
											</div>
										</div>
									</div>
									<div class="info-section weapon-select">
										<div>
											<label>
												<span id="extra-weapon-info-1-btn" class="collapse-button" data-section="extra-weapon-info-1">Weapon</span>
											</label>
											<select id="weapon-1" class="weapon-selector fancy-select" data-charnum="1"></select>
										</div>
										<div id="extra-weapon-info-1" class="extra-info collapsable">
											<div class="ability-desc-container">
												<p id="weapon-desc-1" class="ability-desc"></p>
											</div>
											<div>
												<label>Might</label>
												<span id="weapon-might-1" data-oldmt="0"></span>
											</div>
											<div>
												<label>Range</label>
												<span id="weapon-range-1"></span>
											</div>
											<div>
												<label>Magical</label>
												<span id="weapon-magical-1"></span>
											</div>
										</div>
										<div id="adjacent-block-1" class="adjacent-block">
											<label>Adjacent Allies</label>
											<select id="adjacent-1" class="adjacent-select battle-val" data-charnum="1">
												<option value="0">0</option>
												<option value="1">1</option>
												<option value="2">2</option>
												<option value="3">3</option>
												<option value="4">4</option>
											</select>
										</div>
									</div>
									<div id="skills-1" class="info-section skill-select">
										<div>
											<label class="passive-a-label">
												<span class="collapse-button" data-section="extra-passive-a-info-1">Passive Skill A</span>
											</label>
											<select id="passive-a-1" class="passive-selector fancy-select" data-charnum="1" data-skilltype="a"></select>
										</div>
										<div id="extra-passive-a-info-1" class="collapsable extra-info">
											<div class="ability-desc-container">
												<p id="passive-a-desc-1" class="ability-desc"></p>
											</div>
										</div>

										<div>
											<label class="passive-b-label">
												<span class="collapse-button" data-section="extra-passive-b-info-1">Passive Skill B</span>
											</label>
											<select id="passive-b-1" class="passive-selector fancy-select" data-charnum="1" data-skilltype="b"></select>
										</div>
										<div id="extra-passive-b-info-1" class="collapsable extra-info">
											<div class="ability-desc-container">
												<p id="passive-b-desc-1" class="ability-desc"></p>
											</div>
										</div>

										<div>
											<label class="passive-c-label">
												<span class="collapse-button" data-section="extra-passive-c-info-1">Passive Skill C</span>
											</label>
											<select id="passive-c-1" class="passive-selector fancy-select" data-charnum="1" data-skilltype="c"></select>
										</div>
										<div id="extra-passive-c-info-1" class="collapsable extra-info">
											<div class="ability-desc-container">
												<p id="passive-c-desc-1" class="ability-desc"></p>
											</div>
										</div>

										<div>
											<label class="passive-s-label">
												<span class="collapse-button" data-section="extra-passive-s-info-1">Sacred Seal</span>
											</label>
											<select id="passive-s-1" class="passive-selector fancy-select" data-charnum="1" data-skilltype="s"></select>
										</div>
										<div id="extra-passive-s-info-1" class="collapsable extra-info">
											<div class="ability-desc-container">
												<p id="passive-s-desc-1" class="ability-desc"></p>
											</div>
										</div>

										<div>
											<label class="assist-label">
												<span class="collapse-button" data-section="extra-assist-info-1">Assist Skill</span>
											</label>
											<select id="assist-1" class="assist-selector fancy-select" data-charnum="1"></select>
										</div>
										<div id="extra-assist-info-1" class="collapsable extra-info">
											<div class="ability-desc-container">
												<p id="assist-desc-1" class="ability-desc"></p>
											</div>
										</div>

										<div>
											<label class="special-label">
												<span class="collapse-button" data-section="extra-special-info-1">Special Skill</span>
											</label>
											<select id="special-1" class="special-selector fancy-select" data-charnum="1"></select>
										</div>
										<div id="extra-special-info-1" class="collapsable extra-info">
											<div class="ability-desc-container">
												<p id="special-desc-1" class="ability-desc"></p>
											</div>
										</div>
										<div id="spec-cooldown-line-1">
											<label class="spec-cooldown-label" title="Special skills activate when cooldown reaches 0." data-charnum="1">Special Cooldown</label>
											<input type="number" id="spec-cooldown-1" class="zero-or-more spec-cool" data-charnum="1" value="0">/<span id="spec-cooldown-max-1" class="denominator" autocomplete="off">x</span>
										</div>
									</div>
									<div class="info-section state-section">
										<div>
											<label class="status-label">Status</label>
											<select id="status-1" class="battle-val status-select" multiple="multiple" data-charnum="1">
												<option value="panic">Panic</option>
												<option value="candlelight">Candlelight</option>
											</select>
										</div>
										<div>
											<label class="terrain-label">Terrain</label>
											<select id="terrain-1" class="battle-val terrain-select" data-charnum="1">
												<option value="Default">Default</option>
												<option value="Defensive">Defensive</option>
											</select>
										</div>
									</div>
									<div id="stats-1" class="info-section stat-info">
										<table>
											<tr>
												<th></th>
												<th class="center-cell"><label class="stat-header" title="Default stat total">Base</label></th>
												<th class="center-cell"><label class="stat-header bonus-label" title="Displayed stat buff" data-charnum="1">Bonus</label></th>
												<th class="center-cell"><label class="stat-header penalty-label" title="Displayed stat debuff" data-charnum="1">Penalty</label></th>
												<th class="center-cell"><label class="stat-header spur-label" title="Combat-only stat buff granted by allies" data-charnum="1">Spur</label></th>
											</tr>
											<tr>
												<td><label class="stat" title="A unit is defeated if their Hit Points reach 0.">HP</label></td>
												<td class="center-cell"><input type="number" id="hp-1" class="more-than-zero hp-stat" value="1" data-charnum="1" autocomplete="off"></td>
												<td></td>
												<td></td>
												<td></td>
											</tr>
											<tr>
												<td><label class="stat" title="The higher a unit's Attack, the more damage it will inflict on foes.">ATK</label></td>
												<td class="center-cell"><input type="number" id="atk-1" class="zero-or-more battle-val" value="1" data-charnum="1" autocomplete="off"></td>
												<td class="center-cell"><select id="atk-bonus-1" class="stat-bonus battle-val" data-charnum="1"></select></td>
												<td class="center-cell"><select id="atk-penalty-1" class="stat-penalty battle-val" data-charnum="1"></select></td>
												<td class="center-cell"><select id="atk-spur-1" class="stat-spur battle-val" data-charnum="1"></select></td>
											</tr>
											<tr>
												<td><label class="stat" title="A unit will attack twice if their Speed is at least 5 more than their foe's Speed.">SPD</label></td>
												<td class="center-cell"><input type="number" id="spd-1" class="zero-or-more battle-val" value="1" data-charnum="1" autocomplete="off"></td>
												<td class="center-cell"><select id="spd-bonus-1" class="stat-bonus battle-val" data-charnum="1"></select></td>
												<td class="center-cell"><select id="spd-penalty-1" class="stat-penalty battle-val" data-charnum="1"></select></td>
												<td class="center-cell"><select id="spd-spur-1" class="stat-spur battle-val" data-charnum="1"></select></td>
											</tr>
											<tr>
												<td><label class="stat" title="The higher a unit's Defense is, the less damage they take from physical attacks.">DEF</label></td>
												<td class="center-cell"><input type="number" id="def-1" class="zero-or-more battle-val" value="1" data-charnum="1" autocomplete="off"></td>
												<td class="center-cell"><select id="def-bonus-1" class="stat-bonus battle-val" data-charnum="1"></select></td>
												<td class="center-cell"><select id="def-penalty-1" class="stat-penalty battle-val" data-charnum="1"></select></td>
												<td class="center-cell"><select id="def-spur-1" class="stat-spur battle-val" data-charnum="1"></select></td>
											</tr>
											<tr>
												<td><label class="stat" title="The higher a unit's Resistance is, the less damage they take from magical attacks.">RES</label></td>
												<td class="center-cell"><input type="number" id="res-1" class="zero-or-more battle-val" value="1" data-charnum="1" autocomplete="off"></td>
												<td class="center-cell"><select id="res-bonus-1" class="stat-bonus battle-val" data-charnum="1"></select></td>
												<td class="center-cell"><select id="res-penalty-1" class="stat-penalty battle-val" data-charnum="1"></select></td>
												<td class="center-cell"><select id="res-spur-1" class="stat-spur battle-val" data-charnum="1"></select></td>
											</tr>
										</table>
									</div>
									<div class="info-section-bottom current-hp">
										<label class="curr-hp-label" data-charnum="1">Current HP</label>
										<input type="number" id="curr-hp-1" class="more-than-zero curr-hp-val" data-charnum="1" value="1" autocomplete="off">/<span id="hp-1-denom" class="denominator hp-1-read">1</span>
									</div>
								</fieldset>
							</div>
						</td>
						<td id="swap-cell">
							<div id="swap">
								<button id="swap-button" alt="swap"></button>
							</div>
						</td>
						<td>
							<div class="char-info">
								<fieldset id="defend-panel" class="char-info-panel">
									<legend><h2 class="defender">Defender</h2></legend>
									<div class="char-slots-container">
										<div id="char-slots-2" class="info-section char-slots">
											<img id="def-tab-0" class="char-tab-unselected" alt="D1" src="img/Portraits/Unselected.png" data-index="0" data-charnum="2">
											<img id="def-tab-1" class="char-tab-unselected" alt="D2" src="img/Portraits/Unselected.png" data-index="1" data-charnum="2">
											<img id="def-tab-2" class="char-tab-unselected" alt="D3" src="img/Portraits/Unselected.png" data-index="2" data-charnum="2">
											<img id="def-tab-3" class="char-tab-unselected" alt="D4" src="img/Portraits/Unselected.png" data-index="3" data-charnum="2">
											<img id="def-tab-4" class="char-tab-unselected" alt="D5" src="img/Portraits/Unselected.png" data-index="4" data-charnum="2">
										</div>
									</div>
									<div  class="info-section character-select">
										<div>
											<label>
												<span id="extra-char-info-2-btn" class="collapse-button" data-section="extra-char-info-2">Character</span>
											</label>
											<select id="char-2" class="char-selector fancy-select" data-charnum="2"></select>
										</div>
										<div id="extra-char-info-2" class="collapsable">
											<div>
												<label>Color</label>
												<select id="color-2" class="color-selector" data-charnum="2">
													<option value="Red">Red</option>
													<option value="Green">Green</option>
													<option value="Blue">Blue</option>
													<option value="Colorless">Colorless</option>
												</select>
											</div>
											<div>
												<label>Weapon Type</label>
												<select id="weapon-type-2" class="weapon-type-selector" data-charnum="2">
													<option value="Sword">Sword</option>
													<option value="Red Tome">Red Tome</option>
													<option value="Red Breath">Red Breath</option>
													<option value="Axe">Axe</option>
													<option value="Green Tome">Green Tome</option>
													<option value="Green Breath">Green Breath</option>
													<option value="Lance">Lance</option>
													<option value="Blue Tome">Blue Tome</option>
													<option value="Blue Breath">Blue Breath</option>
													<option value="Bow">Bow</option>
													<option value="Dagger">Dagger</option>
													<option value="Staff">Staff</option>
												</select>
											</div>
											<div>
												<label>Move Type</label>
												<select id="move-type-2" class="move-type-selector" data-charnum="2">
													<option value="Infantry">Infantry</option>
													<option value="Cavalry">Cavalry</option>
													<option value="Flying">Flying</option>
													<option value="Armored">Armored</option>
												</select>
											</div>
										</div>
										<div id="char-build-info-2">
											<div>
												<label>Rarity</label>
												<select id="rarity-2" class="rarity-select build-select" data-charnum="2">
													<option value="5">5 Stars</option>
												</select>
											</div>
											<div>
												<label>Level</label>
												<select id="level-2" class="level-select build-select" data-charnum="2">
													<option value="40">Lvl. 40</option>
													<option value="1">Lvl. 1</option>
												</select><select id="merge-2" class="merge-select build-select" data-charnum="2" title="Merged units">
													<option value="0">+0</option>
													<option value="1">+1</option>
													<option value="2">+2</option>
													<option value="3">+3</option>
													<option value="4">+4</option>
													<option value="5">+5</option>
													<option value="6">+6</option>
													<option value="7">+7</option>
													<option value="8">+8</option>
													<option value="9">+9</option>
													<option value="10">+10</option>
												</select>
											</div>
											<div>
												<label>Boon/Bane</label>
												<select id="boon-2" class="boon-select build-select" data-charnum="2" title="Boon">
													<option value="neutral">Neutral</option>
													<option value="hp">+HP</option>
													<option value="atk">+ATK</option>
													<option value="spd">+SPD</option>
													<option value="def">+DEF</option>
													<option value="res">+RES</option>
												</select><select id="bane-2" class="bane-select build-select" data-charnum="2" title="Bane">
													<option value="neutral">Neutral</option>
													<option value="hp">-HP</option>
													<option value="atk">-ATK</option>
													<option value="spd">-SPD</option>
													<option value="def">-DEF</option>
													<option value="res">-RES</option>
												</select>
											</div>
										</div>
									</div>
									<div class="info-section weapon-select">
										<div>
											<label>
												<span id="extra-weapon-info-2-btn" class="collapse-button" data-section="extra-weapon-info-2">Weapon</span>
											</label>
											<select id="weapon-2" class="weapon-selector fancy-select" data-charnum="2"></select>
										</div>
										<div id="extra-weapon-info-2" class="extra-info collapsable">
											<div class="ability-desc-container">
												<p id="weapon-desc-2" class="ability-desc"></p>
											</div>
											<div>
												<label>Might</label>
												<span id="weapon-might-2" data-oldmt="0"></span>
											</div>
											<div>
												<label>Range</label>
												<span id="weapon-range-2"></span>
											</div>
											<div>
												<label>Magical</label>
												<span id="weapon-magical-2"></span>
											</div>
										</div>
										<div id="adjacent-block-2" class="adjacent-block">
											<label>Adjacent Allies</label>
											<select id="adjacent-2" class="adjacent-select battle-val" data-charnum="2">
												<option value="0">0</option>
												<option value="1">1</option>
												<option value="2">2</option>
												<option value="3">3</option>
												<option value="4">4</option>
											</select>
										</div>
									</div>
									<div id="skills-2" class="info-section skill-select">
										<div>
											<label class="passive-a-label">
												<span class="collapse-button" data-section="extra-passive-a-info-2">Passive Skill A</span>
											</label>
											<select id="passive-a-2" class="passive-selector fancy-select" data-charnum="2" data-skilltype="a"></select>
										</div>
										<div id="extra-passive-a-info-2" class="collapsable extra-info">
											<div class="ability-desc-container">
												<p id="passive-a-desc-2" class="ability-desc"></p>
											</div>
										</div>

										<div>
											<label class="passive-b-label">
												<span class="collapse-button" data-section="extra-passive-b-info-2">Passive Skill B</span>
											</label>
											<select id="passive-b-2" class="passive-selector fancy-select" data-charnum="2" data-skilltype="b"></select>
										</div>
										<div id="extra-passive-b-info-2" class="collapsable extra-info">
											<div class="ability-desc-container">
												<p id="passive-b-desc-2" class="ability-desc"></p>
											</div>
										</div>

										<div>
											<label class="passive-c-label">
												<span class="collapse-button" data-section="extra-passive-c-info-2">Passive Skill C</span>
											</label>
											<select id="passive-c-2" class="passive-selector fancy-select" data-charnum="2" data-skilltype="c"></select>
										</div>
										<div id="extra-passive-c-info-2" class="collapsable extra-info">
											<div class="ability-desc-container">
												<p id="passive-c-desc-2" class="ability-desc"></p>
											</div>
										</div>

										<div>
											<label class="passive-s-label">
												<span class="collapse-button" data-section="extra-passive-s-info-2">Sacred Seal</span>
											</label>
											<select id="passive-s-2" class="passive-selector fancy-select" data-charnum="2" data-skilltype="s"></select>
										</div>
										<div id="extra-passive-s-info-2" class="collapsable extra-info">
											<div class="ability-desc-container">
												<p id="passive-s-desc-2" class="ability-desc"></p>
											</div>
										</div>

										<div>
											<label class="assist-label">
												<span class="collapse-button" data-section="extra-assist-info-2">Assist Skill</span>
											</label>
											<select id="assist-2" class="assist-selector fancy-select" data-charnum="2"></select>
										</div>
										<div id="extra-assist-info-2" class="collapsable extra-info">
											<div class="ability-desc-container">
												<p id="assist-desc-2" class="ability-desc"></p>
											</div>
										</div>

										<div>
											<label class="special-label">
												<span class="collapse-button" data-section="extra-special-info-2">Special Skill</span>
											</label>
											<select id="special-2" class="special-selector fancy-select" data-charnum="2"></select>
										</div>
										<div id="extra-special-info-2" class="collapsable extra-info">
											<div class="ability-desc-container">
												<p id="special-desc-2" class="ability-desc"></p>
											</div>
										</div>
										<div id="spec-cooldown-line-2">
											<label class="spec-cooldown-label" title="Special skills activate when cooldown reaches 0." data-charnum="2">Special Cooldown</label>
											<input type="number" id="spec-cooldown-2" class="zero-or-more spec-cool" data-charnum="2" value="0" autocomplete="off">/<span id="spec-cooldown-max-2" class="denominator">x</span>
										</div>
									</div>
									<div class="info-section state-section">
										<div>
											<label class="status-label">Status</label>
											<select id="status-2" class="battle-val status-select" multiple="multiple" data-charnum="2">
												<option value="panic">Panic</option>
												<option value="candlelight">Candlelight</option>
											</select>
										</div>
										<div>
											<label class="terrain-label">Terrain</label>
											<select id="terrain-2" class="battle-val terrain-select" data-charnum="2">
												<option value="Default">Default</option>
												<option value="Defensive">Defensive</option>
											</select>
										</div>
									</div>
									<div id="stats-2" class="info-section stat-info">
										<table>
											<tr>
												<th></th>
												<th class="center-cell"><label class="stat-header" title="Default stat total">Base</label></th>
												<th class="center-cell"><label class="stat-header bonus-label" title="Displayed stat buff" data-charnum="2">Bonus</label></th>
												<th class="center-cell"><label class="stat-header penalty-label" title="Displayed stat debuff" data-charnum="2">Penalty</label></th>
												<th class="center-cell"><label class="stat-header spur-label" title="Combat-only stat buff granted by allies" data-charnum="2">Spur</label></th>
											</tr>
											<tr>
												<td><label class="stat" title="A unit is defeated if their Hit Points reach 0.">HP</label></td>
												<td class="center-cell"><input type="number" id="hp-2" class="more-than-zero hp-stat" value="1" data-charnum="2" autocomplete="off"></td>
												<td></td>
												<td></td>
												<td></td>
											</tr>
											<tr>
												<td><label class="stat" title="The higher a unit's Attack, the more damage it will inflict on foes.">ATK</label></td>
												<td class="center-cell"><input type="number" id="atk-2" class="zero-or-more battle-val" value="1" data-charnum="2" autocomplete="off"></td>
												<td class="center-cell"><select id="atk-bonus-2" class="stat-bonus battle-val" data-charnum="2"></select></td>
												<td class="center-cell"><select id="atk-penalty-2" class="stat-penalty battle-val" data-charnum="2"></select></td>
												<td class="center-cell"><select id="atk-spur-2" class="stat-spur battle-val" data-charnum="2"></select></td>
											</tr>
											<tr>
												<td><label class="stat" title="A unit will attack twice if their Speed is at least 5 more than their foe's Speed.">SPD</label></td>
												<td class="center-cell"><input type="number" id="spd-2" class="zero-or-more battle-val" value="1" data-charnum="2" autocomplete="off"></td>
												<td class="center-cell"><select id="spd-bonus-2" class="stat-bonus battle-val" data-charnum="2"></select></td>
												<td class="center-cell"><select id="spd-penalty-2" class="stat-penalty battle-val" data-charnum="2"></select></td>
												<td class="center-cell"><select id="spd-spur-2" class="stat-spur battle-val" data-charnum="2"></select></td>
											</tr>
											<tr>
												<td><label class="stat" title="The higher a unit's Defense is, the less damage they take from physical attacks.">DEF</label></td>
												<td class="center-cell"><input type="number" id="def-2" class="zero-or-more battle-val" value="1" data-charnum="2" autocomplete="off"></td>
												<td class="center-cell"><select id="def-bonus-2" class="stat-bonus battle-val" data-charnum="2"></select></td>
												<td class="center-cell"><select id="def-penalty-2" class="stat-penalty battle-val" data-charnum="2"></select></td>
												<td class="center-cell"><select id="def-spur-2" class="stat-spur battle-val" data-charnum="2"></select></td>
											</tr>
											<tr>
												<td><label class="stat" title="The higher a unit's Resistance is, the less damage they take from magical attacks.">RES</label></td>
												<td class="center-cell"><input type="number" id="res-2" class="zero-or-more battle-val" value="1" data-charnum="2" autocomplete="off"></td>
												<td class="center-cell"><select id="res-bonus-2" class="stat-bonus battle-val" data-charnum="2"></select></td>
												<td class="center-cell"><select id="res-penalty-2" class="stat-penalty battle-val" data-charnum="2"></select></td>
												<td class="center-cell"><select id="res-spur-2" class="stat-spur battle-val" data-charnum="2"></select></td>
											</tr>
										</table>
									</div>
									<div class="info-section-bottom current-hp">
										<label class="curr-hp-label" data-charnum="2">Current HP</label>
										<input type="number" id="curr-hp-2" class="more-than-zero curr-hp-val" data-charnum="2" value="1" autocomplete="off">/<span id="hp-2-denom" class="denominator hp-2-read">1</span>
									</div>
								</fieldset>
							</div>
						</td>
					</tr>
					<tr>
						<td colspan="3">
							<div id="battle-log">
								<fieldset>
									<legend>
										<h2 id="interaction-list-header" class="legend-tab"><span id="interaction-list-btn">Battle Log</span></h2>
										<h2 id="import-export-header" class="legend-tab legend-tab-unselected"><span id="import-btn">Import/Export</span></h2>
									</legend>
									<ul id="interaction-list"></ul>
									<table id="import-export">
										<tr>
											<td>
												<button id="import-attacker" class="import-btn">Import Attackers</button>
												<button id="export-attacker" class="export-btn">Export Attackers</button>
												<button id="export-attacker-single" class="export-single-btn">Export Selected</button>
												<button id="clear-attacker" class="clear-team-btn">Clear Attackers</button>
											</td>
											<td>
												<textarea id="import-area"></textarea>
											</td>
											<td>
												<button id="import-defender" class="import-btn">Import Defenders</button>
												<button id="export-defender" class="export-btn">Export Defenders</button>
												<button id="export-defender-single" class="export-single-btn">Export Selected</button>
												<button id="clear-defender" class="clear-team-btn">Clear Defenders</button>
											</td>
										</tr>
										<tr><td id="import-error-msg-container" colspan="3"><span id="import-error-msg"></span></td></tr>
									</table>
								</fieldset>
							</div>
						</td>
					</tr>
					<tr>
						<td colspan="3">
							<div id="matchups">
								<fieldset>
									<legend><h2>Matchups</h2></legend>
									<div id="matchup-display">
										<h3 id="matchup-title"></h3>
										<span id="matchup-overview"></span>
										<div id="matchup-options-container">
											<div id="matchup-buttons">
												<span id="matchup-filter-button" class="collapse-button matchup-button" data-section="matchup-filters">Filters</span>
												<span id="matchup-override-button" class="collapse-button matchup-button" data-section="matchup-overrides">Overrides</span>
											</div>
											<div id="matchup-filters" class="matchup-section">
												<table>
													<tr>
														<td><label class="filter-label filter-toprow">Character(s)</label></td>
														<td colspan="3"><input id="matchup-filter-name" type="text" class="matchup-filter-input filter-toprow" placeholder="Separate names with a comma" autocomplete="off"></td>
													</tr>
													<tr>
														<td><label class="filter-label">Color</label></td>
														<td>
															<select id="matchup-filter-color" class="matchup-filter-input multi-select filter-col2" multiple="multiple">
																<option value="Red">Red</option>
																<option value="Green">Green</option>
																<option value="Blue">Blue</option>
																<option value="Colorless">Colorless</option>
															</select>
														</td>
														<td><label class="filter-label filter-col3">Weapon Type</label></td>
														<td>
															<select id="matchup-filter-weapon" class="matchup-filter-input multi-select" multiple="multiple">
																<option value="Sword">Sword</option>
																<option value="Red Tome">Red Tome</option>
																<option value="Red Breath">Red Breath</option>
																<option value="Axe">Axe</option>
																<option value="Green Tome">Green Tome</option>
																<option value="Green Breath">Green Breath</option>
																<option value="Lance">Lance</option>
																<option value="Blue Tome">Blue Tome</option>
																<option value="Blue Breath">Blue Breath</option>
																<option value="Bow">Bow</option>
																<option value="Dagger">Dagger</option>
																<option value="Staff">Staff</option>
															</select>
														</td>
													</tr>
													<tr>
														<td><label class="filter-label">Range</label></td>
														<td>
															<select id="matchup-filter-range" class="matchup-filter-input multi-select filter-col2" multiple="multiple">
																<option value="1">Melee</option>
																<option value="2">Ranged</option>
															</select>
														</td>
														<td><label class="filter-label filter-col3">Damage Type</label></td>
														<td>
															<select id="matchup-filter-magical" class="matchup-filter-input multi-select" multiple="multiple">
																<option value="Physical">Physical</option>
																<option value="Magical">Magical</option>
															</select>
														</td>
													</tr>
													<tr>
														<td><label class="filter-label">Move Type</label></td>
														<td>
															<select id="matchup-filter-move" class="matchup-filter-input multi-select filter-col2" multiple="multiple">
																<option value="Infantry">Infantry</option>
																<option value="Cavalry">Cavalry</option>
																<option value="Flying">Flying</option>
																<option value="Armored">Armored</option>
															</select>
														</td>
														<td><label class="filter-label filter-col3">Result</label></td>
														<td>
															<select id="matchup-filter-result" class="matchup-filter-input multi-select" multiple="multiple">
																<option value="Attacker Wins">Attacker Wins</option>
																<option value="Defender Wins">Defender Wins</option>
																<option value="Draw">Draw</option>
																<option value="Favorable">Favorable</option>
																<option value="Unfavorable">Unfavorable</option>
																<option value="Other">Other</option>
															</select>
														</td>
													</tr>
												</table>
												<div class="matchup-filter-block">
													<button id="matchup-filter-reset">Reset</button>
												</div>
											</div>
											<div id="matchup-overrides" class="matchup-section">
												<table>
													<tr>
														<td>
															<div class="info-section">
																<div>
																	<label>Rarity</label>
																	<select id="override-rarity" class="override-option">
																		<option value="5">5 Stars</option>
																		<option value="4">4 Stars</option>
																		<option value="3">3 Stars</option>
																		<option value="2">2 Stars</option>
																		<option value="1">1 Star</option>
																	</select>
																</div>
																<div>
																	<label>Level</label>
																	<select id="override-level" class="override-option">
																		<option value="40">Lvl. 40</option>
																		<option value="1">Lvl. 1</option>
																	</select><select id="override-merge" class="override-option" title="Merged units">
																		<option value="0">+0</option>
																		<option value="1">+1</option>
																		<option value="2">+2</option>
																		<option value="3">+3</option>
																		<option value="4">+4</option>
																		<option value="5">+5</option>
																		<option value="6">+6</option>
																		<option value="7">+7</option>
																		<option value="8">+8</option>
																		<option value="9">+9</option>
																		<option value="10">+10</option>
																	</select>
																</div>
																<div>
																	<label>Boon/Bane</label>
																	<select id="override-boon" class="override-option" title="Boon">
																		<option value="neutral">Neutral</option>
																		<option value="hp">+HP</option>
																		<option value="atk">+ATK</option>
																		<option value="spd">+SPD</option>
																		<option value="def">+DEF</option>
																		<option value="res">+RES</option>
																	</select><select id="override-bane" class="override-option" title="Bane">
																		<option value="neutral">Neutral</option>
																		<option value="hp">-HP</option>
																		<option value="atk">-ATK</option>
																		<option value="spd">-SPD</option>
																		<option value="def">-DEF</option>
																		<option value="res">-RES</option>
																	</select>
																</div>
															</div>
															<div class="info-section">
																<div>
																	<label>
																		<span id="override-weapon-button" class="collapse-button" data-section="override-weapon-type-container">Weapon</span>
																	</label>
																	<select id="override-weapon" class="override-option fancy-select"></select>
																</div>
																<div id="override-weapon-type-container" class="collapsable">
																	<label>Weapon Type</label>
																	<select id="override-weapon-type">
																		<option value="Any">Any</option>
																		<option value="Sword">Sword</option>
																		<option value="Red Tome">Red Tome</option>
																		<option value="Red Breath">Red Breath</option>
																		<option value="Axe">Axe</option>
																		<option value="Green Tome">Green Tome</option>
																		<option value="Green Breath">Green Breath</option>
																		<option value="Lance">Lance</option>
																		<option value="Blue Tome">Blue Tome</option>
																		<option value="Blue Breath">Blue Breath</option>
																		<option value="Bow">Bow</option>
																		<option value="Dagger">Dagger</option>
																		<option value="Staff">Staff</option>
																	</select>
																</div>
																<div id="override-adjacent-block" class="adjacent-block">
																	<label>Adjacent Allies</label>
																	<select id="override-adjacent" class="override-option">
																		<option value="0">0</option>
																		<option value="1">1</option>
																		<option value="2">2</option>
																		<option value="3">3</option>
																		<option value="4">4</option>
																	</select>
																</div>
															</div>
															<div class="info-section-bottom">
																<div>
																	<label class="passive-a-label">Passive Skill A</label>
																	<select id="override-passive-a" class="override-option fancy-select" data-skilltype="a"></select>
																</div>
																<div>
																	<label class="passive-b-label">Passive Skill B</label>
																	<select id="override-passive-b" class="override-option fancy-select" data-skilltype="b"></select>
																</div>
																<div>
																	<label class="passive-c-label">Passive Skill C</label>
																	<select id="override-passive-c" class="override-option fancy-select" data-skilltype="c"></select>
																</div>
																<div>
																	<label class="passive-s-label">Sacred Seal</label>
																	<select id="override-passive-s" class="override-option fancy-select" data-skilltype="s"></select>
																</div>
																<div>
																	<label class="assist-label">Assist Skill</label>
																	<select id="override-assist" class="override-option fancy-select"></select>
																</div>
																<div>
																	<label class="special-label">Special Skill</label>
																	<select id="override-special" class="override-option fancy-select"></select>
																</div>
																<div>
																	<label title="Special skills activate when cooldown reaches 0.">Special Cooldown</label>
																	<select id="override-spec-cooldown" class="override-option">
																		<option value="max">Max</option>
																		<option value="5">5</option>
																		<option value="4">4</option>
																		<option value="3">3</option>
																		<option value="2">2</option>
																		<option value="1">1</option>
																		<option value="0">0</option>
																	</select>
																</div>
															</div>
														</td>
														<td>
															<div class="override-state info-section">
																<div>
																	<label class="status-label">Status</label>
																	<select id="override-status" class="override-option status-select" multiple="multiple">
																		<option value="panic">Panic</option>
																		<option value="candlelight">Candlelight</option>
																	</select>
																</div>
																<div>
																	<label class="terrain-label">Terrain</label>
																	<select id="override-terrain" class="override-option terrain-select">
																		<option value="Default">Default</option>
																		<option value="Defensive">Defensive</option>
																	</select>
																</div>
															</div>
															<div id="override-stats" class="info-section">
																<table>
																	<tr>
																		<th></th>
																		<th class="center-cell"><label class="stat-header" title="Displayed stat buff">Bonus</label></th>
																		<th class="center-cell"><label class="stat-header" title="Displayed stat debuff">Penalty</label></th>
																		<th class="center-cell"><label class="stat-header" title="Combat-only stat buff granted by allies">Spur</label></th>
																	</tr>
																	<tr>
																		<td><label class="stat" title="The higher a unit's Attack, the more damage it will inflict on foes.">ATK</label></td>
																		<td class="center-cell"><select id="override-atk-bonus" class="stat-bonus override-option override-stat"></select></td>
																		<td class="center-cell"><select id="override-atk-penalty" class="stat-penalty override-option override-stat"></select></td>
																		<td class="center-cell"><select id="override-atk-spur" class="stat-spur override-option override-stat"></select></td>
																	</tr>
																	<tr>
																		<td><label class="stat" title="A unit will attack twice if their Speed is at least 5 more than their foe's Speed.">SPD</label></td>
																		<td class="center-cell"><select id="override-spd-bonus" class="stat-bonus override-option override-stat"></select></td>
																		<td class="center-cell"><select id="override-spd-penalty" class="stat-penalty override-option override-stat"></select></td>
																		<td class="center-cell"><select id="override-spd-spur" class="stat-spur override-option override-stat"></select></td>
																	</tr>
																	<tr>
																		<td><label class="stat" title="The higher a unit's Defense is, the less damage they take from physical attacks.">DEF</label></td>
																		<td class="center-cell"><select id="override-def-bonus" class="stat-bonus override-option override-stat"></select></td>
																		<td class="center-cell"><select id="override-def-penalty" class="stat-penalty override-option override-stat"></select></td>
																		<td class="center-cell"><select id="override-def-spur" class="stat-spur override-option override-stat"></select></td>
																	</tr>
																	<tr>
																		<td><label class="stat" title="The higher a unit's Resistance is, the less damage they take from magical attacks.">RES</label></td>
																		<td class="center-cell"><select id="override-res-bonus" class="stat-bonus override-option override-stat"></select></td>
																		<td class="center-cell"><select id="override-res-penalty" class="stat-penalty override-option override-stat"></select></td>
																		<td class="center-cell"><select id="override-res-spur" class="stat-spur override-option override-stat"></select></td>
																	</tr>
																</table>
															</div>
															<div class="info-section current-hp">
																<label class="curr-hp-label">Current HP</label>
																<input type="number" id="override-curr-hp" class="more-than-zero override-option" value="100" autocomplete="off">%
															</div>
															<div class="info-section">
																<button id="override-reset">Reset</button>
															</div>
														</td>
													</tr>
												</table>
												<div>
													<p id="override-msg">* Overrides are applied only if it is possible to do so</p>
												</div>
											</div>
										</div>
										<div id="matchup-table-container">
											<table id="matchup-table" class="sortable"></table>
										</div>
									</div>
								</fieldset>
							</div>
						</td>
					</tr>
				</table>
			</div>
		</div>
		<script type="text/javascript" src="scripts/char.js"></script>
		<script type="text/javascript" src="scripts/weapon.js"></script>
		<script type="text/javascript" src="scripts/skill.js"></script>
		<script type="text/javascript" src="scripts/special.js"></script>
		<script type="text/javascript" src="scripts/assist.js"></script>
		<script type="text/javascript" src="scripts/tsorter.js"></script>
		<script type="text/javascript" src="scripts/multiple-select.js"></script>
		<script type="text/javascript" src="scripts/setup.js"></script>
	</body>
</html>