@charset "UTF-8";
/**
 * ContentEditor – Tiptap stylesheet (cleaned)
 */
/* ドラッグハンドル */
.content-editor {
  --header-height: 48px;
  --ce-offset-top: var(--header-height, 48px);
  --ce-border: rgba(0, 0, 0, 0.08);
  --ce-text: #222;
  --ce-text-muted: #6c757d;
  --ce-link: #0d6efd;
  --ce-surface: #fff;
  --ce-radius: 0.75rem;
  --tt-caret-dot: 1;
  --tt-caret-size: 6px;
  --tt-caret-color: var(--ce-link);
  --tt-caret-blink: 1s;
  margin-bottom: 1.5rem;
  color: var(--ce-text);
  background: var(--ce-surface);
  border: 1px solid var(--ce-border);
  border-radius: var(--ce-radius);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
.content-editor .tiptap-wrap {
  display: block;
}
.content-editor {
  /* スクロール追従するツールバー */
}
.content-editor .tt-sticky.sticky-top {
  position: sticky !important;
  position: -webkit-sticky !important;
  top: var(--ce-offset-top, var(--header-height, 48px)) !important;
  z-index: 1020;
  background: transparent;
}
.content-editor .tt-toolbar {
  display: flex;
  flex-wrap: wrap;
  gap: 0.25rem 0.5rem;
  padding: 0.5rem;
  background: #fff;
  border-bottom: 1px solid var(--ce-border);
  border-top-left-radius: var(--ce-radius);
  border-top-right-radius: var(--ce-radius);
  backdrop-filter: saturate(180%) blur(4px);
}
.content-editor .tt-toolbar > button,
.content-editor .tt-toolbar .tt-btn {
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  padding: 0.4rem 0.6rem;
  border-radius: 0.25rem;
  border: 1px solid transparent;
  background: transparent;
  cursor: pointer;
  font: inherit;
  color: inherit;
}
.content-editor .tt-toolbar > button.disabled, .content-editor .tt-toolbar > button[aria-busy=true], .content-editor .tt-toolbar > button:disabled,
.content-editor .tt-toolbar .tt-btn.disabled,
.content-editor .tt-toolbar .tt-btn[aria-busy=true],
.content-editor .tt-toolbar .tt-btn:disabled {
  opacity: 0.6;
  cursor: not-allowed;
}
.content-editor .tt-toolbar > button:hover,
.content-editor .tt-toolbar .tt-btn:hover {
  background: rgba(0, 0, 0, 0.04);
}
.content-editor .tt-toolbar > button.active,
.content-editor .tt-toolbar .tt-btn.active {
  border-color: var(--ce-link);
  background: rgba(13, 110, 253, 0.08);
}
.content-editor .tt-toolbar .tt-sep {
  width: 1px;
  height: 28px;
  background: var(--ce-border);
  display: inline-block;
  margin: 0 0.35rem;
}
.content-editor .tt-toolbar .tt-imgmenu-wrap {
  position: relative;
}
.content-editor .tt-toolbar .tt-imgmenu-wrap .tt-imgmenu {
  position: absolute;
  top: calc(100% + 6px);
  left: 0;
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
  padding: 0.4rem;
  min-width: 160px;
  background: #fff;
  border: 1px solid var(--ce-border);
  border-radius: 0.25rem;
  box-shadow: 0 8px 20px rgba(0, 0, 0, 0.08);
  z-index: 1022;
}
.content-editor .tt-toolbar .tt-imgmenu-wrap .tt-imgmenu button {
  width: 100%;
  text-align: left;
  padding: 0.35rem 0.5rem;
  border-radius: 0.25rem;
  border: 1px solid transparent;
  background: transparent;
  cursor: pointer;
}
.content-editor .tt-toolbar .tt-imgmenu-wrap .tt-imgmenu button:hover {
  background: rgba(0, 0, 0, 0.05);
}
.content-editor .tt-toolbar .tt-sup {
  font-size: 0.7em;
  margin-left: 0.15rem;
  opacity: 0.8;
}
.content-editor .tt-error {
  color: #b42318;
  font-size: 0.9rem;
  padding: 0.35rem 0.5rem 0.25rem;
  background: #fff;
}
.content-editor .tt-subbar {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 0.5rem;
  padding: 0 0.5rem 0.4rem;
  background: #fff;
}
.content-editor .tt-status {
  font-size: 0.9rem;
  color: var(--ce-text-muted);
  display: inline-flex;
  gap: 0.5rem;
  align-items: baseline;
}
.content-editor .tt-status__label {
  font-weight: 600;
  color: var(--ce-text);
}
.content-editor .tt-table-toolbar {
  display: flex;
  flex-wrap: wrap;
  gap: 0.35rem;
  padding: 0.45rem 0.5rem;
  background: #f8f9fa;
  border-top: 1px solid var(--ce-border);
  border-bottom: 1px solid var(--ce-border);
}
.content-editor .tt-table-toolbar button {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  padding: 0.35rem 0.6rem;
  border-radius: 0.25rem;
  border: 1px solid var(--ce-border);
  background: #fff;
  cursor: pointer;
  font: inherit;
}
.content-editor .tt-table-toolbar button:hover:not(:disabled) {
  background: rgba(0, 0, 0, 0.04);
}
.content-editor .tt-table-toolbar button:disabled {
  opacity: 0.6;
  cursor: not-allowed;
}
.content-editor .tt-table-toolbar button.danger {
  color: #b42318;
  border-color: rgba(180, 35, 24, 0.4);
}
.content-editor {
  /* ブロックドラッグ中はファイル用ヒントを隠す */
}
.content-editor.tt-dragging .tt-drop-hint {
  display: none !important;
}
.content-editor .tt-drop-hint {
  position: fixed;
  transform: translate(-50%, -120%);
  padding: 0.3rem 0.5rem;
  background: #fff;
  border: 1px solid var(--ce-border);
  border-radius: 0.25rem;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.08);
  font-size: 0.9rem;
  color: var(--ce-text);
  pointer-events: none;
  z-index: 1020;
  white-space: nowrap;
}
.content-editor {
  /* 編集エリア（本文・カスタムブロック） */
}
.content-editor .tt-editor .tiptap,
.content-editor .tt-editor .ProseMirror {
  position: relative; /* ハンドル/ドロップラインの基準にする */
  box-sizing: border-box;
  outline: none;
  min-height: 10rem;
  padding: 1rem 2.5rem;
  line-height: 1.6;
  word-wrap: break-word;
  white-space: pre-wrap;
  caret-color: currentColor;
}
.content-editor .tt-editor .tiptap ::selection,
.content-editor .tt-editor .ProseMirror ::selection {
  background: rgba(13, 110, 253, 0.2);
}
.content-editor .tt-editor .tiptap,
.content-editor .tt-editor .ProseMirror {
  /* placeholder */
}
.content-editor .tt-editor .tiptap p.is-empty:first-child::before,
.content-editor .tt-editor .ProseMirror p.is-empty:first-child::before {
  content: attr(data-placeholder);
  pointer-events: none;
  height: 0;
  color: var(--ce-text-muted);
  float: left;
}
.content-editor .tt-editor .tiptap,
.content-editor .tt-editor .ProseMirror {
  /* 本文のベーススタイル */
  line-height: 1.6;
  word-wrap: break-word;
  white-space: pre-wrap;
}
.content-editor .tt-editor .tiptap p,
.content-editor .tt-editor .ProseMirror p {
  margin: 0 0 0.75rem;
}
.content-editor .tt-editor .tiptap h1,
.content-editor .tt-editor .tiptap h2,
.content-editor .tt-editor .tiptap h3,
.content-editor .tt-editor .tiptap h4,
.content-editor .tt-editor .tiptap h5,
.content-editor .tt-editor .tiptap h6,
.content-editor .tt-editor .ProseMirror h1,
.content-editor .tt-editor .ProseMirror h2,
.content-editor .tt-editor .ProseMirror h3,
.content-editor .tt-editor .ProseMirror h4,
.content-editor .tt-editor .ProseMirror h5,
.content-editor .tt-editor .ProseMirror h6 {
  margin: 1.2rem 0 0.6rem;
  font-weight: 600;
  line-height: 1.25;
}
.content-editor .tt-editor .tiptap h1,
.content-editor .tt-editor .ProseMirror h1 {
  font-size: 1.75rem;
}
.content-editor .tt-editor .tiptap h2,
.content-editor .tt-editor .ProseMirror h2 {
  font-size: 1.5rem;
  padding: 0.25rem 0.35rem;
  border-left: 4px solid var(--ce-link);
  background: rgba(13, 110, 253, 0.06);
}
.content-editor .tt-editor .tiptap h3,
.content-editor .tt-editor .ProseMirror h3 {
  font-size: 1.25rem;
  padding-left: 0.35rem;
  border-left: 3px solid rgba(13, 110, 253, 0.65);
}
.content-editor .tt-editor .tiptap h4,
.content-editor .tt-editor .ProseMirror h4 {
  font-size: 1.125rem;
}
.content-editor .tt-editor .tiptap h5,
.content-editor .tt-editor .ProseMirror h5 {
  font-size: 1rem;
}
.content-editor .tt-editor .tiptap h6,
.content-editor .tt-editor .ProseMirror h6 {
  font-size: 0.875rem;
  color: var(--ce-text-muted);
}
.content-editor .tt-editor .tiptap a,
.content-editor .tt-editor .ProseMirror a {
  color: var(--ce-link);
  text-decoration: underline;
  text-underline-offset: 2px;
}
.content-editor .tt-editor .tiptap strong,
.content-editor .tt-editor .ProseMirror strong {
  font-weight: 700;
}
.content-editor .tt-editor .tiptap em,
.content-editor .tt-editor .ProseMirror em {
  font-style: italic;
}
.content-editor .tt-editor .tiptap blockquote,
.content-editor .tt-editor .ProseMirror blockquote {
  margin: 1rem 0;
  padding: 0.75rem 1rem;
  background: rgba(13, 110, 253, 0.04);
  border-left: 4px solid var(--ce-link);
  position: relative;
  overflow: hidden;
}
.content-editor .tt-editor .tiptap blockquote::before,
.content-editor .tt-editor .ProseMirror blockquote::before {
  content: "“";
  position: absolute;
  left: 0.4rem;
  top: 0.2rem;
  font-size: 2rem;
  color: rgba(13, 110, 253, 0.25);
  line-height: 1;
}
.content-editor .tt-editor .tiptap hr,
.content-editor .tt-editor .ProseMirror hr {
  height: 0;
  border: 0;
  border-top: 1px solid var(--ce-border);
  box-shadow: inset 0 1px 0 rgba(0, 0, 0, 0.04);
  opacity: 1;
  margin: 1rem 0;
}
.content-editor .tt-editor .tiptap ul,
.content-editor .tt-editor .tiptap ol,
.content-editor .tt-editor .ProseMirror ul,
.content-editor .tt-editor .ProseMirror ol {
  padding-left: 1.25rem;
  margin: 0.75rem 0;
}
.content-editor .tt-editor .tiptap .task-list,
.content-editor .tt-editor .ProseMirror .task-list {
  list-style: none;
  padding-left: 0.25rem;
  margin: 0.75rem 0;
}
.content-editor .tt-editor .tiptap .task-list-item,
.content-editor .tt-editor .ProseMirror .task-list-item {
  display: flex;
  align-items: flex-start;
  gap: 0.5rem;
  margin: 0.35rem 0;
}
.content-editor .tt-editor .tiptap .task-list-item input[type=checkbox],
.content-editor .tt-editor .ProseMirror .task-list-item input[type=checkbox] {
  margin-top: 0.2rem;
}
.content-editor .tt-editor .tiptap .task-list-item > div,
.content-editor .tt-editor .ProseMirror .task-list-item > div {
  flex: 1 1 auto;
}
.content-editor .tt-editor .tiptap li + li,
.content-editor .tt-editor .ProseMirror li + li {
  margin-top: 0.25rem;
}
.content-editor .tt-editor .tiptap table,
.content-editor .tt-editor .ProseMirror table {
  width: 100%;
  border-collapse: collapse;
  margin: 0.75rem 0;
}
.content-editor .tt-editor .tiptap th,
.content-editor .tt-editor .tiptap td,
.content-editor .tt-editor .ProseMirror th,
.content-editor .tt-editor .ProseMirror td {
  border: 1px solid var(--ce-border);
  padding: 0.5rem 0.6rem;
  vertical-align: top;
}
.content-editor .tt-editor .tiptap th,
.content-editor .tt-editor .ProseMirror th {
  background: #f1f3f5;
  font-weight: 600;
}
.content-editor .tt-editor .tiptap td,
.content-editor .tt-editor .ProseMirror td {
  background: #fff;
}
.content-editor .tt-editor .tiptap,
.content-editor .tt-editor .ProseMirror {
  /* code / pre */
}
.content-editor .tt-editor .tiptap code,
.content-editor .tt-editor .ProseMirror code {
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  background: rgba(0, 0, 0, 0.04);
  padding: 0.15rem 0.35rem;
  font-size: 0.95em;
}
.content-editor .tt-editor .tiptap pre,
.content-editor .tt-editor .ProseMirror pre {
  background: rgba(0, 0, 0, 0.04);
  padding: 0.75rem;
  overflow: auto;
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
}
.content-editor .tt-editor .tiptap,
.content-editor .tt-editor .ProseMirror {
  /* figure */
}
.content-editor .tt-editor .tiptap figure,
.content-editor .tt-editor .ProseMirror figure {
  margin: 0.75rem 0;
  position: relative;
}
.content-editor .tt-editor .tiptap img,
.content-editor .tt-editor .ProseMirror img {
  max-width: 100%;
  height: auto;
  display: block;
}
.content-editor .tt-editor .tiptap figcaption,
.content-editor .tt-editor .ProseMirror figcaption {
  margin-top: 0.35rem;
  font-size: 0.85em;
  color: var(--ce-text-muted);
}
.content-editor .tt-editor .tiptap .img-block-export.img-medium,
.content-editor .tt-editor .ProseMirror .img-block-export.img-medium {
  width: 60%;
  margin-left: 20%;
  margin-right: 20%;
}
.content-editor .tt-editor .tiptap .img-block-export.img-text-flex,
.content-editor .tt-editor .ProseMirror .img-block-export.img-text-flex {
  display: flex;
  gap: 1rem;
  align-items: flex-start;
}
.content-editor .tt-editor .tiptap .img-block-export.img-text-flex .img-block-export,
.content-editor .tt-editor .ProseMirror .img-block-export.img-text-flex .img-block-export {
  width: 50%;
  flex: 0 0 50%;
}
.content-editor .tt-editor .tiptap .img-block-export.img-text-flex .img-text-content,
.content-editor .tt-editor .ProseMirror .img-block-export.img-text-flex .img-text-content {
  width: 50%;
  flex: 0 0 50%;
  white-space: normal;
}
@media (max-width: 576px) {
  .content-editor .tt-editor .tiptap .img-block-export.img-text-flex,
  .content-editor .tt-editor .ProseMirror .img-block-export.img-text-flex {
    flex-direction: column;
  }
  .content-editor .tt-editor .tiptap .img-block-export.img-text-flex .img-block-export,
  .content-editor .tt-editor .tiptap .img-block-export.img-text-flex .img-text-content,
  .content-editor .tt-editor .ProseMirror .img-block-export.img-text-flex .img-block-export,
  .content-editor .tt-editor .ProseMirror .img-block-export.img-text-flex .img-text-content {
    width: 100%;
  }
}
.content-editor .tt-editor .tiptap .img-block-export.img-side-flex,
.content-editor .tt-editor .ProseMirror .img-block-export.img-side-flex {
  display: flex;
  gap: 1rem;
  align-items: flex-start;
}
.content-editor .tt-editor .tiptap .img-block-export.img-side-flex > figure,
.content-editor .tt-editor .ProseMirror .img-block-export.img-side-flex > figure {
  width: 50%;
  flex: 0 0 50%;
}
.content-editor .tt-editor .tiptap figcaption.tt-inline-caption,
.content-editor .tt-editor .ProseMirror figcaption.tt-inline-caption {
  margin: 0.3rem 0 0;
  font-size: 0.85em;
  color: var(--ce-text-muted);
}
.content-editor .tt-editor .tiptap,
.content-editor .tt-editor .ProseMirror {
  /* カスタム画像ブロック */
}
.content-editor .tt-editor .tiptap .tt-image-block,
.content-editor .tt-editor .ProseMirror .tt-image-block {
  margin: 1rem 0;
  border: 1px dashed var(--ce-border);
  border-radius: 0.25rem;
  padding: 0.75rem;
  position: relative;
  background: #fafafa;
}
.content-editor .tt-editor .tiptap .tt-image-block.is-selected,
.content-editor .tt-editor .ProseMirror .tt-image-block.is-selected {
  border-color: var(--ce-link);
}
.content-editor .tt-editor .tiptap .tt-image-block .tt-imgflex,
.content-editor .tt-editor .ProseMirror .tt-image-block .tt-imgflex {
  display: flex;
  gap: 0.75rem;
  align-items: stretch;
  flex-wrap: nowrap;
}
.content-editor .tt-editor .tiptap .tt-image-block.layout-withText .tt-textslot, .content-editor .tt-editor .tiptap .tt-image-block.layout-withTextReverse .tt-textslot,
.content-editor .tt-editor .ProseMirror .tt-image-block.layout-withText .tt-textslot,
.content-editor .tt-editor .ProseMirror .tt-image-block.layout-withTextReverse .tt-textslot {
  min-height: 160px;
  flex: 0 0 50%;
  max-width: 50%;
}
.content-editor .tt-editor .tiptap .tt-image-block.layout-withText .tt-imgslot, .content-editor .tt-editor .tiptap .tt-image-block.layout-withTextReverse .tt-imgslot,
.content-editor .tt-editor .ProseMirror .tt-image-block.layout-withText .tt-imgslot,
.content-editor .tt-editor .ProseMirror .tt-image-block.layout-withTextReverse .tt-imgslot {
  flex: 0 0 50%;
  max-width: 50%;
}
.content-editor .tt-editor .tiptap .tt-image-block.layout-sideBySide .tt-imgslot, .content-editor .tt-editor .tiptap .tt-image-block.layout-sideBySideReverse .tt-imgslot,
.content-editor .tt-editor .ProseMirror .tt-image-block.layout-sideBySide .tt-imgslot,
.content-editor .tt-editor .ProseMirror .tt-image-block.layout-sideBySideReverse .tt-imgslot {
  flex: 1 1 50%;
  max-width: 50%;
}
.content-editor .tt-editor .tiptap .tt-image-block.layout-withText .tt-imgflex, .content-editor .tt-editor .tiptap .tt-image-block.layout-withTextReverse .tt-imgflex, .content-editor .tt-editor .tiptap .tt-image-block.layout-sideBySide .tt-imgflex, .content-editor .tt-editor .tiptap .tt-image-block.layout-sideBySideReverse .tt-imgflex,
.content-editor .tt-editor .ProseMirror .tt-image-block.layout-withText .tt-imgflex,
.content-editor .tt-editor .ProseMirror .tt-image-block.layout-withTextReverse .tt-imgflex,
.content-editor .tt-editor .ProseMirror .tt-image-block.layout-sideBySide .tt-imgflex,
.content-editor .tt-editor .ProseMirror .tt-image-block.layout-sideBySideReverse .tt-imgflex {
  gap: 1rem;
}
.content-editor .tt-editor .tiptap .tt-image-block.layout-medium,
.content-editor .tt-editor .ProseMirror .tt-image-block.layout-medium {
  max-width: 60%;
  margin-left: 20%;
  margin-right: 20%;
}
.content-editor .tt-editor .tiptap .tt-image-block .tt-imgslot,
.content-editor .tt-editor .ProseMirror .tt-image-block .tt-imgslot {
  position: relative;
  flex: 1 1 auto;
  min-height: 220px;
  background: #f1f1f1;
  border-radius: 0.25rem;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  cursor: pointer;
  padding: 0.5rem;
  gap: 0.4rem;
}
.content-editor .tt-editor .tiptap .tt-image-block .tt-imgslot .tt-slot-inner,
.content-editor .tt-editor .ProseMirror .tt-image-block .tt-imgslot .tt-slot-inner {
  position: relative;
  width: 100%;
  height: 100%;
  min-height: 160px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: #efefef;
  border-radius: 0.25rem;
  overflow: hidden;
}
.content-editor .tt-editor .tiptap .tt-image-block .tt-imgslot img,
.content-editor .tt-editor .ProseMirror .tt-image-block .tt-imgslot img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.content-editor .tt-editor .tiptap .tt-image-block .tt-imgslot .tt-slot-add,
.content-editor .tt-editor .ProseMirror .tt-image-block .tt-imgslot .tt-slot-add {
  width: 56px;
  height: 56px;
  border-radius: 50%;
  border: 0;
  background: rgba(0, 0, 0, 0.2);
  color: #fff;
  font-size: 1.25rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
}
.content-editor .tt-editor .tiptap .tt-image-block .tt-imgslot .tt-slot-menu,
.content-editor .tt-editor .ProseMirror .tt-image-block .tt-imgslot .tt-slot-menu {
  position: absolute;
  top: 10px;
  right: 10px;
  width: 36px;
  height: 36px;
  border-radius: 50%;
  border: 0;
  background: rgba(0, 0, 0, 0.25);
  color: #fff;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
}
.content-editor .tt-editor .tiptap .tt-image-block .tt-textslot,
.content-editor .tt-editor .ProseMirror .tt-image-block .tt-textslot {
  flex: 1 1 auto;
  min-height: 220px;
  border: 1px dashed var(--ce-border);
  border-radius: 0.75rem;
  padding: 0.75rem;
  background: #fff;
  resize: vertical;
  font: inherit;
}
.content-editor .tt-editor .tiptap .tt-image-block .tt-block-actions,
.content-editor .tt-editor .ProseMirror .tt-image-block .tt-block-actions {
  position: absolute;
  top: 8px;
  right: 8px;
}
.content-editor .tt-editor .tiptap .tt-image-block .tt-block-actions .tt-swap-btn,
.content-editor .tt-editor .ProseMirror .tt-image-block .tt-block-actions .tt-swap-btn {
  border: 1px solid var(--ce-border);
  background: #fff;
  border-radius: 0.5rem;
  padding: 0.3rem 0.45rem;
  cursor: pointer;
  color: var(--ce-text-muted);
}
.content-editor .tt-editor .tiptap .tt-image-block .tt-block-actions .tt-swap-btn:hover,
.content-editor .tt-editor .ProseMirror .tt-image-block .tt-block-actions .tt-swap-btn:hover {
  background: rgba(0, 0, 0, 0.05);
  color: var(--ce-text);
}
.content-editor .tt-editor .tiptap .tt-image-block .tt-caption,
.content-editor .tt-editor .ProseMirror .tt-image-block .tt-caption {
  width: 100%;
  border: 1px solid var(--ce-border);
  border-radius: 0.5rem;
  padding: 0.35rem 0.5rem;
  font-family: inherit;
  font-size: 0.9em;
  background: #fff;
  margin: 0;
}
.content-editor .tt-editor .tiptap,
.content-editor .tt-editor .ProseMirror {
  /* NodeView: figure 内 UI */
}
.content-editor .tt-editor .tiptap .tt-figure-ui,
.content-editor .tt-editor .ProseMirror .tt-figure-ui {
  position: absolute;
  right: 0.5rem;
  top: 0.5rem;
  display: inline-flex;
  gap: 0.25rem;
  background: rgba(255, 255, 255, 0.92);
  border: 1px solid var(--ce-border);
  border-radius: 0.5rem;
  padding: 0.25rem;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.08);
  opacity: 0;
  transition: opacity 0.15s ease;
}
.content-editor .tt-editor .tiptap figure:hover > .tt-figure-ui,
.content-editor .tt-editor .tiptap figure.is-selected > .tt-figure-ui,
.content-editor .tt-editor .ProseMirror figure:hover > .tt-figure-ui,
.content-editor .tt-editor .ProseMirror figure.is-selected > .tt-figure-ui {
  opacity: 1;
}
.content-editor .tt-editor .tiptap .tt-fig-btn,
.content-editor .tt-editor .ProseMirror .tt-fig-btn {
  display: inline-flex;
  align-items: center;
  gap: 0.25rem;
  padding: 0.3rem 0.45rem;
  border: 1px solid transparent;
  background: transparent;
  cursor: pointer;
  color: var(--ce-text);
}
.content-editor .tt-editor .tiptap .tt-fig-btn:hover,
.content-editor .tt-editor .ProseMirror .tt-fig-btn:hover {
  background: rgba(0, 0, 0, 0.05);
}
.content-editor .tt-editor .tiptap,
.content-editor .tt-editor .ProseMirror {
  /* current block highlight */
}
.content-editor .tt-editor .tiptap .tt-current-block,
.content-editor .tt-editor .ProseMirror .tt-current-block {
  background: linear-gradient(0deg, rgba(13, 110, 253, 0.05), rgba(13, 110, 253, 0.05));
  box-shadow: none;
}
.content-editor .tt-editor .tiptap,
.content-editor .tt-editor .ProseMirror {
  /* caret dot（必要なら） */
}
.content-editor .tt-editor .tiptap .tt-caret-marker,
.content-editor .tt-editor .ProseMirror .tt-caret-marker {
  display: inline-block;
  width: var(--tt-caret-size, 6px);
  height: var(--tt-caret-size, 6px);
  border-radius: 50%;
  background: var(--tt-caret-color, var(--ce-link));
  transform: translateY(2px);
  opacity: calc(var(--tt-caret-dot) * 1);
  animation: tt-blink var(--tt-caret-blink, 1s) steps(1, start) infinite;
  pointer-events: none;
}
.content-editor {
  /* バブルメニュー（テキスト選択時） */
}
.content-editor .tt-bubble {
  display: inline-flex;
  align-items: center;
  gap: 0.25rem;
  padding: 0.35rem 0.45rem;
  background: #fff;
  border: 1px solid var(--ce-border);
  border-radius: 0.25rem;
  box-shadow: 0 4px 14px rgba(0, 0, 0, 0.08);
  z-index: 1025;
}
.content-editor .tt-bubble button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  border-radius: 0.25rem;
  border: 1px solid transparent;
  background: transparent;
  color: var(--ce-text);
  cursor: pointer;
}
.content-editor .tt-bubble button:hover {
  background: rgba(0, 0, 0, 0.04);
}
.content-editor .tt-bubble button.active {
  border-color: var(--ce-link);
  background: rgba(13, 110, 253, 0.08);
}
@keyframes tt-blink {
  50% {
    opacity: 0;
  }
}
.content-editor {
  /* ドラッグハンドル（@tiptap/extension-drag-handle） */
}
.content-editor .tt-drag-handle {
  position: absolute; /* extension が付ける */
  width: 28px;
  height: 28px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 0;
  background: transparent;
  color: var(--ce-text-muted);
  cursor: grab;
  user-select: none;
  z-index: 1; /* 本文より上、ツールバーより下 */
  transform: translateX(-36px); /* 本文の左“外”へ */
  transition: background 0.15s ease, opacity 0.15s ease;
}
.content-editor .tt-drag-handle:hover {
  background: rgba(0, 0, 0, 0.06);
  color: var(--ce-text);
}
.content-editor .tt-drag-handle:active {
  cursor: grabbing;
}
.content-editor {
  /* 対象ブロックマーカー（拡張が付けるクラス名の互換） */
}
.content-editor .has-drag-handle,
.content-editor .tt-has-handle {
  position: relative;
}
.content-editor {
  /* ブロックドラッグ中は ProseMirror の dropcursor を見えなく */
}
.content-editor.tt-dragging .ProseMirror-dropcursor {
  border-color: transparent;
}
.content-editor {
  /* NodeSelection の既定クラスに薄枠（任意） */
}
.content-editor .tt-editor .ProseMirror .ProseMirror-selectednode {
  outline: none;
}
.content-editor {
  /* readonly */
}
.content-editor.content-editor--readonly .tt-sticky,
.content-editor.content-editor--readonly .tt-toolbar {
  display: none !important;
}
.content-editor.content-editor--readonly .ProseMirror {
  pointer-events: none;
}
.content-editor {
  /* Mobile */
}
@media (max-width: 576px) {
  .content-editor .tt-toolbar {
    padding: 0.375rem;
    gap: 0.25rem;
  }
  .content-editor .tt-editor .ProseMirror {
    min-height: 10rem;
    padding: 0.85rem 1rem;
  }
}

