/* 글 편집기 «틀» 옷 — 이 파일이 하는 일은 자리 잡기 하나뿐이다.
   편집기 안쪽 색·글자·툴바 모양은 전부 틀 안(닥마스터 assets/webapp/host/shell.css)이 정한다.
   그래서 홈페이지 색을 건드릴 일이 없다.

   마스터 지시 2026-08-09 : "인프레임 방식으로 삽입해."
*/

.sjmk-editor-frame {
  position: relative;
  width: 100%;
  /* ★글 쓰는 자리는 «창 크기에 따라» 커지고 작아진다 (마스터 지시 2026-08-09 —
       "글 쓰는 영역이나 툴바도 화면 크기에 따라 동적으로. 핸드폰도 있고 윈도우도 창 크기마다").
     여태는 JS 가 440px 을 박아 넣어, 큰 모니터에서는 답답하고 폰에서는 화면을 다 먹었다.
     아래 한 줄이 그것을 대신한다 — 최소 260px, 보통은 창 높이의 절반, 최대 760px.
     JS 가 값을 주면(data-height) 그 값이 --sjmk-frame-h 로 들어와 이 자리를 대신한다. */
  height: var(--sjmk-frame-h, clamp(260px, 52vh, 760px));
  min-height: 220px;                 /* 아주 좁은 화면에서도 글 쓸 자리는 남긴다 */
  border: 1px solid var(--border, #e5e7eb);
  border-radius: 10px;
  overflow: hidden;                  /* 틀 모서리가 둥근 테두리 밖으로 삐져나오지 않게 */
  background: var(--surface, #fff);
}

/* 폰 — 화면이 짧으므로 비율을 조금 키우되(글 쓸 자리 확보) 위아래가 답답하지 않게 상한을 둔다. */
@media (max-width: 720px) {
  .sjmk-editor-frame { height: var(--sjmk-frame-h, clamp(240px, 58vh, 520px)); }
}
/* 세로로 아주 짧은 창(노트북 가로 눕힘 등) — 툴바까지 가려지지 않게 최소를 낮춘다. */
@media (max-height: 620px) {
  .sjmk-editor-frame { height: var(--sjmk-frame-h, clamp(200px, 62vh, 460px)); }
}

.sjmk-editor-frame__win {
  display: block;                    /* iframe 기본 inline 이라 아래에 4px 틈이 생긴다 */
  width: 100%;
  height: 100%;
  border: 0;
  background: transparent;
}

/* 원래 글 칸 — 틀이 붙으면 숨는다(값은 살아 있어서 서버로 그대로 나간다).
   display:none 을 쓰지 않는다. 폼 검사·자동완성 복원이 «없는 칸» 을 건너뛰는 브라우저가 있다. */
.sjmk-editor-source {
  position: absolute !important;
  width: 1px; height: 1px;
  margin: -1px; padding: 0; border: 0;
  clip: rect(0 0 0 0);
  clip-path: inset(50%);
  overflow: hidden;
  white-space: nowrap;
}

/* ★편집기가 못 떠서 «원래 글칸» 으로 되돌아갔을 때만 보이는 안내 (2026-08-12).
   빈 네모만 남아 글을 못 쓰는 일이 다시는 없게 한다 — 무음 실패 금지. */
.sjmk-editor-degraded-msg {
  margin-bottom: 6px;
  padding: 8px 10px;
  border: 1px solid #fcd34d;
  border-radius: 8px;
  background: #fffbeb;
  color: #92400e;
  font-size: 12.5px;
  line-height: 1.5;
}

/* 내용을 안 적고 [등록] 을 눌렀을 때만 보이는 안내. */
.sjmk-editor-required-msg {
  margin-top: 6px;
  font-size: 12.5px;
  color: #dc2626;
}