body {
font-family: system-ui, -apple-system, Segoe UI, Roboto, "Helvetica Neue", Arial, "Noto Sans JP", sans-serif;
margin: 0;
background: #F5F2E7;
color: #222;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}

#app {
max-width: 800px;
margin: 0 auto;
padding: 16px;
}

.header {
display: flex;
align-items: center;
justify-content: space-between;
gap: 12px;
}

h1 {
font-size: 20px;
margin: 0;
color: #5D4037;
}

#log {
background: #fff;
border-radius: 12px;
padding: 12px;
height: 60vh;
overflow: auto;
box-shadow: 0 2px 6px rgba(0,0,0,.05);
}

/* 各メッセージ行の簡易スタイル */
#log .user {
text-align: right;
color: #FFFFFF;
background: #5D4037;
display: inline-block;
padding: 8px 12px;
border-radius: 14px 14px 0 14px;
margin: 8px 0 8px auto;
max-width: 90%;
white-space: pre-wrap;
word-break: break-word;
}

#log .assistant {
text-align: left;
color: #333;
background: #FFFFFF;
border: 1px solid #eee;
display: inline-block;
padding: 8px 12px;
border-radius: 14px 14px 14px 0;
margin: 8px auto 8px 0;
max-width: 90%;
white-space: pre-wrap;
word-break: break-word;
}

/* Flutterの括弧内強調と色味（app.js側の<strong>にも適用） */
#log .assistant strong {
color: #795548;
font-weight: 700;
}

/* エラーメッセージ */
#log .error {
text-align: left;
color: #b71c1c;
background: #FFEBEE;
border: 1px solid #ffcdd2;
display: inline-block;
padding: 8px 12px;
border-radius: 12px;
margin: 8px auto 8px 0;
max-width: 90%;
white-space: pre-wrap;
word-break: break-word;
}

/* 入力フォーム */
#form {
display: flex;
gap: 8px;
margin-top: 12px;
}

#msg {
flex: 1;
min-height: 44px;
max-height: 180px;
padding: 10px 12px;
border: 1px solid #ddd;
border-radius: 20px;
background: #fafafa;
resize: vertical; /* 必要に応じて高さ調整可 */
outline: none;
font: inherit;
line-height: 1.3;
}

#msg::placeholder {
color: #999;
}

button {
padding: 10px 16px;
background: #5D4037;
color: #fff;
border: 0;
border-radius: 20px;
cursor: pointer;
font: inherit;
}

button:disabled {
opacity: .5;
cursor: default;
}

button.secondary {
background: transparent;
color: #5D4037;
border: 1px solid #5D4037;
}