
:root {
  --page: #fff;
  --border: #a2a9b1;
  --border-light: #c8ccd1;
  --text: #202122;
  --muted: #54595d;
  --link: #0645ad;
  --link-hover: #0b0080;
  --tab-border: #a7d7f9;
  --side: #f8f9ff;
  --yellow: #ffcc00;
  --yellow-border: #d49a00;
  --code: #f6f6f6;
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  color: var(--text);
  background: var(--page);
  font-family: Arial, Helvetica, sans-serif;
  font-size: 16px;
  line-height: 1.55;
}
a { color: var(--link); text-decoration: none; }
a:hover { color: var(--link-hover); text-decoration: underline; }
.wiki-topbar {
  min-height: 72px;
  padding: 18px 48px 12px;
  display: flex;
  align-items: center;
  gap: 24px;
}
.site-drawer { position: relative; }
.site-drawer summary {
  list-style: none;
  cursor: pointer;
  font-size: 30px;
  line-height: 1;
  color: #444;
  width: 28px;
  height: 32px;
  display: grid;
  place-items: center;
  user-select: none;
}
.site-drawer summary::-webkit-details-marker { display: none; }
.drawer-menu {
  position: absolute;
  top: 42px;
  left: 0;
  width: 290px;
  max-height: min(70vh, 520px);
  overflow: auto;
  background: #fff;
  border: 1px solid var(--border);
  box-shadow: 0 4px 16px rgba(0,0,0,.14);
  z-index: 50;
  padding: 12px 0;
}
.drawer-title { font-weight: 700; padding: 8px 16px; color: #202122; border-bottom: 1px solid var(--border-light); margin-bottom: 6px; }
.drawer-menu a { display: block; padding: 8px 16px; font-size: 15px; }
.wordmark {
  color: #000080;
  font-size: 18px;
  font-weight: 700;
  white-space: nowrap;
}
.top-search { position: relative; flex: 0 1 590px; max-width: 590px; }
.top-search input {
  width: 100%;
  height: 38px;
  border: 1px solid #72777d;
  border-radius: 2px;
  padding: 0 14px 0 45px;
  font-size: 15px;
  background: #fff;
}
.search-icon { position: absolute; left: 15px; top: 8px; width: 20px; height: 20px; border: 3px solid #54595d; border-radius: 50%; }
.search-icon::after { content:""; position:absolute; width:10px; height:3px; background:#54595d; transform:rotate(45deg); right:-7px; bottom:-5px; border-radius:3px; }
.top-more { margin-left: auto; font-weight: 700; font-size: 24px; letter-spacing: 3px; }
.page-shell { width: min(1120px, calc(100% - 80px)); margin: 0 auto; }
.wiki-tabs { display:flex; justify-content:space-between; border-bottom:1px solid var(--tab-border); margin-top:8px; }
.tab-left, .tab-right { display:flex; align-items:end; gap:0; }
.wiki-tabs a { display:inline-flex; align-items:center; min-height:42px; padding:0 12px; border:1px solid transparent; border-bottom:none; font-size:14px; }
.wiki-tabs a.active { color:#202122; background:#fff; border-color:var(--tab-border); border-bottom:1px solid #fff; margin-bottom:-1px; }
.wiki-title { font-family: Georgia, 'Times New Roman', serif; font-weight:400; font-size:34px; line-height:1.25; margin:26px 0 8px; border-bottom:1px solid var(--border); padding-bottom:5px; }
.portal-row { display:flex; align-items:center; gap:22px; flex-wrap:wrap; padding:28px 0 18px; border-bottom:1px solid var(--border); }
.portal-link { display:inline-flex; align-items:center; gap:8px; font-weight:700; font-size:16px; }
.portal-link img { width:48px; height:48px; object-fit:contain; flex:0 0 auto; }
.content-layout { display:grid; grid-template-columns:minmax(0, 1fr) 300px; gap:34px; padding-top:20px; align-items:start; }
.content-main { min-width:0; }
.wiki-section { margin:0 0 18px; animation: fadeInUp .34s ease both; }
.section-title { display:flex; align-items:center; gap:12px; margin:0 0 8px; font-weight:700; font-size:16px; }
.section-title img { width:48px; height:48px; object-fit:contain; }
ul { margin-top:8px; padding-left:24px; }
li { margin:3px 0; }
p { margin:10px 0; }
.wiki-article h1, .wiki-article h2, .wiki-article h3, .wiki-article h4 { color:#202122; }
.wiki-article h1 { font-family: Georgia, 'Times New Roman', serif; font-size:30px; font-weight:400; border-bottom:1px solid var(--border); padding-bottom:5px; margin:0 0 18px; }
.wiki-article h2 { font-family: Georgia, 'Times New Roman', serif; font-size:25px; font-weight:400; border-bottom:1px solid var(--border-light); padding-bottom:5px; margin:28px 0 12px; }
.wiki-article h3 { font-size:18px; margin:22px 0 8px; }
.wiki-article img, .figure img { max-width:100%; height:auto; }
.figure { margin: 12px 0 20px; }
.side-column { width:300px; }
.download-btn { display:block; width:max-content; margin:0 auto 14px; padding:12px 21px; border-radius:5px; background:var(--yellow); color:#0645ad; font-weight:700; text-transform:uppercase; border:1px solid var(--yellow-border); }
.download-btn:hover { background:#ffd84a; text-decoration:none; }
.side-box { border:1px solid var(--border); background:var(--side); padding:11px 13px; margin:0 0 16px; }
.side-box h3 { margin:0 0 7px; font-size:16px; color:#0645ad; }
.side-box ul { margin:0; padding-left:20px; }
.side-box li { margin:6px 0; font-size:15px; }
.category-box { margin:18px 0 12px; border:1px solid var(--border); background:#f8f9fa; padding:7px 9px; font-size:15px; }
.language-bar { display:flex; justify-content:flex-end; min-height:54px; position:relative; }
.language-menu { position:relative; display:inline-block; }
.language-menu summary { list-style:none; cursor:pointer; min-width:150px; padding:8px 12px; border:2px solid #36c; color:#36c; background:#fff; font-weight:700; border-radius:2px; user-select:none; }
.language-menu summary::-webkit-details-marker { display:none; }
.language-menu summary::after { content:"⌄"; float:right; margin-left:10px; }
.language-options { position:absolute; right:0; top:calc(100% + 2px); width:150px; border:1px solid var(--border); background:#fff; z-index:20; box-shadow:0 2px 5px rgba(0,0,0,.08); }
.language-options a { display:block; padding:10px 14px; }
.site-footer { margin:42px 0 0; padding:28px 0 56px; border-top:1px solid var(--border); display:grid; grid-template-columns:minmax(0,1fr) auto; gap:24px; align-items:center; font-size:14px; }
.footer-links { display:flex; flex-wrap:wrap; gap:18px; margin-top:14px; }
.footer-icons { display:flex; gap:12px; align-items:center; }
.footer-icons img { display:block; height:31px; width:auto; }
.code-block, pre { background:var(--code); border:1px solid var(--border-light); border-radius:2px; }
.code-block { position:relative; margin:12px 0; overflow:auto; }
.code-block pre, pre { margin:0; padding:12px 14px; overflow:auto; font-size:14px; line-height:1.45; }
.copy-btn, .copy-config-btn, .export-btn { border:1px solid var(--border); background:#f8f9fa; cursor:pointer; border-radius:2px; }
.copy-btn { position:absolute; top:6px; right:6px; padding:4px 7px; }
.config-panel, .config-wrapper { border:1px solid var(--border); background:#fff; padding:14px; margin:14px 0; }
.vm-grid { display:grid; grid-template-columns:repeat(auto-fit, minmax(210px, 1fr)); gap:12px; }
.vm-card { border:1px solid var(--border-light); padding:10px; background:#f8f9fa; }
.vm-card input { width:100%; padding:6px; border:1px solid var(--border); margin:3px 0 8px; }
.ip-group { display:grid; grid-template-columns:1fr auto 70px; gap:6px; align-items:center; }
.config-tabs { display:flex; gap:6px; flex-wrap:wrap; margin:14px 0; }
.config-tab { padding:7px 10px; border:1px solid var(--border); background:#f8f9fa; cursor:pointer; }
.config-tab.active { background:#eaf3ff; border-color:#36c; }
.config-output { min-height:180px; white-space:pre-wrap; }
.export-bar { margin:14px 0; }
.export-btn, .copy-config-btn { padding:7px 10px; }
.scroll-top { position:fixed; right:22px; bottom:22px; width:42px; height:42px; border:1px solid var(--border); background:#f8f9fa; color:#0645ad; border-radius:2px; cursor:pointer; opacity:.86; }
.scroll-top:hover { opacity:1; }
@keyframes fadeInUp { from { opacity:0; transform:translateY(8px); } to { opacity:1; transform:translateY(0); } }
@media (max-width: 900px) {
  .wiki-topbar { padding:14px 18px; gap:12px; flex-wrap:wrap; }
  .wordmark { font-size:16px; }
  .top-search { order:3; flex:1 0 100%; max-width:none; }
  .page-shell { width:min(100% - 26px, 1120px); }
  .wiki-tabs { overflow-x:auto; }
  .wiki-title { font-size:29px; }
  .portal-row { gap:14px; padding-top:22px; }
  .portal-link { width:calc(50% - 8px); font-size:14px; }
  .content-layout { grid-template-columns:1fr; gap:20px; }
  .side-column { width:auto; }
  .site-footer { grid-template-columns:1fr; }
}
@media (max-width: 560px) {
  body { font-size:15px; }
  .site-drawer summary { font-size:24px; }
  .top-more { display:none; }
  .portal-link { width:100%; }
  .wiki-tabs a { padding:0 9px; font-size:13px; }
  .wiki-title { font-size:26px; }
  .content-layout { padding-top:14px; }
  .site-footer { padding-bottom:38px; }
  .language-bar { justify-content:flex-start; }
  .drawer-menu { width:260px; }
}


/* Added for the three-page clean wiki build */
.wiki-table { width:100%; border-collapse:collapse; margin:14px 0 20px; background:#fff; }
.wiki-table th, .wiki-table td { border:1px solid var(--border); padding:8px 10px; vertical-align:top; }
.wiki-table th { background:#eaecf0; text-align:left; }
.image-frame { border:1px solid var(--border-light); background:#fff; padding:8px; }
.image-frame figcaption { color:var(--muted); font-size:14px; margin-top:6px; text-align:center; }
.module-toc ul { column-count:3; column-gap:30px; }
.pdf-page { margin: 0 0 32px; }
.pdf-frame img { display:block; margin:0 auto; width:min(100%, 860px); }
.pdf-text { margin:10px 0 0; border:1px solid var(--border-light); background:#f8f9fa; padding:8px 10px; }
.pdf-text summary { cursor:pointer; color:var(--link); font-weight:700; }
.pdf-text pre { margin-top:8px; white-space:pre-wrap; background:#fff; }
@media (max-width: 700px) { .module-toc ul { column-count:1; } }


/* Text-integrated module page */
.module-toc {border:1px solid var(--border); background:#f8f9fa; padding:10px 14px; margin:12px 0 20px;}
.module-toc h2 {font-size:18px; margin:0 0 8px; border:0;}
.module-toc ul {columns:2; margin-top:6px;}
.wiki-article mark {background:#fff3cd; padding:0 2px;}
.wiki-article .figure img {max-width:100%; height:auto; display:block;}
.inline-image{display:block;margin:12px 0}.inline-image img{max-width:100%;height:auto;border:1px solid var(--border-light)}
.wiki-article .figure {margin:14px 0 18px;}
@media (max-width:760px){.module-toc ul{columns:1}.code-block pre, pre{font-size:12.5px}.wiki-article p,.wiki-article li{font-size:15px}}
