:root{
  --bg:#F6F8FF;
  --card:#FFFFFF;
  --text:#0F172A;
  --muted:#64748B;
  --border:#E2E8F0;
  --brand:#5B7CFF;
  --accent:#22C55E;
  --shadow:0 12px 30px rgba(15,23,42,.08);
  --radius:18px;
  --radius2:24px;
  --container:1200px;
}
*{box-sizing:border-box}
html,body{height:100%}
body{margin:0;font-family:Pretendard,system-ui,-apple-system,Segoe UI,Roboto,"Apple SD Gothic Neo","Noto Sans KR",sans-serif;color:var(--text);font-size:17px;}
a{color:inherit;text-decoration:none}
img{max-width:100%;display:block}
.container{max-width:var(--container);margin:0 auto;padding:18px 16px 56px}
.card{background:var(--card);border:1px solid var(--border);border-radius:var(--radius2);box-shadow:var(--shadow);padding:22px}
.grid{display:grid;gap:16px}
h1 { font-size: 2rem; } h2 { font-size: 1.5rem; } h3 { font-size: 1.2rem; }/* 데스크탑 (기본) */
@media (max-width: 1023px) {body{font-size:16px;} h1 { font-size: 2.75rem; } h2 { font-size: 1.875rem; } h3 { font-size: 1.375rem; }}/* 태블릿 (1023px 이하) */
@media (max-width: 767px) {body{font-size:16px;} h1 { font-size: 1.9rem; } h2 { font-size: 1.4rem; } h3 { font-size: 1.125rem; } .card{border:none;padding:10px;box-shadow:none;}}/* 모바일 (767px 이하) */
@media (min-width:860px){.grid--2{grid-template-columns:1.1fr .9fr}.grid--3{grid-template-columns:repeat(3,1fr)}}
.h1{/*font-size:32px;*/line-height:1.18;margin:0;letter-spacing:-.4px}
.h2{/*font-size:20px;*/line-height:1.25;margin:0}
.p{margin:0;color:var(--muted);line-height:1.7}
.row{display:flex;gap:12px;align-items:center;flex-wrap:wrap}
.sep{height:1px;background:var(--border);margin:8px 0}
.badge{display:inline-flex;align-items:center;gap:6px;padding:6px 10px;border-radius:999px;background:#333;color:#fff;font-weight:800;font-size:12px}
.btn{display:inline-flex;align-items:center;gap:8px;padding:10px 14px;border-radius:14px;border:1px solid var(--border);background:#fff;box-shadow:0 6px 16px rgba(15,23,42,.06);font-weight:900;cursor:pointer}
.btn--brand{background:#333;border-color:transparent;color:#fff}
.input, textarea, select{width:100%;padding:12px 14px;border-radius:14px;border:1px solid var(--border);background:#fff;outline:none;font-size:14px;font:inherit}
.input:focus, textarea:focus, select:focus{border-color:rgba(91,124,255,.55);box-shadow:0 0 0 4px rgba(91,124,255,.12)}
.notice{border:1px dashed rgba(91,124,255,.35);background:rgba(91,124,255,.06);border-radius:var(--radius2);padding:14px}
.small{font-size:12px;color:var(--muted)}
.hero{display:grid;gap:18px}
@media (min-width:960px){.hero{grid-template-columns:1.2fr .8fr;align-items:center}}
.hero-title{font-size:42px;line-height:1.1;margin:10px 0 12px;letter-spacing:-1px}
.hero-desc{max-width:720px;font-size:15px}
.hero-panel{display:flex;justify-content:center}
.mini-flow{width:100%;display:grid;gap:10px}
.mini-flow > div{background:#fff;border:1px solid var(--border);border-radius:18px;padding:14px 16px;font-weight:800;box-shadow:0 8px 20px rgba(15,23,42,.05)}
.feature-card{min-height:180px}
.form-card{display:flex;flex-direction:column;gap:22px}
.editor-textarea{min-height:340px}
.post-list-grid{display:grid;gap:16px}
.post-list-grid--rows{grid-template-columns:1fr}
.post-card{display:flex;flex-direction:column;gap:12px}
.post-card--row{display:grid;grid-template-columns:minmax(260px,320px) minmax(0,1fr);align-items:stretch;gap:20px;padding:18px;cursor:pointer;transition:transform .18s ease, box-shadow .18s ease, border-color .18s ease}
/*.post-card--row:hover{transform:translateY(-2px);box-shadow:0 18px 34px rgba(15,23,42,.10);border-color:rgba(91,124,255,.24)}*/
.post-card--row:focus-visible{outline:3px solid rgba(91,124,255,.28);outline-offset:2px}
.post-card__thumb{aspect-ratio:16/9;border-radius:18px;overflow:hidden;background:linear-gradient(135deg, rgba(91,124,255,.12), rgba(34,197,94,.10))}
.post-card__thumb--row{height:100%;min-height:220px;aspect-ratio:auto}
.post-card__thumb img{width:100%;height:100%;object-fit:cover}
.post-card__thumb-placeholder{width:100%;height:100%;min-height:220px;display:grid;place-items:center;padding:16px;text-align:center;font-weight:800;color:#475569;background:linear-gradient(135deg, rgba(91,124,255,.08), rgba(34,197,94,.06))}
.post-card__body{display:flex;flex-direction:column;gap:14px;min-width:0}
.post-meta{display:flex;justify-content:space-between;gap:10px;align-items:flex-start}
.post-meta--row{padding-top:2px}
.post-card__title{font-size:28px;line-height:1.25;font-weight:100;letter-spacing:-.4px}
.post-card__summary{font-size:15px;line-height:1.8;color:var(--muted);display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:3;line-clamp:3;overflow:hidden;text-overflow:ellipsis;max-height:calc(1.8em * 3);word-break:keep-all;overflow-wrap:anywhere}
.post-shell{display:block}
.post-main{display:flex;flex-direction:column;gap:16px;min-width:0}
.post-hero{display:flex;flex-direction:column;gap:14px}
.post-title{max-width:900px}
.post-summary{font-size:16px}
.post-cover-wrap{margin:0;}
.post-cover{width:100%;height:auto;object-fit:contain;border-radius:20px}
.post-grid{display:grid;gap:16px}
@media (min-width:980px){.post-grid{grid-template-columns:minmax(0,1fr) 320px;align-items:start}}
.post-body{padding:26px}
.post-body h1,.post-body h2,.post-body h3,.post-body h4{line-height:1.3;letter-spacing:-.3px;margin:26px 0 12px}
.post-body p{line-height:1.9;color:#1e293b;margin:0 0 20px 0;}
.post-body ul,.post-body ol{margin:0 25px 25px;padding:0;line-height:1.9;color:#1e293b}
.post-body ul li,.post-body ol li{margin-bottom:10px;}
.post-body blockquote{margin:22px 0;padding:18px;background:rgba(91,124,255,.06);border-radius:16px}
.post-body blockquote p{margin:0;}
.post-body code{background:#eff6ff;padding:3px 6px;border-radius:8px;font-size:.92em}
.post-side{height:max-content;position:sticky;--site-sidebar-base-top:93px;top:var(--site-sidebar-base-top);display:flex;flex-direction:column;gap:18px;min-height:820px}
.posts-page{padding-top:20px}
.posts-layout{display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:24px;align-items:start}
.posts-main{min-width:0}
.posts-sidebar{min-height:auto;--site-sidebar-base-top:93px}
.posts-sidebar__summary{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.posts-summary-card{display:flex;flex-direction:column;gap:6px;padding:14px 12px;border-radius:18px;background:linear-gradient(180deg,#f8fbff,#fff);border:1px solid rgba(91,124,255,.12);text-align:center}
.posts-summary-card strong{font-size:22px;line-height:1;font-weight:1000;color:#0f172a}
.posts-summary-card span{font-size:12px;font-weight:800;color:#64748b}
.posts-sidebar__chips{display:flex;flex-wrap:wrap;gap:10px}
.posts-sidebar__chip{display:inline-flex;align-items:center;gap:6px}
.posts-sidebar__chip span{display:inline-flex;align-items:center;justify-content:center;min-width:22px;padding:3px 7px;border-radius:999px;background:rgba(91,124,255,.12);color:#1d4ed8;font-size:12px;font-weight:900}
.posts-sidebar__actions{display:flex;flex-direction:column;gap:10px}
.posts-sidebar__actions .btn{justify-content:center;width:100%}
.tag-chip{display:inline-flex;padding:7px 10px;border-radius:999px;background:#eef2ff;color:#334155;font-size:12px;font-weight:800}
.tag-chip--static{pointer-events:none}
.plain-list{margin:0;padding-left:18px;line-height:1.8;color:#334155}
.post-shell--tip .post-hero{border:1px solid rgba(34,197,94,.18);box-shadow:0 12px 32px rgba(34,197,94,.08)}
.post-shell--review .post-hero{border:1px solid rgba(91,124,255,.22);box-shadow:0 12px 32px rgba(91,124,255,.10)}
@media (max-width: 767px) {.post-body{padding:10px;}}/* 모바일 (767px 이하) */


.editor-layout{display:grid;gap:16px;align-items:start}
@media (min-width:1080px){.editor-layout{grid-template-columns:minmax(0,1fr) 340px}}
.seo-panel{display:flex;flex-direction:column;gap:14px;position:sticky;top:86px}
.seo-panel__top{display:flex;align-items:flex-start;justify-content:space-between;gap:12px}
.seo-eyebrow{font-weight:900;color:#1d4ed8;text-transform:uppercase;letter-spacing:.04em}
.seo-score-wrap{text-align:right;min-width:82px}
.seo-score{width:72px;height:72px;border-radius:999px;display:grid;place-items:center;font-size:24px;font-weight:1000;border:6px solid rgba(91,124,255,.15);background:linear-gradient(135deg, rgba(91,124,255,.12), rgba(34,197,94,.10))}
.seo-score[data-grade="매우 좋음"]{border-color:rgba(34,197,94,.3)}
.seo-score[data-grade="좋음"]{border-color:rgba(91,124,255,.3)}
.seo-score[data-grade="보통"]{border-color:rgba(245,158,11,.35)}
.seo-score[data-grade="점검 필요"]{border-color:rgba(239,68,68,.28)}
.seo-keyword-box{display:flex;flex-direction:column;gap:8px;padding:12px;border-radius:18px;background:rgba(91,124,255,.05);border:1px solid rgba(91,124,255,.12)}
.seo-checklist{display:flex;flex-direction:column;gap:10px}
.seo-check{padding:12px 13px;border-radius:18px;border:1px solid var(--border);background:#fff}
.seo-check--good{background:rgba(34,197,94,.08);border-color:rgba(34,197,94,.18)}
.seo-check--warn{background:rgba(245,158,11,.09);border-color:rgba(245,158,11,.2)}
.seo-check--bad{background:rgba(239,68,68,.08);border-color:rgba(239,68,68,.18)}
.seo-check__head{display:flex;justify-content:space-between;gap:10px;align-items:center;margin-bottom:6px}
.seo-check__head--stacked{margin-bottom:10px}
.seo-check--grouped{background:rgba(34,197,94,.08);border-color:rgba(34,197,94,.18)}
.seo-check__rows{display:flex;flex-direction:column;gap:8px}
.seo-check__row{display:flex;justify-content:space-between;align-items:center;gap:12px;padding-top:2px}
.seo-check__row-label{font-size:14px;color:#64748b}
.seo-check__row-status{font-size:13px;font-weight:800}
.seo-check__row-status--good{color:#166534}
.seo-check__row-status--warn{color:#92400e}
.seo-check__row-status--bad{color:#991b1b}
.seo-check__summary{padding:10px 12px;border-radius:14px;background:rgba(255,255,255,.65);font-size:13px;line-height:1.5;color:#334155}
.seo-pill{display:inline-flex;align-items:center;justify-content:center;min-width:52px;padding:5px 8px;border-radius:999px;font-size:11px;font-weight:900}
.seo-pill--good{background:rgba(34,197,94,.15);color:#166534}
.seo-pill--warn{background:rgba(245,158,11,.18);color:#92400e}
.seo-pill--bad{background:rgba(239,68,68,.15);color:#991b1b}
.seo-tip-box{margin-top:4px}

.label-row{display:flex;align-items:center;gap:8px;margin-bottom:8px;flex-wrap:wrap;min-height:38px}.label-row--compact{justify-content:flex-start}
.count-indicator{font-weight:800;white-space:nowrap}
.count-indicator.is-good{color:#15803d}
.count-indicator.is-warn{color:#b45309}
.count-indicator.is-bad{color:#94a3b8}
.editor-head-row{gap:12px}
.preview-backdrop{position:fixed;inset:0;background:rgba(15,23,42,.36);backdrop-filter:blur(2px);z-index:70}
.preview-drawer{position:fixed;top:0;right:0;width:min(50vw,920px);height:100vh;background:#f8fbff;border-left:1px solid var(--border);box-shadow:-18px 0 36px rgba(15,23,42,.14);z-index:80;transform:translateX(100%);transition:transform .26s ease;display:flex;flex-direction:column;padding:18px}
.preview-drawer.is-open{transform:translateX(0)}
.preview-drawer__header{display:flex;justify-content:space-between;gap:14px;align-items:flex-start}
.preview-actions{display:flex;gap:10px;align-items:center;flex-wrap:wrap;justify-content:flex-end}
.preview-device-switch{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.btn--device{padding:8px 12px;font-size:13px}
.btn--device.is-active{background:var(--brand);color:#fff;border-color:transparent}
.preview-stage{flex:1;overflow:auto;padding:12px 4px 4px}
.preview-frame{margin:0 auto;background:#fff;border:1px solid var(--border);border-radius:24px;box-shadow:0 16px 36px rgba(15,23,42,.08);overflow:hidden;transition:width .2s ease}
.preview-frame--pc{width:min(100%,960px)}
.preview-frame--tablet{width:min(100%,820px)}
.preview-frame--mobile{width:min(100%,430px)}
.preview-page{background:#fff;min-height:100%;padding:22px}
.preview-article{display:flex;flex-direction:column;gap:16px}
.preview-article__head{display:flex;flex-direction:column;gap:12px}
.preview-title{font-size:clamp(28px,3vw,42px);line-height:1.18;margin:0;letter-spacing:-.04em}
.preview-summary{margin:0;color:var(--muted);font-size:16px;line-height:1.8}
.preview-cover{width:100%;max-height:420px;object-fit:cover;border-radius:20px;border:1px solid var(--border)}
.preview-body h2,.preview-body h3,.preview-body h4,.preview-body h5,.preview-body h6{line-height:1.32;letter-spacing:-.03em;margin:26px 0 12px;scroll-margin-top:25px}
.preview-body p{margin:0 0 16px;line-height:1.9;color:#1e293b}
.preview-body ul,.preview-body ol{margin:0 0 18px 20px;padding:0;line-height:1.9;color:#1e293b}
.preview-body blockquote{margin:22px 0;padding:18px;border-left:4px solid var(--brand);background:rgba(91,124,255,.06);border-radius:16px}
.preview-body a{color:#1d4ed8;text-decoration:underline}
.preview-body code{background:#eff6ff;padding:3px 6px;border-radius:8px;font-size:.92em}
.preview-figure{margin:20px 0}
.preview-figure img{width:100%;border-radius:18px;border:1px solid var(--border)}
.preview-empty{color:var(--muted)}
body.has-preview-open{overflow:hidden}
@media (max-width:1080px){
  .preview-drawer{width:min(92vw,920px)}
}
@media (max-width:720px){
  .preview-drawer{width:100vw;padding:14px}
  .preview-drawer__header{flex-direction:column}
  .preview-actions{justify-content:flex-start}
  .preview-page{padding:16px}
}

.preview-snippet{padding:16px 18px;border:1px solid rgba(91,124,255,.12);background:linear-gradient(180deg,#f8fbff,#ffffff);border-radius:20px}
.preview-snippet__label{font-weight:900;color:#2563eb;margin-bottom:10px}
.preview-snippet__title{font-size:24px;line-height:1.3;color:#1a0dab;font-weight:500;margin-bottom:6px}
.preview-snippet__url{font-size:14px;line-height:1.5;color:#188038;margin-bottom:6px;word-break:break-all}
.preview-snippet__desc{font-size:14px;line-height:1.7;color:#4b5563}
.preview-post-card{display:flex;flex-direction:column;gap:16px}

.preview-faq{margin-top:28px;padding-top:22px;border-top:1px solid var(--border)}
.preview-faq h2{margin:0 0 14px;line-height:1.3;letter-spacing:-.03em}
.preview-faq__list{display:grid;gap:12px}
.preview-faq__item{padding:16px;border:1px solid var(--border);border-radius:18px;background:#fff}
.preview-faq__item h3{margin:0 0 10px;font-size:18px;line-height:1.45}
.preview-faq__answer p:last-child,.preview-faq__answer ul:last-child,.preview-faq__answer ol:last-child{margin-bottom:0}


.seo-tabs{display:flex;flex-wrap:wrap;gap:8px}
.seo-tab{appearance:none;border:1px solid rgba(91,124,255,.16);background:#fff;color:#334155;padding:8px 12px;border-radius:999px;font-size:12px;font-weight:900;cursor:pointer;transition:.2s ease}
.seo-tab.is-active{background:#1d4ed8;color:#fff;border-color:#1d4ed8;box-shadow:0 8px 20px rgba(29,78,216,.18)}
/*.seo-tab:hover{transform:translateY(-1px)}*/

.post-side__section{padding:18px;border:1px solid var(--border);border-radius:20px;background:#fff}
.post-side__ad-slot{min-height:260px;border:1px dashed rgba(91,124,255,.28);border-radius:18px;background:linear-gradient(135deg, rgba(91,124,255,.06), rgba(34,197,94,.05));display:grid;place-items:center;margin-top:14px;font-weight:900;color:#64748b}

.posts-sidebar__summary + .posts-sidebar__chips { padding-top: 16px; border-top: 1px solid rgba(148,163,184,.16); }
.post-side__ad-slot--placeholder { min-height: 240px; text-align: center; font-size: 14px; line-height: 1.7; }
.post-side__ad-slot--placeholder span { display: inline-block; max-width: 180px; }

.post-side__title{margin:0;font-size:20px;line-height:1.25;font-weight:900;color:#111827;}
.post-side__popular-list{list-style:none;margin:16px 0 0;padding:0;display:grid;gap:12px}
.post-side__popular-link{display:grid;grid-template-columns:28px minmax(0,1fr);gap:10px;align-items:start;word-break:keep-all}
.post-side__popular-rank{display:inline-grid;place-items:center;width:28px;height:28px;border-radius:999px;background:#333;color:#fff;font-size:12px;font-weight:900}
.post-side__popular-text{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;line-height:1.55;color:#1e293b;font-weight:400;font-size:15px;}
.post-side__extra{min-height:280px}

.ad-settings-box{margin-top:4px}
.ad-toggle-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.ad-toggle-item{display:flex;align-items:center;gap:8px;padding:10px 12px;border:1px solid var(--border);border-radius:14px;background:#fff;font-size:14px;font-weight:700}
.ad-toggle-item input{inline-size:16px;block-size:16px}
@media (max-width:720px){.ad-toggle-grid{grid-template-columns:1fr}}

.post-ad{margin:28px 0;padding:0;border:1px solid var(--border);border-radius:18px;background:#fff;overflow:hidden;contain:layout style paint}
.post-ad--inline{min-height:320px}
.post-ad--sidebar{min-height:320px}
.post-ad__slot{width:100%;min-height:inherit;display:block}
.post-ad__skeleton{min-height:inherit;display:grid;place-items:center;padding:18px;background:linear-gradient(135deg, rgba(91,124,255,.05), rgba(34,197,94,.04));color:#64748b}
.post-ad__skeleton-label{font-size:13px;font-weight:800;letter-spacing:-.02em}
.post-ad--placeholder{display:grid;gap:8px;place-items:center;text-align:center;background:rgba(91,124,255,.04);border-style:dashed;min-height:150px;padding:16px}
.post-ad__placeholder-title{font-weight:900;color:var(--ink)}
.post-side__ad .post-ad{margin-top:12px;margin-bottom:0}
@media (max-width:720px){.post-ad--inline,.post-ad--sidebar{min-height:280px}}


.btn--sm{padding:8px 12px;font-size:12px;border-radius:999px}
.btn--danger{border-color:rgba(220,38,38,.18);background:rgba(220,38,38,.08);color:#b91c1c}
/*.btn--danger:hover{background:rgba(220,38,38,.14)}*/
.post-admin-actions .small{white-space:nowrap}


.toc-toolbar{display:flex;gap:10px;align-items:center;justify-content:space-between;flex-wrap:wrap;margin:4px 0 0}
.toc-toolbar__controls{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.toc-toolbar__controls--checkbox{gap:12px}
.toc-toolbar .input{width:auto;min-width:180px}
.checkbox-chip{display:inline-flex;align-items:center;gap:8px;padding:10px 14px;border:1px solid var(--border);border-radius:999px;background:#fff;cursor:pointer;font-weight:700;color:#111827}
.checkbox-chip input{margin:0;width:16px;height:16px}
.checkbox-chip:has(input:checked){border-color:#5B7CFF;background:#eef2ff;color:#1e3a8a}
.toc-help{margin-top:8px}
.post-toc{border:1px solid #eee;border-radius:24px;margin:30px 0;overflow:hidden}
.post-toc__summary{list-style:none;display:flex;align-items:center;justify-content:space-between;gap:16px;padding:18px 20px;cursor:pointer}
.post-toc__summary::-webkit-details-marker{display:none}
.post-toc__summary::marker{display:none}
.post-toc__summary-main{display:flex;align-items:center;min-width:0}
.post-toc__title{font-size:19px;font-weight:900;letter-spacing:-.03em;color:#0f172a}
.post-toc__summary-meta{display:inline-flex;align-items:center;gap:8px;font-size:0;font-weight:800;color:#475569;white-space:nowrap}
.post-toc__summary-meta::after{content:"접기";display:inline-flex;align-items:center;justify-content:center;min-width:64px;padding:8px 12px;border-radius:999px;background:#333;color:#fff;font-size:13px;transition:.2s ease}
.post-toc:not([open]) .post-toc__summary-meta::after{content:"펼치기"}
/*.post-toc__summary:hover .post-toc__summary-meta::after{transform:translateY(-1px)}*/
.post-toc__body{padding:10px;border-top:1px solid rgba(148,163,184,.16)}
.post-toc__list{margin:0 !important;padding:14px 0 0;list-style:none;display:grid;gap:0;}
.post-toc__list li{margin:0 !important;}
.post-toc__item a{display:grid;grid-template-columns:auto minmax(0,1fr);/*gap:10px;*/align-items:start;padding:10px 12px;border-radius:16px;color:#1e3a8a;text-decoration:none;line-height:1.7;transition:.18s ease}
/*.post-toc__item a:hover{background:rgba(91,124,255,.08);text-decoration:none}*/
.post-toc__index{font-weight:900;color:#333;min-width:20px}
.post-toc__text{min-width:0;color:#1e293b}
.post-toc__item--h3{margin-left:18px;font-size:15px}
.post-toc__item--h3 .post-toc__index{color:#64748b}
.preview-toc-placeholder{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:16px 18px;border:1px dashed #9db4ff;border-radius:18px;background:#f8fbff;color:#1e3a8a;margin:8px 0 24px;font-weight:700}
.preview-toc-placeholder__meta{font-size:13px;font-weight:600;color:#64748b}
.post-body h2,.post-body h3{scroll-margin-top:25px}
@media (max-width:768px){.toc-toolbar{align-items:flex-start}.toc-toolbar .input{min-width:150px;width:100%}.toc-toolbar__controls{width:100%}.post-toc__summary{padding:16px}.post-toc__body{padding:15px;}.post-toc__summary-meta::after{min-width:58px;padding:7px 10px;font-size:12px}.post-body h2,.post-body h3{scroll-margin-top:25px}}


.editor-status-field { width: 100%; max-width: 240px; }
.editor-meta-grid { align-items: end; gap: 18px; }
.editor-field-group { display: flex; flex-direction: column; justify-content: flex-end; }
.form-card .notice { margin-top: 2px; }
.form-card textarea.input { line-height: 1.7; }
.label-row--between { justify-content: space-between; align-items: center; gap: 12px; flex-wrap: nowrap; }
.label-row--between .small { flex: 1 1 auto; min-width: 0; }
.btn--small { padding: 8px 12px; font-size: 13px; min-height: 38px; flex: 0 0 auto; white-space: nowrap; }
.modal-backdrop { position: fixed; inset: 0; background: rgba(15, 23, 42, 0.42); z-index: 80; }
.modal-sheet { position: fixed; top: 50%; left: 50%; width: min(680px, calc(100vw - 32px)); max-height: min(80vh, 760px); overflow: hidden; transform: translate(-50%, -50%) scale(0.98); opacity: 0; pointer-events: none; transition: opacity 0.18s ease, transform 0.18s ease; background: #fff; border-radius: 24px; box-shadow: 0 30px 70px rgba(15, 23, 42, 0.22); border: 1px solid rgba(148, 163, 184, 0.24); z-index: 81; }
.modal-sheet.is-open { opacity: 1; pointer-events: auto; transform: translate(-50%, -50%) scale(1); }
.modal-sheet__header, .modal-sheet__body { padding: 22px 24px; }
.modal-sheet__header { display: flex; justify-content: space-between; align-items: flex-start; gap: 16px; }
.modal-sheet__body { overflow: auto; max-height: calc(80vh - 90px); }
.category-manager__create { display: flex; flex-direction: column; gap: 10px; }
.category-manager__create-row { display: grid; grid-template-columns: 1fr auto; gap: 10px; }
.category-manager__list { display: flex; flex-direction: column; gap: 12px; }
.category-manager__item { display: grid; grid-template-columns: 1fr auto; gap: 12px; padding: 14px 16px; border: 1px solid rgba(148, 163, 184, 0.2); border-radius: 18px; background: #f8fafc; }
.category-manager__name { display: flex; align-items: center; min-height: 42px; font-weight: 600; }
.category-manager__actions { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 8px; }
.category-manager__empty { padding: 18px; border-radius: 16px; background: #f8fafc; border: 1px dashed rgba(148, 163, 184, 0.45); }

@media (max-width: 768px) {
  .editor-status-field { width: 100%; max-width: none; }
  .editor-top-controls{grid-template-columns:1fr;gap:12px}
  .editor-meta-grid { gap: 16px; }
  .label-row--between { flex-wrap: wrap; align-items: flex-start; }
  .modal-sheet { width: calc(100vw - 20px); border-radius: 20px; }
  .modal-sheet__header, .modal-sheet__body { padding: 18px; }
  .category-manager__create-row, .category-manager__item { grid-template-columns: 1fr; }
  .category-manager__actions { justify-content: flex-start; }
}

.inline-image-box { display: flex; flex-direction: column; gap: 14px; }
.inline-image-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; margin-top: 4px; }
.inline-image-card { border: 1px solid var(--line); border-radius: 18px; background: #fff; padding: 16px; display: flex; flex-direction: column; gap: 12px; }
.inline-image-fields { display: grid; gap: 12px; }
.inline-image-fields[hidden] { display: none !important; }
.preview-inline-image { margin: 22px 0; }
.preview-inline-image img { width: 100%; height: auto; display: block; border-radius: 18px; border: 1px solid rgba(91, 124, 255, 0.14); }
.preview-inline-image figcaption { margin-top: 10px; color: var(--muted); font-size: 14px; line-height: 1.6; }

@media (max-width: 900px) {
  .inline-image-grid { grid-template-columns: 1fr; }
}

.post-inline-image { margin: 26px 0; }
.post-inline-image__img { width: 100%; height: auto; display: block; border-radius: 20px; border: 1px solid rgba(91, 124, 255, 0.16); box-shadow: 0 18px 38px rgba(15, 23, 42, 0.08); }
.post-inline-image__caption { margin-top: 10px; color: var(--muted); font-size: 14px; line-height: 1.7; text-align: center; }

@media (max-width:1100px){.posts-layout{grid-template-columns:minmax(0,1fr) 290px}.post-card--row{grid-template-columns:minmax(220px,280px) minmax(0,1fr)}.post-card__title{font-size:24px}}
@media (max-width:860px){.posts-layout{grid-template-columns:1fr}.posts-sidebar{position:static;top:auto}.posts-sidebar__summary{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (max-width:720px){.post-card--row{grid-template-columns:1fr;padding:16px}.post-card__thumb--row,.post-card__thumb-placeholder{min-height:200px}.post-card__title{font-size:22px}.posts-sidebar__summary{grid-template-columns:1fr 1fr 1fr}}
@media (max-width:540px){.posts-sidebar__summary{grid-template-columns:1fr}.post-meta--row{align-items:center}.post-card__summary{font-size:14px}}


.posts-main{min-width:0}

.post-card--skeleton{pointer-events:none;user-select:none}
.post-card--skeleton .post-card__body{display:grid;gap:16px}
.skeleton-stack{display:grid;gap:10px}
.skeleton-box{position:relative;display:block;overflow:hidden;border-radius:14px;background:#e8eef7}
.skeleton-box::after{content:"";position:absolute;inset:0;transform:translateX(-100%);background:linear-gradient(90deg, rgba(255,255,255,0) 0%, rgba(255,255,255,.72) 50%, rgba(255,255,255,0) 100%);animation:skeleton-shimmer 1.35s ease-in-out infinite}
@keyframes skeleton-shimmer{100%{transform:translateX(100%)}}
.skeleton-box--media{width:100%;height:100%;min-height:220px;border-radius:20px}
.skeleton-box--chip{width:88px;height:30px;border-radius:999px}
.skeleton-box--chip-short{width:62px}
.skeleton-box--date{width:88px;height:20px;margin-left:auto}
.skeleton-box--title{height:28px;width:min(82%,520px)}
.skeleton-box--text{height:17px;width:100%}
.skeleton-box--text-short{width:72%}
.skeleton-box--button{width:104px;height:42px;border-radius:999px}
.skeleton-box--button-muted{width:84px}
.skeleton-box--summary-number{width:56px;height:32px;border-radius:12px}
.skeleton-box--summary-label{width:72px;height:15px;border-radius:999px}
.posts-summary-card--skeleton{gap:10px}
.posts-sidebar__chip--skeleton{display:inline-block;width:92px;height:34px;border-radius:999px;border:0;padding:0;background:#e8eef7;color:transparent}
.post-side__popular-link--skeleton{display:grid;grid-template-columns:28px minmax(0,1fr);gap:10px;align-items:center;padding:0}
.post-side__popular-rank--skeleton{background:#eef2ff;color:#94a3b8}
.skeleton-box--popular{height:18px;width:100%;border-radius:999px}
@media (max-width:920px){.skeleton-box--media{min-height:190px}}
@media (max-width:720px){.skeleton-box--media{min-height:180px}.skeleton-box--title{width:92%}.skeleton-box--button{width:96px;height:40px}}


.posts-load-more{display:flex;flex-direction:column;align-items:center;gap:12px;margin-top:18px}
.posts-load-more__btn{min-width:220px;justify-content:center}
.posts-skeleton-chunk{display:grid;gap:16px;margin-top:16px}

/* Affiliate link UI */
.affiliate-links-box { margin-top: 18px; }
.affiliate-links-box__head { display:flex; justify-content:space-between; align-items:center; gap:12px; flex-wrap:wrap; }
.affiliate-items-stack { display:grid; gap:14px; margin-top:14px; }
.affiliate-item-card { border:1px solid rgba(15,23,42,.08); border-radius:18px; background:#fff; padding:16px; box-shadow:0 8px 24px rgba(15,23,42,.04); }
.affiliate-item-card__top { display:flex; justify-content:space-between; align-items:center; gap:12px; margin-bottom:12px; }
.affiliate-item-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px 14px; }
.affiliate-links-box__actions { display:flex; align-items:center; gap:12px; margin-top:14px; flex-wrap:wrap; }
.preview-affiliate-card, .post-affiliate-card { display:grid; grid-template-columns:168px minmax(0,1fr); gap:20px; align-items:stretch; border:1px solid rgba(15,23,42,.08); border-radius:24px; padding:18px; background:linear-gradient(180deg,#ffffff 0%,#f8fbff 100%); box-shadow:0 18px 38px rgba(15,23,42,.08); margin:22px 0; overflow:hidden; position:relative; }
.preview-affiliate-card::before, .post-affiliate-card::before { content:"제휴 상품"; position:absolute; top:14px; right:14px; display:inline-flex; align-items:center; min-height:26px; padding:0 10px; border-radius:999px; background:#eef2ff; color:#1d4ed8; font-size:12px; font-weight:800; letter-spacing:-0.01em; }
.preview-affiliate-card__media, .post-affiliate-card__media { width:100%; align-self:stretch; }
.preview-affiliate-card__media img, .post-affiliate-card__img { width:100%; height:100%; min-height:168px; aspect-ratio:1/1; object-fit:cover; border-radius:18px; display:block; background:#f3f6fb; box-shadow:inset 0 0 0 1px rgba(15,23,42,.04); }
.preview-affiliate-card__placeholder, .post-affiliate-card__placeholder { height:100%; min-height:168px; display:grid; place-items:center; border-radius:18px; background:linear-gradient(135deg,#eef4ff,#f8fafc); color:#64748b; font-size:13px; border:1px dashed rgba(100,116,139,.25); }
.preview-affiliate-card__content, .post-affiliate-card__content { display:grid; gap:12px; align-content:center; }
.preview-affiliate-card__title, .post-affiliate-card__title { margin:0; font-size:21px; line-height:1.4; font-weight:800; letter-spacing:-0.02em; color:#0f172a; }
.preview-affiliate-card__prices, .post-affiliate-card__prices { display:flex; flex-wrap:wrap; gap:10px 12px; align-items:center; }
.preview-affiliate-card__price-label { color:#64748b; font-size:13px; }
.post-affiliate-card__current { color:#64748b; font-weight:700; text-decoration:line-through; text-decoration-thickness:1px; }
.preview-affiliate-card__sale, .post-affiliate-card__sale { color:#dc2626; font-size:22px; font-weight:900; letter-spacing:-0.03em; }
.preview-affiliate-card__discount, .post-affiliate-card__discount { display:inline-flex; align-items:center; padding:6px 10px; border-radius:999px; background:#fff1f2; color:#be123c; font-size:12px; font-weight:800; border:1px solid rgba(244,63,94,.15); }
.preview-affiliate-card__button, .post-affiliate-card__button { display:inline-flex; align-items:center; justify-content:center; min-height:48px; padding:0 18px; border-radius:14px; background:linear-gradient(135deg,#0f172a,#1e293b); color:#fff; text-decoration:none; font-weight:800; box-shadow:0 12px 22px rgba(15,23,42,.18); }
/*.preview-affiliate-card__button:hover, .post-affiliate-card__button:hover { transform:translateY(-1px); }*/
.preview-affiliate-card__button.is-disabled, .post-affiliate-card__button.is-disabled { opacity:.5; pointer-events:none; }
.breadcrumb.small ol { display:flex; flex-wrap:wrap; gap:25px; align-items:center; list-style:none; margin:0; padding:0; }
.breadcrumb.small li { position:relative; }
.breadcrumb.small li + li::before { content:">"; position:absolute; left:-16px; top:50%; transform:translateY(-50%); color:#94a3b8; font-weight:700; }
@media (max-width: 768px) { .breadcrumb.small ol { gap:16px; } .breadcrumb.small { margin:5px 12px !important; font-size:12px; line-height:1.35; } .breadcrumb.small li + li::before { left:-11px; } .breadcrumb.small li[aria-current="page"] { display:none; } }
@media (max-width: 900px) { .affiliate-item-grid { grid-template-columns:1fr; } }
@media (max-width: 720px) { .preview-affiliate-card, .post-affiliate-card { grid-template-columns:110px minmax(0,1fr); gap:14px; padding:14px; border-radius:20px; } .preview-affiliate-card::before, .post-affiliate-card::before { top:10px; right:10px; font-size:11px; min-height:24px; } .preview-affiliate-card__media img, .post-affiliate-card__img, .preview-affiliate-card__placeholder, .post-affiliate-card__placeholder { min-height:110px; border-radius:14px; } .preview-affiliate-card__title, .post-affiliate-card__title { font-size:16px; padding-right:54px; } .preview-affiliate-card__sale, .post-affiliate-card__sale { font-size:18px; } .preview-affiliate-card__button, .post-affiliate-card__button { min-height:42px; width:100%; } }

.admin-auth-page { min-height: calc(100vh - 180px); display: grid; place-items: center; }
.admin-auth-card { width: 100%; max-width: 520px; display: flex; flex-direction: column; gap: 18px; }
.admin-auth-card__head { display: flex; flex-direction: column; gap: 10px; }
.admin-auth-form { display: flex; flex-direction: column; gap: 16px; }

.topbar-admin-badge{display:inline-flex;align-items:center;padding:4px 8px;border-radius:999px;background:rgba(17,24,39,.08);color:#374151;font-size:11px;font-weight:700;line-height:1;white-space:nowrap}
.nav__logout{border:0;background:#111827;color:#fff;border-radius:999px;padding:8px 12px;font:inherit;font-size:13px;font-weight:700;cursor:pointer}
/*.nav__logout:hover{background:#1f2937}*/
.posts-sidebar__dashboard-title{display:flex;align-items:center;gap:8px}
.posts-sidebar__dashboard-title::after{content:'→';font-size:14px;color:#6b7280}
[hidden]{display:none !important}
@media (max-width:768px){.topbar-admin-badge{font-size:10px;padding:3px 7px}.nav__logout{width:100%;justify-content:center}}

[data-dashboard-link]{cursor:pointer}


.dashboard-shell{padding-top:16px;padding-bottom:32px}
.dashboard-hero{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(320px,.8fr);gap:20px;align-items:stretch}
.dashboard-stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.dashboard-stat{border:1px solid var(--line);border-radius:18px;background:linear-gradient(180deg,#fff 0%,#f8fafc 100%);padding:16px 14px;box-shadow:0 8px 20px rgba(15,23,42,.05)}
.dashboard-stat__label{font-size:13px;color:#64748b;margin-bottom:8px}
.dashboard-stat__value{font-size:32px;line-height:1;font-weight:800;color:#111827}
.dashboard-grid{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(300px,.8fr);gap:16px;align-items:start}
.dashboard-side{display:grid;gap:16px}
.dashboard-panel{padding:18px}
.dashboard-panel__head{display:flex;align-items:flex-end;justify-content:space-between;gap:12px;margin-bottom:12px}
.dashboard-popular,.dashboard-recent{list-style:none;margin:0;padding:0}
.dashboard-popular__item,.dashboard-recent__item{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;padding:12px 0;border-top:1px solid #eef2f7}
.dashboard-popular__item:first-child,.dashboard-recent__item:first-child{border-top:0;padding-top:0}
.dashboard-popular__item a,.dashboard-recent__item a{color:#0f172a;text-decoration:none;font-weight:600;line-height:1.5;font-size:15px}
.dashboard-popular__main{min-width:0;display:grid;gap:6px}
.dashboard-popular__meta{font-size:12px;color:#64748b;line-height:1.45}
/*.dashboard-popular__item a:hover,.dashboard-recent__item a:hover{text-decoration:underline}*/
.dashboard-popular__views,.dashboard-recent__meta{font-size:12px;color:#64748b;white-space:nowrap;flex-shrink:0}
.dashboard-quick-links{display:grid;gap:10px}
.dashboard-quick-link{display:flex;align-items:center;justify-content:space-between;padding:12px 14px;border:1px solid #e5e7eb;border-radius:14px;background:#fff;color:#111827;text-decoration:none;font-weight:600}
.dashboard-quick-link::after{content:'→';font-size:14px;color:#94a3b8}
/*.dashboard-quick-link:hover{background:#f8fafc}*/
.dashboard-category-chips{display:flex;flex-wrap:wrap;gap:8px}
.dashboard-category-chips .chip{display:inline-flex;align-items:center;gap:6px;padding:8px 10px;border-radius:999px;background:#f8fafc;border:1px solid #e2e8f0;color:#334155}
@media (max-width: 980px){.dashboard-hero,.dashboard-grid{grid-template-columns:1fr}.dashboard-stats{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (max-width: 640px){.dashboard-stats{grid-template-columns:1fr}.dashboard-panel__head{align-items:flex-start;flex-direction:column}.dashboard-popular__item,.dashboard-recent__item{flex-direction:column}.dashboard-popular__views,.dashboard-recent__meta{white-space:normal}}


.topbar--editorial{position:sticky;top:0;z-index:50;background:rgba(255,255,255,.96);backdrop-filter:blur(14px);border-bottom:1px solid rgba(15,23,42,.06)}
.topbar-categories__list{display:flex;flex-wrap:wrap;align-items:center;gap:18px;padding-right:20px}
.topbar-categories__list--desktop{justify-content:center}
.topbar-categories__chip{display:inline-flex;align-items:center;gap:6px;padding:2px 0;border-radius:0;background:transparent;border:0;color:#7c8594;font-size:12px;line-height:1.2;letter-spacing:.04em;text-transform:lowercase;font-weight:500;text-decoration:none;position:relative;transition:color .18s ease}
/*.topbar-categories__chip:hover{transform:none;background:transparent;border-color:transparent;color:#111827}*/
.topbar-categories__chip::after{content:'';position:absolute;left:0;right:0;bottom:-5px;height:1px;background:#111827;transform:scaleX(0);transform-origin:center;transition:transform .18s ease}
/*.topbar-categories__chip:hover::after,.topbar-categories__chip[aria-current="true"]::after{transform:scaleX(1)}*/
.topbar-categories__chip[aria-current="true"]{color:#111827}
.topbar-categories__chip span{display:none}
.topbar-categories__chip--skeleton{width:72px;height:14px;border-radius:999px;background:#e5e7eb}
.mobile-site-menu{position:fixed;inset:0;z-index:70;background:rgba(15,23,42,.36);backdrop-filter:blur(6px)}
.mobile-site-menu__panel{width:min(88vw,360px);height:100%;background:#fff;padding:22px 18px 24px;box-shadow:20px 0 50px rgba(15,23,42,.12);overflow:auto}
.mobile-site-menu__head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:18px}
.mobile-site-menu__head strong{font-size:15px;font-weight:800;color:#111827}
.mobile-site-menu__close{border:0;background:transparent;color:#6b7280;font-weight:700;padding:0;cursor:pointer}
.mobile-site-menu__nav{display:grid;gap:4px;margin-bottom:20px}
.mobile-site-menu__nav a{display:block;padding:12px 0;border-bottom:1px solid #f1f5f9;color:#111827;text-decoration:none;font-weight:700}
.mobile-site-menu__nav a[aria-current="page"]{color:#111827}
.mobile-site-menu__section{display:grid;gap:12px}
.mobile-site-menu__title{font-size:12px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:#6b7280}
.topbar-categories__list--mobile{display:grid;gap:10px}
.topbar-categories__list--mobile .topbar-categories__chip{display:flex;justify-content:space-between;padding:10px 0;border-bottom:1px solid #f8fafc;color:#111827;text-transform:none;font-size:14px;font-weight:600}
.topbar-categories__list--mobile .topbar-categories__chip::after{display:none}
.topbar-categories__list--mobile .topbar-categories__chip span{display:inline;color:#94a3b8;font-size:12px}
.posts-home-hero{position:relative;overflow:hidden;padding:34px 32px;border-radius:28px;background:linear-gradient(135deg,#f8fbff 0%,#eef4ff 44%,#ffffff 100%);border:1px solid rgba(91,124,255,.10);box-shadow:0 24px 50px rgba(91,124,255,.08)}
.posts-home-hero__content{max-width:760px;display:flex;flex-direction:column;gap:12px}
.posts-home-hero__eyebrow{margin:0;font-size:12px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:#4f46e5}
.posts-home-hero__title{margin:0;font-size:clamp(30px,4vw,44px);line-height:1.15;font-weight:900;color:#0f172a}
.posts-home-hero__desc{margin:0;font-size:16px;line-height:1.7;color:#475569}
.posts-layout--clean{align-items:start}
.posts-sidebar--simple{gap:18px}
.posts-sidebar__ad-shell,.posts-sidebar__popular-shell{padding:18px;border:1px solid var(--border);border-radius:22px;background:#fff;box-shadow:0 18px 35px rgba(15,23,42,.04)}
.posts-sidebar__popular-shell .h2{margin:0 0 20px 0;font-size:20px}
@media (max-width:768px){.posts-home-hero{padding:26px 20px;border-radius:24px}.posts-home-hero__desc{font-size:15px}.topbar-categories__list{padding-left:18px;padding-right:18px}}



.post-body a[href^="/"] { color: #333; text-decoration: none;}
.post-body a[href^="/"]:focus-visible { text-decoration: underline; text-underline-offset: 3px; outline: none; }
.post-body .table-wrap, .preview-body .table-wrap { width: 100%; overflow-x: auto; margin: 22px 0; border: 1px solid var(--border); border-radius: 18px; background: #fff; box-shadow: 0 10px 28px rgba(15,23,42,.04); }
.post-body table, .preview-body table { width: 100%; border-collapse: separate; border-spacing: 0; margin: 22px 0; font-size: 14px; line-height: 1.7; color: #1e293b; background: #fff; border: 1px solid var(--border); border-radius: 18px; overflow: hidden; box-shadow: 0 10px 28px rgba(15,23,42,.04); }
.post-body .table-wrap table, .preview-body .table-wrap table { margin: 0; border: 0; border-radius: 0; box-shadow: none; }
.post-body table thead th, .preview-body table thead th { background: #f8fafc; color: #0f172a; font-weight: 800; text-align: left; border-bottom: 1px solid var(--border); }
.post-body table th, .post-body table td, .preview-body table th, .preview-body table td { padding: 14px 16px; vertical-align: top; }
.post-body table tbody tr + tr td, .preview-body table tbody tr + tr td { border-top: 1px solid #eef2f7; }
.post-body table tbody tr:nth-child(even), .preview-body table tbody tr:nth-child(even) { background: #fcfdff; }

@media (max-width: 768px) {
  .post-body table, .preview-body table { font-size: 13px; }
  .post-body table th, .post-body table td, .preview-body table th, .preview-body table td { padding: 12px 14px; }
}

.posts-layout--home-top{margin-top:20px}
.posts-error{color:#b00020}
.posts-popular-list{margin-top:14px}
.posts-loading-text{display:none}
.row--chips{gap:8px;flex-wrap:wrap}
.row--top-gap{margin-top:14px}
.row--top-gap-lg{margin-top:14px}
.post-admin-actions--wrap{flex-wrap:wrap}
.post-card--row .post-admin-actions--wrap{width:100%;align-items:center;gap:8px}
.post-card--row .post-admin-actions__controls{margin-left:auto;display:inline-flex;align-items:center;justify-content:flex-end;gap:6px}
.post-card--row .post-admin-actions__controls > .btn{padding:5px 9px;font-size:12px;line-height:1.15;border-radius:999px;min-height:28px}
.post-admin-actions--meta{gap:8px;flex-wrap:wrap;align-items:center}
.badge--draft{background:rgba(245,158,11,.14);color:#92400e;border-color:rgba(245,158,11,.22)}
.adsbygoogle--block{display:block}
.breadcrumb--post{margin:16px 20px}
.post-section-divider{border-top:1px solid var(--border)}
.post-section-divider--tags{margin-top:32px;padding-top:24px}
.post-section-divider--faq,.post-section-divider--related{margin-top:36px;padding-top:28px}
.post-section-header{justify-content:space-between;align-items:flex-end;flex-wrap:wrap}
.post-section-header--compact{gap:10px}
.post-section-header--related{gap:12px}
.post-section-title{margin:0}
.post-related__list{display:grid;gap:10px;margin-top:16px}
.post-related__list li{margin:0 !important;}
.post-related-link{display:inline-flex;align-items:flex-start;text-decoration:none;line-height:1.55}
.post-faq h3{margin-top:7px}
.post-faq__list{display:grid;gap:14px;margin-top:14px}
.post-faq__list p{margin:0;}
.post-faq__question{margin:0 0 10px}
.table-cell--left{text-align:left}
.table-cell--center{text-align:center}
.table-cell--right{text-align:right}
@media (max-width: 768px) {.post-faq__list{gap:0;}}

.post-author-card{display:flex;align-items:center;gap:10px;padding:12px 0 4px}
.post-author-card__avatar{width:40px;height:40px;border-radius:999px;display:block;object-fit:cover;flex-shrink:0;border:1px solid rgba(15,23,42,.08);background:#fff}
.post-author-card__body{min-width:0;display:grid;}
.post-author-card__name{font-size:16px;font-weight:500;line-height:1.2;color:#0f172a}
.post-author-card__meta{font-size:14px;color:#64748b;line-height:1.5}
.post-related__layout{display:grid;grid-template-columns:minmax(0,1fr) auto;grid-template-areas:"header action" "list list";gap:16px 20px;align-items:end}
.post-section-header--related{grid-area:header}
.post-related__action{grid-area:action;display:flex;justify-content:flex-end;align-self:end}
.post-related__list{grid-area:list}
@media (max-width:768px){.breadcrumb--post{margin:0 12px !important}}
@media (max-width:720px){.post-author-card{padding-top:15px}.post-author-card__name{font-size:18px}.post-author-card__meta{font-size:13px}.post-related__layout{grid-template-columns:1fr;grid-template-areas:"header" "list" "action";gap:14px}.post-related__action{justify-content:stretch}.post-related__more-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;width:100%;min-height:48px;padding:0 16px;border-radius:16px;border:1px solid rgba(15,23,42,.08);background:#fff;color:#0f172a;font-weight:800;box-shadow:0 10px 24px rgba(15,23,42,.06)}.post-related__more-btn::after{content:"→";font-size:15px;line-height:1;transform:translateY(-1px)}.post-related__more-btn:hover{transform:translateY(-1px);box-shadow:0 14px 28px rgba(15,23,42,.1)}.post-related__more-btn:active{transform:none;box-shadow:0 8px 18px rgba(15,23,42,.08)}}

.editor-top-controls{display:grid;grid-template-columns:minmax(180px,240px) minmax(240px,1fr);gap:16px;align-items:end}
.editor-category-field{width:100%}
.editor-category-control{display:flex;gap:8px;align-items:center}
.editor-category-control .input{flex:1}
.seo-check__summary-list{margin:0;padding-left:18px;display:flex;flex-direction:column;gap:6px}
.seo-check__summary-list li{color:#334155;line-height:1.5}


/* SEO checklist detail refinements */
.seo-check__subsection{
  margin-top:12px;
}
.seo-check__subheading{
  font-size:13px;
  font-weight:800;
  color:#334155;
  margin:0 0 8px;
}
.seo-check__summary-list--nested{
  margin-top:0;
}

/* Wacky Travel Specific Reset & Variables */
.ww-wrapper {
  --ww-bg: #ffffff;
  --ww-text: #000000;
  --ww-text-sub: #666666;
  --ww-line-light: #eeeeee;
  --ww-spacing: clamp(60px, 10vw, 150px);
  background-color: var(--ww-bg);
  color: var(--ww-text);
  font-family: 'Noto Sans KR', sans-serif;
  line-height: 1.6;
  word-break: keep-all;
  -webkit-font-smoothing: antialiased;
}

.ww-container { width: min(1200px, 90%); margin: 0 auto; }

/* Scroll Animation */
.ww-reveal { opacity: 0; transform: translateY(20px); transition: all 0.6s ease-out; }
.ww-reveal.ww-active { opacity: 1; transform: translateY(0); }

/* Hero Section */
.ww-hero { 
  min-height: 100vh; 
  display: flex; 
  flex-direction: column;
  justify-content: center; 
  border-bottom: 1px solid var(--ww-text); 
}
.ww-hero-title { 
  font-family: 'Darker Grotesque', sans-serif;
  font-size: clamp(4rem, 16vw, 14rem); 
  line-height: 0.85; letter-spacing: -0.07em; font-weight: 900; 
  text-transform: uppercase;
  margin:0;
}
.ww-hero-title span { display: block; }
.ww-hero-flex { margin-top: 60px; display: flex; justify-content: flex-end; }
.ww-hero-desc { max-width: 450px; font-size: 1.1rem; color: var(--ww-text-sub); font-weight: 400; }

/* Common Section Styles */
.ww-section { padding: var(--ww-spacing) 0; }
.ww-section-border { border-bottom: 1px solid var(--ww-line-light); }

.ww-label-tag { 
    display: inline-block; font-size: 0.75rem; font-weight: 900; 
    text-transform: uppercase; margin-bottom: 40px; letter-spacing: 0.1em;
    border: 1px solid var(--ww-text); padding: 4px 12px; border-radius: 50px;
}

.ww-split-grid { display: grid; grid-template-columns: 1.2fr 0.8fr; gap: 40px; }
.ww-big-text { font-size: clamp(1.8rem, 4vw, 3.2rem); font-weight: 900; line-height: 1.2; letter-spacing: -0.04em; }
.ww-big-text strong { color: var(--ww-text); text-decoration: underline; text-underline-offset: 8px; }

/* Library List */
.ww-topic-list { margin-top: 40px; border-top: 1px solid var(--ww-text); }
.ww-topic-row { 
    display: grid; grid-template-columns: 80px 1.5fr 1fr; 
    padding: 50px 0; border-bottom: 1px solid var(--ww-line-light);
}
.ww-topic-num { font-family: 'Darker Grotesque', sans-serif; font-size: 1.5rem; font-weight: 900; }
.ww-topic-title { font-family: 'Darker Grotesque', sans-serif; font-size: 2.5rem; font-weight: 900; letter-spacing: -0.04em; text-transform: uppercase; }
.ww-topic-desc { font-size: 1.05rem; color: var(--ww-text-sub); align-self: center; }

/* Method Cards */
.ww-value-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 40px; margin-top: 60px; }
.ww-value-card { border-left: 1px solid var(--ww-text); padding-left: 25px; }
.ww-value-card h3 { font-size: 1.5rem; margin-bottom: 20px; font-weight: 900; }
.ww-value-card p { font-size: 1rem; color: var(--ww-text-sub); line-height: 1.7; }

/* Quote Wrap */
.ww-quote-wrap { background: var(--ww-text); color: var(--ww-bg); text-align: center; padding: 120px 0; }
.ww-quote-text { font-size: clamp(2.5rem, 6vw, 6rem); font-weight: 900; line-height: 1.1; letter-spacing: -0.05em; }

/* CTA Section */
.ww-cta { text-align: center; padding: 150px 0; }
.ww-big-btn { 
    font-family: 'Darker Grotesque', sans-serif; font-size: clamp(3rem, 10vw, 8rem); 
    font-weight: 900; letter-spacing: -0.05em; text-decoration: none; 
    color: var(--ww-text); display: inline-block; line-height: 0.9;
}
.ww-cta-desc { margin-top: 50px; color: var(--ww-text-sub); max-width: 600px; margin-inline: auto; font-size: 1rem; }

/* Footer */
.ww-footer { padding: 80px 0 40px; display: flex; justify-content: space-between; font-size: 0.8rem; color: #999; border-top: 1px solid var(--ww-line-light); }

/* Mobile Responsive */
@media (max-width: 900px) {
  .ww-hero { padding: 80px 0; min-height: auto; }
  .ww-split-grid, .ww-value-grid { grid-template-columns: 1fr; gap: 30px; }
  .ww-topic-row { grid-template-columns: 1fr; gap: 10px; padding: 40px 0; }
  .ww-hero-title { font-size: 20vw; }
  .ww-hero-flex { justify-content: flex-start; margin-top: 40px; }
  .ww-topic-title { font-size: 1.8rem; }
  .ww-value-card { border-left: none; border-top: 1px solid var(--ww-text); padding-left: 0; padding-top: 20px; }
  .ww-footer { flex-direction: column; gap: 20px; text-align: center; }
}
/* PageSpeed: 사이드바 광고/인기글 영역의 높이를 미리 확보해 CLS를 줄입니다. */
.posts-sidebar__ad-shell{min-height:300px;contain:layout paint;}
.posts-sidebar__popular-shell{min-height:190px;contain:layout paint;}
.post-card__thumb img{aspect-ratio:16/9;}

/* =========================================================
   Article body readability UI - 0505 v1
   실제 발행 본문(.post-content)과 add/edit 미리보기(.preview-body)를 동일한 기준으로 정리
========================================================= */
.post-body .post-content,
.preview-body {
  max-width: 820px;
  margin: 0 auto;
  font-size: 16.5px;
  line-height: 1.9;
  color: #1f2937;
  word-break: keep-all;
  overflow-wrap: break-word;
  counter-reset: article-h2;
}

.post-body .post-content > p,
.preview-body > p {
  margin: 0 0 19px;
  line-height: 1.9;
  color: #1f2937;
  letter-spacing: -0.01em;
}

.post-body .post-content > p + p,
.preview-body > p + p {
  margin-top: 4px;
}

/* H2: 섹션 번호 배지형 제목 */
.post-body .post-content > h2,
.preview-body > h2 {
  counter-increment: article-h2;
  display: flex;
  align-items: center;
  gap: 16px;
  margin: 58px 0 24px;
  padding: 0 0 16px;
  border-bottom: 1px solid #e5e7eb;
  font-size: 28px;
  line-height: 1.35;
  font-weight: 900;
  letter-spacing: -0.045em;
  color: #111827;
  scroll-margin-top: 25px;
}

.post-body .post-content > h2:first-child,
.preview-body > h2:first-child {
  margin-top: 10px;
}

.post-body .post-content > h2::before,
.preview-body > h2::before {
  content: counter(article-h2, decimal-leading-zero);
  flex: 0 0 auto;
  min-width: 42px;
  height: 42px;
  padding: 0 12px;
  border-radius: 14px;
  background: #2f715f;
  color: #fff;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 15px;
  line-height: 1;
  font-weight: 900;
  letter-spacing: -0.02em;
  box-shadow: 0 8px 18px rgba(47, 113, 95, .18);
}

/* H3: 세부 주제 구분용 왼쪽 강조선 */
.post-body .post-content > h3,
.preview-body > h3 {
  margin: 38px 0 15px;
  padding: 0 0 0 15px;
  border-left: 4px solid #2f715f;
  font-size: 21px;
  line-height: 1.45;
  letter-spacing: -0.035em;
  font-weight: 900;
  color: #111827;
  scroll-margin-top: 25px;
}

/* H4: 체크 포인트/주의사항 구분 박스 */
.post-body .post-content > h4,
.preview-body > h4 {
  margin: 30px 0 13px;
  padding: 11px 15px;
  border-radius: 12px;
  background: #f5f7f6;
  border: 1px solid #e7ece9;
  font-size: 17px;
  line-height: 1.45;
  font-weight: 900;
  letter-spacing: -0.025em;
  color: #111827;
}

.post-body .post-content > h3 + p,
.preview-body > h3 + p,
.post-body .post-content > h4 + p,
.preview-body > h4 + p {
  margin-top: 6px;
}

/* 목록: 들여쓰기, 줄 간격, 블록 간격 개선 */
.post-body .post-content > ul,
.post-body .post-content > ol,
.preview-body > ul,
.preview-body > ol {
  margin: 16px 0 28px;
  padding-left: 27px;
  line-height: 1.85;
  color: #1f2937;
}

.post-body .post-content > ol,
.preview-body > ol {
  padding-left: 30px;
}

.post-body .post-content > ul li,
.post-body .post-content > ol li,
.preview-body > ul li,
.preview-body > ol li {
  margin: 9px 0;
  padding-left: 4px;
  line-height: 1.85;
}

.post-body .post-content > ul li::marker,
.post-body .post-content > ol li::marker,
.preview-body > ul li::marker,
.preview-body > ol li::marker {
  color: #2f715f;
  font-weight: 900;
}

/* 핵심 요약/주의 박스: 마크다운 > 인용문 활용 */
.post-body .post-content > blockquote,
.preview-body > blockquote {
  margin: 26px 0 30px;
  padding: 19px 21px;
  border-left: 5px solid #2f715f;
  border-radius: 16px;
  background: #f4f8f6;
  color: #1f2937;
  box-shadow: none;
}

.post-body .post-content > blockquote p,
.preview-body > blockquote p {
  margin: 0 0 9px;
  line-height: 1.8;
  color: #1f2937;
}

.post-body .post-content > blockquote p:last-child,
.preview-body > blockquote p:last-child {
  margin-bottom: 0;
}

/* 표: 실제 발행/미리보기 동일한 카드형 테이블 */
.post-body .post-content > .table-wrap,
.preview-body > .table-wrap {
  width: 100%;
  overflow-x: auto;
  margin: 28px 0 36px;
  border: 1px solid #e5e7eb;
  border-radius: 16px;
  background: #fff;
  box-shadow: 0 10px 26px rgba(15, 23, 42, .045);
  -webkit-overflow-scrolling: touch;
}

.post-body .post-content > .table-wrap table,
.preview-body > .table-wrap table,
.post-body .post-content > table,
.preview-body > table {
  width: 100%;
  min-width: 620px;
  border-collapse: separate;
  border-spacing: 0;
  margin: 0;
  font-size: 15px;
  line-height: 1.65;
  color: #1f2937;
  background: #fff;
  border: 0;
  border-radius: 0;
  box-shadow: none;
}

.post-body .post-content table thead th,
.preview-body table thead th {
  background: #f3f6f5;
  color: #111827;
  font-weight: 900;
  text-align: left;
  border-bottom: 1px solid #e5e7eb;
}

.post-body .post-content table th,
.post-body .post-content table td,
.preview-body table th,
.preview-body table td {
  padding: 13px 15px;
  vertical-align: top;
  border-right: 1px solid #eef2f7;
}

.post-body .post-content table th:last-child,
.post-body .post-content table td:last-child,
.preview-body table th:last-child,
.preview-body table td:last-child {
  border-right: 0;
}

.post-body .post-content table tbody tr + tr td,
.preview-body table tbody tr + tr td {
  border-top: 1px solid #eef2f7;
}

.post-body .post-content table tbody tr:nth-child(even) td,
.preview-body table tbody tr:nth-child(even) td {
  background: #fbfcfb;
}

.post-body .post-content .table-cell--center,
.preview-body .table-cell--center {
  text-align: center;
}

.post-body .post-content .table-cell--right,
.preview-body .table-cell--right {
  text-align: right;
}

/* 코드/링크 기본 가독성 */
.post-body .post-content code,
.preview-body code {
  background: #f1f5f9;
  color: #0f172a;
  padding: 3px 7px;
  border-radius: 8px;
  font-size: .92em;
}

.post-body .post-content a,
.preview-body a {
  text-underline-offset: 3px;
}

@media (max-width: 768px) {
  .post-body {
    padding: 16px;
  }

  .post-body .post-content,
  .preview-body {
    max-width: 100%;
    font-size: 15.5px;
    line-height: 1.85;
  }

  .post-body .post-content > p,
  .preview-body > p {
    margin-bottom: 17px;
    line-height: 1.85;
  }

  .post-body .post-content > h2,
  .preview-body > h2 {
    gap: 12px;
    margin: 44px 0 20px;
    padding-bottom: 13px;
    font-size: 22px;
    line-height: 1.4;
    letter-spacing: -0.04em;
  }

  .post-body .post-content > h2::before,
  .preview-body > h2::before {
    min-width: 36px;
    height: 36px;
    padding: 0 10px;
    border-radius: 12px;
    font-size: 13px;
  }

  .post-body .post-content > h3,
  .preview-body > h3 {
    margin-top: 32px;
    padding-left: 12px;
    font-size: 18.5px;
  }

  .post-body .post-content > h4,
  .preview-body > h4 {
    margin-top: 26px;
    padding: 10px 13px;
    font-size: 16px;
  }

  .post-body .post-content > ul,
  .post-body .post-content > ol,
  .preview-body > ul,
  .preview-body > ol {
    padding-left: 23px;
    margin-bottom: 24px;
  }

  .post-body .post-content > blockquote,
  .preview-body > blockquote {
    margin: 22px 0 26px;
    padding: 16px 17px;
    border-radius: 14px;
  }

  .post-body .post-content > .table-wrap,
  .preview-body > .table-wrap {
    margin: 24px 0 30px;
    border-radius: 14px;
  }

  .post-body .post-content > .table-wrap table,
  .preview-body > .table-wrap table,
  .post-body .post-content > table,
  .preview-body > table {
    min-width: 560px;
    font-size: 14px;
  }

  .post-body .post-content table th,
  .post-body .post-content table td,
  .preview-body table th,
  .preview-body table td {
    padding: 12px 13px;
  }
}


/* =========================================================
   Article body UI hard override - 0505 v2
   v1에서 브라우저/Cloudflare CSS 캐시와 일부 선택자 범위 문제를 막기 위한 최종 오버라이드
========================================================= */
.post-body .post-content,
.preview-body {
  max-width: 820px !important;
  margin-left: auto !important;
  margin-right: auto !important;
  font-size: 16.5px !important;
  line-height: 1.9 !important;
  color: #1f2937 !important;
  word-break: keep-all;
  overflow-wrap: break-word;
  counter-reset: ww-article-h2;
}

.post-body .post-content p,
.preview-body p {
  margin: 0 0 19px !important;
  line-height: 1.9 !important;
  letter-spacing: -0.01em;
}

.post-body .post-content h2,
.preview-body h2 {
  counter-increment: ww-article-h2;
  display: flex !important;
  align-items: center !important;
  gap: 16px !important;
  margin: 58px 0 24px !important;
  padding: 0 0 16px !important;
  border-bottom: 1px solid #e5e7eb !important;
  background: transparent !important;
  font-size: 28px !important;
  line-height: 1.35 !important;
  font-weight: 900 !important;
  letter-spacing: -0.045em !important;
  color: #111827 !important;
  scroll-margin-top: 25px;
}

.post-body .post-content h2:first-child,
.preview-body h2:first-child {
  margin-top: 10px !important;
}

.post-body .post-content h2::before,
.preview-body h2::before {
  content: counter(ww-article-h2, decimal-leading-zero);
  flex: 0 0 auto;
  min-width: 42px;
  height: 42px;
  padding: 0 12px;
  border-radius: 14px;
  background: #2f715f;
  color: #fff;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 15px;
  line-height: 1;
  font-weight: 900;
  letter-spacing: -0.02em;
  box-shadow: 0 8px 18px rgba(47, 113, 95, .18);
}

.post-body .post-content h3,
.preview-body h3 {
  margin: 38px 0 15px !important;
  padding: 0 0 0 15px !important;
  border-left: 4px solid #2f715f !important;
  border-bottom: 0 !important;
  background: transparent !important;
  font-size: 21px !important;
  line-height: 1.45 !important;
  letter-spacing: -0.035em !important;
  font-weight: 900 !important;
  color: #111827 !important;
}

.post-body .post-content h4,
.preview-body h4 {
  margin: 30px 0 13px !important;
  padding: 11px 15px !important;
  border-radius: 12px !important;
  background: #f5f7f6 !important;
  border: 1px solid #e7ece9 !important;
  font-size: 17px !important;
  line-height: 1.45 !important;
  font-weight: 900 !important;
  letter-spacing: -0.025em !important;
  color: #111827 !important;
}

.post-body .post-content ul,
.post-body .post-content ol,
.preview-body ul,
.preview-body ol {
  margin: 16px 0 28px !important;
  padding-left: 28px !important;
  line-height: 1.85 !important;
}

.post-body .post-content li,
.preview-body li {
  margin: 9px 0 !important;
  padding-left: 4px;
  line-height: 1.85 !important;
}

.post-body .post-content li::marker,
.preview-body li::marker {
  color: #2f715f;
  font-weight: 900;
}

.post-body .post-content blockquote,
.preview-body blockquote {
  margin: 26px 0 30px !important;
  padding: 19px 21px !important;
  border-left: 5px solid #2f715f !important;
  border-radius: 16px !important;
  background: #f4f8f6 !important;
  color: #1f2937 !important;
  box-shadow: none !important;
}

.post-body .post-content blockquote p,
.preview-body blockquote p {
  margin: 0 0 9px !important;
}

.post-body .post-content blockquote p:last-child,
.preview-body blockquote p:last-child {
  margin-bottom: 0 !important;
}

.post-body .post-content .table-wrap,
.preview-body .table-wrap {
  width: 100%;
  overflow-x: auto;
  margin: 28px 0 36px !important;
  border: 1px solid #e5e7eb !important;
  border-radius: 16px !important;
  background: #fff;
  box-shadow: 0 10px 26px rgba(15, 23, 42, .045) !important;
  -webkit-overflow-scrolling: touch;
}

.post-body .post-content table,
.preview-body table {
  width: 100% !important;
  min-width: 620px;
  border-collapse: separate !important;
  border-spacing: 0 !important;
  margin: 0 !important;
  font-size: 15px !important;
  line-height: 1.65 !important;
  color: #1f2937 !important;
  background: #fff !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

.post-body .post-content table thead th,
.preview-body table thead th {
  background: #f3f6f5 !important;
  color: #111827 !important;
  font-weight: 900 !important;
  text-align: left !important;
  border-bottom: 1px solid #e5e7eb !important;
}

.post-body .post-content table th,
.post-body .post-content table td,
.preview-body table th,
.preview-body table td {
  padding: 13px 15px !important;
  vertical-align: top !important;
  border-right: 1px solid #eef2f7 !important;
}

.post-body .post-content table th:last-child,
.post-body .post-content table td:last-child,
.preview-body table th:last-child,
.preview-body table td:last-child {
  border-right: 0 !important;
}

.post-body .post-content table tbody tr + tr td,
.preview-body table tbody tr + tr td {
  border-top: 1px solid #eef2f7 !important;
}

.post-body .post-content table tbody tr:nth-child(even) td,
.preview-body table tbody tr:nth-child(even) td {
  background: #fbfcfb !important;
}

@media (max-width: 768px) {
  .post-body {
    padding: 16px !important;
  }

  .post-body .post-content,
  .preview-body {
    max-width: 100% !important;
    font-size: 15.5px !important;
    line-height: 1.85 !important;
  }

  .post-body .post-content h2,
  .preview-body h2 {
    gap: 12px !important;
    margin: 44px 0 20px !important;
    padding-bottom: 13px !important;
    font-size: 22px !important;
    line-height: 1.4 !important;
  }

  .post-body .post-content h2::before,
  .preview-body h2::before {
    min-width: 36px;
    height: 36px;
    padding: 0 10px;
    border-radius: 12px;
    font-size: 13px;
  }

  .post-body .post-content h3,
  .preview-body h3 {
    margin-top: 32px !important;
    padding-left: 12px !important;
    font-size: 18.5px !important;
  }

  .post-body .post-content h4,
  .preview-body h4 {
    margin-top: 26px !important;
    padding: 10px 13px !important;
    font-size: 16px !important;
  }

  .post-body .post-content ul,
  .post-body .post-content ol,
  .preview-body ul,
  .preview-body ol {
    padding-left: 24px !important;
    margin-bottom: 24px !important;
  }

  .post-body .post-content table,
  .preview-body table {
    min-width: 560px;
    font-size: 14px !important;
  }

  .post-body .post-content table th,
  .post-body .post-content table td,
  .preview-body table th,
  .preview-body table td {
    padding: 12px 13px !important;
  }
}