/* ---------- 基本設定 ---------- */
body {
    margin: 0;
    padding: 0;
    font-family: 'Helvetica', 'Arial', 'Noto Sans TC', '黑體-繁', '微軟正黑體', sans-serif;
    font-size: 1rem;
    line-height: 1.6;
    color: #000000;
}

#main {
    margin: 0 auto;
    max-width: 800px;
    background: #DDF0C7;
}

/* ---------- 視覺隱藏（螢幕閱讀器仍可讀）與跳過連結 ---------- */
.visually-hidden {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip-path: inset(50%);
    white-space: nowrap;
}

.skip-link {
    position: absolute;
    left: 0;
    top: -4rem;
    padding: 0.5rem 1rem;
    background: #000000;
    color: #FFFFFF;
    z-index: 10;
}
.skip-link:focus {
    top: 0;
}

/* ---------- 連結與焦點 ---------- */
a:link    { color: #0000EE; }
a:visited { color: #551A8B; }
a:focus-visible {
    outline: 3px solid #003300;
    outline-offset: 2px;
}

/* ---------- 頁首 ---------- */
header {
    box-sizing: border-box;
    border: 1px #330000 solid;
    min-height: 120px;
    padding: 0.5rem 1rem;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    color: #DDF0C7;        /* 對 #176917 對比約 5.7:1 */
    background: #176917;
}
header h1 {
    margin: 0;
    font-size: 2rem;
    line-height: 1.4;
}

/* ---------- 個人資料區（聯絡資訊 + 照片） ---------- */
.profile {
    display: grid;
    grid-template-columns: 1fr 200px;
    gap: 1rem;
    margin: 0 10px;
}

#contact {
    background: #DDF0C7;
}

#pic {
    text-align: center;
    padding-top: 1rem;
}
#pic img {
    max-width: 100%;
    height: auto;
}

.contact-list {
    display: grid;
    grid-template-columns: max-content 1fr;
    gap: 0.25rem 0.5rem;
    margin: 1rem 0;
}
.contact-list dt { font-weight: bold; }
.contact-list dd { margin: 0; overflow-wrap: anywhere; }

/* ---------- 專長與論文 ---------- */
#cv, #paper {
    background: #DDF0C7;
    margin: 0 10px;
    text-align: left;       /* 避免兩端對齊造成字距不均 */
}

#paper li {
    margin-bottom: 1rem;
    overflow-wrap: anywhere;
}

strong { font-weight: bold; }   /* 取代原本的底線 + 粗體，避免被誤認為連結 */
.journal { font-weight: bold; }

/* ---------- 頁尾 ---------- */
footer {
    box-sizing: border-box;
    border: 1px #330000 solid;
    background: #176917;
    color: #FFFFFF;           /* 對比約 6.8:1 */
    min-height: 65px;
    padding: 0.5rem 1rem;
    text-align: center;
    font-size: 0.875rem;
    line-height: 1.5;
}
footer p { margin: 0; }
footer a:link, footer a:visited { color: #FFFFFF; }

/* ---------- 窄螢幕：改為單欄 ---------- */
@media (max-width: 640px) {
    .profile {
        grid-template-columns: 1fr;
    }
    #pic {
        order: -1;
    }
    header h1 {
        font-size: 1.5rem;
    }
}