:root{
    --bg:#ffffff;
    --panel:#ffffff;
    --text:#1a1a1a;
    --muted:#5f6368;
    --border:#e0e0e0;
    --code-bg:#f5f7fa;
    --shadow:0 2px 8px rgba(0,0,0,0.06);

    --accent:#00a88f;
    --accent-600:#00967f;
    --accent-700:#007d6b;

    --ff-sans: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Noto Sans KR", Arial, sans-serif;
    --ff-mono: ui-monospace, SFMono-Regular, Menlo, Consolas, "Noto Sans Mono", monospace;

    /* font sizes */
    --size-base: 1.05rem;      /* 기본 본문 크기 ↑ */
    --size-1: 2.2rem;          /* h1 */
    --size-2: 1.7rem;          /* h2 */
    --size-3: 1.4rem;          /* h3 */
    --size-4: 1.2rem;
    --size-5: 1.05rem;
    --size-6: .95rem;

    --radius: 12px;
    --space-1:.4rem;
    --space-2:.8rem;
    --space-3:1.2rem;
    --space-4:1.8rem;
    --space-5:2.5rem;
}

html,body{
    margin:0; padding:0;
    background:var(--bg);
    color:var(--text);
    font-size: var(--size-base);   /* 본문 기본 폰트 크기 적용 */
}
body{
    font-family:var(--ff-sans);
    line-height:1.7;
    -webkit-font-smoothing:antialiased;
}

.markdown-body {
    width: 90%;          /* 화면 폭의 90% 사용 */
    max-width: 1200px;   /* 너무 넓어지지 않게 상한선 설정 */
    margin: 0 auto;
    padding: var(--space-5) var(--space-3) 6rem;
}

/* headings */
.markdown-body h1,.markdown-body h2,.markdown-body h3,
.markdown-body h4,.markdown-body h5,.markdown-body h6{
    font-weight:700;
    line-height:1.4;
    margin-top:2em;
    margin-bottom:.8em;
}
.markdown-body h1{font-size:var(--size-1); border-bottom:2px solid var(--border); padding-bottom:.4em;}
.markdown-body h2{font-size:var(--size-2); border-left:5px solid var(--accent); padding-left:.5em; background:#f9fdfc;}
.markdown-body h3{font-size:var(--size-3);}
.markdown-body h4{font-size:var(--size-4); color:var(--accent-700);}
.markdown-body h5{font-size:var(--size-5); color:var(--muted);}
.markdown-body h6{font-size:var(--size-6); color:var(--muted);}

/* text */
.markdown-body p{margin:1em 0;}
.markdown-body strong{font-weight:700;}
.markdown-body em{font-style:italic;}

/* links */
.markdown-body a{
    color:var(--accent-600);
    text-decoration:none;
    border-bottom:1px solid var(--accent-600);
}
.markdown-body a:hover{color:var(--accent-700); border-color:var(--accent-700);}

/* lists */
.markdown-body ul,.markdown-body ol{
    margin:1em 0; padding-left:1.4em;
}
.markdown-body li+li{margin-top:.3em;}

/* blockquote = 카드형 */
.markdown-body blockquote{
    margin:1.5em 0;
    padding:1em 1.2em;
    background:#f9f9fb;
    border-left:6px solid var(--accent);
    border-radius: var(--radius);
    box-shadow: var(--shadow);
    color:#333;
}
.markdown-body blockquote p{margin:.3em 0;}

/* code */
.markdown-body code{
    font-family:var(--ff-mono);
    background:var(--code-bg);
    padding:.2em .5em;
    border-radius:6px;
    font-size:.9em;
}
.markdown-body pre{
    background:var(--code-bg);
    padding:1rem 1.2rem;
    border-radius:var(--radius);
    overflow:auto;
    box-shadow:var(--shadow);
}

/* tables */
.markdown-body table{
    width:100%; border-collapse:collapse; margin:1.5em 0;
    border:1px solid var(--border); border-radius:var(--radius); overflow:hidden;
    box-shadow:var(--shadow);
}
.markdown-body th,.markdown-body td{
    padding:.8em 1em; border-bottom:1px solid var(--border);
}
.markdown-body thead{background:#f1f3f6; font-weight:600;}

/* hr */
.markdown-body hr{
    border:none;
    height:1px;
    background:var(--border);
    margin:2.2em 0;
}