Update app.py

app.py

@@ -144,68 +144,68 @@ def generate_html_from_text(text, temperature=1.0, layout_type="standard"):
 - スマートスペーシング：内容量に応じて自動的に間隔を調整
 - 以下のCSSを必ず追加して、テキストの重なりを防止する：
 ```css
-.card, .section, .info-box {
+.card, .section, .info-box {{
   overflow: hidden;
   display: flex;
   flex-direction: column;
   margin-bottom: 1.5rem;
   min-height: fit-content;
-}
-.card-content {
+}}
+.card-content {{
   flex: 1;
   display: flex;
   flex-direction: column;
-}
-.card-title {
+}}
+.card-title {{
   font-weight: bold;
   margin-bottom: 0.75rem;
   line-height: 1.4;
-}
-.card-text {
+}}
+.card-text {{
   line-height: 1.6;
   margin-bottom: 0.5rem;
-}
-.info-item {
+}}
+.info-item {{
   margin-bottom: 0.75rem;
   line-height: 1.5;
-}
-li {
+}}
+li {{
   margin-bottom: 0.5rem;
   line-height: 1.5;
-}
-p {
+}}
+p {{
   margin-bottom: 0.75rem;
   line-height: 1.5;
-}
+}}
 ```
 
 ## 自動テキスト調整機能
 以下のJavaScriptを必ず追加して、テキスト量に応じたフォントサイズの自動調整を行う：
 ```html
 <script>
-document.addEventListener('DOMContentLoaded', function() {
+document.addEventListener('DOMContentLoaded', function() {{
   // カード内のテキスト量に基づいてフォントサイズを調整
   const cards = document.querySelectorAll('.card, .section, .info-box');
-  cards.forEach(card => {
+  cards.forEach(card => {{
     const cardContent = card.querySelector('.card-content') || card;
     const textLength = cardContent.textContent.length;
     
     // テキスト量に応じてフォントサイズを調整
-    if (textLength > 200) {
+    if (textLength > 200) {{
       card.style.fontSize = '0.9em';
-    }
-    if (textLength > 300) {
+    }}
+    if (textLength > 300) {{
       card.style.fontSize = '0.85em';
-    }
+    }}
     
     // カード内の要素間の余白を確保
     const elements = card.querySelectorAll('p, h3, h4, ul, ol, .info-item');
-    elements.forEach(el => {
+    elements.forEach(el => {{
       el.style.marginBottom = '0.75rem';
       el.style.lineHeight = '1.5';
-    });
-  });
-});
+    }});
+  }});
+}});
 </script>
 ```