:root{
  --bg:#ffffff; --fg:#1a1d21; --muted:#66707a; --line:#e6e9ec;
  --brand:#0b5fb0; --brand-2:#0a4f93; --accent:#e8f1fb; --chip:#f3f6f9;
  --radius:12px; --maxw:1120px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0; font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,"PingFang SC","Microsoft YaHei",sans-serif;
  color:var(--fg); background:var(--bg); line-height:1.6; font-size:16px;
}
a{color:var(--brand); text-decoration:none}
a:hover{text-decoration:underline}
.container{max-width:var(--maxw); margin:0 auto; padding:0 20px}
.muted{color:var(--muted)}
img{max-width:100%}
h1,h2,h3{line-height:1.25}
.site-header{position:sticky; top:0; z-index:20; background:rgba(255,255,255,.92); backdrop-filter:blur(8px); border-bottom:1px solid var(--line)}
.nav{display:flex; align-items:center; justify-content:space-between; height:60px}
.brand{font-weight:800; font-size:20px; color:var(--fg); letter-spacing:.2px}
.brand span{color:var(--brand)}
.nav-links{display:flex; gap:18px; font-size:15px}
.nav-links a{color:var(--fg)}
.site-footer{border-top:1px solid var(--line); margin-top:56px; padding:28px 0; background:#fafbfc}
.site-footer p{margin:.3em 0}
.hero{padding:46px 0 30px; border-bottom:1px solid var(--line}
.hero h1{font-size:38px; margin:0 0 10px}
.hero p{font-size:18px; color:var(--muted); max-width:760px}
.section{margin:38px 0}
.section h2{font-size:24px; margin:0 0 16px}
.grid{display:grid; gap:16px}
.grid.cards{grid-template-columns:repeat(auto-fill,minmax(260px,1fr))}
.card{border:1px solid var(--line); border-radius:var(--radius); padding:18px; background:#fff; transition:box-shadow .15s, transform .15s}
.card:hover{box-shadow:0 6px 20px rgba(11,95,176,.10); transform:translateY(-2px)}
.card h3{margin:.2em 0 .3em; font-size:18px}
.card .sub{color:var(--muted); font-size:14px}
.chip{display:inline-block; background:var(--chip); color:#33414d; border:1px solid var(--line); border-radius:999px; padding:2px 10px; font-size:12px; margin:2px 4px 2px 0}
.breadcrumb{font-size:13px; color:var(--muted); margin:18px 0 6px}
.breadcrumb a{color:var(--muted)}
.meta-row{display:flex; flex-wrap:wrap; gap:8px; margin:10px 0}
.kv{display:grid; grid-template-columns:200px 1fr; gap:6px 16px; margin:14px 0}
.kv dt{color:var(--muted); font-weight:600}
.kv dd{margin:0}
.tabs{margin:22px 0}
.tab-bar{display:flex; flex-wrap:wrap; gap:6px; border-bottom:2px solid var(--line); margin-bottom:18px}
.tab-btn{background:none; border:none; padding:10px 14px; cursor:pointer; font-size:15px; color:var(--muted); border-bottom:2px solid transparent; margin-bottom:-2px}
.tab-btn.active{color:var(--brand); border-bottom-color:var(--brand); font-weight:700}
.tab-panel{display:none}
.tab-panel.active{display:block}
pre{background:#0f172a; color:#e6edf3; padding:14px 16px; border-radius:10px; overflow:auto; font-size:13.5px}
code{font-family:"SFMono-Regular",Consolas,"Liberation Mono",monospace}
:not(pre) > code{background:var(--accent); color:var(--brand-2); padding:1px 6px; border-radius:6px; font-size:14px}
table{border-collapse:collapse; width:100%; margin:14px 0}
th,td{border:1px solid var(--line); padding:8px 10px; text-align:left; font-size:14px}
th{background:var(--chip)}
.btn{display:inline-block; background:var(--brand); color:#fff; padding:10px 16px; border-radius:10px; font-weight:600}
.btn:hover{background:var(--brand-2); text-decoration:none}
.lead{font-size:17px; color:var(--muted)}
.note{background:var(--accent); border:1px solid #cfe2f6; border-radius:10px; padding:12px 14px; font-size:14px}
.search-box{display:flex; gap:8px; margin:16px 0}
.search-box input{flex:1; padding:10px 12px; border:1px solid var(--line); border-radius:10px; font-size:15px}
.result{border:1px solid var(--line); border-radius:10px; padding:14px; margin:10px 0}
.result .type{font-size:12px; color:var(--brand); text-transform:uppercase; letter-spacing:.5px}
@media(max-width:640px){.hero h1{font-size:30px}.kv{grid-template-columns:1fr}.nav-links{gap:12px; font-size:14px}}
/* News */
.news-card{display:flex; flex-direction:column}
.news-card .news-cover{width:100%; aspect-ratio:16/9; object-fit:cover; border-radius:8px; margin-bottom:10px; border:1px solid var(--line)}
.news-meta{color:var(--muted); font-size:13px; margin:2px 0 6px}
.article-body{max-width:820px}
.article-body img{max-width:100%; height:auto; border-radius:10px; margin:14px 0; border:1px solid var(--line)}
.article-cover{width:100%; max-height:440px; object-fit:cover; border-radius:12px; margin:14px 0 6px; border:1px solid var(--line)}
.article-body h2{font-size:22px; margin:26px 0 10px}
.article-body p{margin:12px 0}
.article-body ul{margin:12px 0; padding-left:22px}
.article-body li{margin:6px 0}
/* === IOTTourChina i18n: machine-translation disclaimer bar === */
.mt-disclaimer{background:#fff8e1; color:#7a5b00; font-size:13px; padding:8px 16px; text-align:center; line-height:1.5}
.mt-disclaimer a{color:#0b3d91; font-weight:600; margin-left:6px}
/* === I18n: language switcher bar (injected at top of <body>) === */
.lang-switch{display:flex; flex-wrap:wrap; gap:4px 16px; align-items:center; padding:6px 16px; background:var(--brand); font-size:13px; line-height:1.4}
.lang-switch a{color:#fff; opacity:.85; text-decoration:none; font-weight:500; white-space:nowrap}
.lang-switch a:hover{opacity:1; text-decoration:underline}
.lang-switch a.active{opacity:1; font-weight:700}
.lang-switch a.active::after{content:" \2022"}
/* Future RTL languages (e.g. Arabic) — uncomment when added to TARGETS:
[dir="rtl"] body{direction:rtl}
[dir="rtl"] .nav-inner,[dir="rtl"] .nav-links{flex-direction:row-reverse}
[dir="rtl"] .article-body ul,[dir="rtl"] .article-body ol{padding-left:0; padding-right:22px}
*/
