Refactor & Fix the typography.

composeApp/src/commonMain/kotlin/com/pixelized/desktop/lwa/ui/composable/character/alterteration/AlterationToggleItem.kt

@@ -65,7 +65,7 @@ fun AlterationToggleItem(
             }
         )
         Text(
-            style = MaterialTheme.lwa.typography.base.body1,
+            style = MaterialTheme.lwa.typography.system.body1,
             overflow = TextOverflow.Ellipsis,
             maxLines = 1,
             color = animatedColor.value,

composeApp/src/commonMain/kotlin/com/pixelized/desktop/lwa/ui/composable/character/inventory/InventoryDialog.kt

@@ -276,7 +276,7 @@ private fun InventoryDialogItem(
             ) {
                 Text(
                     modifier = Modifier.alignByBaseline(),
-                    style = MaterialTheme.lwa.typography.base.body1,
+                    style = MaterialTheme.lwa.typography.system.body1,
                     fontWeight = FontWeight.Bold,
                     overflow = TextOverflow.Ellipsis,
                     maxLines = 1,

composeApp/src/commonMain/kotlin/com/pixelized/desktop/lwa/ui/screen/campaign/player/detail/header/CharacterDetailHeader.kt

@@ -146,7 +146,7 @@ fun CharacterDetailHeader(
                 )
                 Text(
                     modifier = Modifier.alignByBaseline(),
-                    style = MaterialTheme.lwa.typography.base.caption,
+                    style = MaterialTheme.lwa.typography.system.caption,
                     text = stringResource(
                         resource = Res.string.character_sheet__level,
                         header.value?.level ?: 0
@@ -277,14 +277,14 @@ fun CharacterDetailHeader(
                     )
                     Text(
                         modifier = Modifier.alignByBaseline(),
-                        style = MaterialTheme.typography.h6,
+                        style = MaterialTheme.lwa.typography.characterSheet.headerValue,
                         color = MaterialTheme.lwa.colorScheme.base.primary,
                         fontWeight = FontWeight.Bold,
                         text = header.value?.hp ?: "",
                     )
                     Text(
                         modifier = Modifier.alignByBaseline(),
-                        style = MaterialTheme.typography.caption,
+                        style = MaterialTheme.lwa.typography.characterSheet.headerCaption,
                         fontWeight = FontWeight.Thin,
                         text = "/${header.value?.maxHp ?: ""}",
                     )
@@ -306,14 +306,14 @@ fun CharacterDetailHeader(
                     )
                     Text(
                         modifier = Modifier.alignByBaseline(),
-                        style = MaterialTheme.typography.h6,
+                        style = MaterialTheme.lwa.typography.characterSheet.headerValue,
                         color = MaterialTheme.lwa.colorScheme.base.primary,
                         fontWeight = FontWeight.Bold,
                         text = header.value?.pp ?: "",
                     )
                     Text(
                         modifier = Modifier.alignByBaseline(),
-                        style = MaterialTheme.typography.caption,
+                        style = MaterialTheme.lwa.typography.characterSheet.headerCaption,
                         fontWeight = FontWeight.Thin,
                         text = "/${header.value?.maxPp ?: ""}",
                     )
@@ -340,7 +340,7 @@ fun CharacterDetailHeader(
                     )
                     Text(
                         modifier = Modifier.alignByBaseline(),
-                        style = MaterialTheme.typography.h6,
+                        style = MaterialTheme.lwa.typography.characterSheet.headerValue,
                         color = MaterialTheme.lwa.colorScheme.base.primary,
                         text = header.value?.reflex ?: "",
                     )
@@ -361,7 +361,7 @@ fun CharacterDetailHeader(
                     )
                     Text(
                         modifier = Modifier.alignByBaseline(),
-                        style = MaterialTheme.typography.h6,
+                        style = MaterialTheme.lwa.typography.characterSheet.headerValue,
                         text = header.value?.initiative ?: "",
                     )
                 }
@@ -381,12 +381,12 @@ fun CharacterDetailHeader(
                     )
                     Text(
                         modifier = Modifier.alignByBaseline(),
-                        style = MaterialTheme.typography.h6,
+                        style = MaterialTheme.lwa.typography.characterSheet.headerValue,
                         text = header.value?.mov ?: "",
                     )
                     Text(
                         modifier = Modifier.alignByBaseline(),
-                        style = MaterialTheme.typography.caption,
+                        style = MaterialTheme.lwa.typography.characterSheet.headerCaption,
                         text = "m",
                     )
                 }
@@ -406,7 +406,7 @@ fun CharacterDetailHeader(
                     )
                     Text(
                         modifier = Modifier.alignByBaseline(),
-                        style = MaterialTheme.typography.h6,
+                        style = MaterialTheme.lwa.typography.characterSheet.headerValue,
                         text = header.value?.armor ?: "",
                     )
                 }
@@ -426,7 +426,7 @@ fun CharacterDetailHeader(
                     )
                     Text(
                         modifier = Modifier.alignByBaseline(),
-                        style = MaterialTheme.typography.h6,
+                        style = MaterialTheme.lwa.typography.characterSheet.headerValue,
                         text = header.value?.bonus ?: "",
                     )
                 }
@@ -446,7 +446,7 @@ fun CharacterDetailHeader(
                     )
                     Text(
                         modifier = Modifier.alignByBaseline(),
-                        style = MaterialTheme.typography.h6,
+                        style = MaterialTheme.lwa.typography.characterSheet.headerValue,
                         text = header.value?.grow ?: "",
                     )
                 }
@@ -466,7 +466,7 @@ fun CharacterDetailHeader(
                     )
                     Text(
                         modifier = Modifier.alignByBaseline(),
-                        style = MaterialTheme.typography.h6,
+                        style = MaterialTheme.lwa.typography.characterSheet.headerValue,
                         text = header.value?.learn ?: "",
                     )
                 }

