/* =====================================================================
   AI 튜터 플로팅 챗봇 스타일 (Phase A — 퍼블 기반)
   - 루트: #aitutor-float-popup | .aitutor-pop
   - 열림: .open | .is-open
   - 와이드: .maximized | .wide-pop
   ===================================================================== */

:root {
	--ai-bg: #f5f7fa;
	--ai-bg-blue: #f2f7ff;

	--ai-text: #191f28;
	--ai-text-sub: #4e5968;
	--ai-text-muted: #8b95a1;
	--ai-text-placeholder: #b0b8c1;

	--ai-blue: #1677ff;
	--ai-blue-hover: #0969e8;
	--ai-blue-light: #dee9fd;

	--ai-gray: #e9edf2;
	--ai-gray-hover: #dfe5eb;
	--ai-gray-light: #f7f8fa;

	--ai-border: #e5e8eb;
	--ai-border-light: #eef0f2;

	--ai-shadow: 0 4px 16px rgba(30, 60, 100, .10);
	--ai-shadow-popup: 0 6px 20px rgba(30, 60, 100, .14);
}

/* ── 플로팅 버튼 (퍼블) ──────────────────────────────────────────────── */
.aitutor-float {
	position: fixed;
	bottom: 20px;
	right: 40px;
	width: 80px;
	border: none;
	background: transparent;
	padding: 0;
	cursor: pointer;
	display: flex;
	align-items: center;
	justify-content: center;
	z-index: 9999;
	transition: transform 0.2s;
}
#aitutor-float-btn {
	position: relative;
	z-index: 2;
	width: 100%;
	border: none;
	background: transparent;
	padding: 0;
	cursor: pointer;
	display: flex;
	align-items: center;
	justify-content: center;
}
#aitutor-float-btn img,
#aitutor-float-btn .img {
    width: 63px;
	position: relative;
	z-index: 1;
	width: 100%;
	display: block;
}

@media (max-width: 767px) {
	.aitutor-float {
		right: 10px;
		bottom: 70px;
		width: 70px;
	}
}

/* ── 나의강의실 말풍선 (state / review) — 기존 유지 ───────────────────── */
.aitutor-float.myclass-float {
	width: auto;
	overflow: visible;
}
.myclass-float #aitutor-float-btn {
	position: relative;
	width: auto;
	padding: 0 20px;
	gap: 10px;
	align-items: flex-end;
	color: #fff;
	font-size: 14px;
	overflow: visible;
	transition: padding 0.35s ease, gap 0.35s ease, transform 0.2s;
}
.myclass-float #aitutor-float-btn:hover {
	transform: none;
}
.myclass-float #aitutor-float-btn::before {
	content: '';
	position: absolute;
	bottom: 0;
	left: 0;
	width: 100%;
	height: 55px;
	background: #4e5cc6;
	border-radius: 999px;
	z-index: 0;
}
.myclass-float #aitutor-float-btn > * {
	position: relative;
	z-index: 1;
}
.myclass-float-text {
	display: flex;
	align-items: center;
	overflow: hidden;
	white-space: nowrap;
	max-width: 320px;
	height: 55px;
	transition: opacity 0.35s ease, max-width 0.35s ease, margin 0.35s ease;
}
.myclass-float #aitutor-float-btn img {
	width: 70px;
	flex-shrink: 0;
}
.myclass-float.is-text-hide #aitutor-float-btn {
	overflow: hidden;
	border-radius: 0 0 30px 30px;
	padding: 0 5px;
	gap: 0;
}
.myclass-float.is-text-hide .myclass-float-text {
	opacity: 0;
	max-width: 0;
	margin: 0;
}

@media (max-width: 767px) {
	.myclass-float #aitutor-float-btn::before,
	.myclass-float-text {
		height: 50px;
	}
	.myclass-float #aitutor-float-btn {
		padding: 0 15px;
	}
	.myclass-float #aitutor-float-btn img {
		width: 50px;
	}
	.myclass-float.is-text-hide #aitutor-float-btn {
		border-radius: 0 0 25px 25px;
	}
}

