/* 深度文章沿用檔案桌視覺，行距與段落寬度按長文閱讀優先調整。 */
.article-page{background:#f7fbfa;color:#1E293B}
.article-page .site-header nav a[href="blog.html"]{background:#0ABAB5;transform:translateY(0)}
.article-page h1,.article-page h2,.article-page h3{letter-spacing:-.045em}
.article-cover{position:relative;overflow:hidden;background:#eaf9f6;border-block:2px solid #111}
.article-cover:before{content:"";position:absolute;inset:0;background:linear-gradient(#0abab517 1px,transparent 1px),linear-gradient(90deg,#0abab517 1px,transparent 1px);background-size:38px 38px;pointer-events:none}
.article-cover-inner{position:relative;max-width:1360px;margin:auto;padding:54px 36px 78px}
.article-back{display:inline-flex;align-items:center;gap:10px;min-height:44px;border-bottom:2px solid #111;color:#111;font-size:12px;font-weight:900;text-decoration:none}
.article-back:hover{color:#087f7b;border-color:#087f7b}
.article-file{display:table;margin:51px 0 27px;padding:12px 17px;background:#FDF0D5;border:3px solid #111;box-shadow:5px 5px 0 #111;transform:rotate(-2deg);font:900 12px/1.35 Geist,monospace;letter-spacing:.1em}
.article-cover h1{max-width:1120px;margin:0;color:#111;font-size:clamp(45px,5.7vw,83px);font-weight:900;line-height:1.14}
.article-deck{max-width:850px;margin:27px 0 27px;font-size:19px;font-weight:600;line-height:1.7}
.article-meta{display:flex;flex-wrap:wrap;gap:13px 20px;font-size:12px;font-weight:900;letter-spacing:.05em}
.article-meta span,.article-meta time{padding:8px 10px;background:#fff;border:2px solid #111;box-shadow:2px 2px 0 #111}
.article-layout{display:grid;grid-template-columns:230px minmax(0,1fr);gap:70px;max-width:1288px;margin:auto;padding:95px 36px 110px}
.article-toc{align-self:start;position:sticky;top:25px;padding:22px;background:#FDF0D5;border:2px solid #111;box-shadow:4px 4px 0 #111}
.article-toc strong{display:block;margin-bottom:17px;font:900 11px/1.4 Geist,monospace;letter-spacing:.12em}
.article-toc a{display:block;padding:11px 0;border-top:1px solid #111;color:#1E293B;font-size:12px;font-weight:800;line-height:1.45;text-decoration:none}
.article-toc a:hover{color:#087f7b}
.article-copy{min-width:0;max-width:810px;font-size:17px;line-height:1.85}
.article-copy .lead{margin:0 0 36px;color:#111;font-size:21px;font-weight:760;line-height:1.7}
.article-copy p{margin:0 0 22px}
.article-copy h2{margin:74px 0 24px;padding-top:13px;border-top:3px solid #111;color:#111;font-size:clamp(28px,3.1vw,42px);line-height:1.27}
.article-copy h3{margin:34px 0 13px;color:#111;font-size:22px;line-height:1.35}
.article-copy ul,.article-copy ol{margin:0 0 29px;padding-left:1.35em}
.article-copy li{margin:10px 0;padding-left:3px}
.article-copy strong{color:#111}
.article-copy a{color:#056f6b;text-decoration-thickness:2px;text-underline-offset:3px}
.article-note{margin:31px 0;padding:22px 25px;background:#FDF0D5;border:2px solid #111;box-shadow:4px 4px 0 #111}
.article-note b{display:block;margin-bottom:8px;color:#111;font-size:12px;letter-spacing:.05em}
.article-note p:last-child,.article-note ul:last-child{margin-bottom:0}
.article-example{margin:31px 0;padding:22px 25px;background:#e1f8f3;border:2px solid #111;box-shadow:4px 4px 0 #111}
.article-example b{display:block;margin-bottom:8px;color:#111;font-size:12px}
.article-example p:last-child,.article-example ul:last-child{margin-bottom:0}
.article-checklist{counter-reset:check;list-style:none!important;padding:0!important}
.article-checklist li{position:relative;padding:10px 0 10px 35px!important;border-bottom:1px solid #abbfb9}
.article-checklist li:before{content:"✓";position:absolute;left:0;top:14px;display:grid;place-items:center;width:22px;height:22px;background:#0ABAB5;border:1px solid #111;color:#111;font-size:12px;font-weight:900}
.article-source{margin-top:58px;padding-top:20px;border-top:2px dashed #111;color:#53676c;font-size:12px;line-height:1.65}
.article-source strong{display:block;margin-bottom:8px}
.article-source ul{margin:0;padding-left:18px}
.article-summary{margin-top:73px;padding:35px;background:#0ABAB5;border:3px solid #111;box-shadow:7px 7px 0 #111}
.article-summary h2{margin:0 0 15px;padding:0;border:0;font-size:clamp(30px,3.5vw,48px)}
.article-summary p{margin-bottom:22px}
.article-summary .button{display:inline-flex;gap:12px;align-items:center;min-height:46px;font-size:13px}
.article-footer{display:flex;justify-content:space-between;gap:22px;max-width:1288px;margin:0 auto;padding:32px 36px 100px;border-top:2px solid #111;font-size:13px;font-weight:900}
.article-footer a{text-decoration:none;border-bottom:2px solid #111}
.article-footer a:hover{color:#087f7b;border-color:#087f7b}
@media(max-width:900px){.article-layout{grid-template-columns:1fr;gap:45px;padding:75px 28px}.article-toc{position:static;display:flex;align-items:center;flex-wrap:wrap;gap:8px 16px}.article-toc strong{width:100%;margin-bottom:5px}.article-toc a{border:2px solid #111;padding:8px 10px;background:#fff}.article-cover-inner{padding-inline:28px}}
@media(max-width:620px){.article-cover-inner{padding:38px 20px 58px}.article-file{max-width:100%;margin-top:34px;font-size:9px;overflow-wrap:anywhere}.article-cover h1{font-size:clamp(38px,10vw,55px)}.article-deck{font-size:15px}.article-meta{font-size:10px}.article-layout{padding:62px 20px 80px}.article-copy{font-size:15px;line-height:1.82}.article-copy .lead{font-size:18px}.article-copy h2{font-size:29px;margin-top:59px}.article-copy h3{font-size:20px}.article-note,.article-example{padding:17px}.article-summary{padding:24px;box-shadow:5px 5px 0 #111}.article-summary .button{font-size:11px;padding-inline:10px}.article-footer{padding:26px 20px 90px;flex-direction:column}}
