:root{color-scheme:light;--blue:#0868e8;--navy:#10153b;--muted:#5d6b84}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{display:flex;flex-direction:column;min-height:100vh;margin:0;background:#fff;color:var(--navy);font-family:"DM Sans","Noto Sans TC",system-ui,sans-serif;overflow-x:clip}
a{color:var(--blue);text-underline-offset:3px}
a:focus-visible{outline:3px solid var(--blue);outline-offset:3px;border-radius:2px}
#guide-header{min-height:76px}
.guide-container{flex:1 0 auto;width:100%;max-width:1100px;margin:auto;padding:0 30px 78px}
.guide-topline{display:flex;align-items:center;justify-content:space-between;gap:16px;margin:35px 0 32px}
.guide-crumbs{display:flex;align-items:center;flex-wrap:wrap;gap:8px;color:#6c7892;font-size:12px}
.guide-crumbs a{color:#536683;text-decoration:none}
.guide-languages{display:flex;align-items:center;gap:11px;flex:none;font-size:13px;font-weight:700}
.guide-languages span{color:#b6c5d6}
.guide-languages a{text-decoration:none;padding:7px 2px}
.guide-languages a[aria-current]{color:var(--navy);border-bottom:2px solid var(--blue)}
.guide-article{max-width:850px;margin:0 auto;font-size:16px;line-height:1.8;overflow-wrap:break-word}
.guide-article h1{font-size:clamp(30px,4vw,46px);line-height:1.18;letter-spacing:-.025em;margin:0 0 26px}
.guide-article h2{font-size:clamp(23px,2.9vw,30px);line-height:1.35;letter-spacing:-.02em;margin:58px 0 20px;scroll-margin-top:26px}
.guide-article h3{font-size:20px;line-height:1.4;margin:36px 0 12px}
.guide-article p{margin:0 0 18px}
.guide-article strong{font-weight:700;color:#142653}
.guide-article hr{border:0;border-top:1px solid #e8eef6;margin:44px 0}
.guide-article ul,.guide-article ol{padding-left:25px;margin:0 0 22px}
.guide-article li{margin:4px 0}
.guide-article a:hover{text-decoration-thickness:2px}
.guide-toc{background:#f1f8ff;border:1px solid #dfedfa;border-radius:14px;padding:25px 32px;margin:36px 0 60px}
.guide-toc h2{font-size:21px;margin:0 0 18px}
.guide-toc ul{columns:2;column-gap:35px;padding-left:21px;margin:0}
.guide-toc li{break-inside:avoid;line-height:1.5;margin:0 0 11px}
.guide-toc a{font-size:14px;font-weight:600;text-decoration:none}
.guide-toc a:hover{text-decoration:underline}
.guide-figure{margin:32px auto 44px}
.guide-figure img{display:block;width:100%;height:auto;max-width:100%;object-fit:contain;border-radius:12px}
.guide-figure figcaption{font-size:13px;line-height:1.55;color:#62718a;margin-top:10px}
.guide-hero-image{margin:35px 0}
.guide-article table{border-collapse:collapse;min-width:550px;width:100%;font-size:14px;line-height:1.5}
.guide-article table th,.guide-article table td{padding:12px 14px;text-align:left;border-bottom:1px solid #dbe8f5}
.guide-article table th{background:#ecf6ff;font-weight:700}
.guide-table-wrap{overflow-x:auto;margin:24px 0 28px;border:1px solid #dbe8f5;border-radius:10px}
.guide-article h2#works-cited~p{font-size:14px;line-height:1.65;padding-left:20px;text-indent:-20px}
.guide-reviewed{max-width:850px;margin:34px auto 0;color:#62718a;font-size:13px}
.guide-related{margin:55px auto 0}
.guide-library{max-width:950px;margin:0 auto 75px}
.guide-library-intro{max-width:730px;margin:35px 0 50px}
.guide-library-intro h1{font-size:clamp(32px,4vw,45px);line-height:1.2;letter-spacing:-.025em;margin:0 0 18px}
.guide-library-intro p{font-size:17px;line-height:1.8;color:#52617d;margin:0}
.guide-library section{margin:45px 0 60px}
.guide-library h2,.guide-related h2{font-size:clamp(23px,2.5vw,29px);line-height:1.3;margin:0 0 23px}
.guide-category-grid,.guide-card-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:19px}
.guide-category-card,.guide-card{border:1px solid #dce8f5;background:#fff;border-radius:15px;box-shadow:0 8px 24px rgba(16,33,74,.05)}
.guide-category-card{display:flex;flex-direction:column;min-height:185px;padding:27px;text-decoration:none;color:var(--navy)}
.guide-category-card:hover,.guide-card:hover{border-color:#9bc8fa;box-shadow:0 10px 30px rgba(16,33,74,.09)}
.guide-category-card h3,.guide-card h3{font-size:21px;line-height:1.35;margin:0 0 10px}
.guide-category-card p,.guide-card p{color:#5d6b84;font-size:14px;line-height:1.65;margin:0 0 17px}
.guide-category-card span{color:var(--blue);font-size:13px;font-weight:700;margin-top:auto}
.guide-card{overflow:hidden}
.guide-card img{display:block;width:100%;height:auto;aspect-ratio:16/9;object-fit:cover}
.guide-card-copy{padding:25px}
.guide-card h3 a{color:var(--navy);text-decoration:none}
.guide-card h3 a:hover{color:var(--blue)}
.guide-card .guide-card-date{font-size:12px;color:#6b7891}
.guide-read{font-size:13px;font-weight:700;text-decoration:none}
#guide-footer{margin-top:auto}
#guide-footer .guide-shared-footer{border-top:1px solid #e2e8f0;background:#fff;color:#475569;text-align:center;font-size:14px;line-height:1.5;padding:32px 16px}
#guide-footer .guide-shared-footer>div{display:flex;flex-direction:column;align-items:center;gap:8px;max-width:64rem;margin:0 auto}
#guide-footer .guide-shared-footer p{margin:0}
#guide-footer .guide-shared-footer nav{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;column-gap:8px;row-gap:4px}
#guide-footer .guide-shared-footer a{color:#0868e8;text-underline-offset:3px}
#guide-footer .guide-shared-footer p:last-child{width:100%;max-width:56rem;color:#64748b;font-size:12px;line-height:1.65}
@media(max-width:700px){
 #guide-header{min-height:65px}
 .guide-container{padding:0 18px 45px}.guide-topline{margin:25px 0 27px;align-items:flex-start}
 .guide-crumbs{font-size:11px;line-height:1.4}.guide-languages{font-size:12px}
 .guide-article{font-size:15px;line-height:1.75}
 .guide-article h1{font-size:clamp(28px,8vw,36px);margin-bottom:21px}
 .guide-article h2{font-size:23px;margin:43px 0 16px}
 .guide-article h3{font-size:18px}
 .guide-toc{padding:20px 22px;margin:27px 0 45px}.guide-toc ul{columns:1}.guide-toc li{margin-bottom:10px}
 .guide-figure{margin:25px 0 33px}.guide-figure figcaption{font-size:12px}
 .guide-diagram{overflow-x:auto}.guide-diagram img{width:720px;max-width:none}
 .guide-library{margin-bottom:40px}.guide-library-intro{margin:26px 0 38px}
 .guide-library-intro h1{font-size:clamp(29px,8vw,38px)}
 .guide-library-intro p{font-size:15px}
 .guide-category-grid,.guide-card-grid{grid-template-columns:1fr;gap:14px}
 .guide-category-card{min-height:0;padding:22px}
 .guide-library section{margin:36px 0 42px}
}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}