.study-workspace { display: contents; }
.study-tutor-modes { margin-top: 18px; }
.study-room-active .narrow-shell { max-width: 1200px; }
.study-room-active .study-workspace {
  display: grid; grid-template-columns: minmax(0, 1fr) 360px; gap: 22px; align-items: start;
}
.conversation-card { min-height: 680px; max-height: 820px; padding: 24px; display: flex; flex-direction: column; }
.mode-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.mode-grid .btn { padding: 10px 8px; }
.conversation-head { display: flex; justify-content: space-between; align-items: start; gap: 16px; border-bottom: 1px solid var(--line); padding-bottom: 18px; }
.conversation-head h2 { font-size: 22px; }
.voice-controls { display: flex; align-items: center; gap: 7px; }
.voice-choice {
  width: 116px; min-width: 0; border: 1px solid var(--line); border-radius: 8px;
  padding: 7px 8px; color: var(--ink-soft); background: #fff; font: inherit; font-size: 12px;
}
.transcript { display: flex; flex-direction: column; gap: 12px; flex: 1; overflow-y: auto; padding: 22px 0; min-height: 400px; }
.transcript .chat { display: grid; gap: 8px; white-space: pre-wrap; }
.chat-speak {
  width: max-content; border: 0; padding: 0; color: var(--accent); background: transparent;
  font: inherit; font-size: 11px; font-weight: 650; cursor: pointer;
}
.voice-toggle.selected { color: #fff; border-color: var(--accent); background: var(--accent); }
.talk-button.listening { color: #fff; border-color: #d92d20; background: #d92d20; animation: mic-pulse 1s ease-in-out infinite; }
@keyframes mic-pulse { 50% { box-shadow: 0 0 0 5px rgba(217,45,32,.14); } }
.speech-status { min-height: 18px; margin-top: 8px; color: var(--ink-faint); font-size: 12px; }
.approach-reason { align-self: flex-start; max-width: 92%; color: var(--ink-faint); font-size: 12.5px; }
.approach-reason summary { cursor: pointer; color: var(--accent); }
.approach-reason p { margin: 6px 0 0; }
.empty-chat { text-align: center; color: var(--ink-faint); margin: auto; max-width: 300px; }
.empty-chat span { display: block; color: var(--accent); font-size: 38px; margin-bottom: 10px; }
.followup { display: flex; gap: 8px; border-top: 1px solid var(--line); padding-top: 16px; }
.followup .form-control { min-width: 0; }
.margin-tutor-mark { pointer-events: none; animation: margin-mark-in .5s ease both; transform-origin: center; }
.margin-circle, .margin-arrow, .margin-line, .margin-rectangle {
  fill: none; stroke-width: 5px; stroke-linecap: round; stroke-linejoin: round;
  vector-effect: non-scaling-stroke;
}
@keyframes margin-mark-in {
  from { opacity: 0; transform: scale(.96); }
  to { opacity: 1; transform: none; }
}

@media (max-width: 800px) {
  .study-room-active .study-workspace { grid-template-columns: 1fr; }
  .conversation-card { min-height: 560px; max-height: none; }
}

@media (max-width: 600px) {
  .conversation-head { align-items: stretch; flex-direction: column; }
  .voice-choice { flex: 1; width: auto; }
  .followup { align-items: stretch; flex-direction: column; }
}