composeApp/src/commonMain/kotlin/com/pixelized/desktop/lwa/ui/screen/campaign/player/detail/inventory/item/InventoryItem.kt

@@ -224,7 +224,7 @@ fun InventoryItem(
                                         text = it,
                                     )
                                     Text(
-                                        style = MaterialTheme.lwa.typography.inventory.countInline,
+                                        style = MaterialTheme.lwa.typography.inventory.count,
                                         overflow = TextOverflow.Ellipsis,
                                         maxLines = 1,
                                         text = it,

composeApp/src/commonMain/kotlin/com/pixelized/desktop/lwa/ui/screen/campaign/player/detail/inventory/item/InventoryPurse.kt

@@ -75,7 +75,7 @@ fun InventoryPurse(
                     transitionSpec = coinTransitionSpec(),
                 ) {
                     Text(
-                        style = MaterialTheme.lwa.typography.base.body1,
+                        style = MaterialTheme.lwa.typography.system.body1,
                         fontWeight = FontWeight.Bold,
                         text = "$it",
                     )
@@ -93,7 +93,7 @@ fun InventoryPurse(
                     transitionSpec = coinTransitionSpec(),
                 ) {
                     Text(
-                        style = MaterialTheme.lwa.typography.base.body1,
+                        style = MaterialTheme.lwa.typography.system.body1,
                         fontWeight = FontWeight.Bold,
                         text = "$it",
                     )
@@ -111,7 +111,7 @@ fun InventoryPurse(
                     transitionSpec = coinTransitionSpec(),
                 ) {
                     Text(
-                        style = MaterialTheme.lwa.typography.base.body1,
+                        style = MaterialTheme.lwa.typography.system.body1,
                         fontWeight = FontWeight.Bold,
                         text = "$it",
                     )

composeApp/src/commonMain/kotlin/com/pixelized/desktop/lwa/ui/screen/campaign/player/detail/sheet/item/CharacterDetailSheetCharacteristic.kt

@@ -16,6 +16,7 @@ import com.pixelized.desktop.lwa.ui.composable.decoratedBox.DecoratedBox
 import com.pixelized.desktop.lwa.ui.composable.tooltip.BasicTooltipLayout
 import com.pixelized.desktop.lwa.ui.composable.tooltip.BasicTooltipUio
 import com.pixelized.desktop.lwa.ui.overlay.roll.RollAction
+import com.pixelized.desktop.lwa.ui.theme.lwa
 
 @Stable
 data class CharacterDetailSheetCharacteristicUio(
@@ -51,7 +52,7 @@ fun CharacterDetailSheetCharacteristic(
                 )
                 Text(
                     modifier = Modifier.align(alignment = Alignment.Center),
-                    style = MaterialTheme.typography.h3,
+                    style = MaterialTheme.lwa.typography.characterSheet.characteristic,
                     overflow = TextOverflow.Ellipsis,
                     maxLines = 1,
                     color = MaterialTheme.colors.primary,

composeApp/src/commonMain/kotlin/com/pixelized/desktop/lwa/ui/screen/campaign/player/detail/sheet/item/CharacterDetailSheetSkill.kt

@@ -22,6 +22,7 @@ import com.pixelized.desktop.lwa.ui.composable.shapes.MasteryShape
 import com.pixelized.desktop.lwa.ui.composable.tooltip.BasicTooltipLayout
 import com.pixelized.desktop.lwa.ui.composable.tooltip.BasicTooltipUio
 import com.pixelized.desktop.lwa.ui.overlay.roll.RollAction
+import com.pixelized.desktop.lwa.ui.theme.lwa
 
 @Stable
 data class CharacterDetailSheetSkillUio(
@@ -71,7 +72,7 @@ fun CharacterDetailSheetSkill(
                     text = skill.label
                 )
                 Text(
-                    style = MaterialTheme.typography.body1,
+                    style = MaterialTheme.lwa.typography.characterSheet.skill,
                     fontWeight = FontWeight.Bold,
                     color = MaterialTheme.colors.primary,
                     text = skill.value,

composeApp/src/commonMain/kotlin/com/pixelized/desktop/lwa/ui/screen/campaign/player/ribbon/common/CharacterRibbonPortrait.kt

@@ -2,10 +2,6 @@ package com.pixelized.desktop.lwa.ui.screen.campaign.player.ribbon.common
 
 import androidx.compose.animation.AnimatedContent
 import androidx.compose.animation.AnimatedVisibility
-import androidx.compose.animation.animateColorAsState
-import androidx.compose.animation.core.EaseOutCirc
-import androidx.compose.animation.core.animateFloatAsState
-import androidx.compose.animation.core.tween
 import androidx.compose.animation.fadeIn
 import androidx.compose.animation.fadeOut
 import androidx.compose.animation.togetherWith
@@ -17,9 +13,7 @@ import androidx.compose.foundation.layout.Box
 import androidx.compose.foundation.layout.Column
 import androidx.compose.foundation.layout.Row
 import androidx.compose.foundation.layout.Spacer
-import androidx.compose.foundation.layout.fillMaxHeight
 import androidx.compose.foundation.layout.fillMaxSize
-import androidx.compose.foundation.layout.fillMaxWidth
 import androidx.compose.foundation.layout.offset
 import androidx.compose.foundation.layout.padding
 import androidx.compose.foundation.layout.size
@@ -35,7 +29,6 @@ import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.draw.clip
 import androidx.compose.ui.draw.drawWithContent
-import androidx.compose.ui.graphics.Color
 import androidx.compose.ui.graphics.FilterQuality
 import androidx.compose.ui.input.pointer.PointerButton
 import androidx.compose.ui.layout.ContentScale
@@ -49,8 +42,6 @@ import lwacharactersheet.composeapp.generated.resources.Res
 import lwacharactersheet.composeapp.generated.resources.ic_heart_24dp
 import lwacharactersheet.composeapp.generated.resources.ic_water_drop_24dp
 import org.jetbrains.compose.resources.painterResource
-import kotlin.math.max
-import kotlin.math.min
 
 @Stable
 data class CharacterRibbonPortraitUio(
@@ -148,7 +139,9 @@ fun CharacterRibbonPortrait(
             ) {
                 Row {
                     Icon(
-                        modifier = Modifier.size(12.dp).offset(y = 3.dp),
+                        modifier = Modifier
+                            .size(12.dp)
+                            .offset(y = 2.dp),
                         painter = painterResource(Res.drawable.ic_heart_24dp),
                         contentDescription = null
                     )
@@ -160,15 +153,22 @@ fun CharacterRibbonPortrait(
                         style = MaterialTheme.lwa.typography.portrait.value,
                         text = "${stats.hp}",
                     )
+                    Text(
+                        modifier = Modifier.alignByBaseline(),
+                        style = MaterialTheme.lwa.typography.portrait.separator,
+                        text = "/",
+                    )
                     Text(
                         modifier = Modifier.alignByBaseline(),
                         style = MaterialTheme.lwa.typography.portrait.max,
-                        text = "/${stats.maxHp}",
+                        text = "${stats.maxHp}",
                     )
                 }
                 Row {
                     Icon(
-                        modifier = Modifier.size(12.dp).offset(y = 2.dp),
+                        modifier = Modifier
+                            .size(12.dp)
+                            .offset(y = 2.dp),
                         painter = painterResource(Res.drawable.ic_water_drop_24dp),
                         contentDescription = null
                     )
@@ -180,10 +180,15 @@ fun CharacterRibbonPortrait(
                         style = MaterialTheme.lwa.typography.portrait.value,
                         text = "${stats.pp}",
                     )
+                    Text(
+                        modifier = Modifier.alignByBaseline(),
+                        style = MaterialTheme.lwa.typography.portrait.separator,
+                        text = "/",
+                    )
                     Text(
                         modifier = Modifier.alignByBaseline(),
                         style = MaterialTheme.lwa.typography.portrait.max,
-                        text = "/${stats.maxPp}",
+                        text = "${stats.maxPp}",
                     )
                 }
             }

composeApp/src/commonMain/kotlin/com/pixelized/desktop/lwa/ui/screen/campaign/player/ribbon/common/CharacterRibbonRoll.kt

@@ -112,14 +112,7 @@ fun CharacterRibbonRoll(
                     contentDescription = null,
                 )
                 Text(
-                    style = MaterialTheme.typography.h5.copy(
+                    style = MaterialTheme.lwa.typography.portrait.dice,
-                        shadow = Shadow(
-                            color = MaterialTheme.colors.surface,
-                            offset = Offset.Zero,
-                            blurRadius = 8f,
-                        )
-                    ),
-                    fontWeight = FontWeight.SemiBold,
                     textAlign = TextAlign.Center,
                     color = MaterialTheme.colors.onSurface,
                     text = it.value.toString()

composeApp/src/commonMain/kotlin/com/pixelized/desktop/lwa/ui/screen/campaign/toolbar/dice/DiceMenu.kt

@@ -275,7 +275,7 @@ private fun DiceMenuContent(
         ) {
             Text(
                 modifier = Modifier.fillMaxWidth(),
-                style = MaterialTheme.lwa.typography.dice.result,
+                style = MaterialTheme.lwa.typography.freeDiceThrow.result,
                 textAlign = TextAlign.Center,
                 text = "${it?.value ?: ""}"
             )
@@ -326,7 +326,7 @@ private fun Dice(
             contentDescription = null,
         )
         Text(
-            style = MaterialTheme.lwa.typography.dice.dice,
+            style = MaterialTheme.lwa.typography.freeDiceThrow.dice,
             text = "×"
         )
         AnimatedContent(
@@ -334,12 +334,12 @@ private fun Dice(
             transitionSpec = { contentTransform() }
         ) {
             Text(
-                style = MaterialTheme.lwa.typography.dice.dice,
+                style = MaterialTheme.lwa.typography.freeDiceThrow.dice,
                 text = "$it"
             )
         }
         Text(
-            style = MaterialTheme.lwa.typography.dice.dice,
+            style = MaterialTheme.lwa.typography.freeDiceThrow.dice,
             text = postSign,
         )
     }

composeApp/src/commonMain/kotlin/com/pixelized/desktop/lwa/ui/screen/campaign/toolbar/links/ResourcesMenu.kt

@@ -128,7 +128,7 @@ private fun ResourcesItem(
             contentDescription = null,
         )
         Text(
-            style = MaterialTheme.lwa.typography.base.body1,
+            style = MaterialTheme.lwa.typography.system.body1,
             fontWeight = FontWeight.SemiBold,
             color = MaterialTheme.lwa.colorScheme.base.primary,
             text = stringResource(resource = resource.name),

composeApp/src/commonMain/kotlin/com/pixelized/desktop/lwa/ui/screen/characterSheet/copy/CharacterSheetCopyDialog.kt

@@ -140,7 +140,7 @@ private fun Dialog(
                         exit = fadeOut(),
                     ) {
                         Text(
-                            style = MaterialTheme.lwa.typography.base.caption,
+                            style = MaterialTheme.lwa.typography.system.caption,
                             color = MaterialTheme.lwa.colorScheme.base.error,
                             text = stringResource(Res.string.character_sheet_edit__copy__error)
                         )

composeApp/src/commonMain/kotlin/com/pixelized/desktop/lwa/ui/screen/characterSheet/edit/CharacterSheetEditPage.kt

@@ -246,12 +246,12 @@ fun CharacterSheetEdit(
                     modifier = Modifier.fillMaxWidth(),
                 ) {
                     Text(
-                        style = MaterialTheme.lwa.typography.base.caption,
+                        style = MaterialTheme.lwa.typography.system.caption,
                         text = "id : "
                     )
                     SelectionContainer {
                         Text(
-                            style = MaterialTheme.lwa.typography.base.caption,
+                            style = MaterialTheme.lwa.typography.system.caption,
                             text = form.id.value,
                         )
                     }

composeApp/src/commonMain/kotlin/com/pixelized/desktop/lwa/ui/screen/gamemaster/GameMasterScreen.kt

@@ -35,7 +35,6 @@ import androidx.navigation.NavHostController
 import androidx.navigation.compose.NavHost
 import androidx.navigation.compose.rememberNavController
 import com.pixelized.desktop.lwa.BuildKonfig
-import com.pixelized.desktop.lwa.ui.navigation.screen.destination.composableLevelUp
 import com.pixelized.desktop.lwa.ui.navigation.screen.destination.gamemaster.GMActionDestination
 import com.pixelized.desktop.lwa.ui.navigation.screen.destination.gamemaster.composableGameMasterActionPage
 import com.pixelized.desktop.lwa.ui.navigation.screen.destination.gamemaster.composableGameMasterAlterationEditPage
@@ -112,7 +111,7 @@ private fun GameMasterContent(
                         )
                         Text(
                             modifier = Modifier.alignByBaseline(),
-                            style = MaterialTheme.lwa.typography.base.caption,
+                            style = MaterialTheme.lwa.typography.system.caption,
                             text = stringResource(Res.string.app_version, BuildKonfig.version),
                         )
                     }

composeApp/src/commonMain/kotlin/com/pixelized/desktop/lwa/ui/screen/gamemaster/action/GMAction.kt

@@ -51,7 +51,7 @@ fun GMAction(
             contentDescription = null,
         )
         Text(
-            style = MaterialTheme.lwa.typography.base.body1,
+            style = MaterialTheme.lwa.typography.system.body1,
             text = label,
         )
     }

composeApp/src/commonMain/kotlin/com/pixelized/desktop/lwa/ui/screen/gamemaster/alteration/list/GMAlteration.kt

@@ -69,7 +69,7 @@ fun GMAlteration(
         verticalAlignment = Alignment.CenterVertically,
     ) {
         Text(
-            style = MaterialTheme.lwa.typography.base.body1,
+            style = MaterialTheme.lwa.typography.system.body1,
             overflow = TextOverflow.Ellipsis,
             maxLines = 1,
             text = alteration.label,
@@ -133,7 +133,7 @@ private fun OverflowActionMenu(
                             contentDescription = null,
                         )
                         Text(
-                            style = MaterialTheme.lwa.typography.base.body1,
+                            style = MaterialTheme.lwa.typography.system.body1,
                             color = MaterialTheme.lwa.colorScheme.base.primary,
                             text = stringResource(Res.string.game_master__alteration__delete),
                         )

composeApp/src/commonMain/kotlin/com/pixelized/desktop/lwa/ui/screen/gamemaster/character/edit/GMCharacterEditPage.kt

@@ -352,7 +352,7 @@ fun GMCharacterEditContent(
                                 modifier = Modifier
                                     .animateItem()
                                     .padding(horizontalPadding),
-                                style = MaterialTheme.lwa.typography.base.caption,
+                                style = MaterialTheme.lwa.typography.system.caption,
                                 text = "Metadata",
                             )
                         }
@@ -438,7 +438,7 @@ fun GMCharacterEditContent(
                                         field = form.levelUp,
                                     )
                                     Text(
-                                        style = MaterialTheme.lwa.typography.base.body1,
+                                        style = MaterialTheme.lwa.typography.system.body1,
                                         overflow = TextOverflow.Ellipsis,
                                         maxLines = 1,
                                         text = "Montée de niveau"
@@ -478,7 +478,7 @@ fun GMCharacterEditContent(
                                 modifier = Modifier
                                     .animateItem()
                                     .padding(paddingValues = horizontalPadding),
-                                style = MaterialTheme.lwa.typography.base.caption,
+                                style = MaterialTheme.lwa.typography.system.caption,
                                 text = "Characteristics",
                             )
                         }
@@ -500,7 +500,7 @@ fun GMCharacterEditContent(
                                 modifier = Modifier
                                     .animateItem()
                                     .padding(paddingValues = horizontalPadding),
-                                style = MaterialTheme.lwa.typography.base.caption,
+                                style = MaterialTheme.lwa.typography.system.caption,
                                 text = "Compétences communes",
                             )
                         }
@@ -523,7 +523,7 @@ fun GMCharacterEditContent(
                                 modifier = Modifier
                                     .animateItem()
                                     .padding(paddingValues = horizontalPadding),
-                                style = MaterialTheme.lwa.typography.base.caption,
+                                style = MaterialTheme.lwa.typography.system.caption,
                                 text = "Compétences spéciales",
                             )
                         }
@@ -561,7 +561,7 @@ fun GMCharacterEditContent(
                                 modifier = Modifier
                                     .animateItem()
                                     .padding(paddingValues = horizontalPadding),
-                                style = MaterialTheme.lwa.typography.base.caption,
+                                style = MaterialTheme.lwa.typography.system.caption,
                                 text = "Compétences magiques",
                             )
                         }
@@ -599,7 +599,7 @@ fun GMCharacterEditContent(
                                 modifier = Modifier
                                     .animateItem()
                                     .padding(paddingValues = horizontalPadding),
-                                style = MaterialTheme.lwa.typography.base.caption,
+                                style = MaterialTheme.lwa.typography.system.caption,
                                 text = "Actions",
                             )
                         }

composeApp/src/commonMain/kotlin/com/pixelized/desktop/lwa/ui/screen/gamemaster/character/list/GMCharacter.kt

@@ -34,7 +34,6 @@ import com.pixelized.desktop.lwa.ui.screen.gamemaster.common.tag.GMTag
 import com.pixelized.desktop.lwa.ui.screen.gamemaster.common.tag.GMTagUio
 import com.pixelized.desktop.lwa.ui.theme.lwa
 import lwacharactersheet.composeapp.generated.resources.Res
-import lwacharactersheet.composeapp.generated.resources.character_sheet_edit__external_link
 import lwacharactersheet.composeapp.generated.resources.game_master__character_action__add_to_group
 import lwacharactersheet.composeapp.generated.resources.game_master__character_action__add_to_npc
 import lwacharactersheet.composeapp.generated.resources.game_master__character_action__delete
@@ -158,20 +157,20 @@ fun GMCharacter(
             ) {
                 Text(
                     modifier = Modifier.alignByBaseline(),
-                    style = MaterialTheme.lwa.typography.base.body1,
+                    style = MaterialTheme.lwa.typography.system.body1,
                     text = character.name,
                 )
                 character.job?.let {
                     Text(
                         modifier = Modifier.alignByBaseline(),
-                        style = MaterialTheme.lwa.typography.base.body1,
+                        style = MaterialTheme.lwa.typography.system.body1,
                         fontStyle = FontStyle.Italic,
                         text = "($it)",
                     )
                 }
                 Text(
                     modifier = Modifier.alignByBaseline(),
-                    style = MaterialTheme.lwa.typography.base.caption,
+                    style = MaterialTheme.lwa.typography.system.caption,
                     text = stringResource(
                         Res.string.game_master__character_level__label,
                         character.level,
@@ -238,7 +237,7 @@ private fun OverflowActionMenu(
                                 contentDescription = null,
                             )
                             Text(
-                                style = MaterialTheme.lwa.typography.base.body1,
+                                style = MaterialTheme.lwa.typography.system.body1,
                                 color = MaterialTheme.lwa.colorScheme.base.primary,
                                 text = stringResource(action.label),
                             )

composeApp/src/commonMain/kotlin/com/pixelized/desktop/lwa/ui/screen/gamemaster/common/tag/GMTag.kt

@@ -66,7 +66,7 @@ fun GMTag(
             if (tag.meta) {
                 Text(
                     modifier = Modifier.alignByBaseline(),
-                    style = MaterialTheme.lwa.typography.base.caption,
+                    style = MaterialTheme.lwa.typography.system.caption,
                     color = animatedColor.value,
                     overflow = TextOverflow.Ellipsis,
                     maxLines = 1,
@@ -75,7 +75,7 @@ fun GMTag(
             }
             Text(
                 modifier = Modifier.alignByBaseline(),
-                style = MaterialTheme.lwa.typography.base.caption,
+                style = MaterialTheme.lwa.typography.system.caption,
                 color = animatedColor.value,
                 overflow = TextOverflow.Ellipsis,
                 maxLines = 1,

composeApp/src/commonMain/kotlin/com/pixelized/desktop/lwa/ui/screen/gamemaster/item/edit/GMItemEditPage.kt

@@ -297,7 +297,7 @@ private fun GMItemEditContent(
                                     verticalAlignment = Alignment.CenterVertically,
                                 ) {
                                     Text(
-                                        style = MaterialTheme.lwa.typography.base.body1,
+                                        style = MaterialTheme.lwa.typography.system.body1,
                                         text = stringResource(Res.string.game_master__item__edit_stackable)
                                     )
                                     LwaCheckBox(
@@ -315,7 +315,7 @@ private fun GMItemEditContent(
                                     verticalAlignment = Alignment.CenterVertically,
                                 ) {
                                     Text(
-                                        style = MaterialTheme.lwa.typography.base.body1,
+                                        style = MaterialTheme.lwa.typography.system.body1,
                                         text = stringResource(Res.string.game_master__item__edit_equipable)
                                     )
                                     LwaCheckBox(
@@ -333,7 +333,7 @@ private fun GMItemEditContent(
                                     verticalAlignment = Alignment.CenterVertically,
                                 ) {
                                     Text(
-                                        style = MaterialTheme.lwa.typography.base.body1,
+                                        style = MaterialTheme.lwa.typography.system.body1,
                                         text = stringResource(Res.string.game_master__item__edit_consumable)
                                     )
                                     LwaCheckBox(

composeApp/src/commonMain/kotlin/com/pixelized/desktop/lwa/ui/screen/gamemaster/item/list/GMItem.kt

@@ -10,7 +10,6 @@ import androidx.compose.foundation.layout.Arrangement
 import androidx.compose.foundation.layout.PaddingValues
 import androidx.compose.foundation.layout.Row
 import androidx.compose.foundation.layout.padding
-import androidx.compose.foundation.layout.widthIn
 import androidx.compose.foundation.lazy.LazyRow
 import androidx.compose.foundation.lazy.items
 import androidx.compose.foundation.lazy.rememberLazyListState
@@ -34,7 +33,6 @@ import androidx.compose.ui.draw.clip
 import androidx.compose.ui.text.style.TextOverflow
 import androidx.compose.ui.unit.Dp
 import androidx.compose.ui.unit.dp
-import androidx.compose.ui.unit.min
 import com.pixelized.desktop.lwa.ui.screen.gamemaster.common.tag.GMTag
 import com.pixelized.desktop.lwa.ui.screen.gamemaster.common.tag.GMTagUio
 import com.pixelized.desktop.lwa.ui.theme.lwa
@@ -85,7 +83,7 @@ fun GMItem(
     ) {
         Text(
             modifier = Modifier.weight(1f),
-            style = MaterialTheme.lwa.typography.base.body1,
+            style = MaterialTheme.lwa.typography.system.body1,
             overflow = TextOverflow.Ellipsis,
             maxLines = 1,
             text = item.label,
@@ -162,7 +160,7 @@ private fun OverflowActionMenu(
                             contentDescription = null,
                         )
                         Text(
-                            style = MaterialTheme.lwa.typography.base.body1,
+                            style = MaterialTheme.lwa.typography.system.body1,
                             color = MaterialTheme.lwa.colorScheme.base.primary,
                             text = stringResource(Res.string.game_master__item__delete),
                         )

composeApp/src/commonMain/kotlin/com/pixelized/desktop/lwa/ui/screen/levelup/LevelScreen.kt

@@ -239,7 +239,7 @@ private fun LevelUpContent(
                         )
                         Text(
                             modifier = Modifier.alignByBaseline(),
-                            style = MaterialTheme.lwa.typography.base.caption,
+                            style = MaterialTheme.lwa.typography.system.caption,
                             text = (header.value?.level ?: 0).let { level ->
                                 stringResource(
                                     resource = Res.string.level_up__character__label,

composeApp/src/commonMain/kotlin/com/pixelized/desktop/lwa/ui/screen/splash/SplashScreen.kt

@@ -48,12 +48,12 @@ private fun SplashContent(
     ) {
         Text(
             modifier = Modifier.align(Alignment.Center),
-            style = MaterialTheme.lwa.typography.base.h3,
+            style = MaterialTheme.lwa.typography.system.h3,
             text = stringResource(Res.string.app_name)
         )
         Text(
             modifier = Modifier.align(Alignment.BottomEnd),
-            style = MaterialTheme.lwa.typography.base.caption,
+            style = MaterialTheme.lwa.typography.system.caption,
             text = stringResource(Res.string.app_version, BuildKonfig.version)
         )
     }

composeApp/src/commonMain/kotlin/com/pixelized/desktop/lwa/ui/theme/LwaTheme.kt

@@ -57,7 +57,7 @@ fun LwaTheme(
     ) {
         MaterialTheme(
             colors = lwaColors.base,
-            typography = MaterialTheme.typography,
+            typography = lwaTypography.system,
             shapes = lwaShapes.base,
             content = content,
         )

composeApp/src/commonMain/kotlin/com/pixelized/desktop/lwa/ui/theme/typography/LwaTypography.kt

@@ -18,33 +18,18 @@ import androidx.compose.ui.text.style.TextAlign
 import androidx.compose.ui.unit.sp
 import com.pixelized.desktop.lwa.ui.theme.color.LwaColors
 import com.pixelized.desktop.lwa.ui.theme.typography.LwaTypography.Settings
-import lwacharactersheet.composeapp.generated.resources.AtkinsonHyperlegibleMono_Bold
+import com.pixelized.desktop.lwa.ui.theme.typography.fonts.RobotoMono
-import lwacharactersheet.composeapp.generated.resources.AtkinsonHyperlegibleMono_BoldItalic
-import lwacharactersheet.composeapp.generated.resources.AtkinsonHyperlegibleMono_ExtraBold
-import lwacharactersheet.composeapp.generated.resources.AtkinsonHyperlegibleMono_ExtraBoldItalic
-import lwacharactersheet.composeapp.generated.resources.AtkinsonHyperlegibleMono_ExtraLight
-import lwacharactersheet.composeapp.generated.resources.AtkinsonHyperlegibleMono_ExtraLightItalic
-import lwacharactersheet.composeapp.generated.resources.AtkinsonHyperlegibleMono_Italic
-import lwacharactersheet.composeapp.generated.resources.AtkinsonHyperlegibleMono_Light
-import lwacharactersheet.composeapp.generated.resources.AtkinsonHyperlegibleMono_LightItalic
-import lwacharactersheet.composeapp.generated.resources.AtkinsonHyperlegibleMono_Medium
-import lwacharactersheet.composeapp.generated.resources.AtkinsonHyperlegibleMono_MediumItalic
-import lwacharactersheet.composeapp.generated.resources.AtkinsonHyperlegibleMono_Regular
-import lwacharactersheet.composeapp.generated.resources.AtkinsonHyperlegibleMono_SemiBold
-import lwacharactersheet.composeapp.generated.resources.AtkinsonHyperlegibleMono_SemiBoldItalic
-import lwacharactersheet.composeapp.generated.resources.Res
-import lwacharactersheet.composeapp.generated.resources.consola_mono_bold
-import lwacharactersheet.composeapp.generated.resources.consola_mono_book
-import org.jetbrains.compose.resources.Font
 
 @Stable
 data class LwaTypography(
-    val base: Typography,
+    val robotoMono: Typography,
+    val system: Typography,
     val chat: Chat,
     val settings: Settings,
     val portrait: Portrait,
+    val characterSheet: CharacterSheet,
     val inventory: Inventory,
-    val dice: Dice,
+    val freeDiceThrow: Dice,
 ) {
     @Stable
     data class Chat(
@@ -63,13 +48,23 @@ data class LwaTypography(
     @Stable
     data class Portrait(
         val value: TextStyle,
+        val separator: TextStyle,
         val max: TextStyle,
+        val dice: TextStyle,
+    )
+
+    @Stable
+    data class CharacterSheet(
+        val headerValue: TextStyle,
+        val headerCaption: TextStyle,
+        val characteristic: TextStyle,
+        val skill: TextStyle,
     )
 
     @Stable
     data class Inventory(
         val countOutline: TextStyle,
-        val countInline: TextStyle,
+        val count: TextStyle,
         val label: TextStyle,
     )
 
@@ -80,110 +75,27 @@ data class LwaTypography(
     )
 }
 
-@Composable
-@Stable
-fun ConsolaFontFamily() = FontFamily(
-    Font(resource = Res.font.consola_mono_book, weight = FontWeight.Normal),
-    Font(resource = Res.font.consola_mono_bold, weight = FontWeight.Bold),
-)
-
-@Composable
-@Stable
-fun AtkinsonHyperLigibleMonoFontFamily() = FontFamily(
-    Font(
-        resource = Res.font.AtkinsonHyperlegibleMono_ExtraLight,
-        weight = FontWeight.ExtraLight,
-        style = FontStyle.Normal
-    ),
-    Font(
-        resource = Res.font.AtkinsonHyperlegibleMono_Light,
-        weight = FontWeight.Light,
-        style = FontStyle.Normal
-    ),
-    Font(
-        resource = Res.font.AtkinsonHyperlegibleMono_Regular,
-        weight = FontWeight.Normal,
-        style = FontStyle.Normal
-    ),
-    Font(
-        resource = Res.font.AtkinsonHyperlegibleMono_Medium,
-        weight = FontWeight.Medium,
-        style = FontStyle.Normal
-    ),
-    Font(
-        resource = Res.font.AtkinsonHyperlegibleMono_SemiBold,
-        weight = FontWeight.SemiBold,
-        style = FontStyle.Normal
-    ),
-    Font(
-        resource = Res.font.AtkinsonHyperlegibleMono_Bold,
-        weight = FontWeight.Bold,
-        style = FontStyle.Normal
-    ),
-    Font(
-        resource = Res.font.AtkinsonHyperlegibleMono_ExtraBold,
-        weight = FontWeight.ExtraBold,
-        style = FontStyle.Normal
-    ),
-    Font(
-        resource = Res.font.AtkinsonHyperlegibleMono_ExtraLightItalic,
-        weight = FontWeight.ExtraLight,
-        style = FontStyle.Italic
-    ),
-    Font(
-        resource = Res.font.AtkinsonHyperlegibleMono_LightItalic,
-        weight = FontWeight.Light,
-        style = FontStyle.Italic
-    ),
-    Font(
-        resource = Res.font.AtkinsonHyperlegibleMono_Italic,
-        weight = FontWeight.Normal,
-        style = FontStyle.Italic
-    ),
-    Font(
-        resource = Res.font.AtkinsonHyperlegibleMono_MediumItalic,
-        weight = FontWeight.Medium,
-        style = FontStyle.Italic
-    ),
-    Font(
-        resource = Res.font.AtkinsonHyperlegibleMono_SemiBoldItalic,
-        weight = FontWeight.SemiBold,
-        style = FontStyle.Italic
-    ),
-    Font(
-        resource = Res.font.AtkinsonHyperlegibleMono_BoldItalic,
-        weight = FontWeight.Bold,
-        style = FontStyle.Italic
-    ),
-    Font(
-        resource = Res.font.AtkinsonHyperlegibleMono_ExtraBoldItalic,
-        weight = FontWeight.ExtraBold,
-        style = FontStyle.Italic
-    ),
-)
-
 @Composable
 @Stable
 fun lwaTypography(
-    base: Typography = Typography(),
     colors: LwaColors,
 ): LwaTypography {
-    val consolaFontFamily = ConsolaFontFamily()
+    val system = Typography()
-    val atkinsonHyperLigibleMonoFontFamily = AtkinsonHyperLigibleMonoFontFamily()
+    val robotoMono = Typography(fontFamily = RobotoMono())
 
-    return remember(consolaFontFamily) {
+    return remember {
         LwaTypography(
-            base = base,
+            system = system,
+            robotoMono = robotoMono,
             chat = LwaTypography.Chat(
-                timestamp = base.body1.copy(
+                timestamp = system.body1.copy(
-                    fontFamily = consolaFontFamily,
                     fontWeight = FontWeight.Normal,
                     fontSize = 12.sp,
                     lineHeight = 16.sp,
                     letterSpacing = 0.sp,
                     color = colors.chat.timestamp,
                 ),
-                text = base.body1.copy(
+                text = system.body1.copy(
                     fontWeight = FontWeight.Normal,
                     fontSize = 14.sp,
                     lineHeight = 16.sp,
@@ -192,23 +104,23 @@ fun lwaTypography(
                 ),
             ),
             settings = Settings(
-                section = base.h6,
+                section = system.h6,
-                title = base.body1.copy(
+                title = system.body1.copy(
                     fontWeight = FontWeight.SemiBold,
                 ),
-                input = base.body1.copy(
+                input = system.body1.copy(
                     fontWeight = FontWeight.SemiBold,
                     fontSize = 18.sp,
                     lineHeight = 26.sp,
                     textAlign = TextAlign.End,
                 ),
-                description = base.caption.copy(
+                description = system.caption.copy(
                     fontStyle = FontStyle.Italic,
                     color = colors.base.onSurface.copy(alpha = 0.7f),
                 ),
             ),
             portrait = LwaTypography.Portrait(
-                value = base.caption.copy(
+                value = robotoMono.caption.copy(
                     fontWeight = FontWeight.Bold,
                     shadow = Shadow(
                         color = Color.Black,
@@ -216,7 +128,15 @@ fun lwaTypography(
                         blurRadius = 2f,
                     ),
                 ),
-                max = base.caption.copy(
+                separator = system.caption.copy(
+                    fontWeight = FontWeight.ExtraLight,
+                    shadow = Shadow(
+                        color = Color.Black,
+                        offset = Offset(x = 1f, y = 1f),
+                        blurRadius = 2f,
+                    ),
+                ),
+                max = robotoMono.caption.copy(
                     fontWeight = FontWeight.Light,
                     shadow = Shadow(
                         color = Color.Black,
@@ -224,10 +144,32 @@ fun lwaTypography(
                         blurRadius = 2f,
                     ),
                 ),
+                dice = robotoMono.h5.copy(
+                    fontWeight = FontWeight.Medium,
+                    shadow = Shadow(
+                        color = colors.base.surface,
+                        offset = Offset.Zero,
+                        blurRadius = 8f,
+                    )
+                )
+            ),
+            characterSheet = LwaTypography.CharacterSheet(
+                headerValue = robotoMono.subtitle1.copy(
+                    fontSize = 18.sp,
+                    fontWeight = FontWeight.Medium,
+                ),
+                headerCaption = system.caption,
+                characteristic = robotoMono.h3.copy(
+                    fontWeight = FontWeight.Normal,
+                ),
+                skill = robotoMono.subtitle1.copy(
+                    fontSize = 16.sp,
+                    fontWeight = FontWeight.Medium,
+                ),
             ),
             inventory = LwaTypography.Inventory(
-                countOutline = base.caption.copy(
+                countOutline = robotoMono.caption.copy(
-                    fontWeight = FontWeight.SemiBold,
+                    fontWeight = FontWeight.Medium,
                     color = colors.elevated.base4dp,
                     drawStyle = Stroke(
                         miter = 3f,
@@ -235,25 +177,42 @@ fun lwaTypography(
                         join = StrokeJoin.Round,
                     )
                 ),
-                countInline = base.caption.copy(
+                count = robotoMono.caption.copy(
-                    fontWeight = FontWeight.SemiBold,
+                    fontWeight = FontWeight.Medium,
                     color = colors.base.onSurface,
                     drawStyle = Fill
                 ),
-                label = base.body1.copy(
+                label = system.body1.copy(
                     fontWeight = FontWeight.Normal,
                 ),
             ),
-            dice = LwaTypography.Dice(
+            freeDiceThrow = LwaTypography.Dice(
-                dice = base.h6.copy(
+                dice = robotoMono.h6.copy(
-                    fontFamily = atkinsonHyperLigibleMonoFontFamily,
                     color = colors.base.onSurface,
                 ),
-                result = base.h4.copy(
+                result = robotoMono.h4.copy(
-                    fontFamily = atkinsonHyperLigibleMonoFontFamily,
                     color = colors.base.onSurface,
                 ),
             )
         )
     }
 }
+
+@Stable
+fun Typography(fontFamily: FontFamily): Typography = Typography().let { typography: Typography ->
+    typography.copy(
+        h1 = typography.h1.copy(fontFamily = fontFamily),
+        h2 = typography.h2.copy(fontFamily = fontFamily),
+        h3 = typography.h3.copy(fontFamily = fontFamily),
+        h4 = typography.h4.copy(fontFamily = fontFamily),
+        h5 = typography.h5.copy(fontFamily = fontFamily),
+        h6 = typography.h6.copy(fontFamily = fontFamily),
+        subtitle1 = typography.subtitle1.copy(fontFamily = fontFamily),
+        subtitle2 = typography.subtitle2.copy(fontFamily = fontFamily),
+        body1 = typography.body1.copy(fontFamily = fontFamily),
+        body2 = typography.body2.copy(fontFamily = fontFamily),
+        button = typography.button.copy(fontFamily = fontFamily),
+        caption = typography.caption.copy(fontFamily = fontFamily),
+        overline = typography.overline.copy(fontFamily = fontFamily),
+    )
+}

composeApp/src/commonMain/kotlin/com/pixelized/desktop/lwa/ui/theme/typography/fonts/RobotoMono.kt

@@ -0,0 +1,86 @@
+package com.pixelized.desktop.lwa.ui.theme.typography.fonts
+
+import androidx.compose.runtime.Composable
+import androidx.compose.runtime.Stable
+import androidx.compose.ui.text.font.FontFamily
+import androidx.compose.ui.text.font.FontStyle
+import androidx.compose.ui.text.font.FontWeight
+import lwacharactersheet.composeapp.generated.resources.Res
+import lwacharactersheet.composeapp.generated.resources.RobotoMono_Bold
+import lwacharactersheet.composeapp.generated.resources.RobotoMono_BoldItalic
+import lwacharactersheet.composeapp.generated.resources.RobotoMono_ExtraLight
+import lwacharactersheet.composeapp.generated.resources.RobotoMono_ExtraLightItalic
+import lwacharactersheet.composeapp.generated.resources.RobotoMono_Italic
+import lwacharactersheet.composeapp.generated.resources.RobotoMono_Light
+import lwacharactersheet.composeapp.generated.resources.RobotoMono_LightItalic
+import lwacharactersheet.composeapp.generated.resources.RobotoMono_Medium
+import lwacharactersheet.composeapp.generated.resources.RobotoMono_MediumItalic
+import lwacharactersheet.composeapp.generated.resources.RobotoMono_Regular
+import lwacharactersheet.composeapp.generated.resources.RobotoMono_SemiBold
+import lwacharactersheet.composeapp.generated.resources.RobotoMono_SemiBoldItalic
+import org.jetbrains.compose.resources.Font
+
+@Composable
+@Stable
+fun RobotoMono() = FontFamily(
+    Font(
+        resource = Res.font.RobotoMono_ExtraLight,
+        weight = FontWeight.ExtraLight,
+        style = FontStyle.Normal
+    ),
+    Font(
+        resource = Res.font.RobotoMono_Light,
+        weight = FontWeight.Light,
+        style = FontStyle.Normal
+    ),
+    Font(
+        resource = Res.font.RobotoMono_Regular,
+        weight = FontWeight.Normal,
+        style = FontStyle.Normal
+    ),
+    Font(
+        resource = Res.font.RobotoMono_Medium,
+        weight = FontWeight.Medium,
+        style = FontStyle.Normal
+    ),
+    Font(
+        resource = Res.font.RobotoMono_SemiBold,
+        weight = FontWeight.SemiBold,
+        style = FontStyle.Normal
+    ),
+    Font(
+        resource = Res.font.RobotoMono_Bold,
+        weight = FontWeight.Bold,
+        style = FontStyle.Normal
+    ),
+    Font(
+        resource = Res.font.RobotoMono_ExtraLightItalic,
+        weight = FontWeight.ExtraLight,
+        style = FontStyle.Italic
+    ),
+    Font(
+        resource = Res.font.RobotoMono_LightItalic,
+        weight = FontWeight.Light,
+        style = FontStyle.Italic
+    ),
+    Font(
+        resource = Res.font.RobotoMono_Italic,
+        weight = FontWeight.Normal,
+        style = FontStyle.Italic
+    ),
+    Font(
+        resource = Res.font.RobotoMono_MediumItalic,
+        weight = FontWeight.Medium,
+        style = FontStyle.Italic
+    ),
+    Font(
+        resource = Res.font.RobotoMono_SemiBoldItalic,
+        weight = FontWeight.SemiBold,
+        style = FontStyle.Italic
+    ),
+    Font(
+        resource = Res.font.RobotoMono_BoldItalic,
+        weight = FontWeight.Bold,
+        style = FontStyle.Italic
+    ),
+)