feat: ソング：音素タイミングの表示エリアを追加

src/components/Sing/CharacterPortrait.vue

@@ -36,40 +36,25 @@ const portraitPath = computed(() => {
 @use "@/styles/colors" as colors;
 
 // 表示変数
-$right-margin: 24px;
-$portrait-min-width: 200px;
-$portrait-max-width: 40vw;
 $portrait-min-height: 500px;
-$portrait-max-height: 60vh;
 
 // 画面右下に固定表示
 // 幅固定、高さ可変、画像のアスペクト比を保持、heightを調整
 .character-portrait-wrap {
-  display: flex;
-  justify-content: flex-end;
-  align-items: flex-end;
-  position: sticky;
-  bottom: 0;
-  right: $right-margin;
   height: 100%;
-  contain: strict;
-  pointer-events: none;
+  display: flex;
+  flex-direction: column;
+  margin-left: auto;
+  overflow: hidden;
 }
 
 // 通常は下部基準だが、親要素が最小高さより小さい場合は上部基準とし頭を残して足から隠れさせる
 .character-portrait {
-  position: absolute;
-  // 通常は下部基準
-  bottom: 0;
-  // 親要素が最小高さより小さい場合は上部基準
-  top: max(0px, calc(100% - $portrait-min-height));
-  min-width: $portrait-min-width;
-  max-width: $portrait-max-width;
-  min-height: $portrait-min-height;
-  max-height: $portrait-max-height;
+  display: block;
+  margin-top: auto;
+  min-height: max(75%, $portrait-min-height);
   opacity: 0.55;
   backface-visibility: hidden;
   object-fit: contain;
-  transform-origin: top;
 }
 </style>