/* 기사 듣기 알약(inc/kt-listen.php) — 도구 줄 오른쪽 끝 */
.kt-listen { --p: 0%; position: relative; display: inline-flex; align-items: center; gap: 8px; height: 34px; margin-left: auto; padding: 0 14px 0 12px; border: 1px solid color-mix(in srgb, var(--sec, #0C7673) 45%, transparent); border-radius: 999px; overflow: hidden; isolation: isolate;
	background: color-mix(in srgb, var(--sec, #0C7673) 8%, #fff); color: var(--sec, #0C7673); font: 700 13.5px/1 var(--kt-sans); cursor: pointer; transition: background .2s, box-shadow .2s, transform .15s; }
.kt-listen[hidden] { display: none; }
.kt-listen::before { content: ""; position: absolute; inset: 0 auto 0 0; width: var(--p); background: color-mix(in srgb, var(--sec, #0C7673) 16%, transparent); z-index: -1; transition: width .4s linear; }
.kt-listen:hover { box-shadow: 0 6px 16px -10px color-mix(in srgb, var(--sec, #0C7673) 80%, transparent); transform: translateY(-1px); }
.kt-listen:focus-visible { outline: 3px solid color-mix(in srgb, var(--sec, #0C7673) 55%, transparent); outline-offset: 2px; }
.kt-listen-m { font-weight: 600; opacity: .75; font-variant-numeric: tabular-nums; }
.kt-listen-m::before { content: "·"; margin-right: 6px; }
/* 음파 아이콘 — 로고 밑 음파와 같은 말투. 읽는 동안만 움직임 */
.kt-listen-ico { display: inline-flex; align-items: center; gap: 2px; height: 14px; }
.kt-listen-ico i { display: block; width: 3px; border-radius: 2px; background: currentColor; height: 6px; }
.kt-listen-ico i:nth-child(2) { height: 12px; } .kt-listen-ico i:nth-child(3) { height: 9px; } .kt-listen-ico i:nth-child(4) { height: 5px; }
.kt-listen[aria-pressed="true"] { background: var(--sec, #0C7673); color: #fff; border-color: var(--sec, #0C7673); }
.kt-listen[aria-pressed="true"]::before { background: rgba(255,255,255,.18); }
.kt-listen[aria-pressed="true"] .kt-listen-ico i { animation: kt-listen-bar .9s ease-in-out infinite alternate; }
.kt-listen[aria-pressed="true"] .kt-listen-ico i:nth-child(2) { animation-delay: -.3s; } .kt-listen[aria-pressed="true"] .kt-listen-ico i:nth-child(3) { animation-delay: -.6s; } .kt-listen[aria-pressed="true"] .kt-listen-ico i:nth-child(4) { animation-delay: -.15s; }
@keyframes kt-listen-bar { from { transform: scaleY(.35); } to { transform: scaleY(1.15); } }
.kt-listen-tip { position: absolute; z-index: 30; max-width: 280px; padding: 8px 11px; border-radius: 10px; background: #07383a; color: #fff; font: 500 12.5px/1.45 var(--kt-sans); box-shadow: 0 10px 24px -12px rgba(0,0,0,.5); }
/* 읽고 있는 문단 */
.kt-reading { position: relative; border-radius: 3px; background: color-mix(in srgb, var(--sec, #0C7673) 9%, transparent);
	box-shadow: -14px 0 0 color-mix(in srgb, var(--sec, #0C7673) 9%, transparent), 8px 0 0 color-mix(in srgb, var(--sec, #0C7673) 9%, transparent); transition: background .3s; }
/* 세로 줄은 글자 바깥(왼쪽 여백)에 — 전엔 문단 안쪽에 그려져 줄마다 첫 글자를 가렸음 */
.kt-reading::before { content: ""; position: absolute; left: -14px; top: 0; bottom: 0; width: 3px; border-radius: 3px; background: var(--sec, #0C7673); }
.kt-art-title.kt-reading, .kt-art-sub.kt-reading { box-shadow: none; }
.kt-art-title.kt-reading::before, .kt-art-sub.kt-reading::before { content: none; }
/* 밤 */
html.kt-dark .kt-listen { background: color-mix(in srgb, var(--sec, #4FD1C5) 12%, #0E1617); color: var(--sec, #4FD1C5); border-color: color-mix(in srgb, var(--sec, #4FD1C5) 40%, transparent); }
html.kt-dark .kt-listen[aria-pressed="true"] { background: var(--sec, #4FD1C5); color: #0b1213; }
html.kt-dark .kt-reading { background: color-mix(in srgb, var(--sec, #4FD1C5) 12%, transparent); box-shadow: -14px 0 0 color-mix(in srgb, var(--sec, #4FD1C5) 12%, transparent), 8px 0 0 color-mix(in srgb, var(--sec, #4FD1C5) 12%, transparent); }
@media (max-width: 600px) { .kt-listen { margin-left: 0; } }
@media (prefers-reduced-motion: reduce) { .kt-listen[aria-pressed="true"] .kt-listen-ico i { animation: none; } .kt-listen, .kt-listen::before { transition: none; } }
@media print { .kt-listen { display: none !important; } .kt-reading { background: none; box-shadow: none; } .kt-reading::before { content: none; } }
