/* 제자리 입력 줄 - 동작은 inline-input.js, 규칙은 claude_common/ui/inline-input.md
   결과가 생길 자리에 그 줄 높이 그대로 뜬다. 오른쪽 끝 X로 닫는다(바깥 누르기로는 안 닫힘) */
.inline-input { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 6px; padding: 3px 8px; }
.inline-input-icon { flex: none; width: 24px; text-align: center; font-size: 15px; }
.inline-input-box { flex: 1 1 0; min-width: 0; display: flex; align-items: center; height: 30px; border-radius: var(--uk-r-sm); background: var(--uk-surface); box-shadow: 0 0 0 2px var(--uk-brand); }
.inline-input-field { flex: 1 1 auto; width: 100%; min-width: 0; height: 100%; border: 0; background: none; padding: 0 4px 0 10px; font: inherit; font-size: 14px; color: var(--uk-fg); outline: none; }
.inline-input-field:focus, .inline-input-field:focus-visible { outline: none; } /* 칸 둘레의 강조색 테두리가 이미 "쓰는 중"을 보인다 */
.inline-input-field::placeholder { color: var(--uk-muted); }
.inline-input-x { flex: none; width: 28px; height: 28px; margin-right: 1px; display: grid; place-items: center; border: 0; border-radius: var(--uk-r-sm); background: none; color: var(--uk-muted); cursor: pointer; }
.inline-input-x:hover { background: var(--uk-head); color: var(--uk-fg); }
.inline-input-x:focus-visible { outline: 2px solid var(--uk-brand); outline-offset: -2px; }
.inline-input-err { flex-basis: 100%; padding-left: 30px; font-size: 12.5px; color: var(--uk-danger); }
.inline-input-err:empty { display: none; }
.inline-input:not(:has(.inline-input-icon)) .inline-input-err { padding-left: 2px; }
.inline-input.has-error .inline-input-box { box-shadow: 0 0 0 2px var(--uk-danger); }
.inline-input.is-busy { opacity: .6; pointer-events: none; }
@media (max-width: 767px) { .inline-input-box { height: 36px; } .inline-input-field { font-size: 16px; } } /* 16px - 아이폰이 확대하지 않게 */