/* ── 팝업 공통 / 유틸 (퍼블) ─────────────────────────────────────────── */
#aitutor-float-popup ::-webkit-scrollbar,
.aitutor-pop ::-webkit-scrollbar {
	width: 5px;
	height: 4px;
}
#aitutor-float-popup ::-webkit-scrollbar-thumb,
.aitutor-pop ::-webkit-scrollbar-thumb {
	background-color: #89909e;
	border: 1px solid transparent;
	border-radius: 2px;
}
#aitutor-float-popup button,
.aitutor-pop button {
	font-family: 'Pretendard';
	font-weight: 500;
	color: var(--ai-text);
	font-size: 14px;
}
/* button 기본 14px가 자식에 상속됨 — font-11/12/13 자식은 퍼블 크기로 재지정 */
#aitutor-float-popup button .font-11,
.aitutor-pop button .font-11 {
	font-size: 11px;
	line-height: 1.4;
}
#aitutor-float-popup button .font-12,
.aitutor-pop button .font-12 {
	font-size: 12px;
	line-height: 1.4;
}
#aitutor-float-popup button .font-13,
.aitutor-pop button .font-13 {
	font-size: 13px;
	line-height: 1.4;
}

.b600 { font-weight: 600; }
.text-ai-blue { color: var(--ai-blue) !important; }
.ai-text-sub { color: var(--ai-text-sub) !important; }
.bg-ai-blue { background: var(--ai-blue) !important; color: #fff !important; }
.bg-white { background: var(--white) !important; }

/* ── 팝업 컨테이너 ───────────────────────────────────────────────────── */
#aitutor-float-popup,
.aitutor-pop {
	position: fixed;
	bottom: 20px;
	right: 40px;
	z-index: 99999;
	width: 400px;
	font-family: 'Pretendard';
	box-shadow: var(--ai-shadow-popup);
	border-radius: 16px;
	overflow: hidden;
	background: var(--ai-bg);
	font-size: 14px;
	color: var(--ai-text);
	line-height: 1.6;
	font-weight: 500;
	border: 1px solid var(--ai-border-light);
	display: none;
	flex-direction: column;
}
#aitutor-float-popup.open,
.aitutor-pop.is-open {
	display: flex;
}

.aitutor-pop .beta-blt,
#aitutor-float-popup .beta-blt {
	color: var(--ai-blue);
	background: var(--ai-blue-light);
	font-size: 12px;
	height: 24px;
}
.aitutor-header { padding: 12px 20px; }
.aitutor-header.small button { color: var(--ai-text-muted); }
.aitutor-hover-btn:hover {
	background-color: var(--ai-blue-light) !important;
	color: var(--ai-blue) !important;
}

.aitutor-body {
	padding: 20px;
	border-top: 1px solid var(--ai-border);
	min-height: 500px;
	max-height: 50dvh;
	position: relative;
}
.chat-up .chat-ai { min-width: 0; }
.chat-ai {
	position: relative;
	z-index: 0;
	padding: 15px;
	min-height: 42px;
	overflow: hidden;
	color: var(--ai-text);
}
.chat-ai-intro { background: transparent; }
.chat-ai-intro::before {
	content: '';
	position: absolute;
	inset: 0;
	border-radius: 8px;
	background: var(--ai-blue-light);
	opacity: 0;
	transition: opacity .3s ease;
	z-index: -1;
}
.chat-ai-intro.is-typing::before { opacity: 1; }
.chat-ai:not(.chat-ai-intro) { background: var(--ai-blue-light); }
.chat-ai-text { position: relative; z-index: 1; }
.chat-user {
	padding: 15px;
	background: var(--ai-gray);
	color: var(--ai-text);
}
.chat-up,
.chat-welcome .aitutor-reco {
	opacity: 0;
	transform: translateY(10px);
}
.chat-up.is-enter,
.chat-welcome .aitutor-reco.is-enter {
	animation: chatAiBoxFadeUp .45s ease forwards;
}
@keyframes chatAiBoxFadeUp {
	from { opacity: 0; transform: translateY(10px); }
	to   { opacity: 1; transform: translateY(0); }
}
.aitutor-reco .item {
	background: var(--white);
	padding: 10px;
	color: #333;
	border: 1px solid var(--ai-border-light);
}
.aitutor-body.wide .aitutor-reco .item {
	box-shadow: var(--ai-shadow);
	border: none;
}
/* 와이드 랜딩 Swiper 칩 — 전체폭 + 미니와 동일 슬라이드 구조 */
#aitutor-f-landing-reco {
	width: 100%;
}
#aitutor-f-landing-reco .aitutor-reco-swiper {
	width: 100%;
	/* 추천질문 5줄 기준 고정 높이 — 칩 개수에 따라 입력창 위치가 흔들리지 않게 */
	min-height: calc(50px * 5 + 6px * 4);
}
#aitutor-f-landing-reco .swiper-slide > .flex.column {
	min-height: calc(50px * 5 + 6px * 4);
}
#aitutor-f-landing-chips .aitutor-f-chip {
	width: 100%;
	box-sizing: border-box;
	white-space: normal;
	text-align: left;
	min-height: 50px;
}
.aitutor-reco .item:hover { background: var(--ai-gray); }
.aitutor-reco-swiper { overflow: hidden; }
.aitutor-reco-swiper .swiper-slide { height: auto; }
.aitutor-pagination { margin-top: 10px; }
.aitutor-reco .swiper-pagination-bullet,
.aitutor-reco-swiper .swiper-pagination-bullet {
	margin: 0 !important;
	background: var(--ai-text-muted);
}
.aitutor-reco .swiper-pagination-bullet-active,
.aitutor-reco-swiper .swiper-pagination-bullet-active {
	background: var(--ai-blue-hover);
}

