微件:AkComponents

用法：模板最外层元素加 ak-host 类，模板里写一次 {{#widget:AkComponents}}。

模板直接输出设计系统组件（.ak-archive 等）的 HTML 时用。Arknights 皮肤本来就全套加载组件样式，什么都不做； 其他皮肤（Vector / Vector 2022 / Minerva …）用 JS 加载皮肤自己的 skins.arknights.components + skins.arknights.fonts， 加载完给页面里的 .ak-host 加 ak-scope 当作用域根。做法同新首页（微件:Mpstyle/newskin）。

• 样式到位前 .ak-host 先 visibility: hidden，免得闪一下没样式的版面；脚本没跑起来 3 秒后照常显示，无 JS 的访客不藏。
• 旧 Vector / Minerva 的 <html> 不带 skin-theme-clientpref-*，令牌会跟随系统明暗，系统暗色下组件会变成亮页面里的一块黑，所以钉成亮色（<html data-theme="light">）。
• 组件的点击行为在 Arknights 皮肤上由皮肤脚本（skins.arknights.scripts 的 interactive.js）代管，其他皮肤上由这里补同样的几条，都挂在 document 上，脚本后建的组件也管得到：
  • 页签（.ak-tabs[data-tabs] .ak-tab）：点哪个哪个 is-active，同 data-tabs 的 .ak-tabpanel 只留 data-tab 对得上的那块。
  • 可折叠面板（.ak-panel--collapsible）：点标题栏（.ak-panel__head）切换 is-collapsed，[data-no-toggle] 里的不管。
  • 对话框：点 [data-dialog-open="选择器"] 对选中的 <dialog> 调 showModal()，点 [data-dialog-close] 关掉所在的 <dialog>。脚本建、挂在 <body> 下的对话框根节点同样标 ak-host；样式加载完以后才建的，打开时补上 ak-scope。
• 一页里写多次只输出一份。

见 prts-skin-migration/migration/paradox/README.md、prts-skin-migration/migration/enemy-list-collapse/README.md、prts-skin-migration/migration/enemy-data-dialog/README.md。