
  :root {
    --blue: #1a66b3;
    --blue-dark: #0f4c81;
    --link: #1a4f9c;
    --link-hover: #d43f3f;
    --text: #333;
    --muted: #6f6f6f;
    --border: #dfe5ec;
    --bg: #f4f5f7;
  }
  * { margin: 0; padding: 0; box-sizing: border-box; }
  body {
    font-family: Arial, "Segoe UI", sans-serif;
    color: var(--text);
    background: var(--bg);
    font-size: 13px;
  }
  a { text-decoration: none; color: var(--link); }
  a:hover { color: var(--link-hover); text-decoration: underline; }

  /* ===== Top bar ===== */
  .topbar { background: var(--blue); }
  .topbar-inner { max-width: 1000px; margin: 0 auto; padding: 8px 12px; display: flex; align-items: center; gap: 18px; }
  .logo { font-size: 20px; font-weight: 700; color: #fff; white-space: nowrap; }
  .logo b { color: #ffd04d; }
  .search { flex: 1; display: flex; max-width: 430px; }
  .search input { flex: 1; border: none; padding: 6px 10px; font-size: 13px; outline: none; border-radius: 2px 0 0 2px; }
  .search button { border: none; background: #ffd04d; color: #5a4500; font-weight: 700; padding: 0 16px; cursor: pointer; border-radius: 0 2px 2px 0; font-size: 13px; }
  .topbar .quick { margin-left: auto; font-size: 12px; }
  .topbar .quick a { color: #cfe2f5; margin-left: 10px; }
  .topbar .quick a:hover { color: #fff; }

  /* ===== Nav tabs ===== */
  .mainnav { background: #fff; border-bottom: 2px solid var(--blue); }
  .mainnav-inner { max-width: 1000px; margin: 0 auto; padding: 0 12px; display: flex; }
  .mainnav a { padding: 8px 16px; font-size: 14px; color: #444; font-weight: 600; }
  .mainnav a.active { background: var(--blue); color: #fff; }
  .mainnav a:hover:not(.active) { color: var(--blue); text-decoration: none; }

  .crumb { max-width: 1000px; margin: 0 auto; padding: 8px 12px 0; font-size: 12px; color: var(--muted); }
  .crumb a { color: var(--blue); }
  .intro { max-width: 1000px; margin: 0 auto; padding: 4px 12px; color: var(--muted); font-size: 12.5px; }
  .intro b { color: var(--text); }

  /* ===== Dense sections ===== */
  .wrap { max-width: 1000px; margin: 0 auto; padding: 6px 12px 24px; }
  .section { background: #fff; border: 1px solid var(--border); margin-bottom: 10px; }
  .section-head {
    background: linear-gradient(#fafbfc, #eef2f6);
    border-bottom: 1px solid var(--border);
    padding: 6px 10px;
    display: flex; align-items: center;
  }
  .section-head h2 { font-size: 14px; color: var(--blue-dark); border-left: 3px solid var(--blue); padding-left: 7px; }
  .section-head .more { margin-left: auto; font-size: 12px; font-weight: 400; }
  .subhead { padding: 7px 10px 3px; font-size: 13px; font-weight: 700; color: #0f4c81; }
  .subhead::before { content: "▍"; color: var(--blue); }

  /* Dense text link list: long names, many columns */
  .linklist {
    padding: 5px 10px 8px;
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 2px 14px;
  }
  .linklist .item { font-size: 13px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  .linklist .item::before { content: "· "; color: #35803b; font-weight: 700; }
  .linklist .item .loc { color: var(--muted); font-size: 11px; margin-left: 3px; }
  .linklist .item .hot { color: #d43f3f; font-size: 10px; margin-left: 2px; }

  /* Logo image link wall - compact, full-width image top, one-line name */
  .logowall { padding: 6px 8px; display: grid; grid-template-columns: repeat(6, 1fr); gap: 6px; }
  .logoitem {
    display: flex; flex-direction: column; align-items: stretch;
    border: 1px solid var(--border); background: #fff; overflow: hidden;
  }
  .logoitem:hover { border-color: var(--blue); text-decoration: none; }
  .logoitem .img { width: 100%; height: 40px; display: flex; align-items: center; justify-content: center; font-weight: 700; font-size: 13px; color: #fff; }
  .logoitem .nm {
    font-size: 11.5px; color: #333; text-align: center; padding: 4px 5px;
    white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
  }
  .logoitem:hover .nm { color: var(--link-hover); }
  .logoitem .img img { width: 100%; height: 100%; object-fit: contain; display: block; padding: 3px; box-sizing: border-box; }

  /* Ranked rows with one-line desc */
  .featurerows { padding: 2px 0; }
  .featurerows .row { display: flex; align-items: baseline; gap: 8px; padding: 4px 10px; border-bottom: 1px dashed #edf0f4; }
  .featurerows .row:last-child { border-bottom: none; }
  .featurerows .row .num { width: 15px; height: 15px; flex-shrink: 0; background: #e8edf2; color: #5c6b7a; font-size: 10px; display: flex; align-items: center; justify-content: center; align-self: center; }
  .featurerows .row:nth-child(1) .num, .featurerows .row:nth-child(2) .num, .featurerows .row:nth-child(3) .num { background: #d43f3f; color: #fff; }
  .featurerows .row a.name { font-size: 13px; font-weight: 600; white-space: nowrap; }
  .featurerows .row .desc { color: var(--muted); font-size: 12px; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }

  /* Latest articles - dense 2-col list */
  .articles-grid { padding: 4px 10px 8px; display: grid; grid-template-columns: 1fr 1fr; gap: 0 24px; }
  .art { padding: 6px 0; border-bottom: 1px dashed #edf0f4; }
  .art:nth-last-child(-n+2) { border-bottom: none; }
  .art .top { display: flex; align-items: baseline; gap: 6px; }
  .art .cat {
    flex-shrink: 0; font-size: 10.5px; color: #fff; background: var(--blue);
    padding: 1px 6px; border-radius: 2px;
  }
  .art .cat.green { background: #35803b; }
  .art .cat.orange { background: #b65f00; }
  .art a.t { font-size: 13.5px; font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  .art .meta { display: block; margin-top: 3px; font-size: 12px; color: var(--muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  .art .date { float: right; font-size: 11px; color: #6b7683; }

  /* ===== Footer ===== */
  .site-footer { background: #fff; border-top: 1px solid var(--border); }
  .footer-inner { max-width: 1000px; margin: 0 auto; padding: 14px 12px 18px; display: flex; gap: 48px; flex-wrap: wrap; font-size: 12.5px; }
  .footer-inner h3 { color: #555; margin-bottom: 5px; font-size: 13px; }
  .sr-h1 { position:absolute; width:1px; height:1px; margin:-1px; padding:0; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; border:0; }
  .footer-inner a { display: block; margin-bottom: 3px; color: #666; }
  .copyright { text-align: center; color: #6f6f6f; font-size: 11.5px; padding: 0 0 16px; }
  .footer-contact { margin-left: auto; text-align: left; color: #555; font-size: 13px; line-height: 1.7; padding: 2px 0; max-width: 340px; }
  .footer-contact a { color: #1d5fae; font-weight: 600; }

  /* ===== Latest Articles image module (local Ghost blog) ===== */
  .pv-articles { display:grid; grid-template-columns:repeat(4,1fr); grid-template-rows:220px 220px; gap:12px; }
  .article-hero { grid-column:1/3; grid-row:1; position:relative; border:1px solid #e5e7eb; border-radius:8px; overflow:hidden; background:#fff; }
  .article-hero-slide { position:absolute; inset:0; opacity:0; transition:opacity .5s ease; }
  .article-hero-slide.active { opacity:1; }
  .article-hero-slide > a { display:flex; flex-direction:column; height:100%; text-decoration:none; color:inherit; }
  .article-hero-slide .hero-img { flex:1 1 auto; min-height:0; background:linear-gradient(135deg,#0a4d8c,#0077b0); position:relative; overflow:hidden; }
  .article-hero-slide .hero-img img { width:100%; height:100%; object-fit:cover; display:block; }
  .article-hero-slide .hero-title { flex:0 0 auto; padding:12px 14px; font-size:15px; font-weight:600; line-height:1.4; color:#1f2937; background:#fff; border-top:1px solid #f1f5f9; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
  .article-hero-arrow { position:absolute; top:calc(50% - 18px); transform:translateY(-50%); width:36px; height:36px; border-radius:50%; background:rgba(0,0,0,0.45); color:#fff; border:none; cursor:pointer; font-size:16px; display:none; align-items:center; justify-content:center; z-index:5; transition:background .2s; padding:0; }
  .article-hero-arrow:hover { background:rgba(0,0,0,0.7); }
  .article-hero-arrow.prev { left:10px; }
  .article-hero-arrow.next { right:10px; }
  .article-hero:hover .article-hero-arrow { display:flex; }
  .article-hero-dots { position:absolute; left:0; right:0; bottom:50px; display:flex; justify-content:center; gap:6px; z-index:4; }
  .article-hero-dots .dot { width:9px; height:9px; border-radius:50%; background:rgba(255,255,255,0.6); cursor:pointer; transition:all .2s; box-shadow:0 1px 3px rgba(0,0,0,0.2); }
  .article-hero-dots .dot.active { background:#0a4d8c; transform:scale(1.15); }
  .articles-side { grid-column:3/5; grid-row:1/3; display:grid; grid-template-columns:1fr 1fr; grid-template-rows:1fr 1fr; gap:12px; min-height:0; }
  .article-card { border:1px solid #e5e7eb; border-radius:8px; overflow:hidden; transition:box-shadow .2s; background:#fff; display:flex; flex-direction:column; height:100%; }
  .article-card:hover { box-shadow:0 3px 12px rgba(0,0,0,0.07); }
  .article-thumb { width:100%; aspect-ratio:4/3; flex:1 1 auto; min-height:0; background:linear-gradient(135deg,#0a4d8c,#0077b0); display:flex; align-items:center; justify-content:center; color:rgba(255,255,255,0.85); font-size:36px; }
  .article-thumb img { width:100%; height:100%; object-fit:cover; display:block; }
  .article-body { padding:8px 10px 7px; flex:0 0 auto; margin-top:auto; overflow:hidden; }
  .article-body h3 { font-size:13px; margin-bottom:3px; line-height:1.35; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
  .article-body h3 a { color:#1f2937; }
  .article-body h3 a:hover { color:var(--link-hover); }
  .article-body p { color:#6b7280; font-size:12px; line-height:1.4; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
  .article-meta { margin-top:5px; color:#6b7280; font-size:11px; }
  .pv-articles-banner { grid-column:1/3; grid-row:2; border:1px solid #e5e7eb; border-radius:8px; overflow:hidden; }
  .pv-articles-banner img { width:100%; height:100%; display:block; object-fit:cover; }
  .pv-articles-banner a { display:block; cursor:pointer; }
  .pv-articles-banner a:hover img { opacity:.88; }
  .pv-articles-banner a:hover { box-shadow:0 2px 10px rgba(26,102,179,.35); }
  @media (max-width:900px) {
    .pv-articles { grid-template-columns:1fr 1fr; }
    .article-hero { grid-column:1/3; grid-row:1; }
    .articles-side { grid-column:1/3; grid-row:2; grid-template-columns:1fr 1fr; grid-template-rows:1fr; }
    .pv-articles-banner { grid-column:1/3; grid-row:3; }
  }

  @media (max-width: 760px) {
    .search, .quick { display: none; }
    .linklist { grid-template-columns: repeat(2, 1fr); }
    .logowall { grid-template-columns: repeat(3, 1fr); }
  }
  /* a11y round2: touch targets + link distinguishability (2026-09-29) */
  .topbar .quick a { display: inline-block; padding: 7px 0; }
  .linklist .item { display: inline-block; padding: 5px 0; }
  .featurerows .row a { display: inline-block; padding: 4px 0; }
  .footer-inner a { padding: 3px 0; }
  .art a.t { display: inline-block; padding: 4px 0; }
  .section-head .more { display: inline-block; padding: 6px 0; }
  p a, .prose a, .intro a, .cmeta a { text-decoration: underline; text-underline-offset: 2px; }


  /* inner-page additions */
  .crumb { padding: 10px 12px 0; font-size: 12px; color: #6b7280; max-width: 1000px; margin: 0 auto; }
  .crumb a { color: #1a4f9c; }
  .intro { max-width: 1000px; margin: 6px auto 0; padding: 0 12px; font-size: 14px; color: #374151; line-height: 1.7; }
  .wrap { max-width: 1000px; margin: 0 auto; padding: 0 12px 24px; }
  .row .ext { margin-left: auto; font-size: 12px; color: #1a4f9c; white-space: nowrap; }
  .row .ext.off { color: #6b7280; }
  .row .num { min-width: 26px; text-align: right; color: #6b7280; font-size: 12px; }
  .row { display: flex; align-items: baseline; gap: 10px; padding: 7px 4px; border-bottom: 1px solid #f1f3f5; }
  .row .name { font-weight: 600; color: #1a4f9c; }
  .row .desc { font-size: 12.5px; color: #6b7280; }
  .pager { display: flex; gap: 6px; flex-wrap: wrap; padding: 14px 2px; }
  .pager a, .pager span.cur { padding: 4px 10px; border: 1px solid #d6d9de; border-radius: 4px; font-size: 13px; color: #1a4f9c; }
  .pager span.cur { background: var(--blue, #1a4f9c); color: #fff; border-color: var(--blue, #1a4f9c); }
  .pager .lbl { border: 0; color: #6b7280; padding: 4px 2px; }
  .subgrid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 8px; padding: 10px 4px; }
  .subgrid a { border: 1px solid #e3e6ea; border-radius: 6px; padding: 9px 10px; font-size: 13.5px; color: #1a4f9c; font-weight: 600; }
  .subgrid a small { display: block; font-weight: 400; color: #6b7280; font-size: 12px; margin-top: 2px; }
  .subgrid a:hover { border-color: #1a4f9c; text-decoration: none; }
  .cmeta { font-size: 13px; color: #6b7280; padding: 2px 0 10px; }
  .cmeta b { color: #374151; font-weight: 600; }
  .csite { display: inline-block; background: var(--blue, #1a4f9c); color: #fff; padding: 8px 16px; border-radius: 6px; font-size: 14px; font-weight: 600; margin: 4px 0 12px; }
  .csite:hover { text-decoration: none; opacity: .92; }
  .taglist { padding: 2px 0 14px; }
  .taglist a, .taglist span { display: inline-block; background: #eef2f7; color: #374151; font-size: 12px; padding: 5px 10px; border-radius: 12px; margin: 0 5px 5px 0; }
  .prose { font-size: 14.5px; line-height: 1.8; color: #2c3138; padding: 4px 4px 10px; max-width: 860px; }
  .prose h2 { font-size: 17px; margin: 18px 0 8px; color: #111827; }
  .prose p { margin: 0 0 10px; }
  .prose table { border-collapse: collapse; width: 100%; font-size: 13px; margin: 8px 0 12px; }
  .prose td, .prose th { border: 1px solid #dfe3e8; padding: 6px 9px; text-align: left; }
  .prose th { background: #f3f6fa; }
  .section-head h1 { font-size: 14px; color: var(--blue-dark); border-left: 3px solid var(--blue); padding-left: 7px; margin: 0; }
  .sr-h1 { position:absolute; width:1px; height:1px; margin:-1px; padding:0; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; border:0; }
  .row a { display: inline-block; padding: 4px 0; }
  .section-head .more { display: inline-block; padding: 6px 0; }
  p a, .prose a, .intro a, .cmeta a { text-decoration: underline; text-underline-offset: 2px; }
  @media (max-width:760px){ .subgrid { grid-template-columns: repeat(2,1fr); } }


img{-webkit-user-drag:none;user-drag:none}
.noselect,.noselect *{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}


.footer-contact { margin-left: auto; text-align: left; color: #555; font-size: 13px; line-height: 1.7; padding: 2px 0; max-width: 340px; }
.footer-contact a { color: #1d5fae; font-weight: 600; }
