/* 가이드 본문: 이미지, 안내 박스, 표, 도구 목록 */
.guide-figure{margin:2rem 0;border-radius:var(--radius-md);overflow:hidden;border:1px solid var(--line);background:var(--soft);box-shadow:var(--shadow-sm)}
.guide-figure img{display:block;width:100%;height:auto}
.guide-figure:not(.is-wide){max-width:440px;margin-inline:auto}
.guide-notes{margin:1.6rem 0;padding:1.1rem 1.3rem;border-radius:var(--radius-sm);background:var(--accent-soft);border:1px solid rgba(102,87,232,.18)}
.guide-notes p{margin:.25rem 0;font-size:.9rem !important;color:#3b3470 !important}
.guide-table{margin:1.4rem 0;overflow-x:auto;border:1px solid var(--line);border-radius:var(--radius-sm)}
.guide-table table{width:100%;border-collapse:collapse;font-size:.9rem}
.guide-table th,.guide-table td{padding:.8rem 1rem;text-align:left;vertical-align:top;border-bottom:1px solid var(--line);line-height:1.55}
.guide-table th{background:var(--soft);font-weight:750;font-size:.8rem;color:var(--muted)}
.guide-table tr:last-child td{border-bottom:0}
.guide-table code,.article-prose code{padding:.1rem .35rem;border-radius:6px;background:var(--soft);font-size:.85em}
.tool-role{display:flex;flex-wrap:wrap;align-items:baseline;gap:.6rem;margin:2rem 0 .8rem !important}
.tool-role strong{font-size:1.05rem;color:var(--ink)}
.tool-role span{color:var(--muted);font-size:.88rem}
.tool-list{display:grid;gap:.6rem}
.tool-item{display:grid;grid-template-columns:2.6rem minmax(0,1fr);gap:.9rem;padding:1rem 1.1rem;border:1px solid var(--line);border-radius:var(--radius-sm);background:#fff;transition:border-color .16s ease,box-shadow .16s ease}
.tool-item:hover{border-color:rgba(102,87,232,.35);box-shadow:var(--shadow-sm)}
.tool-item>b{display:grid;place-items:center;width:2.6rem;height:2.6rem;border-radius:12px;background:var(--accent-soft);color:var(--accent-strong);font-size:.85rem}
.tool-item h3{margin:0 0 .3rem !important;font-size:1rem !important;display:flex;flex-wrap:wrap;align-items:baseline;gap:.4rem .6rem}
.tool-item h3 small{color:var(--muted);font-weight:500;font-size:.8rem}
.tool-item p{margin:0 !important;font-size:.9rem !important}
.tool-item a{color:var(--accent-strong);font-weight:700;text-decoration:none;white-space:nowrap}
.tool-paid{font-style:normal;font-size:.68rem;font-weight:800;padding:.12rem .45rem;border-radius:999px;background:#fff1e6;color:#b4570f}
.step-list{counter-reset:step;display:grid;gap:.7rem;padding:0;list-style:none}
.step-list li{counter-increment:step;position:relative;padding-left:2.4rem}
.step-list li::before{content:counter(step);position:absolute;left:0;top:.05rem;display:grid;place-items:center;width:1.7rem;height:1.7rem;border-radius:50%;background:var(--ink);color:#fff;font-size:.78rem;font-weight:800}
@media (max-width:760px){.tool-item{grid-template-columns:2.2rem minmax(0,1fr);padding:.85rem}.tool-item>b{width:2.2rem;height:2.2rem}.guide-figure{margin:1.4rem 0}}
/* 코드 박스 복사: 오른쪽 위 아이콘 버튼 */
.prompt-box pre{padding-right:2.6rem}
.copy-icon{position:absolute;top:.7rem;right:.7rem;display:grid;place-items:center;width:2.1rem;height:2.1rem;padding:0;border:1px solid rgba(255,255,255,.14);border-radius:9px;background:rgba(255,255,255,.06);color:rgba(255,255,255,.72);cursor:pointer;transition:background .15s ease,color .15s ease}
.copy-icon:hover{background:rgba(255,255,255,.14);color:#fff}
.copy-icon:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.copy-icon .check-glyph{display:none}
.copy-icon.is-copied{color:#7ee2b8;border-color:rgba(126,226,184,.4)}
.copy-icon.is-copied .copy-glyph{display:none}
.copy-icon.is-copied .check-glyph{display:block}
/* 도구 링크는 설명 다음 줄에 */
.tool-item p a{display:table;margin-top:.3rem}
/* 본문 작은 글씨 키우기 (제목 크기는 그대로) */
.longform-article .article-prose p,.longform-article .article-prose li{font-size:1.1rem;line-height:1.85}
.longform-article .article-dek{font-size:1.15rem}
.longform-article .article-byline strong{font-size:.95rem}
.longform-article .article-byline small{font-size:.85rem}
.longform-article .prompt-box pre{font-size:1rem}
.longform-article .guide-notes p{font-size:1.02rem !important}
.longform-article .guide-table table{font-size:1rem}
.longform-article .guide-table th{font-size:.9rem}
.longform-article .tool-role strong{font-size:1.15rem}
.longform-article .tool-role span{font-size:1rem}
.longform-article .tool-item h3{font-size:1.1rem !important}
.longform-article .tool-item h3 small{font-size:.9rem}
.longform-article .tool-item p{font-size:1rem !important}
.longform-article .tool-paid{font-size:.75rem}
@media (max-width:760px){
.longform-article .article-prose p,.longform-article .article-prose li{font-size:1.05rem}
.longform-article .prompt-box pre{font-size:.95rem}
.longform-article .guide-table table,.longform-article .tool-item p{font-size:.98rem !important}
}
.longform-article .category-index>span,.longform-article .command-list>span{font-size:1rem}
.longform-article .category-index b,.longform-article .command-list code{font-size:.9rem}
.longform-article .category-index em,.longform-article .command-list em{font-size:.85rem}

/* 2026-10-09: 본문 끝 '연관 가이드 3개' (related.py 로 생성) */
.article-related{margin-top:4rem;padding-top:2.5rem;border-top:1px solid var(--line,#e7e7ec)}
.related-head{display:flex;align-items:flex-end;justify-content:space-between;gap:1rem;margin-bottom:1.4rem}
.related-head h2{margin:.3rem 0 0;font-size:clamp(1.4rem,3vw,1.9rem);letter-spacing:-.04em;line-height:1.2}
.related-all{flex:none;font-size:.88rem;font-weight:700;color:var(--accent-strong,#4f3ed8);text-decoration:none}
.related-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1rem}
.related-card{display:flex;flex-direction:column;gap:.7rem;color:inherit;text-decoration:none}
.related-thumb{position:relative;display:flex;flex-direction:column;justify-content:space-between;aspect-ratio:16/10;padding:12px 14px;border-radius:14px;overflow:hidden;isolation:isolate;transition:transform .2s ease}
.related-card:hover .related-thumb{transform:translateY(-3px)}
.related-thumb::after{content:"";position:absolute;width:120px;height:120px;right:-40px;bottom:-50px;border-radius:50%;z-index:-1;opacity:.55}
.related-tool{align-self:flex-start;padding:4px 9px;border-radius:999px;background:rgba(255,255,255,.75);font-size:11px;font-weight:700}
.related-hook{font-weight:900;font-size:20px;line-height:1.15;letter-spacing:-.04em}
.related-copy time{display:block;font-size:.78rem;color:var(--muted,#777)}
.related-copy strong{display:block;margin-top:.2rem;font-size:.98rem;line-height:1.4}
.related-card:hover strong{text-decoration:underline;text-underline-offset:3px}
.related-thumb.t-c1{background:#efe8fb;color:#4a2a9c}.related-thumb.t-c1::after{background:#c9b4f5}
.related-thumb.t-c2{background:#e5f0ec;color:#1f5c48}.related-thumb.t-c2::after{background:#a9dcc8}
.related-thumb.t-c3{background:#fbe8ef;color:#8e2753}.related-thumb.t-c3::after{background:#f5b3cd}
.related-thumb.t-c4{background:#fdf1df;color:#8a4a10}.related-thumb.t-c4::after{background:#f7cd94}
.related-thumb.t-c5{background:#e6ebfb;color:#2a3f9c}.related-thumb.t-c5::after{background:#b4c3f5}
@media (max-width:760px){.related-grid{grid-template-columns:1fr}.related-card{flex-direction:row;align-items:center}.related-thumb{flex:none;width:120px;aspect-ratio:4/3}.related-hook{font-size:15px}.related-head{flex-direction:column;align-items:flex-start}}

/* '👇🏻 복붙 프롬프트는 여기!' — 첫 복사 칸 바로 위에 크게(2026-10-27 누나: 표시만 있고 프롬프트가 안 보임). 한쪽 굵은 테두리 장식 없음 */
.longform-article .copy-cue{margin:1.6rem 0 .5rem;font-size:1.35rem;line-height:1.35;font-weight:800;color:var(--ink);letter-spacing:-.01em}
.longform-article .copy-cue + .prompt-box{margin-top:0}