.ss-tabs { display:flex; gap:4px; border-bottom:1px solid #E5E7EB; margin-bottom:20px; flex-wrap:wrap; }
.ss-tab  { padding:10px 18px; background:transparent; border:none; cursor:pointer; font-size:14px;
           color:#6B7280; font-weight:600; border-bottom:3px solid transparent; font-family:inherit; }
.ss-tab:hover { color:#1F2937; background:#F9FAFB; }
.ss-tab.is-active { color:#1B4332; border-bottom-color:#2D6A4F; background:#FFFFFF; }
.ss-panel { background:#FFFFFF; border:1px solid #E5E7EB; border-radius:10px; padding:20px; }
.ss-field { margin-bottom:18px; }
.ss-field__label { display:block; font-size:13px; font-weight:600; color:#374151; margin-bottom:6px; }
.ss-field__hint  { font-size:12px; color:#6B7280; margin-top:4px; line-height:1.6; }
.ss-field__row   { display:flex; gap:8px; align-items:center; }
.ss-field__edited-flag { font-size:11px; color:#92400E; background:#FEF3C7; padding:2px 8px; border-radius:4px; margin-left:8px; }
.ss-field__default-flag { font-size:11px; color:#6B7280; background:#F3F4F6; padding:2px 8px; border-radius:4px; margin-left:8px; }
.ss-actions { display:flex; gap:8px; justify-content:flex-end; margin-top:16px; padding-top:16px; border-top:1px solid #F3F4F6; }
.ss-required { color:#DC2626; }
/* 繰り返し項目 (FAQ 等) */
.ss-repeat { border:1px solid #E5E7EB; border-radius:8px; padding:8px; background:#FAFAF9; }
.ss-repeat__item { background:#FFFFFF; border:1px solid #E5E7EB; border-radius:8px; padding:14px; margin-bottom:10px; position:relative; }
.ss-repeat__item-head { display:flex; justify-content:space-between; align-items:center; margin-bottom:10px; }
.ss-repeat__item-no { font-size:12px; font-weight:700; color:#6B7280; }
.ss-repeat__del { background:#FEE2E2; color:#991B1B; border:none; border-radius:6px; padding:4px 10px;
                  font-size:12px; cursor:pointer; font-family:inherit; }
.ss-repeat__del:hover { background:#FECACA; }
.ss-repeat__add { background:#F0FDF4; color:#166534; border:1px dashed #86EFAC; border-radius:8px;
                  padding:10px; width:100%; cursor:pointer; font-size:13px; font-weight:600; font-family:inherit; }
.ss-repeat__add:hover { background:#DCFCE7; }
.ss-repeat__empty { text-align:center; color:#9CA3AF; font-size:13px; padding:16px; }
/* 画像フィールド */
.ss-image__preview { width:100%; max-width:340px; min-height:96px; border:1px solid #E5E7EB;
                     border-radius:8px; background:#FAFAF9; display:flex; align-items:center;
                     justify-content:center; overflow:hidden; margin-bottom:8px; }
.ss-image__preview img { max-width:100%; max-height:220px; display:block; }
.ss-image__empty { color:#9CA3AF; font-size:13px; }
.ss-image__ctrl { display:flex; gap:8px; align-items:center; flex-wrap:wrap; }
.ss-image__btn { background:#F0FDF4; color:#166534; border:1px solid #86EFAC; border-radius:6px;
                 padding:6px 14px; font-size:13px; font-weight:600; cursor:pointer; }
.ss-image__btn:hover { background:#DCFCE7; }
.ss-image__clear { background:#FEE2E2; color:#991B1B; border:none; border-radius:6px;
                   padding:6px 12px; font-size:12px; cursor:pointer; font-family:inherit; }
.ss-image__clear:hover { background:#FECACA; }
.ss-image__status { font-size:12px; }
/* select / color / checkbox */
.ss-color { width:56px; height:36px; padding:2px; border:1px solid #E5E7EB;
            border-radius:6px; cursor:pointer; background:#FFFFFF; vertical-align:middle; }
.ss-check { display:flex; align-items:center; gap:8px; font-size:14px; cursor:pointer; color:#374151; }
.ss-check input { width:16px; height:16px; }
/* リッチテキスト (contenteditable) */
.ss-rt { border:1px solid #E5E7EB; border-radius:8px; overflow:hidden; background:#FFFFFF; }
.ss-rt__toolbar { display:flex; flex-wrap:wrap; gap:3px; padding:6px;
                  background:#F9FAFB; border-bottom:1px solid #E5E7EB; }
.ss-rt__btn { background:#FFFFFF; border:1px solid #E5E7EB; border-radius:5px; padding:4px 9px;
              font-size:12px; cursor:pointer; font-family:inherit; color:#374151; line-height:1.4; }
.ss-rt__btn:hover { background:#F0FDF4; border-color:#86EFAC; }
.ss-rt__editor { min-height:140px; padding:12px 14px; font-size:14px; line-height:1.8; outline:none; }
.ss-rt__editor:empty::before { content:'ここに入力…'; color:#9CA3AF; }
.ss-rt__editor h2, .ss-rt__editor h3, .ss-rt__editor h4 { font-weight:700; margin:14px 0 6px; }
.ss-rt__editor h3 { font-size:17px; }
.ss-rt__editor p  { margin:8px 0; }
.ss-rt__editor ul, .ss-rt__editor ol { margin:8px 0; padding-left:24px; }
.ss-rt__editor a  { color:#2D6A4F; text-decoration:underline; }
.ss-rt__editor blockquote { margin:8px 0; padding:6px 14px; border-left:3px solid #86EFAC; color:#4B5563; }
/* フォント選択プルダウン (Safari でも各フォントを表示するためのカスタム実装) */
.fp { position:relative; }
.fp__btn { width:100%; display:flex; align-items:center; justify-content:space-between;
           gap:8px; padding:9px 12px; border:1px solid #E5E7EB; border-radius:8px;
           background:#fff; color:#1A1A1A; cursor:pointer; font-size:14px;
           font-family:inherit; text-align:left; }
.fp__btn:hover { border-color:#2D6A4F; }
.fp__current { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.fp__caret { color:#9CA3AF; font-size:11px; flex-shrink:0; }
.fp__panel { position:absolute; z-index:60; left:0; right:0; top:calc(100% + 4px);
             max-height:280px; overflow-y:auto; background:#fff;
             border:1px solid #E5E7EB; border-radius:8px;
             box-shadow:0 10px 30px rgba(0,0,0,0.14); padding:4px; }
.fp__opt { padding:9px 12px; border-radius:6px; cursor:pointer; font-size:14px;
           color:#1A1A1A; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.fp__opt:hover { background:#F3F4F6; }
.fp__opt--on { background:#D8F3DC; font-weight:600; }
/* セクション編集タブ内の見出しフォント行 */
.ss-fontrow { display:flex; align-items:center; gap:12px; flex-wrap:wrap;
              background:#F9FAFB; border:1px solid #E5E7EB; border-radius:8px;
              padding:10px 14px; margin-bottom:16px; }
.ss-fontrow__label { font-size:13px; font-weight:600; color:#374151; }
.ss-fontrow__pick { flex:1; min-width:200px; }

/* ---------- スマホ (≤640px) ---------- */
@media (max-width: 640px) {
    /* タブを折り返さず横スクロール (スワイプで全タブに到達) */
    .ss-tabs { flex-wrap:nowrap; overflow-x:auto; gap:0;
        -webkit-overflow-scrolling:touch; scrollbar-width:none; }
    .ss-tabs::-webkit-scrollbar { display:none; }
    .ss-tab { padding:9px 14px; font-size:13px; flex-shrink:0; white-space:nowrap; }
    .ss-panel { padding:14px; border-radius:8px; }
    .ss-field { margin-bottom:14px; }
    .ss-image__preview { max-width:100%; min-height:80px; }
    /* アクションは横並びを維持しつつフル幅で押しやすく */
    .ss-actions { flex-wrap:wrap; gap:6px; }
    .ss-actions .btn { flex:1 1 auto; justify-content:center; }
    /* フォント行は1カラムに */
    .ss-fontrow { padding:8px 10px; gap:6px; }
    .ss-fontrow__pick { min-width:0; flex:1 1 100%; }
    .ss-repeat__item { padding:12px; }
}