/*
 * FILE VERSION: Aemazon-PostDetail-Base-v2.0.0
 * UPDATED: 2026-08-18
 * DEPLOY AS: static/css/post-detail-base-v2.css
 * 기존 post_detail.jsp 인라인 스타일을 분리해 Jasper _jspService 크기를 줄인다.
 */

  :root{
    --bg:#ffffff; --card:#fff; --line:#e6e7e9; --text:#1a1a1b;
    --muted:#7c7c7c; --brand:#ff4500; --pill:#f6f7f8; --container:1100px;
    --sbw:270px; --gutter-left:90px; --gutter-right:24px; --right-rail:320px;
    --side-left-gap:30px; --avatar-size:22px; --ctrl-h:32px;
  }
  *{box-sizing:border-box}
  body{margin:0;background:var(--bg);color:var(--text);font-family:Segoe UI,Roboto,"Noto Sans KR",Arial,sans-serif;}
  a{text-decoration:none;color:inherit}

  button, input[type="button"], input[type="submit"], input[type="text"], input[type="search"], textarea{
    -webkit-appearance:none; appearance:none; color:var(--text) !important; font:inherit; line-height:1.2; background-clip:padding-box;
  }
  .btn{appearance:none;border:1px solid #dcdfe3;background:#fff;padding:6px 12px;border-radius:20px;cursor:pointer;font-weight:700;color:var(--text) !important; min-height:var(--ctrl-h); display:inline-flex; align-items:center; height:var(--ctrl-h); line-height:1;}
  .btn.sm{padding:6px 10px;border-radius:16px;font-size:13px; height:var(--ctrl-h); line-height:1;}
  .btn.primary{border-color:#111;background:#111;color:#fff !important}
  .btn.danger{background:#111;border-color:#111;color:#fff !important}

  /* Topbar */
  .topbar{background:#fff;border-bottom:1px solid var(--line);position:sticky;top:0;z-index:600;}
  .topin{max-width:var(--container);margin:0 auto;height:50px;display:flex;align-items:center;gap:12px;padding:0 16px; flex-wrap:nowrap;}
  .logo{font-weight:900;color:#ff4500;font-size:18px;letter-spacing:.2px}
  .spacer{flex:1}
  .userlink{display:inline-flex; align-items:center; gap:8px; height:var(--ctrl-h); padding:0 4px; border:none; background:transparent; cursor:pointer; font-weight:700; color:#333; text-decoration:none;}
  .avatar-xs{width:var(--avatar-size); height:var(--avatar-size); border-radius:50%; object-fit:cover; border:1px solid rgba(0,0,0,.06); background:#f6f7f8;}

  .search{flex:1}
  .search form{margin:0;display:flex;gap:6px;align-items:center}
  .search input{flex:1;padding:8px 14px;border:1px solid #dcdfe3;border-radius:24px;background:#f6f7f8;outline:none;color:var(--text)}
  .search-btn{
    border:none;background:#fff;cursor:pointer;border-radius:50%;width:34px;height:34px;
    display:flex;align-items:center;justify-content:center;box-shadow:0 1px 3px rgba(0,0,0,.15);
    -webkit-appearance:none; appearance:none; color:var(--text);
    min-height:var(--ctrl-h);
  }
  .search-btn:hover{ background:#f0f0f0; }

  .msearch{display:none;background:#fff;border-bottom:1px solid var(--line)}
  .msearch-in{max-width:var(--container);margin:0 auto;padding:8px 16px}
  .msearch-in form{margin:0;display:flex;gap:6px;align-items:center}
  .msearch-in input{flex:1;padding:9px 14px;border:1px solid #dcdfe3;border-radius:20px;background:#f6f7f8;outline:none;color:var(--text)}

  .frame{
    display:grid;
    grid-template-columns: var(--sbw) var(--gutter-left) minmax(0,1fr) var(--gutter-right) var(--right-rail);
    width:100%;
    max-width:none;
  }
  .frame::before{ content:none; }

  .sidebar{
    grid-column:1;
    position:sticky; top:50px; align-self:start; background:#fff;
    padding:12px 0 12px var(--side-left-gap);
    border-right:1px solid var(--line);
  }
  .feed{ grid-column:3; min-width:0; padding:16px 0 16px 0; }
  .right-rail{ grid-column:5; }

  .breadcrumbs{
    display:flex;
    align-items:center;
    gap:7px;
    margin:0 16px 12px;
    color:var(--muted);
    font-size:13px;
    line-height:1.4;
  }
  .breadcrumbs a{color:#555;font-weight:700}
  .breadcrumbs a:hover{text-decoration:underline}
  .breadcrumbs-current{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

  .side-group{margin-bottom:18px}
  .side-title{font-size:12px;font-weight:800;color:#8a8a8a;letter-spacing:.3px;margin:10px 16px}
  .side-list{list-style:none;margin:0;padding:0}
  .side-list li a{display:flex;align-items:center;gap:10px;padding:10px 16px;border-radius:8px;color:var(--text)}
  .side-list li a:hover{background:#f6f7f8}
  .side-list li.on a{ background:#f6f7f8; font-weight:800; }
  .ic{width:18px;text-align:center}
  .label{white-space:nowrap}

  .card{
    background:var(--card);
    border-top:1px solid var(--line);
    border-bottom:1px solid var(--line);
    border-left:none; border-right:none;
    border-radius:0;
    padding:12px 16px; margin-bottom:12px;
  }

  .title{margin:0 0 6px;font-size:22px;font-weight:800;line-height:1.25}
  .meta{color:#787c7e;font-size:12px;display:flex;gap:6px;align-items:center;margin-bottom:8px;flex-wrap:wrap}
  .vehicle-badges{display:inline-flex;align-items:center;gap:8px;min-width:0;max-width:100%;flex-wrap:wrap}
  .vehicle-badge{display:inline-flex;align-items:center;justify-content:center;width:22px;height:22px;padding:0;border:0;border-radius:0;background:#fff;line-height:1}
  .vehicle-badge-logo{width:20px;height:20px;flex:0 0 20px;object-fit:contain}
  .meta b{color:#444}

  .text-only .content{margin-top:4px}

  .maint-review-shop-card{
    display:grid;
    grid-template-columns:84px minmax(0,1fr) auto;
    align-items:center;
    gap:15px;
    margin:16px 0 18px;
    padding:14px;
    border:1px solid #e1e3e6;
    border-radius:18px;
    background:linear-gradient(145deg,#fff 0%,#fff7f3 100%);
    color:#171719;
    box-shadow:0 7px 22px rgba(0,0,0,.045);
  }
  .maint-review-shop-card:hover{
    border-color:#ffb79a;
    box-shadow:0 10px 28px rgba(255,69,0,.10);
  }
  .maint-review-shop-card.is-inactive{background:#f7f7f7;box-shadow:none}
  .maint-shop-image{
    width:84px;height:84px;border-radius:15px;overflow:hidden;
    display:flex;align-items:center;justify-content:center;
    background:#1c1c1c;color:#fff;font-size:30px;font-weight:950;
  }
  .maint-shop-image img{display:block;width:100%;height:100%;object-fit:cover}
  .maint-shop-kicker{color:#e64000;font-size:11px;font-weight:950;letter-spacing:.04em}
  .maint-shop-name{margin-top:4px;font-size:18px;font-weight:950;line-height:1.3}
  .maint-shop-desc{
    margin-top:4px;color:#6d7076;font-size:12px;line-height:1.5;
    white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
  }
  .maint-shop-facts{display:flex;flex-wrap:wrap;gap:6px;margin-top:9px}
  .maint-shop-fact{
    display:inline-flex;align-items:center;min-height:26px;padding:0 9px;
    border-radius:999px;background:#f1f2f3;color:#55585d;font-size:10px;font-weight:850;
  }
  .maint-shop-link-label{color:#e64000;font-size:12px;font-weight:950;white-space:nowrap}
  @media(max-width:620px){
    .maint-review-shop-card{grid-template-columns:62px minmax(0,1fr);gap:11px;padding:12px}
    .maint-shop-image{width:62px;height:62px;border-radius:12px;font-size:24px}
    .maint-shop-name{font-size:16px}
    .maint-shop-link-label{grid-column:1/-1;padding-top:2px;text-align:right}
  }

  .ghost-share-card{
    margin:16px 0;
    padding:18px;
    border:1px solid #fed7aa;
    border-radius:18px;
    background:linear-gradient(145deg,#fff7ed 0%,#ffffff 72%);
    box-shadow:0 8px 24px rgba(234,88,12,.08);
  }
  .ghost-share-head{display:flex;align-items:flex-start;gap:12px}
  .ghost-share-icon{
    width:42px;height:42px;border-radius:14px;background:#f97316;color:#fff;
    display:grid;place-items:center;font-size:21px;flex:0 0 auto;
  }
  .ghost-share-kicker{font-size:12px;font-weight:900;color:#ea580c;letter-spacing:.04em}
  .ghost-share-name{font-size:18px;font-weight:900;margin-top:2px;line-height:1.3}
  .ghost-share-vehicle{font-size:12px;color:#78716c;margin-top:3px}
  .ghost-share-stats{
    display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;margin-top:16px;
  }
  .ghost-stat{padding:11px 8px;border-radius:12px;background:#fff;border:1px solid #ffedd5;text-align:center}
  .ghost-stat-label{display:block;font-size:11px;color:#9a3412;margin-bottom:4px}
  .ghost-stat-value{display:block;font-size:14px;font-weight:900;color:#431407;white-space:nowrap}
  .ghost-share-note{font-size:12px;color:#78716c;margin-top:12px}
  .ghost-challenge-btn{
    display:flex;align-items:center;justify-content:center;gap:8px;
    width:100%;margin-top:14px;padding:13px 16px;border-radius:12px;
    background:#ea580c;color:#fff;text-decoration:none;font-size:14px;font-weight:900;
    box-shadow:0 8px 18px rgba(234,88,12,.20);
    transition:transform .15s ease,background .15s ease,box-shadow .15s ease;
  }
  .ghost-challenge-btn:hover{
    background:#c2410c;color:#fff;transform:translateY(-1px);
    box-shadow:0 10px 22px rgba(194,65,12,.24);
  }
  .ghost-challenge-btn:active{transform:translateY(0)}
  .ghost-download-btn{
    margin-top:8px;
    background:#2563eb;
    box-shadow:0 8px 18px rgba(37,99,235,.18);
  }
  .ghost-download-btn:hover{
    background:#1d4ed8;
    box-shadow:0 10px 22px rgba(29,78,216,.22);
  }
  @media(max-width:640px){
    .ghost-share-stats{grid-template-columns:repeat(2,minmax(0,1fr))}
  }

  /* 첨부 단일 */
  .att-single{
    margin-top:12px;
    border:1px solid var(--line);
    border-radius:12px;
    overflow:hidden;
    background:#0b0b0b;
  }
  .att-single .att{
    width:100%;
    min-height:320px;
    display:grid;
    place-items:center;
    background:#000;
  }
  .att-single .media{
    display:block;
    width:100%;
    max-height:560px;
    object-fit:contain;
    background:#000;
  }

  /* 첨부 그리드 */
  .att-grid{
    display:grid;
    grid-template-columns:repeat(2, 1fr);
    gap:10px;
    margin-top:12px;
  }
  .att-grid .att{
    border:1px solid var(--line);
    border-radius:12px;
    overflow:hidden;
    background:#000;
    min-height:220px;
    display:grid;
    place-items:center;
  }
  .att-grid .media{
    width:100%;
    height:320px;
    object-fit:cover;
    display:block;
    background:#000;
  }

  /* ▶ 슬라이더: scroll-snap 기반 */
  .att-slider{position:relative;margin-top:12px;border:1px solid var(--line);border-radius:8px;background:#0b0b0b;overflow:hidden}
  .att-scroll{
    display:flex; overflow-x:auto; overflow-y:hidden;
    scroll-snap-type:x mandatory; -webkit-overflow-scrolling:touch;
    scroll-behavior:smooth; height:100%;
  }
  .att-scroll::-webkit-scrollbar{display:none}
  .att-slide{flex:0 0 100%; scroll-snap-align:center; display:flex}
  .att{ width:100%; background:#000; display:grid; place-items:center; overflow:hidden; }
  .att .media{ display:block; max-width:100%; max-height:560px; width:auto; height:auto; background:#000; }

  .att-prev,.att-next{
    position:absolute;top:50%;transform:translateY(-50%);
    width:36px;height:36px;border-radius:999px;border:none;cursor:pointer;
    display:flex;align-items:center;justify-content:center;
    background:rgba(0,0,0,.35);color:#fff
  }
  .att-prev{left:8px} .att-next{right:8px}
  .att-prev:hover,.att-next:hover{background:rgba(0,0,0,.5)}

  .att-dots{position:absolute;left:50%;transform:translateX(-50%);bottom:8px;display:flex;gap:6px}
  .att-dot{width:8px;height:8px;border-radius:999px;border:none;background:rgba(255,255,255,.55);cursor:pointer;padding:0}
  .att-dot.on{background:#fff}

  .att-counter{
    position:absolute;top:8px;right:8px;
    padding:4px 8px;border-radius:999px;
    background:rgba(0,0,0,.55);color:#fff;font-size:12px;font-weight:700;
    line-height:1;
  }

  .file-list{margin-top:10px;border-top:1px dashed var(--line);padding-top:10px}
  .file-item{display:flex;align-items:center;gap:8px;font-size:13px;margin:6px 0}
  .file-meta{color:#787c7e;font-size:12px}

  .likebar{display:flex;gap:10px;align-items:center;margin-top:12px}
  .likepill{display:inline-flex;align-items:center;gap:6px;background:var(--pill);border:1px solid #e5e7eb;padding:6px 10px;border-radius:999px;font-weight:800;font-size:13px}
  .likepill.clickable{cursor:pointer;user-select:none}
  .likepill .heart{color:#9ca3af}
  .likepill.clickable.on .heart{color:#e11d48}

  .actions{display:flex;gap:8px;justify-content:flex-end;margin-top:10px;flex-wrap:wrap}

  .cmt-box{margin-top:16px}
  .cmt-title{font-weight:800;font-size:16px;margin:4px 0 10px}
  .cmt{padding:10px 0;border:none;background:transparent;border-radius:0;position:relative}
  .op-badge{margin-left:4px;width:22px;height:22px;border-radius:999px;display:inline-flex;align-items:center;justify-content:center;font-size:11px;font-weight:900;color:#b45309;background:#fde68a;border:1px solid #f59e0b;line-height:1}
  .cmt .head{display:flex;gap:8px;align-items:center;color:#787c7e;font-size:12.5px;margin-bottom:6px;flex-wrap:wrap}
  .cmt .head b{color:#444}
  .cmt .row-actions{margin-left:auto;display:flex;gap:6px}
  .cmt .body{white-space:pre-wrap;line-height:1.6;font-size:14.5px}
  .cmt.child{margin-left:28px;padding-left:12px}
  .cmt.child::before{content:"";position:absolute;left:-6px;top:18px;width:14px;height:14px;border-left:2px solid #e5e7eb;border-bottom:2px solid #e5e7eb;border-bottom-left-radius:6px}

  .cmt-form{border:1px dashed var(--line);background:#fff;border-radius:8px;padding:12px;margin-top:10px}
  .input, textarea{width:100%;padding:10px 12px;border:1px solid var(--line);border-radius:10px;font-size:14.5px;background:#fff}
  .input:focus, textarea:focus{outline:none;border-color:#2563eb;box-shadow:0 0 0 4px rgba(37,99,235,.14)}

  .more-wrap{margin-left:auto; position:relative;}
  .more-btn{
    border:none; background:transparent; cursor:pointer;
    width:28px; height:28px; border-radius:6px; 
    display:inline-flex; align-items:center; justify-content:center;
    font-size:20px; line-height:1; color:#6b7280;
  }
  .more-btn:hover{ background:#f3f4f6; color:#374151; }
  .more-menu{
    position:absolute; top:30px; right:0;
    min-width:120px; background:#fff; border:1px solid #e5e7eb; border-radius:8px;
    box-shadow:0 10px 20px rgba(0,0,0,.08); padding:6px; display:none; z-index:30;
  }
  .more-menu.open{ display:block; }
  .menu-item{
    width:100%; display:flex; align-items:center; gap:8px;
    background:#fff; border:none; cursor:pointer;
    padding:8px 10px; border-radius:6px; font-size:13px; font-weight:700; color:#374151;
    text-align:left;
  }
  .menu-item:hover{ background:#f6f7f8; }
  .menu-item.danger{ color:#b91c1c; }
  .menu-divider{ height:1px; background:#eef0f3; margin:6px 0; }

  .mobile-toggle{ display:none; width:36px; height:36px; border-radius:999px; border:1px solid var(--line); background:#fff; font-weight:900; align-items:center; justify-content:center; color:#111; -webkit-appearance:none; appearance:none; }
  .sb-dim{ display:none; }

  .userbar{ display:flex; align-items:center; gap:8px; white-space:nowrap; flex-wrap:nowrap; overflow-x:auto; -webkit-overflow-scrolling:touch; max-width:100%; }
  .userbar .btn, .userbar .userlink{ flex:0 0 auto; }
  .topbar .btn-ghost{ border:none; background:transparent; padding:0 6px; box-shadow:none; }
  .topbar .btn-ghost:hover{ background:transparent; }
  .topbar .btn-ghost svg{ width:18px; height:18px; }
  .topbar .mobile-toggle{ border:none; background:transparent; }

  @media (max-width:1200px){
    .frame{ grid-template-columns: var(--sbw) var(--gutter-left) minmax(0,1fr); }
    .right-rail{ display:none; }
    .sidebar{ grid-column:1; }
    .feed{ grid-column:3; }
  }
  @media (max-width:900px){
    .search{display:none}
    .msearch{display:block}
    .frame{ grid-template-columns:1fr; }
    .sidebar{
      grid-column:auto;
      position:fixed; top:98px; left:0; bottom:0; width:var(--sbw);
      border-right:1px solid var(--line); border-bottom:none;
      transform: translateX(-100%); transition: transform .25s ease;
      min-height:auto; padding:12px 0 12px var(--side-left-gap); z-index:150; background:#fff;
    }
    .feed{ grid-column:1; padding:12px 16px; }
    body.mobile-sidebar-open .sidebar{ transform: translateX(0); }
    body:not(.mobile-sidebar-open) .sidebar,
    body:not(.mobile-sidebar-open) .sidebar * { pointer-events:none !important; }
    .sb-dim{ position:fixed; inset:94px 0 0 0; background:rgba(0,0,0,.35); display:none; z-index:100; }
    body.mobile-sidebar-open .sb-dim{ display:block; }

    .topin{ height:50px; gap:8px; }
    .btn.sm{ font-size:13px; }
    .mobile-toggle{ display:inline-flex !important; margin-left:8px; }

    .att-grid{
      grid-template-columns:1fr;
    }
    .att-grid .media{
      height:260px;
    }
  }

  /* ✅ 유튜브 oEmbed 반응형 컨테이너 (영상 우선, 실패 시 썸네일 카드 폴백) */
  .lp-embed { margin: 12px 0; }
  .lp-embed-inner {
    position: relative;
    width: 100%;
    padding-top: 56.25%; /* 16:9 */
    background: #000;
    border-radius: 8px;
    overflow: hidden;
    border: 1px solid var(--line);
  }
  .lp-embed-inner iframe {
    position: absolute; inset: 0;
    width: 100%; height: 100%;
    border: 0;
  }
  
 

.toastui-editor-contents img { max-width:100%; height:auto; }
.toastui-editor-contents iframe { max-width:100%; }
/* 🔥 ToastUI table 깨짐 원인 제거 */
.post-body table p {
  margin: 0 !important;
  white-space: normal !important;
}

/* table 기본 레이아웃 강제 복구 */
.post-body table {
  display: table;
  width: 100%;
  border-collapse: collapse;
}

.post-body th,
.post-body td {
  display: table-cell;
  vertical-align: middle;
  border: 1px solid #e5e7eb;
  padding: 8px;
}

.post-body thead th {
  background: #f6f7f8;
  font-weight: 800;
}


.post-body{
  line-height: 1.7;
  font-size: 15px;
}
/* ✅ 리스트 안에서 p 마진 때문에 마커-텍스트가 벌어지는 현상 방지 */
.post-body li > p{ margin: 0; }

/* ✅ 리스트 기본 들여쓰기/간격 정리(선택) */
.post-body ol, .post-body ul{
  margin: 0.6em 0;
  padding-left: 1.4em;
}
.post-body li{ margin: 0.25em 0; }


/* ✅ ToastUI 본문 이미지 사이즈 클래스 */
.content img{ max-width:100%; height:auto; border-radius:8px; display:block; }

.post-body img{ max-width:100%; height:auto; border-radius:8px; display:block; }
.post-body img.img-sm   { width:40%;  margin:10px auto; }
.post-body img.img-md   { width:60%;  margin:10px auto; }
.post-body img.img-lg   { width:80%;  margin:10px auto; }
.post-body img.img-full { width:100%; margin:10px auto; }

@media (max-width: 520px){
  .post-body img.img-sm,
  .post-body img.img-md,
  .post-body img.img-lg{ width:100%; }
}

/* ===== ToastUI 테이블 컬러 커스터마이즈 ===== */
.post-body table {
  width: 100%;
  border-collapse: collapse;
  background: #ffffff;
}

/* 헤더 */
.post-body thead th {
  background: #111827;
  color: #ffffff;
  font-weight: 800;
  text-align: center;
}

/* 바디 */
.post-body tbody td {
  background: #ffffff;
  color: #111827;
}

/* 셀 공통 */
.post-body th,
.post-body td {
  border: 1px solid #e5e7eb;
  padding: 10px 12px;
}

/* 줄무늬 */
.post-body tbody tr:nth-child(even) td {
  background: #f9fafb;
}

/* ===== 유튜브 embed 레이아웃 고정 ===== */
.post-body .lp-embed {
  margin: 12px 0;
}

.post-body .lp-embed-inner {
  position: relative;
  width: 100%;
  padding-top: 56.25%;
  background: #000;
  border-radius: 12px;
  overflow: hidden;
}

.post-body .lp-embed-inner iframe {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  border: 0;
}

/* ToastUI 인용구(세로줄) 복구 */
.toastui-editor-contents blockquote,
.post-body blockquote {
  border-left: 4px solid #e5e7eb;
  padding-left: 12px;
  margin: 12px 0;
  color: #374151;
}

.toastui-editor-contents blockquote p,
.post-body blockquote p {
  margin: 0.35em 0;
}

/* =========================
   ✅ Aemazon: 본문 이미지 통일 + 갤러리
   ========================= */
.post-body p{
  margin: 0;
  padding: 0;
}

.post-body .aem-gallery-marker{
  display:none !important;
}

.toastui-editor-contents .aem-gallery{
  scrollbar-width: none;
}
.toastui-editor-contents .aem-gallery::-webkit-scrollbar{
  display: none;
}

.toastui-editor-contents .aem-gallery-wrap{
  position: relative;
  margin: 12px 0;
  border-radius: 12px;
  background: #0b0b0b;
  overflow: hidden;
  border: 1px solid var(--line);
}

.toastui-editor-contents .aem-gallery{
  display:flex;
  gap:0;
  overflow-x:auto;
  overflow-y:hidden;
  scroll-snap-type:x mandatory;
  -webkit-overflow-scrolling:touch;
  scroll-behavior:smooth;
}

.toastui-editor-contents .aem-gallery img{
  flex: 0 0 100%;
  height: 360px;
  width: 100%;
  object-fit: contain;
  background:#000;
  scroll-snap-align:center;
  display:block;
}

.toastui-editor-contents .aem-gallery{ scrollbar-width:none; }
.toastui-editor-contents .aem-gallery::-webkit-scrollbar{ display:none; }

.toastui-editor-contents .aem-g-prev,
.toastui-editor-contents .aem-g-next{
  position:absolute; top:50%; transform:translateY(-50%);
  width:36px; height:36px; border-radius:999px;
  border:none; cursor:pointer;
  display:flex; align-items:center; justify-content:center;
  background:rgba(0,0,0,.35);
  color:#fff;
}
.toastui-editor-contents .aem-g-prev{ left:8px; }
.toastui-editor-contents .aem-g-next{ right:8px; }

.toastui-editor-contents .aem-g-dots{
  position:absolute; left:50%; transform:translateX(-50%);
  bottom:10px; display:flex; gap:6px;
}
.toastui-editor-contents .aem-g-dot{
  width:8px; height:8px; border-radius:999px;
  border:none; padding:0;
  background:rgba(255,255,255,.55);
}
.toastui-editor-contents .aem-g-dot.on{ background:#fff; }

.toastui-editor-contents .aem-g-counter{
  position:absolute; top:10px; right:10px;
  padding:4px 8px; border-radius:999px;
  background:rgba(0,0,0,.55);
  color:#fff; font-size:12px; font-weight:800;
  line-height:1;
}

@media (max-width:520px){
  .toastui-editor-contents .aem-gallery img{ height: 260px; }
}

.scheduled-preview-banner{margin:0 0 14px;padding:12px 14px;border:1px solid #fdba74;background:#fff7ed;color:#9a3412;border-radius:12px;font-size:13px;font-weight:800}
.att-caption{padding:9px 12px;color:#555;background:#fafafa;border-top:1px solid #eee;font-size:12px;line-height:1.5}
.aem-content-card{display:flex;align-items:center;gap:13px;margin:14px 0;padding:15px;border:1px solid #ffd3c3;border-radius:15px;background:linear-gradient(135deg,#fff8f5,#fff);color:#171717!important;text-decoration:none!important}
.aem-content-card:hover{border-color:#ff8d66;transform:translateY(-1px)}
.aem-content-card-icon{width:43px;height:43px;border-radius:13px;background:#fff0e9;display:grid;place-items:center;font-size:23px;flex:0 0 auto}
.aem-content-card-body{display:flex;flex-direction:column;min-width:0;flex:1}.aem-content-card-kicker{font-size:11px;font-weight:900;color:#e64d1b;letter-spacing:.04em}
.aem-content-card-title{font-size:15px;margin-top:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.aem-content-card-desc{font-size:12px;color:#666;margin-top:4px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.aem-content-card-arrow{font-size:25px;color:#e64d1b}
.post-poll{margin:22px 0 10px;padding:18px;border:1px solid #e5e7eb;border-radius:16px;background:#fafafa}
.post-poll-kicker{font-size:11px;font-weight:900;color:#e64d1b}.post-poll h3{margin:5px 0 14px;font-size:18px}
.poll-choice{position:relative;display:block;width:100%;overflow:hidden;margin:8px 0;padding:12px 13px;border:1px solid #ddd;border-radius:12px;background:#fff;text-align:left;cursor:pointer}
.poll-choice.selected{border-color:#ff6a38}.poll-choice:disabled{cursor:default;color:#222!important}
.poll-choice-bar{position:absolute;inset:0 auto 0 0;background:#fff0e9;pointer-events:none}.poll-choice-content{position:relative;z-index:1;display:flex;justify-content:space-between;gap:12px;font-weight:750}
.post-poll-meta{margin-top:11px;color:#777;font-size:12px}

.toastui-editor-contents img.aem-portrait,
.post-body img.aem-portrait,
.toastui-editor-contents .aem-gallery img.aem-portrait{
  object-fit: contain !important;
  background:#0b0b0b;
}

/* Lightbox */
#aemLightbox{
  position:fixed; inset:0;
  background:rgba(0,0,0,.92);
  display:none;
  z-index:9999;
  touch-action: manipulation;
}

#aemLightbox.open{ display:block; }

#aemLightbox .lb-wrap{
  position:absolute; inset:0;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:18px;
}

#aemLightbox img{
  max-width: 95vw;
  max-height: 92vh;
  width:auto;
  height:auto;
  object-fit: contain;
  display:block;
  border-radius:12px;
  background:#000;
}

#aemLightbox .lb-close{
  position:absolute; top:12px; right:12px;
  width:40px; height:40px;
  border-radius:999px;
  border:none;
  background:rgba(255,255,255,.14);
  color:#fff;
  font-size:22px;
  cursor:pointer;
}

#aemLightbox .lb-prev,
#aemLightbox .lb-next{
  position:absolute; top:50%; transform:translateY(-50%);
  width:44px; height:44px;
  border-radius:999px;
  border:none;
  background:rgba(255,255,255,.14);
  color:#fff;
  font-size:22px;
  cursor:pointer;
}
#aemLightbox .lb-prev{ left:12px; }
#aemLightbox .lb-next{ right:12px; }

#aemLightbox .lb-counter{
  position:absolute; top:14px; left:14px;
  padding:6px 10px;
  border-radius:999px;
  background:rgba(255,255,255,.14);
  color:#fff;
  font-weight:800;
  font-size:12px;
}

@media (max-width:520px){
  #aemLightbox .lb-prev,
  #aemLightbox .lb-next{ width:40px; height:40px; }
}

.toastui-editor-contents .aem-gallery .aem-slide{
  position:relative;
  flex:0 0 100%;
  height:460px;
  scroll-snap-align:center;
  background:#000;
  overflow:hidden;
}

.toastui-editor-contents .aem-gallery .aem-slide::before{
  content:"";
  position:absolute; inset:-20px;
  background-image: var(--bg);
  background-size: cover;
  background-position: center;
  filter: blur(18px);
  transform: scale(1.1);
  opacity: .55;
}

.toastui-editor-contents .aem-gallery .aem-slide img{
  position:relative;
  z-index:1;
  width:100%;
  height:100%;
  object-fit:contain;
  background:transparent;
}

.post-body .aem-portrait-wrap{
  position: relative;
  height: 360px;
  border-radius: 12px;
  overflow: hidden;
  background: #000;
  margin: 10px 0;
}

.post-body .aem-portrait-wrap::before{
  content:"";
  position:absolute;
  inset:-20px;
  background-image: var(--bg);
  background-size: cover;
  background-position: center;
  filter: blur(22px) brightness(0.78);
  transform: scale(1.1);
  opacity: .9;
}

.post-body .aem-portrait-wrap > img{
  position: relative;
  z-index: 2;
  width: 100%;
  height: 100%;
  object-fit: contain;
  display:block;
  background: transparent;
}

.post-body > p > img{
  display:block;
  width:100%;
  height:360px;
  object-fit:cover;
  border-radius:12px;
}

.toastui-editor-contents .aem-grid{
  display:grid;
  grid-template-columns: 1fr 1fr;
  gap:10px;
  margin:10px 0;
}

.toastui-editor-contents .aem-grid img{
  width:100%;
  height:260px;
  object-fit:cover;
  border-radius:12px;
  display:block;
}

@media (max-width:520px){
  .toastui-editor-contents .aem-grid{
    grid-template-columns: 1fr;
  }
  .toastui-editor-contents .aem-grid img{
    height:260px;
  }
}

/* ✅ Comment mention dropdown */
#aemMentionBoxC{
  position:absolute;
  min-width:220px;
  max-width:320px;
  background:#fff;
  border:1px solid rgba(0,0,0,.12);
  border-radius:12px;
  box-shadow:0 10px 26px rgba(0,0,0,.14);
  padding:6px;
  z-index:3000;
  display:none;
}
#aemMentionBoxC .item{
  padding:8px 10px;
  border-radius:10px;
  cursor:pointer;
  font-weight:800;
}
#aemMentionBoxC .item.active{ background:#f3f4f6; }

/* @멘션 하이라이트 */
.aem-mention-tag{
  display:inline-block;
  padding:2px 6px;
  margin:0 1px;
  border-radius:6px;
  color:#ff4500;
  font-weight:800;
  cursor:pointer;
}

.aem-mention-tag:hover{
  background:rgba(255,69,0,0.2);
  text-decoration:underline;
}

/* === 닉네임 클릭 메뉴(프로필/차단) === */
.nick-pop{
  border:none;
  background:transparent;
  padding:0;
  cursor:pointer;
  font:inherit;
  color:inherit;
  display:inline-flex;
  align-items:center;
}
.nick-menu{
  position:absolute;
  min-width:160px;
  background:#fff;
  border:1px solid rgba(0,0,0,.12);
  border-radius:12px;
  box-shadow:0 14px 30px rgba(0,0,0,.14);
  padding:6px;
  z-index:7000;
}
.nick-item{
  width:100%;
  display:flex;
  align-items:center;
  justify-content:flex-start;
  padding:10px 12px;
  border:none;
  background:#fff;
  cursor:pointer;
  border-radius:10px;
  font-weight:800;
  font-size:13px;
  color:#111827;
  text-align:left;
}
.nick-item:hover{ background:#f6f7f8; }
.nick-item.danger{ color:#b91c1c; }

.cmt-upload-row{
  display:flex;
  align-items:center;
  gap:10px;
  margin-top:10px;
  flex-wrap:wrap;
}

.cmt-file-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  height:34px;
  padding:0 12px;
  border:1px solid #dcdfe3;
  border-radius:999px;
  background:#fff;
  font-size:13px;
  font-weight:800;
  cursor:pointer;
}

.cmt-file-btn:hover{
  background:#f6f7f8;
}

.cmt-file-input{
  display:none;
}

.cmt-upload-note{
  font-size:12px;
  color:#6b7280;
}

.cmt-img-preview{
  display:grid;
  grid-template-columns:repeat(auto-fill, minmax(90px, 1fr));
  gap:8px;
  margin-top:10px;
}

.cmt-img-preview .item{
  position:relative;
  border:1px solid #e5e7eb;
  border-radius:10px;
  overflow:hidden;
  background:#f8fafc;
  aspect-ratio:1/1;
}

.cmt-img-preview img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}

.cmt-images{
  display:grid;
  grid-template-columns:repeat(auto-fill, minmax(120px, 1fr));
  gap:8px;
  margin-top:10px;
}

.cmt-images a{
  display:block;
  border-radius:10px;
  overflow:hidden;
  border:1px solid #e5e7eb;
  background:#000;
}

.cmt-images img{
  width:100%;
  height:120px;
  object-fit:cover;
  display:block;
}

@media (max-width:520px){
  .cmt-images{
    grid-template-columns:repeat(2, 1fr);
  }
}