.aitutor-textarea {
	border: 1px solid var(--ai-border-light);
	padding: 15px;
	box-shadow: var(--ai-shadow);
	background: var(--white);
}
.aitutor-textarea textarea {
	border: none;
	background: var(--white);
	padding: 0;
	font-size: 14px;
	font-family: 'Pretendard';
	line-height: 1.4;
}
.aitutor-body.wide .aitutor-textarea.is-grow-up textarea {
	resize: none;
	overflow-y: hidden;
	min-height: calc(1.4em * 2);
	max-height: calc(1.4em * 6);
}
.aitutor-textarea textarea::placeholder {
	font-size: 14px;
	font-family: 'Pretendard';
	line-height: 1.4;
	color: var(--ai-text-placeholder);
}
.aitutor-textarea button {
	background: var(--ai-border);
	color: var(--ai-text-muted);
	margin-left: auto;
	transition: background .3s ease, color .3s ease;
}
.aitutor-textarea.is-filled button {
	background: var(--ai-blue);
	color: var(--white);
}
/* #aitutor-float-popup button 기본색보다 특이도 상향 */
#aitutor-float-popup .aitutor-textarea button,
.aitutor-pop .aitutor-textarea button {
	background: var(--ai-border);
	color: var(--ai-text-muted);
}
#aitutor-float-popup .aitutor-textarea.is-filled button,
.aitutor-pop .aitutor-textarea.is-filled button {
	background: var(--ai-blue);
	color: var(--white);
}

/* #aitutor-float-popup button { color: var(--ai-text) } 보다 특이도를 높여
   비활성 상태(#8b95a1 = rgb(139,149,161))가 적용되게 한다 */
#aitutor-float-popup .chat-feedback button,
.aitutor-pop .chat-feedback button {
	color: var(--ai-text-muted);
}
#aitutor-float-popup .chat-feedback button:hover,
#aitutor-float-popup .aitutor-chat button.active,
.aitutor-pop .chat-feedback button:hover,
.aitutor-pop .aitutor-chat button.active {
	color: #000;
	background: var(--ai-gray);
}

.chat-history { display: none; }
.chat-history .item {
	padding: var(--gap-10);
	background: var(--ai-gray);
}
.chat-history .item:hover { background: var(--ai-gray-hover); }
.chat-history svg { color: var(--ai-text-muted); }

.chat-new {
	letter-spacing: 1px;
	display: none;
}
.chat-new:hover { background: var(--ai-blue-hover); }

.aitutor-body.is-history .chat-welcome,
.aitutor-body.is-history .aitutor-textarea-wrap { display: none; }
.aitutor-body.is-history .chat-history { display: flex; }
.aitutor-body.is-history .chat-new { display: flex; }

