<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Björn - Dwarf Mage</title>
    <link rel="stylesheet" href="styles.css">
</head>
<body>
    <div class="character-sheet">
        <h1>Björn - Dwarf Mage</h1>

        <!-- Character Picture -->
        <div class="character-picture">
            <img src="../assets/player.png" alt="Björn">
        </div>

        <div class="section">
            <h2>Basic Information</h2>
            <ul>
                <li><strong>Race:</strong> Dwarf</li>
                <li><strong>Class:</strong> Mage (Level 1)</li>
            </ul>
        </div>

        <div class="section">
            <h2>Stats</h2>
            <ul>
                <li><strong>STR:</strong> 8 (-1)</li>
                <li><strong>DEX:</strong> 12 (+1)</li>
                <li><strong>CON:</strong> 10 (0)</li>
                <li><strong>INT:</strong> 16 (+3)</li>
                <li><strong>WIS:</strong> 14 (+2)</li>
                <li><strong>CHA:</strong> 12 (+1)</li>
            </ul>
        </div>

        <div class="section">
            <h2>Proficiencies</h2>
            <p>Arcana, History, Nature</p>
        </div>

        <div class="section">
            <h2>Actions</h2>
            <ul>
                <li><strong>Cast a Spell:</strong> See spell list</li>
            </ul>
        </div>

        <div class="section">
            <h2>Bonus-action</h2>
            <ul>
                <li><strong>Dagger:</strong> +DEX+Prof, 1d4+DEX</li>
                <li><strong>Dodge:</strong> Damage-halved</li>
                <li><strong>Stone's Resilience:</strong> Touch an ally to grant them temporary hit points equal to 1d10 + mage level</li>
            </ul>
        </div>

        <div class="section">
            <h2>Reaction</h2>
            <ul>
                <li><strong>Earthquake Strike:</strong> When an enemy targets Björn or an ally within 30 feet with an attack, impose disadvantage on the attack roll.</li>
                <li><strong>Reduce Harm:</strong> Reduce damage taken by an ally by 1d10 + level</li>
            </ul>
        </div>

        <div class="section">
            <h2>Race Feature</h2>
            <ul>
                <li><strong>Dwarven Resistance:</strong> Poison damage halved</li>
                <li><strong>Healing Word:</strong> Ability to cast Healing Word</li>
                <li><strong>Tremor Sense:</strong> Sense the location of creatures within 30 feet that are in contact with the ground</li>
                <li><strong>Dwarven Fortitude:</strong> As a reaction, reduce the damage taken by an ally by 1d10 + level</li>
            </ul>
        </div>

        <div class="section">
            <h2>Spell Slots</h2>
            <p>3x Longrest</p>
        </div>

        <div class="section">
            <h2>Spell List</h2>
            <h3>Level 0 (At Will Spells)</h3>
            <table>
                <tr>
                    <th>Name</th>
                    <th>Bonus to hit</th>
                    <th>Damage</th>
                    <th>Damage Type</th>
                    <th>Range</th>
                </tr>
                <tr>
                    <td>Firedagger</td>
                    <td>+INT+Prof</td>
                    <td>1d10+INT</td>
                    <td>Fire</td>
                    <td>120 feet</td>
                </tr>
                <tr>
                    <td>Icedagger</td>
                    <td>+INT+Prof</td>
                    <td>1d10+INT</td>
                    <td>Ice</td>
                    <td>120 feet</td>
                </tr>
                <tr>
                    <td>Stone Shard</td>
                    <td>+INT+Prof</td>
                    <td>1d8+INT</td>
                    <td>Bludgeoning</td>
                    <td>100 feet</td>
                </tr>
                <tr>
                    <td>Frostbite</td>
                    <td>+INT+Prof</td>
                    <td>1d6+INT</td>
                    <td>Cold</td>
                    <td>60 feet</td>
                </tr>
                <tr>
                    <td>Earthen Shield</td>
                    <td>-</td>
                    <td>8 Temporary HP</td>
                    <td>-</td>
                    <td>Self</td>
                </tr>
            </table>

            <h3>Level 1 Spells</h3>
            <table>
                <tr>
                    <th>Name</th>
                    <th>Save</th>
                    <th>Damage</th>
                    <th>Damage Type</th>
                    <th>Range</th>
                </tr>
                <tr>
                    <td>Magma Burst</td>
                    <td>Dex-save</td>
                    <td>3d6</td>
                    <td>Fire</td>
                    <td>60 feet / 15-foot radius</td>
                </tr>
                <tr>
                    <td>Stone Skin</td>
                    <td>-</td>
                    <td>Resistance</td>
                    <td>Non-magical bludgeoning, piercing, and slashing damage</td>
                    <td>30 feet</td>
                </tr>
                <tr>
                    <td>Earthbind</td>
                    <td>+INT+Prof</td>
                    <td>Restrained</td>
                    <td>-</td>
                    <td>60 feet</td>
                </tr>
                <tr>
                    <td>Create Flame</td>
                    <td>-</td>
                    <td>3d6</td>
                    <td>Fire</td>
                    <td>80 feet / 20-foot radius</td>
                </tr>
                <tr>
                    <td>Healing Word</td>
                    <td>-</td>
                    <td>1d8</td>
                    <td>Heal</td>
                    <td>30 feet</td>
                </tr>
                <tr>
                    <td>Counterspell</td>
                    <td>If roll higher than enemy, their spell doesn't work</td>
                    <td>-</td>
                    <td>-</td>
                    <td>30 feet</td>
                </tr>
            </table>
        </div>

    </div>
</body>
</html>