/* OLLIEMAGIC Unified Editor v2 / v5.8.50 */
html:has(body.om-editor-shell-body), body.om-editor-shell-body { margin:0 !important; padding:0 !important; overflow:hidden !important; background:#f2eeeb !important; }
body.om-editor-shell-body #wpadminbar { display:none !important; }
.om-editor-shell { position:fixed; inset:0; display:flex; background:#f2eeeb; color:#392f2c; font-family:-apple-system,BlinkMacSystemFont,"Hiragino Kaku Gothic ProN","Yu Gothic",Meiryo,sans-serif; z-index:100000; }
.om-editor-workspace { min-width:0; flex:1 1 auto; display:flex; flex-direction:column; }
.om-editor-preview-head { height:54px; flex:0 0 54px; display:flex; align-items:center; justify-content:space-between; gap:12px; padding:0 16px; border-bottom:1px solid #d9d2ce; background:#fff; box-sizing:border-box; }
.om-editor-device-tabs { display:flex; gap:6px; align-items:center; flex-wrap:wrap; }
.om-editor-device-tabs button { appearance:none; border:1px solid #d8cfca; background:#fff; color:#574844; border-radius:999px; padding:7px 11px; font-size:12px; font-weight:700; cursor:pointer; }
.om-editor-device-tabs button.is-active { background:#5a4742; border-color:#5a4742; color:#fff; }
.om-editor-preview-note { font-size:12px; color:#7d6d68; }
.om-editor-frame-wrap { flex:1 1 auto; min-height:0; overflow:auto; display:flex; align-items:flex-start; justify-content:center; padding:16px; box-sizing:border-box; background:#e7e1dd; }
.om-editor-frame-wrap iframe { border:0; background:#fff; display:block; min-height:100%; height:calc(100vh - 86px); box-shadow:0 12px 36px rgba(52,42,39,.12); transition:width .2s ease; }
.om-editor-frame-wrap.is-desktop iframe { width:100%; border-radius:10px; }
.om-editor-frame-wrap.is-mobile iframe { width:var(--om-phone-width,390px); max-width:100%; border-radius:26px; border:8px solid #302825; box-sizing:content-box; }
.om-editor-sidebar { width:370px; flex:0 0 370px; height:100vh; display:flex; flex-direction:column; background:#fff; border-left:1px solid #d9d2ce; box-shadow:-8px 0 28px rgba(57,47,44,.08); box-sizing:border-box; }
.om-editor-sidebar-head { min-height:66px; display:flex; align-items:center; justify-content:space-between; gap:12px; padding:12px 15px; border-bottom:1px solid #eee8e5; box-sizing:border-box; }
.om-editor-sidebar-head div { display:flex; flex-direction:column; gap:2px; }
.om-editor-sidebar-head small { font-size:10px; letter-spacing:.12em; color:#9b8780; }
.om-editor-sidebar-head strong { font-size:17px; line-height:1.2; }
.om-editor-sidebar-head a { text-decoration:none; color:#fff; background:#5a4742; border-radius:999px; padding:8px 12px; font-size:12px; font-weight:700; }
.om-editor-status { margin:10px 12px 0; padding:9px 11px; border-radius:10px; background:#f7f2ef; color:#6c5a55; font-size:12px; line-height:1.55; }
.om-editor-status.is-success { background:#eef7ef; color:#345c3d; }
.om-editor-status.is-error { background:#fff0ef; color:#8a3f3a; }
.om-editor-panel { flex:1 1 auto; min-height:0; overflow:auto; padding:12px 12px 110px; box-sizing:border-box; }
.om-editor-empty { text-align:center; padding:38px 16px; border:1px dashed #d8ccc6; border-radius:14px; background:#fffaf8; }
.om-editor-empty-icon { width:42px; height:42px; border-radius:50%; margin:0 auto 10px; display:grid; place-items:center; background:#f5afaa; color:#fff; font-size:20px; }
.om-editor-empty strong { display:block; font-size:14px; line-height:1.6; }
.om-editor-empty p { margin:8px 0 0; font-size:12px; color:#7d6e68; line-height:1.7; }
.om-editor-page-actions { margin-top:12px; }
.om-selection-head { display:flex; align-items:flex-start; justify-content:space-between; gap:10px; padding:10px 2px 12px; }
.om-selection-head > div { min-width:0; display:flex; flex-direction:column; gap:3px; }
.om-selection-head small { font-size:10px; color:#9a8780; }
.om-selection-head strong { font-size:14px; line-height:1.45; overflow-wrap:anywhere; }
.om-editor-section { margin:0 0 12px; padding:12px; border:1px solid #ece4e0; border-radius:12px; background:#fff; }
.om-section-title { display:flex; align-items:baseline; justify-content:space-between; gap:8px; margin-bottom:9px; }
.om-section-title strong { font-size:13px; }
.om-section-title small { font-size:10px; color:#9a8780; }
.om-fields { display:grid; grid-template-columns:1fr 1fr; gap:8px; }
.om-field { display:flex; flex-direction:column; gap:5px; min-width:0; font-size:11px; color:#6b5a55; }
.om-field > span { font-weight:700; }
.om-field input[type="text"], .om-field textarea, .om-field select { width:100%; min-width:0; box-sizing:border-box; border:1px solid #d9cfca; border-radius:8px; background:#fff; padding:8px 9px; font:inherit; font-size:12px; color:#3f3431; outline:none; }
.om-field textarea { resize:vertical; min-height:82px; line-height:1.55; }
.om-field input:focus, .om-field textarea:focus, .om-field select:focus { border-color:#c7908c; box-shadow:0 0 0 2px rgba(245,175,170,.2); }
.om-color-row { display:grid; grid-template-columns:1fr 36px; gap:5px; }
.om-color-row input[type="color"] { width:36px; height:34px; padding:2px; border:1px solid #d9cfca; border-radius:8px; background:#fff; }
.om-media-preview { width:100%; min-height:100px; max-height:180px; border-radius:10px; overflow:hidden; background:#f3efed; display:flex; align-items:center; justify-content:center; margin-bottom:9px; }
.om-media-preview img, .om-media-preview video { display:block; width:100%; height:160px; object-fit:contain; }
.om-media-bg-preview { width:100%; height:160px; background-size:cover; background-position:center; }
.om-button-grid { display:grid; grid-template-columns:1fr 1fr; gap:7px; }
.om-button-grid-4 { grid-template-columns:1fr 1fr 1fr 1fr; }
.om-btn { appearance:none; border:1px solid #d9cfca; background:#fff; color:#554641; border-radius:9px; padding:8px 9px; font-size:11px; font-weight:700; cursor:pointer; text-align:center; }
.om-btn:hover { filter:brightness(.98); }
.om-btn-primary { background:#5a4742; border-color:#5a4742; color:#fff; }
.om-btn-danger { color:#9c3c38; border-color:#e7bbb8; background:#fff7f6; }
.om-btn-subtle { background:#f7f2ef; border-color:#e7ddd8; }
.om-checks { display:grid; grid-template-columns:1fr 1fr; gap:7px; margin-top:10px; font-size:11px; }
.om-checks label { display:flex; align-items:center; gap:6px; }
.om-current-size { margin-top:7px; padding:7px 8px; border-radius:8px; background:#f8f5f3; font-size:10px; color:#806f69; }
.om-palette { margin:0 0 12px; padding:12px; border:1px solid #ece4e0; border-radius:12px; background:#fff; }
.om-palette > span { display:block; margin-bottom:8px; font-size:11px; font-weight:700; color:#6c5a55; }
.om-palette-list { display:flex; flex-wrap:wrap; gap:6px; }
.om-swatch { width:24px; height:24px; border-radius:50%; border:1px solid rgba(0,0,0,.14); padding:0; cursor:pointer; box-shadow:0 1px 2px rgba(0,0,0,.06); }
.om-deleted-banner { margin-bottom:12px; padding:10px; border-radius:10px; background:#fff1ef; border:1px solid #efcbc7; color:#814640; font-size:11px; line-height:1.6; }
.om-editor-savebar { position:sticky; bottom:0; display:grid; grid-template-columns:1.2fr 1fr; gap:7px; padding:10px 0 0; background:linear-gradient(to bottom,rgba(255,255,255,0),#fff 24%); }

/* frame-only editing helpers */
html.om-editor-frame-mode, body.om-editor-frame-mode { margin-top:0 !important; }
.om-editor-frame-mode .om-editor-hover { outline:2px dashed rgba(245,175,170,.9) !important; outline-offset:2px !important; cursor:pointer !important; }
.om-editor-frame-mode .om-editor-selected { outline:3px solid #f5afaa !important; outline-offset:3px !important; }
.om-editor-deleted-placeholder { display:none !important; width:min(100%,480px); min-height:54px; margin:8px auto; border:2px dashed #d59c97; border-radius:10px; background:#fff6f5; color:#875650; font:700 12px/1.5 -apple-system,BlinkMacSystemFont,"Yu Gothic",sans-serif; cursor:pointer; }
.om-editor-added-button { display:inline-flex; align-items:center; justify-content:center; min-height:42px; padding:9px 16px; border-radius:999px; background:#5a4742; color:#fff; text-decoration:none; font-weight:700; }
.om-editor-added-text { margin:10px 0; }

@media (max-width:1100px) {
  .om-editor-sidebar { width:330px; flex-basis:330px; }
  .om-fields { grid-template-columns:1fr; }
  .om-button-grid-4 { grid-template-columns:1fr 1fr; }
}
.om-selection-actions{display:flex;flex-direction:column;gap:6px;align-items:stretch;flex:0 0 auto}.om-selection-actions .om-btn{white-space:nowrap}.om-delete-added{width:100%;margin:0 0 12px}
.om-layer-add-title{margin:11px 0 7px;padding-top:10px;border-top:1px solid #eee6e2;font-size:10px;font-weight:800;color:#8b7770;letter-spacing:.04em}.om-range-field{margin-top:10px}.om-range-field input[type="number"]{width:100%;box-sizing:border-box;border:1px solid #d9cfca;border-radius:8px;background:#fff;padding:8px 9px;font:inherit;font-size:12px;color:#3f3431}
.om-editor-layer-host{position:relative;isolation:isolate}.om-editor-layer{display:block;pointer-events:none}.om-editor-layer-background{z-index:0}.om-editor-layer-watermark{z-index:2}.om-editor-layer-shade{display:block}

/* v5.8.50: the editor shell intentionally sits above the site preview. WordPress
   media modal is appended to <body>, so it must be explicitly placed above the
   shell or "差し替える / 画像追加 / 動画追加" appears to do nothing. */
body.om-editor-shell-body .media-modal-backdrop {
  z-index:199900 !important;
}
body.om-editor-shell-body .media-modal {
  z-index:200000 !important;
}
body.om-editor-shell-body .media-frame,
body.om-editor-shell-body .media-modal-content {
  z-index:200001 !important;
}
body.om-editor-shell-body .media-modal-close {
  z-index:200002 !important;
}

/* Keep WP media chooser usable even when theme/global CSS contains aggressive
   img/video/button rules. */
body.om-editor-shell-body .media-modal img,
body.om-editor-shell-body .media-modal video {
  max-width:none;
}

/* v5.8.51: deleted items never occupy the page canvas. Recovery is sidebar-only. */
.om-deleted-items{margin:14px 0;border:1px solid #e7d9d6;border-radius:12px;background:#fff;padding:0;overflow:hidden}.om-deleted-items summary{cursor:pointer;padding:12px 14px;font-size:12px;font-weight:700;color:#5f504d;display:flex;align-items:center;justify-content:space-between}.om-deleted-items summary span{display:inline-flex;min-width:22px;height:22px;align-items:center;justify-content:center;border-radius:999px;background:#f3e6e3;color:#7a5a55;font-size:11px}.om-deleted-items-list{border-top:1px solid #eee3e1;padding:8px 12px}.om-deleted-item{display:flex;align-items:center;gap:8px;justify-content:space-between;padding:8px 0;border-bottom:1px solid #f3ecea}.om-deleted-item:last-child{border-bottom:0}.om-deleted-item>span{font-size:11px;line-height:1.45;color:#685956;overflow-wrap:anywhere}.om-deleted-item .om-btn{flex:0 0 auto;padding:6px 9px;font-size:10px}.om-deleted-help{margin:0;padding:0 12px 11px;font-size:10px;line-height:1.55;color:#8b7b78}


/* v5.8.52: match the historical Easy Edit defaults for newly added media.
   The previous editor presented a 100%-wide 4:3 frame with 16px rounding and
   cover-fit on both desktop and mobile. Saved inline editor values can still
   override these defaults. */
.om-editor-added-media {
  display:block;
  width:100%;
  max-width:100%;
  aspect-ratio:4 / 3;
  object-fit:cover;
  object-position:center center;
  border-radius:16px;
  overflow:hidden;
  box-sizing:border-box;
  margin:12px 0;
}
.om-field small { display:block; margin-top:2px; font-size:10px; line-height:1.5; color:#8b7b76; }

/* v5.8.55: explicit frame deletion. Removing a frame hides its own layout
   footprint (height / margin / aspect ratio), not only the media inside it. */
.om-frame-delete-section .om-delete-frame{width:100%;font-size:12px;padding:10px 12px}
.om-frame-delete-help{display:block;margin-top:8px;font-size:10px;line-height:1.6;color:#846f69}

/* v5.8.58: free focal-position controls for images/videos. */
.om-position-field{grid-column:1/-1;padding:10px;border:1px solid #eee4e0;border-radius:10px;background:#fbf8f6}
.om-position-axis{display:grid;grid-template-columns:minmax(0,1fr) 66px;gap:9px;align-items:end;margin-top:8px}
.om-position-axis>label{display:flex;flex-direction:column;gap:5px;min-width:0}
.om-position-axis>label>span{font-size:10px;font-weight:700;color:#77655f}
.om-position-axis input[type="range"]{width:100%;margin:0;accent-color:#8d6d65;cursor:pointer}
.om-position-number{display:grid;grid-template-columns:1fr auto;align-items:center;gap:4px}
.om-position-number input[type="number"]{width:100%;min-width:0;box-sizing:border-box;border:1px solid #d9cfca;border-radius:8px;background:#fff;padding:7px 5px;font:inherit;font-size:12px;color:#3f3431;text-align:right;outline:none}
.om-position-number span{font-size:10px;color:#806e68}
.om-position-scale{display:flex;justify-content:space-between;margin:2px 75px 0 0;font-size:9px;color:#9a8882}
.om-position-actions{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-top:9px}
.om-position-actions .om-btn{padding:6px 9px;font-size:10px}
.om-position-actions output{font-size:10px;font-weight:700;color:#725d57;background:#f0e8e4;border-radius:999px;padding:5px 8px;white-space:nowrap}


/* v5.8.59: direct drag positioning for text/media/frames. */
.om-free-placement-help{margin:0 0 9px;font-size:10px;line-height:1.65;color:#806d67}
.om-drag-toggle{width:100%;padding:10px 12px;font-size:12px;border-color:#c9b6b0;background:#f9f4f2}
.om-drag-toggle.is-active{background:#5a4742;border-color:#5a4742;color:#fff;box-shadow:0 0 0 3px rgba(90,71,66,.12)}
.om-move-values{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:9px}
.om-move-number{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:5px;align-items:center}
.om-move-number input{width:100%;min-width:0;box-sizing:border-box;border:1px solid #d9cfca;border-radius:8px;background:#fff;padding:8px;font:inherit;font-size:12px;color:#3f3431}
.om-move-number>span{font-size:10px;color:#806e68}
.om-move-nudges{display:grid;grid-template-columns:repeat(4,1fr);gap:5px;margin-top:8px}
.om-move-nudges .om-btn{padding:7px 3px;font-size:9px}
.om-move-reset,.om-select-frame{width:100%;margin-top:8px}
.om-free-placement-note{display:block;margin-top:8px;font-size:9px;line-height:1.55;color:#927f79}
.om-editor-frame-mode.om-editor-drag-mode .om-editor-selected,.om-editor-frame-mode .om-editor-drag-target{cursor:grab!important;touch-action:none!important;user-select:none!important;-webkit-user-select:none!important}
.om-editor-frame-mode .om-editor-drag-target.om-editor-dragging{cursor:grabbing!important;outline:3px solid #8d6d65!important;box-shadow:0 0 0 6px rgba(141,109,101,.14)!important}
@media(max-width:1100px){.om-move-nudges{grid-template-columns:1fr 1fr}}


/* v5.8.60: persistent free placement + direct frame resizing. */
.om-free-size-block{margin-top:12px;padding-top:12px;border-top:1px solid #eee4e0}
.om-free-size-head{display:flex;justify-content:space-between;align-items:center;gap:8px;margin-bottom:8px}.om-free-size-head strong{font-size:11px;color:#5f4f4a}.om-free-size-head small{font-size:9px;color:#93817b}
.om-resize-toggle{width:100%;padding:10px 12px;font-size:12px;border-color:#c9b6b0;background:#f9f4f2}.om-resize-toggle.is-active{background:#5a4742;border-color:#5a4742;color:#fff;box-shadow:0 0 0 3px rgba(90,71,66,.12)}
.om-size-actions{display:grid;grid-template-columns:1fr 1fr;gap:6px;margin-top:8px}
.om-editor-frame-mode .om-editor-resize-target{outline:3px solid #8d6d65!important;outline-offset:3px!important}
.om-editor-resize-handle{position:fixed!important;width:20px!important;height:20px!important;z-index:2147483000!important;border:3px solid #fff!important;border-radius:6px!important;background:#5a4742!important;box-shadow:0 1px 8px rgba(0,0,0,.35)!important;cursor:nwse-resize!important;touch-action:none!important;user-select:none!important;-webkit-user-select:none!important;box-sizing:border-box!important}
.om-editor-resize-handle::after{content:"";position:absolute;right:3px;bottom:3px;width:6px;height:6px;border-right:2px solid #fff;border-bottom:2px solid #fff}.om-editor-resize-handle.is-dragging{transform:scale(1.15)}


/* v5.8.66: responsive editor shell. PC can edit the mobile bucket by choosing
   375/390/430, and the same editor is usable directly on a real smartphone. */
body.om-editor-shell-body.om-editing-mobile-layout .om-editor-preview-note{font-weight:700;color:#6d5049}

@media (max-width:820px) {
  html:has(body.om-editor-shell-body), body.om-editor-shell-body {
    width:100% !important;
    height:100dvh !important;
    min-height:100dvh !important;
    overscroll-behavior:none;
  }
  .om-editor-shell {
    flex-direction:column;
    width:100%;
    height:100dvh;
    min-height:100dvh;
  }
  .om-editor-workspace {
    flex:0 0 46dvh;
    min-height:255px;
    max-height:52dvh;
    width:100%;
  }
  .om-editor-preview-head {
    height:auto;
    min-height:52px;
    flex:0 0 auto;
    align-items:center;
    gap:8px;
    padding:6px 8px;
    overflow:hidden;
  }
  .om-editor-device-tabs {
    flex:1 1 auto;
    min-width:0;
    flex-wrap:nowrap;
    overflow-x:auto;
    overscroll-behavior-x:contain;
    -webkit-overflow-scrolling:touch;
    scrollbar-width:none;
    padding-bottom:1px;
  }
  .om-editor-device-tabs::-webkit-scrollbar{display:none}
  .om-editor-device-tabs button {
    flex:0 0 auto;
    min-height:40px;
    padding:8px 11px;
    font-size:11px;
    touch-action:manipulation;
  }
  .om-editor-preview-note { display:none; }
  .om-editor-frame-wrap {
    flex:1 1 auto;
    min-height:0;
    padding:6px;
    justify-content:center;
    -webkit-overflow-scrolling:touch;
  }
  .om-editor-frame-wrap iframe {
    min-height:0;
    height:100%;
    max-width:100%;
    box-shadow:0 5px 18px rgba(52,42,39,.12);
  }
  .om-editor-frame-wrap.is-mobile iframe {
    width:min(var(--om-phone-width,390px), calc(100vw - 20px)) !important;
    max-width:calc(100vw - 20px) !important;
    border-width:4px;
    border-radius:18px;
  }
  .om-editor-sidebar {
    width:100%;
    max-width:none;
    height:auto;
    min-height:0;
    flex:1 1 54dvh;
    border-left:0;
    border-top:1px solid #d9d2ce;
    box-shadow:0 -7px 22px rgba(57,47,44,.09);
  }
  .om-editor-sidebar-head {
    min-height:50px;
    padding:7px 10px;
    padding-left:max(10px, env(safe-area-inset-left));
    padding-right:max(10px, env(safe-area-inset-right));
  }
  .om-editor-sidebar-head small{display:none}
  .om-editor-sidebar-head strong{font-size:14px}
  .om-editor-sidebar-head a {
    min-height:38px;
    display:inline-flex;
    align-items:center;
    padding:6px 12px;
    touch-action:manipulation;
  }
  .om-editor-status {
    margin:6px 8px 0;
    padding:7px 9px;
    font-size:11px;
  }
  .om-editor-panel {
    padding:8px 8px calc(100px + env(safe-area-inset-bottom));
    -webkit-overflow-scrolling:touch;
  }
  .om-editor-section {padding:10px;margin-bottom:9px}
  .om-fields {grid-template-columns:1fr}
  .om-button-grid,.om-button-grid-4 {grid-template-columns:1fr 1fr}
  .om-btn {min-height:42px;font-size:12px;touch-action:manipulation}
  .om-editor-savebar {
    margin-left:-1px;
    margin-right:-1px;
    padding:12px 0 max(8px, env(safe-area-inset-bottom));
    z-index:8;
  }
  .om-editor-savebar .om-btn {min-height:48px;font-size:13px}
  .om-position-axis {grid-template-columns:minmax(0,1fr) 74px}
  .om-move-values {grid-template-columns:1fr 1fr}
  .om-move-nudges {grid-template-columns:1fr 1fr 1fr 1fr}
}

@media (max-width:430px) {
  .om-editor-workspace {flex-basis:43dvh; min-height:230px}
  .om-editor-sidebar {flex-basis:57dvh}
  .om-button-grid,.om-button-grid-4 {grid-template-columns:1fr}
  .om-move-nudges {grid-template-columns:1fr 1fr}
  .om-editor-savebar {grid-template-columns:1.25fr .9fr}
}

@media (pointer:coarse) {
  .om-editor-frame-mode .om-editor-hover {outline:none !important}
  .om-editor-resize-handle {
    width:30px !important;
    height:30px !important;
    border-width:4px !important;
    border-radius:8px !important;
    margin-left:-5px;
    margin-top:-5px;
  }
  .om-editor-resize-handle::after {right:5px;bottom:5px;width:8px;height:8px}
  .om-editor-frame-mode .om-editor-selected {outline-width:3px !important;outline-offset:2px !important}
}


/* v5.8.67: live color code controls + always-visible up/down numeric steppers. */
.om-color-row{grid-template-columns:minmax(0,1fr) 42px;align-items:end}
.om-color-code-wrap{min-width:0;display:flex;flex-direction:column;gap:3px}
.om-color-code-wrap>small{margin:0!important;font-size:9px!important;color:#8b7770!important;font-weight:700}
.om-color-code-wrap input{font-family:ui-monospace,SFMono-Regular,Consolas,"Liberation Mono",monospace!important;text-transform:lowercase}
.om-color-row input[type="color"]{width:42px;height:38px;cursor:pointer}
.om-value-stepper,.om-number-stepper{display:grid;grid-template-columns:minmax(0,1fr) 28px;gap:4px;align-items:stretch;min-width:0;width:100%}
.om-value-stepper>input,.om-number-stepper>input{min-width:0;width:100%!important}
.om-step-buttons{display:grid;grid-template-rows:1fr 1fr;gap:2px;min-width:28px}
.om-step-buttons button{appearance:none;-webkit-appearance:none;border:1px solid #d7cbc6;background:#f8f3f1;color:#604d47;border-radius:5px;padding:0;min-width:28px;min-height:16px;font-size:8px;line-height:1;cursor:pointer;touch-action:manipulation}
.om-step-buttons button:hover{background:#efe4e0}
.om-step-buttons button:active{background:#5a4742;color:#fff;border-color:#5a4742}
.om-position-number .om-number-stepper,.om-move-number .om-number-stepper{grid-column:1}
.om-position-number>.om-number-stepper+span,.om-move-number>.om-number-stepper+span{grid-column:2}
.om-range-field>.om-number-stepper{margin-top:0}
@media(max-width:820px){
  .om-step-buttons{min-width:34px}
  .om-step-buttons button{min-width:34px;min-height:20px;font-size:9px}
  .om-value-stepper,.om-number-stepper{grid-template-columns:minmax(0,1fr) 34px}
}

/* v5.8.68: reversible device-local drag/resize controls. */
.om-geometry-rescue-actions{display:grid;grid-template-columns:1fr 1fr;gap:6px;margin-top:10px;padding-top:10px;border-top:1px dashed #eaded9}
.om-btn-danger-soft{border-color:#d7aaa3!important;background:#fff7f5!important;color:#8a4d46!important}
.om-btn-danger-soft:hover{background:#fbe9e6!important}
.om-page-geometry-help{display:block;margin-top:7px;font-size:9px;line-height:1.55;color:#8d7973}
.om-editor-resize-handle.is-width{cursor:ew-resize!important;border-radius:999px!important}
.om-editor-resize-handle.is-height{cursor:ns-resize!important;border-radius:999px!important}
.om-editor-resize-handle.is-both{cursor:nwse-resize!important}
.om-editor-resize-handle.is-width::after{left:50%!important;top:4px!important;right:auto!important;bottom:4px!important;width:0!important;height:auto!important;border:0!important;border-left:2px solid #fff!important;transform:translateX(-50%)}
.om-editor-resize-handle.is-height::after{left:4px!important;right:4px!important;top:50%!important;bottom:auto!important;width:auto!important;height:0!important;border:0!important;border-top:2px solid #fff!important;transform:translateY(-50%)}
.om-editor-frame-mode.om-editor-drag-mode img,.om-editor-frame-mode.om-editor-drag-mode a,.om-editor-frame-mode.om-editor-drag-mode video{-webkit-user-drag:none!important}
@media(max-width:820px){.om-geometry-rescue-actions{grid-template-columns:1fr}.om-page-geometry-help{font-size:10px}}

/* v5.8.69: simplified direct layout editing. */
.om-simple-geometry .om-free-placement-help{font-size:11px;line-height:1.7;margin-bottom:10px}
.om-direct-layout-toggle{width:100%;min-height:46px;padding:11px 13px;font-size:12px;font-weight:800;border:1px solid #c9b6b0;background:#f8f2ef;color:#584844;border-radius:10px}
.om-direct-layout-toggle.is-active{background:#5a4742;border-color:#5a4742;color:#fff;box-shadow:0 0 0 3px rgba(90,71,66,.12)}
.om-simple-geometry-actions{display:grid;grid-template-columns:1fr 1fr;gap:7px;margin-top:8px}
.om-layout-details{margin-top:10px;border:1px solid #eadfdb;border-radius:10px;background:#fcfaf9;overflow:hidden}
.om-layout-details>summary{cursor:pointer;list-style:none;padding:10px 12px;font-size:11px;font-weight:800;color:#665650;display:flex;align-items:center;justify-content:space-between;touch-action:manipulation}
.om-layout-details>summary::-webkit-details-marker{display:none}
.om-layout-details>summary::after{content:'＋';font-size:15px;line-height:1;color:#8b756f}
.om-layout-details[open]>summary::after{content:'−'}
.om-layout-details[open]>summary{border-bottom:1px solid #eee4e0;background:#fff}
.om-layout-details>.om-move-values,.om-layout-details>.om-move-nudges,.om-layout-details>.om-size-actions{margin-left:10px;margin-right:10px}
.om-layout-details>.om-size-actions{margin-bottom:10px;grid-template-columns:repeat(3,1fr)}
.om-simple-geometry .om-select-frame{margin-top:9px}
.om-editor-resize-handle.is-both{width:24px!important;height:24px!important;border-radius:7px!important}
@media(max-width:820px){
  .om-simple-geometry-actions{grid-template-columns:1fr 1fr}
  .om-direct-layout-toggle{min-height:48px;font-size:13px}
  .om-layout-details>.om-size-actions{grid-template-columns:1fr}
  .om-editor-resize-handle.is-both{width:32px!important;height:32px!important}
}

/* v5.8.96: responsive media sizing that is independent from the 370px editor sidebar. */
.om-media-size-presets{margin-top:10px;padding:10px;border:1px solid #eadfdb;border-radius:10px;background:#faf7f5}
.om-media-size-presets>strong{display:block;margin-bottom:7px;font-size:11px;color:#5f4f4a}
.om-media-size-preset-grid{display:grid;grid-template-columns:1fr 1fr;gap:6px}
.om-media-size-preset-grid .om-btn{min-height:38px;padding:7px 5px;font-size:10px;line-height:1.35}
.om-media-size-presets>small{display:block;margin-top:7px;font-size:9px;line-height:1.55;color:#846f69}
.om-media-size-presets>em{display:block;margin-top:6px;padding:5px 7px;border-radius:7px;background:#f1e9e6;color:#6f5953;font-size:9px;font-style:normal;font-weight:700;overflow-wrap:anywhere}
@media(max-width:430px){.om-media-size-preset-grid{grid-template-columns:1fr 1fr}.om-media-size-preset-grid .om-btn{min-height:42px;font-size:11px}}


/* v6.0.3: editable card contents. Card text can be selected independently and
   images/text inserted from the unified editor without destroying the card DOM. */
.om-card-editor-section .om-button-grid{grid-template-columns:1fr 1fr}
.om-card-editor-section [data-action="card-text"]{grid-column:1/-1}
.om-card-editor-help{display:block;margin-top:8px;font-size:10px;line-height:1.55;color:#846f69}
[data-om-card-editor="1"] > .om-editor-card-item{position:relative;z-index:1;box-sizing:border-box}
[data-om-card-editor="1"] > .om-editor-card-media{
  grid-column:1 / -1;
  justify-self:start;
  width:min(140px,42%);
  max-width:100%;
  height:auto;
  aspect-ratio:4 / 3;
  margin:7px 0 0;
  border-radius:12px;
  object-fit:cover;
}
[data-om-card-editor="1"] > .om-editor-card-text{
  grid-column:1 / -1;
  width:100%;
  margin:5px 0 0;
  font-size:11px;
  line-height:1.55;
  color:inherit;
}
@media(max-width:700px){
  [data-om-card-editor="1"] > .om-editor-card-media{width:min(120px,48%)}
}

/* v6.0.4: native editable-card geometry is intentionally protected from width/position saves. */
.om-card-layout-protected{border-color:#ead7d2;background:#fffaf7}
.om-card-layout-protected .om-free-placement-help{margin-bottom:0}


/* v5.9.04 — desktop preview uses the same layout viewport width as the public page.
   The iframe keeps the real public width; only its rendered surface is scaled
   to fit beside the editor sidebar. This keeps CSS media queries identical. */
.om-editor-frame-wrap.is-desktop{justify-content:flex-start!important;align-items:flex-start!important}
.om-editor-frame-wrap.is-desktop iframe{flex:0 0 auto!important;max-width:none!important;transition:none!important}

/* v5.9.05 — card-internal centering controls */
.om-card-center-controls{margin:12px 0 4px;padding:12px;border:1px solid rgba(107,91,72,.16);border-radius:12px;background:rgba(255,255,255,.62)}
.om-card-center-controls>strong{display:block;margin-bottom:8px;font-size:12px;letter-spacing:.04em}
.om-card-center-controls>small{display:block;margin-top:8px;line-height:1.55;color:#746e66}
.om-card-center-controls .om-button-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
@media(max-width:680px){.om-card-center-controls .om-button-grid{grid-template-columns:1fr}}


/* FTD recruitment photo slots: stable one-click image replacement. */
.om-editor-frame-mode [data-ftd-photo-slot="1"]{cursor:pointer!important}
.om-editor-frame-mode [data-ftd-photo-slot="1"] > *{pointer-events:none!important}
[data-ftd-photo-slot="1"]{
  position:relative;
  overflow:hidden;
  background-position:center center!important;
  background-repeat:no-repeat!important;
  background-size:cover!important;
}
/* A unified replacement owns the frame. Hide only the native/legacy children;
   explicitly added unified layers can remain if the user created them. */
[data-ftd-photo-slot="1"].om-editor-media-filled > :not([data-om-added-id]):not(.om-editor-layer):not(.om-editor-layer-shade){
  opacity:0!important;
  visibility:hidden!important;
  pointer-events:none!important;
}
.om-ftd-photo-slot-section .om-btn-primary{width:100%}

/* Recruitment cards receive images as real card content, not tiny floating media. */
.ftd-recruit-site [data-om-card-editor="1"] > .om-editor-card-media{
  width:100%!important;
  max-width:100%!important;
  height:auto;
  aspect-ratio:16 / 10;
  margin:0 0 18px!important;
  border-radius:10px;
  object-fit:cover!important;
  align-self:stretch;
  flex:0 0 auto;
}
.ftd-recruit-site [data-om-card-editor="1"] > .om-editor-card-media:last-child{margin:18px 0 0!important}

/* 4.1.8 — canonical in-card media hosts. Added card images stay inside the
   selected card and are placed after the card copy (before CTA when present). */
.ftd-recruit-site [data-om-card-editor="1"] > .ftd-card-media-host{
  display:block!important;
  position:relative!important;
  width:100%!important;
  max-width:100%!important;
  min-width:0!important;
  height:auto!important;
  flex:0 0 auto!important;
  grid-column:1 / -1!important;
  box-sizing:border-box!important;
  overflow:visible!important;
  margin:0!important;
  padding:0!important;
  z-index:1!important;
}
.ftd-recruit-site [data-om-card-editor="1"] > .ftd-card-media-host--top{margin:0 0 18px!important}
.ftd-recruit-site [data-om-card-editor="1"] > .ftd-card-media-host--bottom{margin:18px 0 0!important}
.ftd-recruit-site .ftd-card-media-host > .om-editor-card-media{
  display:block!important;
  position:relative!important;
  inset:auto!important;
  transform:none!important;
  width:100%!important;
  max-width:100%!important;
  height:auto!important;
  aspect-ratio:16 / 10!important;
  margin:0!important;
  border-radius:10px!important;
  object-fit:cover!important;
  box-sizing:border-box!important;
}
.ftd-recruit-site .ftd-home-job-card > .ftd-card-media-host--bottom,
.ftd-recruit-site .ftd-home-flow-card > .ftd-card-media-host--bottom{order:20!important}
.ftd-recruit-site .ftd-home-job-card > b{order:30!important}


/* 4.1.9 root fix — recruitment photo frames are theme-owned geometry.
   The editor may replace/crop the media, but historical width/height/drag
   records can never collapse these structural boxes into lines. */
.ftd-recruit-site [data-ftd-photo-slot="1"]{
  transform:none!important;
  translate:none!important;
  margin-left:0!important;
  margin-right:0!important;
  box-sizing:border-box!important;
}
.ftd-recruit-home-template .ftd-home-media--main{left:0!important;right:auto!important;top:0!important;bottom:auto!important;width:64%!important;height:78%!important;min-height:0!important;max-height:none!important}
.ftd-recruit-home-template .ftd-home-media--sub1{left:auto!important;right:0!important;top:9%!important;bottom:auto!important;width:31%!important;height:43%!important;min-height:0!important;max-height:none!important}
.ftd-recruit-home-template .ftd-home-media--sub2{left:auto!important;right:3%!important;top:auto!important;bottom:0!important;width:42%!important;height:38%!important;min-height:0!important;max-height:none!important}
.ftd-recruit-site .ftd-pr-hero-media{min-height:610px!important;height:auto!important;width:auto!important}
.ftd-recruit-site .ftd-pr-photo-card{min-height:600px!important;height:auto!important;width:auto!important}
.ftd-recruit-site .ftd-pr-gallery-card{min-height:0!important;height:auto!important;width:auto!important}
.ftd-recruit-site .ftd-home-salon-media{min-height:430px!important;height:auto!important;width:auto!important}
.ftd-recruit-site .ftd-company-hero__media{min-height:590px!important;height:auto!important;width:auto!important}
.ftd-recruit-site .ftd-company-salon-card__media{min-height:390px!important;height:auto!important;width:auto!important}
.ftd-recruit-site .ftd-company-representative__media{min-height:570px!important;height:auto!important;width:auto!important}
.ftd-recruit-site .ftd-blog-feature-card__media{min-height:470px!important;height:auto!important;width:auto!important}
@media(max-width:980px){
  .ftd-recruit-site .ftd-pr-hero-media{min-height:520px!important}
}
@media(max-width:700px){
  .ftd-recruit-home-template .ftd-home-media--main{width:72%!important;height:75%!important}
  .ftd-recruit-home-template .ftd-home-media--sub1{width:37%!important;height:36%!important}
  .ftd-recruit-home-template .ftd-home-media--sub2{width:44%!important;height:35%!important}
  .ftd-recruit-site .ftd-pr-hero-media{min-height:430px!important}
  .ftd-recruit-site .ftd-pr-photo-card{min-height:430px!important}
  .ftd-recruit-site .ftd-home-salon-media{min-height:330px!important}
  .ftd-recruit-site .ftd-company-hero__media{min-height:410px!important}
  .ftd-recruit-site .ftd-company-salon-card__media{min-height:320px!important}
  .ftd-recruit-site .ftd-company-representative__media{min-height:410px!important}
  .ftd-recruit-site .ftd-blog-feature-card__media{min-height:340px!important}
}


/* 4.2.0 root layout contract: card media is always normal-flow content below copy. */
.ftd-recruit-site [data-om-card-editor="1"] > .ftd-card-media-host,
.ftd-recruit-site [data-om-card-editor="1"] > .om-editor-card-media{position:relative!important;inset:auto!important;left:auto!important;right:auto!important;top:auto!important;bottom:auto!important;transform:none!important;translate:none!important;float:none!important;clear:both!important;z-index:1!important}
.ftd-recruit-site .ftd-home-job-card{display:flex!important;flex-direction:column!important;height:auto!important;overflow:hidden!important}
.ftd-recruit-site .ftd-home-job-card>small{order:10!important}
.ftd-recruit-site .ftd-home-job-card>h3{order:20!important;margin:64px 0 13px!important}
.ftd-recruit-site .ftd-home-job-card>p{order:30!important}
.ftd-recruit-site .ftd-home-job-card>.ftd-card-media-host--bottom,
.ftd-recruit-site .ftd-home-job-card>.om-editor-card-media{order:40!important;margin:18px 0 0!important}
.ftd-recruit-site .ftd-home-job-card>b{order:50!important;margin-top:22px!important}
.ftd-recruit-site .ftd-home-flow-card{display:flex!important;flex-direction:column!important;height:auto!important;overflow:hidden!important}
.ftd-recruit-site .ftd-home-flow-card>b{order:10!important}
.ftd-recruit-site .ftd-home-flow-card>h3{order:20!important}
.ftd-recruit-site .ftd-home-flow-card>p{order:30!important}
.ftd-recruit-site .ftd-home-flow-card>.ftd-card-media-host--bottom,
.ftd-recruit-site .ftd-home-flow-card>.om-editor-card-media{order:40!important;margin:18px 0 0!important}
.ftd-recruit-home-template [data-ftd-recruit-structural="hero-grid"],
.ftd-recruit-home-template [data-ftd-recruit-structural="hero-visual"]{transform:none!important;translate:none!important;margin-left:auto!important;margin-right:auto!important}
.ftd-recruit-home-template .ftd-home-hero__visual{position:relative!important;min-height:660px!important;height:660px!important;width:100%!important}
.ftd-recruit-home-template .ftd-home-media--single{position:relative!important;inset:auto!important;width:100%!important;height:100%!important;min-height:0!important;max-height:none!important;transform:none!important;translate:none!important;margin:0!important}
@media(max-width:700px){.ftd-recruit-home-template .ftd-home-hero__visual{min-height:470px!important;height:470px!important}}


/* FTD 4.2.1 — text placed directly on an image/video. The text is anchored to
   the selected media box, not to the page/card flow, so responsive changes do
   not push it outside the media. Editor drag uses the independent CSS
   `translate` property and therefore composes with the centering transform. */
.om-editor-overlay-position-host {
  position: relative !important;
}
.om-editor-overlay-text {
  position: absolute !important;
  left: var(--om-overlay-left, 50%) !important;
  top: var(--om-overlay-top, 50%) !important;
  width: min(calc(var(--om-overlay-media-width, 480px) * .84), 90%) !important;
  max-width: calc(var(--om-overlay-media-width, 480px) * .94) !important;
  min-width: 0;
  transform: translate(-50%, -50%);
  z-index: 20 !important;
  box-sizing: border-box;
  margin: 0 !important;
  padding: 8px 12px;
  color: #fff;
  background: transparent;
  border-radius: 8px;
  font-size: clamp(18px, 2.6vw, 38px);
  font-weight: 700;
  line-height: 1.35;
  letter-spacing: .02em;
  text-align: center;
  text-shadow: 0 2px 14px rgba(0,0,0,.42);
  overflow-wrap: anywhere;
  pointer-events: none;
}
.om-editor-frame-mode .om-editor-overlay-text {
  pointer-events: auto;
  cursor: pointer;
}
.om-overlay-text-add { width:100%; margin-top:9px; }
.om-overlay-text-help { display:block; margin-top:7px; font-size:10px; line-height:1.6; color:#806d67; }
@media (max-width: 700px) {
  .om-editor-overlay-text {
    width: min(calc(var(--om-overlay-media-width, 360px) * .88), 94%) !important;
    max-width: calc(var(--om-overlay-media-width, 360px) * .96) !important;
    padding: 6px 9px;
    font-size: clamp(15px, 5vw, 28px);
  }
}


/* FTD 4.2.2 — richer typography controls for media overlay text. */
.om-font-family-field select{margin-bottom:7px}
.om-font-family-field small{display:block;margin-top:6px;font-size:10px;line-height:1.55;color:#806d67}
.om-overlay-text-placement .om-layout-details[open]{margin-top:10px}
.om-overlay-text-placement .om-direct-layout-toggle{width:100%}


/* FTD 4.2.3 — overlay text is a first-class editable object. */
.om-editor-frame-mode .om-editor-overlay-text{pointer-events:auto!important;cursor:move!important;outline:1px dashed rgba(255,255,255,.72);outline-offset:4px}
.om-editor-frame-mode .om-editor-overlay-text.om-editor-selected{outline:2px solid #f19a98!important;outline-offset:5px!important}
.om-editor-overlay-delete-control{position:fixed!important;z-index:2147483646!important;width:30px!important;height:30px!important;border:0!important;border-radius:999px!important;background:#8f3c3c!important;color:#fff!important;font:700 22px/30px Arial,sans-serif!important;text-align:center!important;padding:0!important;margin:0!important;box-shadow:0 3px 12px rgba(0,0,0,.28)!important;cursor:pointer!important}
.om-overlay-dedicated-editor{border:1px solid #efc1bf;background:#fff9f8}
.om-overlay-active-note{margin:0 0 10px;padding:9px 10px;border-radius:9px;background:#fff0ef;color:#6d4745;font-size:11px;line-height:1.55}
.om-overlay-type-grid,.om-overlay-color-grid,.om-overlay-position-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.om-overlay-actions{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:10px}
.om-overlay-delete-now{font-weight:700}
@media(max-width:720px){.om-overlay-type-grid,.om-overlay-color-grid,.om-overlay-position-grid,.om-overlay-actions{grid-template-columns:1fr}}