.chat-history.is-enter,
.chat-welcome.is-enter,
.aitutor-textarea-wrap.is-enter {
	opacity: 0;
	transform: translateY(10px);
	animation: chatAiBoxFadeUp .45s ease forwards;
}

/* ── wide / maximized ────────────────────────────────────────────────── */
.aitutor-header.wide,
.aitutor-body.wide { display: none; }

#aitutor-float-popup.maximized,
.aitutor-pop.wide-pop {
	width: 100dvw;
	height: 100dvh;
	left: 0;
	right: 0;
	bottom: 0;
	border-radius: 0;
	flex-direction: row;
}
#aitutor-float-popup.maximized .aitutor-header.small,
#aitutor-float-popup.maximized .aitutor-body.small,
.aitutor-pop.wide-pop .aitutor-header.small,
.aitutor-pop.wide-pop .aitutor-body.small {
	display: none;
}
#aitutor-float-popup.maximized .aitutor-header.wide,
.aitutor-pop.wide-pop .aitutor-header.wide {
	display: flex;
}
#aitutor-float-popup.maximized .aitutor-body.wide,
.aitutor-pop.wide-pop .aitutor-body.wide {
	display: flex;
}
html:has(#aitutor-float-popup.maximized),
html:has(.aitutor-pop.wide-pop),
body:has(#aitutor-float-popup.maximized),
body:has(.aitutor-pop.wide-pop) {
	overflow: hidden;
}

.aitutor-header.wide {
	padding: 20px 10px;
	text-align: center;
	position: relative;
	z-index: 2;
	background: var(--ai-bg);
	flex-shrink: 0;
	width: 240px;
}
/* 와이드 대화목록 — 스크롤바와 item 박스 겹침 방지 */
#aitutor-f-conv-list-wide {
	padding-right: 6px;
	box-sizing: border-box;
}
.aitutor-menu .item { padding: var(--gap-10); }
.aitutor-menu .item:hover,
.aitutor-menu .item.active { background: var(--ai-gray-hover); }
.aitutor-menu .txt { margin: -10px; padding: 10px; }
.aitutor-menu .chat-more .more-btn { opacity: 0; }
.aitutor-menu .item:hover .chat-more .more-btn,
.aitutor-menu .chat-more.is-open .more-btn { opacity: 1; }
.aitutor-menu .chat-more.is-open { z-index: 20; }
.aitutor-menu .chat-more-pop {
	display: none;
	min-width: 96px;
	padding: 4px;
	background: var(--white);
	border: 1px solid var(--ai-border-light);
	border-radius: 8px;
	box-shadow: var(--ai-shadow-popup);
	z-index: 100000;
}
.aitutor-menu .chat-more.is-open .chat-more-pop {
	display: block;
	position: fixed;
}
.aitutor-menu .chat-more-delete {
	display: block;
	width: 100%;
	padding: 8px 10px;
	text-align: left;
	border-radius: 6px;
	font-size: 13px;
	color: var(--ai-text);
}
.aitutor-menu .chat-more-delete:hover { background: var(--ai-gray-hover); }

.aitutor-body.wide {
	flex: 1 1 auto;
	max-height: none;
	height: auto;
	border-top: none;
	border-left: 1px solid var(--ai-border);
	background: var(--white);
	padding: 0;
}
.aitutor-body.wide > .grow1 {
	margin: 0;
	padding: 0;
	flex: 1 1 auto;
	overflow-y: auto;
	overflow-x: hidden;
	-webkit-overflow-scrolling: touch;
}
@keyframes moveAndChangeColor1 {
	0% {
		transform: translate(0px, 0px);
		background-color: #1677ff;
	}
	33% {
		transform: translate(80px, -50px);
		background-color: #2f54eb;
	}
	66% {
		transform: translate(-30px, 60px);
		background-color: #1890ff;
	}
	100% {
		transform: translate(0px, 0px);
		background-color: #1677ff;
	}
}
@keyframes moveAndChangeColor2 {
	0% {
		transform: translate(0px, 0px);
		background-color: #40a9ff;
	}
	33% {
		transform: translate(-70px, 50px);
		background-color: #096dd9;
	}
	66% {
		transform: translate(50px, -40px);
		background-color: #69b1ff;
	}
	100% {
		transform: translate(0px, 0px);
		background-color: #40a9ff;
	}
}
.aitutor-body.wide::before,
.aitutor-body.wide::after {
	content: '';
	position: absolute;
	width: 40%;
	aspect-ratio: 1 / 1;
	border-radius: 50%;
	filter: blur(150px);
	pointer-events: none;
	opacity: 0.3;
}
.aitutor-body.wide::before {
	top: -10%;
	left: -10%;
	animation: moveAndChangeColor1 16s ease-in-out infinite;
}
.aitutor-body.wide::after {
	bottom: -10%;
	right: -10%;
	animation: moveAndChangeColor2 20s ease-in-out infinite;
}
.aitutor-body.chat-page::before,
.aitutor-body.chat-page::after { display: none; }

.aitutor-body.wide {
	padding-top: 20px;
	padding-bottom: 20px;
}
.aitutor-body.wide .inner {
	max-width: 700px;
	padding-left: 10px;
	padding-right: 10px;
	width: 100%;
	margin: 0 auto;
	z-index: 2;
}

.wide .aitutor-close-btn { background: var(--ai-gray); }
.aitutor-body.wide > .aitutor-close-btn {
	position: absolute;
	top: 20px;
	right: 20px;
	z-index: 3;
}
.aitutor-welcome .icon { width: 80px; }
/* 랜딩은 flex column + justify-center — jQuery .show()가 block으로 덮어쓰지 않도록 */
#aitutor-f-landing {
	display: flex;
}
#aitutor-f-landing.is-hidden {
	display: none !important;
}
.aitutor-body.wide .aitutor-welcome {
	opacity: 0;
	transform: translateY(20px);
}
.aitutor-body.wide .aitutor-welcome.is-enter {
	animation: chatAiBoxFadeUp .35s cubic-bezier(0.22, 1, 0.36, 1) .3s forwards;
}
.aitutor-header.small .aitutor-close-btn { display: none; }