.tt-output {
  --ce-border: rgba(0, 0, 0, 0.08);
  --ce-text: #222;
  --ce-text-muted: #6c757d;
  --ce-link: #0d6efd;
  color: var(--ce-text);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  line-height: 1.6;
  word-wrap: break-word;
  white-space: pre-wrap;
}
.tt-output p {
  margin: 0 0 0.75rem;
}
.tt-output h1,
.tt-output h2,
.tt-output h3,
.tt-output h4,
.tt-output h5,
.tt-output h6 {
  margin: 1.2rem 0 0.6rem;
  font-weight: 600;
  line-height: 1.25;
}
.tt-output h1 {
  font-size: 1.75rem;
}
.tt-output h2 {
  font-size: 1.5rem;
  padding: 0.25rem 0.35rem;
  border-left: 4px solid var(--ce-link);
  background: rgba(13, 110, 253, 0.06);
}
.tt-output h3 {
  font-size: 1.25rem;
  padding-left: 0.35rem;
  border-left: 3px solid rgba(13, 110, 253, 0.65);
}
.tt-output h4 {
  font-size: 1.125rem;
}
.tt-output h5 {
  font-size: 1rem;
}
.tt-output h6 {
  font-size: 0.875rem;
  color: var(--ce-text-muted);
}
.tt-output a {
  color: var(--ce-link);
  text-decoration: underline;
  text-underline-offset: 2px;
}
.tt-output strong {
  font-weight: 700;
}
.tt-output em {
  font-style: italic;
}
.tt-output blockquote {
  margin: 1rem 0;
  padding: 0.75rem 1rem;
  background: rgba(13, 110, 253, 0.04);
  border-left: 4px solid var(--ce-link);
  position: relative;
  overflow: hidden;
}
.tt-output blockquote::before {
  content: "“";
  position: absolute;
  left: 0.4rem;
  top: 0.2rem;
  font-size: 2rem;
  color: rgba(13, 110, 253, 0.25);
  line-height: 1;
}
.tt-output hr {
  height: 0;
  border: 0;
  border-top: 1px solid var(--ce-border);
  box-shadow: inset 0 1px 0 rgba(0, 0, 0, 0.04);
  opacity: 1;
  margin: 1rem 0;
}
.tt-output ul,
.tt-output ol {
  padding-left: 1.25rem;
  margin: 0.75rem 0;
}
.tt-output .task-list {
  list-style: none;
  padding-left: 0.25rem;
  margin: 0.75rem 0;
}
.tt-output .task-list-item {
  display: flex;
  align-items: flex-start;
  gap: 0.5rem;
  margin: 0.35rem 0;
}
.tt-output .task-list-item input[type=checkbox] {
  margin-top: 0.2rem;
}
.tt-output .task-list-item > div {
  flex: 1 1 auto;
}
.tt-output li + li {
  margin-top: 0.25rem;
}
.tt-output table {
  width: 100%;
  border-collapse: collapse;
  margin: 0.75rem 0;
}
.tt-output th,
.tt-output td {
  border: 1px solid var(--ce-border);
  padding: 0.5rem 0.6rem;
  vertical-align: top;
}
.tt-output th {
  background: #f1f3f5;
  font-weight: 600;
}
.tt-output td {
  background: #fff;
}
.tt-output {
  /* code / pre */
}
.tt-output code {
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  background: rgba(0, 0, 0, 0.04);
  padding: 0.15rem 0.35rem;
  font-size: 0.95em;
}
.tt-output pre {
  background: rgba(0, 0, 0, 0.04);
  padding: 0.75rem;
  overflow: auto;
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
}
.tt-output {
  /* figure */
}
.tt-output figure {
  margin: 0.75rem 0;
  position: relative;
}
.tt-output img {
  max-width: 100%;
  height: auto;
  display: block;
}
.tt-output figcaption {
  margin-top: 0.35rem;
  font-size: 0.85em;
  color: var(--ce-text-muted);
}
.tt-output .img-block-export.img-medium {
  width: 60%;
  margin-left: 20%;
  margin-right: 20%;
}
.tt-output .img-block-export.img-text-flex {
  display: flex;
  gap: 1rem;
  align-items: flex-start;
}
.tt-output .img-block-export.img-text-flex .img-block-export {
  width: 50%;
  flex: 0 0 50%;
}
.tt-output .img-block-export.img-text-flex .img-text-content {
  width: 50%;
  flex: 0 0 50%;
  white-space: normal;
}
@media (max-width: 576px) {
  .tt-output .img-block-export.img-text-flex {
    flex-direction: column;
  }
  .tt-output .img-block-export.img-text-flex .img-block-export,
  .tt-output .img-block-export.img-text-flex .img-text-content {
    width: 100%;
  }
}
.tt-output .img-block-export.img-side-flex {
  display: flex;
  gap: 1rem;
  align-items: flex-start;
}
.tt-output .img-block-export.img-side-flex > figure {
  width: 50%;
  flex: 0 0 50%;
}
.tt-output figcaption.tt-inline-caption {
  margin: 0.3rem 0 0;
  font-size: 0.85em;
  color: var(--ce-text-muted);
}

/* Fallback safety */
.tiptap,
.ProseMirror {
  box-sizing: border-box;
}
