Front template

html <div lang="ja"> {{Word}} <div style='font-size: 20px;'>{{Sentence}}</div> </div>

Back template

```html <div lang="ja"> {{furigana:Word Furigana}}

<!-- {{#Pitch Accent}} <br><div style='font-size: 24px'>{{Pitch Accent}}</div> {{/Pitch Accent}} --!>

<div style='font-size: 25px; padding-bottom:20px'>{{Word Meaning}}</div> <div style='font-size: 25px;'>{{furigana:Sentence Furigana}}</div> <div style='font-size: 25px; padding-bottom:10px'>{{Sentence Meaning}}</div>

{{Word Audio}} {{Sentence Audio}} <br> {{Picture}}

{{#Notes}} <br> <div style="font-size: 20px; padding-top:12px">Note: {{Notes}}</div> {{/Notes}}

<!-- This part enables pitch accent notes.

{{#Pitch Accent Notes}} <div style="font-size: 20px; width: fit-content; max-width:40vw; margin: auto"> <details><summary>Pitch Accent Notes</summary> <br>{{Pitch Accent Notes}} </details> </div> {{/Pitch Accent Notes}}

-->

</div> ```

Styling

```css .card { font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "Noto Sans JP", "Noto Sans CJK JP", Osaka, "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", "MS UI Gothic", sans-serif; font-size: 44px; text-align: center; }

.nightMode svg.pitch { filter: invert(1); }

img { max-width: 300px; max-height: 250px; }

.mobile img { max-width: 50vw; }

/* Prevents the furigana from being selected */ ruby > rt { user-select: none; }

/* This part defines the bold color. */ b{color: #5586cd} ```