@media (max-width: 767px) {
	#aitutor-float-popup,
	.aitutor-pop {
		top: 0;
		left: 0;
		width: 100dvw;
		height: 100dvh;
		border-radius: 0;
	}

	.aitutor-header { padding: 10px; }
	.aitutor-header.small .aitutor-wide-toggle { display: none; }
	.aitutor-header.small .aitutor-close-btn { display: flex; }

	.aitutor-body {
		max-height: none;
		padding: 10px;
	}
}

/* 최대화 시 플로팅 버튼 숨김 */
body:has(#aitutor-float-popup.maximized) .aitutor-float,
body:has(.aitutor-pop.wide-pop) .aitutor-float {
	display: none;
}

/* ── Phase A: has-messages / history / wide chat 상태 ───────────────── */
#aitutor-float-popup.has-messages #aitutor-f-welcome,
#aitutor-float-popup.has-messages #aitutor-f-reco {
	display: none;
}
#aitutor-float-popup.maximized.has-messages #aitutor-f-landing {
	display: none !important;
}
#aitutor-float-popup.maximized.has-messages #aitutor-f-scroll-wide,
#aitutor-float-popup.maximized.has-messages #aitutor-f-inputbar-wide {
	display: flex !important;
}
#aitutor-float-popup.maximized.has-messages .aitutor-body.wide {
	/* chat-page: 배경 블러 오브 숨김 */
}
#aitutor-float-popup.maximized.has-messages .aitutor-body.wide::before,
#aitutor-float-popup.maximized.has-messages .aitutor-body.wide::after {
	display: none;
}

.aitutor-body.small.is-history .chat-welcome,
.aitutor-body.small.is-history .aitutor-textarea-wrap {
	display: none;
}
.aitutor-body.small.is-history .chat-history {
	display: flex;
}
.aitutor-body.small.is-history .chat-new {
	display: flex;
}

#aitutor-f-chips.swiper-wrapper {
	display: flex;
}
#aitutor-f-chips .swiper-slide {
	height: auto;
}
#aitutor-f-chips .swiper-slide .flex.column {
	width: 100%;
}

