/* Royal Chef model card (assets/js/slm/slm-chat.js) and the streaming reply. Loaded after chat-market.css. */
.model-card {
  position: relative; z-index: 2; margin: 0 0 .6rem; padding: .8rem .95rem; border: 1px solid var(--line); border-radius: var(--radius-lg);
  background: #fff; color: var(--ink-deep); box-shadow: var(--lift); font-size: .88rem;
}
.model-card[hidden] { display: none; }
.model-card p { margin: 0; }
.model-card-title { display: flex; align-items: center; gap: .5rem; font-family: var(--font-display); font-weight: 750; font-size: 1rem; }
.model-card-title::before { content: ""; flex: none; width: .6rem; height: .6rem; border-radius: 50%; background: var(--saffron); box-shadow: 0 0 0 2px #fff, 0 0 0 3.5px var(--saffron); }
.model-card-text { margin-top: .2rem !important; color: var(--text-secondary); line-height: 1.45; }
.model-card-lang { margin-top: .45rem !important; padding-left: .7rem; border-left: 3px solid var(--saffron); color: var(--ink-deep); }
.model-card-actions { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem; margin-top: .6rem; }
.model-card .model-card-go { min-height: 40px; padding: .45rem 1rem; border: 1px solid var(--ink-deep); border-radius: 12px;
  background: var(--btn-tomato, var(--tomato)); color: #fff; font: inherit; font-weight: 700; box-shadow: var(--lift); cursor: pointer;
  transition: transform .18s var(--ease-spring, ease), box-shadow .18s; }
.model-card .model-card-go:hover { box-shadow: var(--lift-2); transform: translate(-1px, -1px); }
.model-card-later { min-height: 40px; padding: .45rem .7rem; border: 0; background: none; color: var(--text-secondary);
  font: inherit; text-decoration: underline; cursor: pointer; }
.model-card-bar { height: 8px; margin-top: .5rem; border: 1px solid var(--ink-deep); border-radius: var(--radius-full); background: #fff; overflow: hidden; }
.model-card-fill { display: block; width: 0; height: 100%; background: var(--teal); transition: width .3s var(--ease-out); }
.model-card[data-state="ready"] { padding: .35rem .8rem; background: transparent; border-style: dashed; box-shadow: none; }
.model-card-ready { display: flex; align-items: center; gap: .45rem; color: var(--text-secondary); font-size: .8rem; }
.model-card-ready::before { content: ""; flex: none; width: .55rem; height: .55rem; border-radius: 50%; background: var(--leaf); }
.model-card[data-state="error"] { background: var(--tomato-soft); }

/* reply being written */
.msg-streaming .msg-bubble { position: relative; }
.msg-stream-body:empty::before { content: "…"; color: var(--text-secondary); }
.msg-stop { margin-top: .6rem; min-height: 36px; padding: .3rem .8rem; border: 1px solid var(--line); border-radius: 10px;
  background: #fff; color: var(--ink-deep); font: inherit; font-size: .82rem; font-weight: 700; cursor: pointer; }
.msg-stop:disabled { opacity: .5; cursor: default; }
.msg-sources-site { color: var(--text-secondary); font-size: .76rem; }

@media (max-width: 480px) {
  .model-card { font-size: .84rem; padding: .65rem .75rem; }
  .model-card-actions { flex-direction: column; align-items: stretch; }
}
@media (prefers-reduced-motion: reduce) {
  .model-card-fill { transition: none; }
}