*{box-sizing:border-box}
:root{color-scheme:dark}
body{margin:0;background:#050a10;color:#f4f8fb;font:16px/1.7 Inter,"Noto Sans TC",sans-serif}
header,footer{border-color:#33414b;border-style:solid;border-width:0 0 1px;padding:1rem}
nav,main,footer{width:min(900px,calc(100% - 32px));margin:auto}
nav{display:flex;gap:1rem;flex-wrap:wrap}
main{padding:3rem 0}
article{border:1px solid #33414b;border-radius:18px;padding:1.5rem;margin:1rem 0;background:#101820}
a{color:#9ed0e8}
h1,h2,h3{line-height:1.25}
.blog-heading{display:flex;align-items:center;justify-content:space-between;gap:1rem;flex-wrap:wrap;margin-bottom:1rem}
.blog-heading h1{margin:0}
.language-switcher{width:auto;display:flex;gap:.4rem;padding:.25rem;border:1px solid #405463;border-radius:999px;background:#0b1218}
.language-switcher a{padding:.35rem .8rem;border-radius:999px;text-decoration:none;white-space:nowrap}
.language-switcher a[aria-current="page"]{color:#050a10;background:#9ed0e8;font-weight:700}
.article-languages{margin:0 0 1.25rem}
.blog-search{display:flex;align-items:end;gap:.5rem;flex-wrap:wrap;margin:0 0 1.25rem}
.blog-search label{display:grid;gap:.25rem}
.tag{display:inline-block;margin:.25rem;padding:.2rem .6rem;border:1px solid #547084;border-radius:99px}
.article-content img{max-width:100%;height:auto}
.article-content .table-scroll{width:100%;margin:1.5rem 0;overflow-x:auto;border:1px solid #405463;border-radius:12px;background:#0b1218;box-shadow:0 8px 24px rgba(0,0,0,.18)}
.article-content table{width:100%;min-width:620px;border-collapse:collapse;color:#edf6fb}
.article-content th,.article-content td{padding:.75rem .9rem;border-right:1px solid #405463;border-bottom:1px solid #405463;text-align:left;vertical-align:top}
.article-content th:last-child,.article-content td:last-child{border-right:0}
.article-content tbody tr:last-child td{border-bottom:0}
.article-content th{background:#1c2c37;color:#b9e4f7;font-weight:700}
.article-content tbody tr:nth-child(even){background:#121f28}
.article-content .table-scroll:focus{outline:2px solid #9ed0e8;outline-offset:2px}
.toc{width:100%;margin:1.5rem 0;padding:1rem;border-left:3px solid #547084;background:#0b1218}
pre{overflow:auto;background:#020609;padding:1rem;border-radius:.5rem}
input,button{font:inherit;padding:.6rem;border-radius:.5rem}
.empty-state{padding:1rem;border:1px dashed #547084;border-radius:12px}
.pagination{width:100%;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:1rem;margin:2rem 0 0;padding:1rem 0;border-top:1px solid #33414b}
.pagination>*:last-child{text-align:right}
.pagination a{font-weight:700}
.article-ad{width:100%;min-height:160px;margin:2.25rem 0;padding:1rem 0;border-block:1px solid #33414b;overflow:hidden;contain:layout paint}
.article-ad-label{display:block;margin:0 0 .5rem;color:#91a2ae;font-size:.75rem;letter-spacing:.08em;text-align:center;text-transform:uppercase}
.article-ad .adsbygoogle{width:100%;min-height:120px}
footer{border-width:1px 0 0}
@media(max-width:600px){
  main{padding:1rem 0}
  article{padding:1rem}
  .blog-heading{align-items:flex-start;flex-direction:column}
  .article-content table{min-width:520px;font-size:.94rem}
  .article-content th,.article-content td{padding:.6rem .7rem}
}