.aitutor-alert {
	position: fixed;
	inset: 0;
	z-index: 100000;
	display: none;
	align-items: center;
	justify-content: center;
	padding: 10px;
}
.aitutor-alert.is-open {
	display: flex;
}
.aitutor-alert::before {
	content: '';
	position: absolute;
	inset: 0;
	background: rgba(0, 0, 0, 0.2);
	backdrop-filter: blur(1px);
}
.aitutor-alert .alert-content {
	position: relative;
	z-index: 1;
	max-width: 400px;
	width: 100%;
	background: #fff;
	box-shadow: var(--ai-shadow-popup);
	border-radius: 16px;
	overflow: hidden;
	padding: 20px;
}

@media (max-width: 767px) {
	.aitutor-enter-hint {
		display: none !important;
	}
	body.aitutor-popup-open .aitutor-float {
		display: none;
	}
}

/* =====================================================================
   호환: 기존 JS 메시지 클래스 → 퍼블 비주얼 언어
   ===================================================================== */

/* 레이아웃 (기존 구조 유지) */
.aitutor-f-msg-user {
	display: flex;
	justify-content: flex-end;
	animation: af-slide-up 0.2s ease;
}
.aitutor-f-msg-bot {
	display: flex;
	align-items: flex-start;
	gap: 10px;
	animation: af-slide-up 0.2s ease;
}
.aitutor-f-msg-bot .bot-icon {
	flex-shrink: 0;
	width: 40px;
	height: 40px;
	display: flex;
	align-items: center;
	justify-content: center;
}
.aitutor-f-msg-bot .bot-icon img {
	width: 100%;
	display: block;
}
/* 봇 아이콘(104x129)은 40px 박스보다 세로로 커서 행 위로 약 5px 넘친다.
   목록 최상단에서 스크롤 영역에 잘리므로 상단 여백을 준다. */
/* 메시지 목록 — 퍼블: .aitutor-chat 형제 간 gap (미니 gap30 / 와이드 gap10) */
#aitutor-f-messages {
	display: flex;
	flex-direction: column;
	gap: 30px;
	padding-top: 6px;
}
#aitutor-f-messages-wide {
	display: flex;
	flex-direction: column;
	gap: 10px;
	padding-top: 6px;
	width: 100%;
}
#aitutor-f-conv-title-wide {
	width: 100%;
	word-break: keep-all;
	overflow-wrap: break-word;
}
/* 공용 .object-cover(object-fit:cover)는 40x40 박스에서 세로로 긴 원본의
   위·아래를 잘라낸다. 캐릭터 머리가 잘리므로 이 두 곳만 contain으로 맞춘다. */
.aitutor-header.wide .width40 > img,
#aitutor-f-welcome .width40 > img {
	object-fit: contain;
}

/* 봇 메시지 — 본문+시각(피드백 행) 래퍼 */
.aitutor-f-msg-bot-body {
	flex: 1;
	min-width: 0;
	max-width: calc(100% - 50px);
}

/* .chat-user 대응 */
.aitutor-f-msg-user .bubble {
	max-width: 85%;
	padding: 15px;
	border-radius: 8px;
	background: var(--ai-gray);
	color: var(--ai-text);
	font-size: 14px;
	line-height: 1.6;
	word-break: keep-all;
	overflow-wrap: break-word;
	white-space: pre-wrap;
}

/* .chat-ai 대응 */
.aitutor-f-msg-bot .bubble {
	max-width: 85%;
	padding: 15px;
	border-radius: 8px;
	background: var(--ai-blue-light);
	color: var(--ai-text);
	font-size: 14px;
	line-height: 1.6;
	word-break: keep-all;
	overflow-wrap: break-word;
	min-height: 42px;
}

/* .aitutor-reco .item 대응 */
.aitutor-f-chip {
	flex-shrink: 0;
	padding: 10px;
	border-radius: 8px;
	background: var(--white);
	border: 1px solid var(--ai-border-light);
	font-size: 14px;
	color: #333;
	cursor: pointer;
	transition: background 0.15s;
	white-space: nowrap;
	font-family: 'Pretendard';
	font-weight: 500;
}
.aitutor-f-chip:hover {
	background: var(--ai-gray);
}
.aitutor-f-chip:disabled {
	opacity: 0.5;
	cursor: not-allowed;
}

