settings.html

<div class="statecoordinator_settings">
    <div class="inline-drawer">
        <div class="inline-drawer-toggle inline-drawer-header">
            <b>State Coordinator</b>
            <div class="inline-drawer-icon fa-solid fa-circle-chevron-down down"></div>
        </div>
        <div class="inline-drawer-content">
            <div class="flex-container flexFlowColumn">
                <div id="characterStatesHeader">
                    <span id="currentCharacterName">No Character Selected</span>
                </div>
                <div id="stateCoordinatorBody">
                    <div id="statesCheckboxes"></div>
                    <div class="flex-container flexFlowColumn custom-state-container">
                        <label class="checkbox_label" for="customStateCheckbox">
                            <input type="checkbox" id="customStateCheckbox" />
                            Custom State
                        </label>
                        <textarea id="customStateText" class="text_pole textarea_compact autoSetHeight" rows="2" placeholder="Enter custom state..."></textarea>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>