/* ── 마크다운 prose (티처빌 전역 li{list-style:none} 리셋 덮어씀) ───────── */
.aitutor-f-prose p { margin: 0 0 6px; }
.aitutor-f-prose p:last-child { margin-bottom: 0; }
#aitutor-float-popup .aitutor-f-prose ul,
.aitutor-pop .aitutor-f-prose ul {
	list-style-type: disc;
	list-style-position: outside;
	padding-left: 1.25em;
	margin: 4px 0 6px;
}
#aitutor-float-popup .aitutor-f-prose ol,
.aitutor-pop .aitutor-f-prose ol {
	list-style-type: decimal;
	list-style-position: outside;
	padding-left: 1.25em;
	margin: 4px 0 6px;
}
#aitutor-float-popup .aitutor-f-prose ul > li,
#aitutor-float-popup .aitutor-f-prose ol > li,
.aitutor-pop .aitutor-f-prose ul > li,
.aitutor-pop .aitutor-f-prose ol > li {
	display: list-item;
	margin-bottom: 2px;
	list-style: inherit;
}
.aitutor-f-prose strong { font-weight: 700; }
.aitutor-f-prose em { font-style: italic; }
.aitutor-f-prose a { color: var(--ai-blue); text-decoration: underline; }
.aitutor-f-prose h1,
.aitutor-f-prose h2,
.aitutor-f-prose h3,
.aitutor-f-prose h4,
.aitutor-f-prose h5,
.aitutor-f-prose h6 {
	font-weight: 700;
	line-height: 1.3;
	margin: 8px 0 4px;
}
.aitutor-f-prose h1 { font-size: 1.15em; }
.aitutor-f-prose h2 { font-size: 1.08em; }
.aitutor-f-prose h3 { font-size: 1.0em; }
.aitutor-f-prose blockquote {
	border-left: 3px solid var(--ai-blue);
	margin: 6px 0;
	padding: 4px 10px;
	color: var(--ai-text-sub);
	background: var(--ai-gray-light);
}
.aitutor-f-prose hr {
	border: none;
	border-top: 1px solid var(--ai-border);
	margin: 8px 0;
}
.aitutor-f-prose pre {
	background: #1e293b;
	color: #e2e8f0;
	border-radius: 8px;
	padding: 10px 12px;
	margin: 6px 0;
	overflow-x: auto;
	font-size: 12px;
	line-height: 1.5;
}
.aitutor-f-prose pre code {
	background: none;
	padding: 0;
	font-size: inherit;
	color: inherit;
}
.aitutor-f-prose code {
	background: var(--ai-gray-light);
	padding: 1px 4px;
	border-radius: 4px;
	font-size: 12px;
}
.aitutor-f-prose table {
	border-collapse: collapse;
	width: 100%;
	margin: 6px 0;
	font-size: 12px;
}
.aitutor-f-prose th,
.aitutor-f-prose td {
	border: 1px solid var(--ai-border);
	padding: 5px 8px;
	text-align: left;
}
.aitutor-f-prose th {
	background: var(--ai-bg);
	font-weight: 600;
}

/* ── 타이핑 인디케이터 ───────────────────────────────────────────────── */
.aitutor-f-typing {
	display: flex;
	align-items: center;
	gap: 4px;
	height: 18px;
}
.aitutor-f-typing span {
	width: 5px;
	height: 5px;
	border-radius: 50%;
	background: var(--ai-text-placeholder);
	animation: af-bounce 1.2s infinite ease-in-out;
}
.aitutor-f-typing span:nth-child(2) { animation-delay: 0.2s; }
.aitutor-f-typing span:nth-child(3) { animation-delay: 0.4s; }

@keyframes af-slide-up {
	from { opacity: 0; transform: translateY(6px); }
	to   { opacity: 1; transform: translateY(0); }
}
@keyframes af-bounce {
	0%, 80%, 100% { transform: scale(0.7); opacity: 0.5; }
	40%           { transform: scale(1);   opacity: 1; }
}
