MediaWiki:Common.css：修订间差异

2025年4月26日 (六) 21:35的最新版本

/* 这里放置的CSS将应用于所有皮肤 */
@import url("https://fonts.googleapis.com/css2?family=Press+Start+2P&display=swap");
@import url("https://fastly.jsdelivr.net/gh/hoah2333/Fonts@main/Typeface-VonwaonBitmap-16px.css");
@import url("https://fastly.jsdelivr.net/gh/hoah2333/Fonts@main/Typeface-VonwaonBitmap-12px.css");

:root {
	--link-color: #0645ad;
	--link-color-active: #faa700;
	--custom-background-blue: #ccf;
	--custom-background-cyan: #cef;
	--custom-background-green: #cfc;
	--custom-background-gray: #d2d2d2;
	--custom-background-grey: var(--custom-background-gray);
	--custom-background-magenta: #fdf;
	--custom-background-orange: #fdb;
	--custom-background-purple: #ecf;
	--custom-background-red: #fcc;
	--custom-background-yellow: #ffc;
	--custom-border-blue: #36e;
	--custom-border-cyan: #9df;
	--custom-border-green: #5d5;
	--custom-border-gray: #bbb;
	--custom-border-grey: var(--custom-border-gray);
	--custom-border-magenta: #f9f;
	--custom-border-orange: #f90;
	--custom-border-purple: #96c;
	--custom-border-red: #e44;
	--custom-border-yellow: #fc3;
	--custom-closed-topic-neutral: #eef;
	--custom-closed-topic-no: #fee;
	--custom-closed-topic-yes: #efe;
	--custom-code-background: #f8f9fa;
	--custom-load-page-button-color: #fff8;
	--custom-main-page-background: #fcfcfc;
	--custom-main-page-border: var(--custom-border-gray);
	--custom-main-page-edition-subheader: #333;
	--custom-mcwiki-header-color: #bcd4f5;
	--custom-navbox-background: #fff;
	--custom-navbox-top: #ccc;
	--custom-navbox-middle: #ddd;
	--custom-navbox-thru: #eee;
	--custom-nbt-inherit-color: #e6e6fa;
	--custom-table-background: #f8f9fa;
	--custom-table-alternate-background: #f0f1f2;
	--custom-table-choice-always: #003600;
	--custom-table-choice-always-background: #80d080;
	--custom-table-choice-default: #fff;
	--custom-table-choice-in-off-background: #060;
	--custom-table-choice-in-on-background: #0c0;
	--custom-table-choice-na: #000;
	--custom-table-choice-na-background: #fff;
	--custom-table-choice-neutral: #634800;
	--custom-table-choice-neutral-background: #ffeb9c;
	--custom-table-choice-never: #3c0404;
	--custom-table-choice-never-background: #ff8080;
	--custom-table-choice-no: #840606;
	--custom-table-choice-no-background: #ffc7ce;
	--custom-table-choice-out-off-background: #900;
	--custom-table-choice-out-on-background: #f00;
	--custom-table-choice-partial: #665400;
	--custom-table-choice-partial-background: #ffd;
	--custom-table-choice-planned: #0131b7;
	--custom-table-choice-planned-background: #dfdfff;
	--custom-table-choice-rarely: #533400;
	--custom-table-choice-rarely-background: #fdce5e;
	--custom-table-choice-unknown: #222;
	--custom-table-choice-unknown-background: #ccc;
	--custom-table-choice-yes: #005600;
	--custom-table-choice-yes-background: #c6efce;
	--custom-table-header-background: #eaecf0;
	--custom-topic-30-days: #bbb;
	--custom-topic-7-days: #ddd;
}
--pixel-font-16: 'VonwaonBitmap 16px', monospace;
  --pixel-font-12: 'VonwaonBitmap 12px', monospace;
  --title-font: var(--pixel-font-16);
  --body-font: var(--pixel-font-16);
  --small-font: var(--pixel-font-12);
  --UI-font: var(--pixel-font-12);
  
  .notaninfobox {
	position: relative;
	clear: right;
	margin: 0 0 1em 1em;
	width: 350px;
	font-size: 90%;
	background-color: var(--custom-table-background);
	float: right;
	border: 1px solid var(--custom-border-gray);
	padding: 2px;
	overflow: auto;
	z-index: 1;
	overflow-wrap: anywhere;
}
@media all and (max-width: 511px) {
	.notaninfobox {
		float: none;
		margin-left: 0;
		width: auto;
	}
}
@media all and (max-width: 337px) {
	.notaninfobox {
		margin-left: -16px;
		margin-right: -16px;
		border-left: none;
		border-right: none;
	}
}

.notaninfobox > .infobox-title {
	font-weight: bold;
	text-align: center;
	font-size: 120%;
	background-color: #BCD4F5;
}
.infobox-imagearea {
	text-align: center;
	padding: 4px;
}
.infobox-imagearea > div:not(:first-child) {
	padding-top: 1em;
}
/* Horizontally centre animated images */
.infobox-imagearea .animated {
	display: inline-flex;
	align-items: center;
}

.notaninfobox .infobox-rows {
	display: grid;
	grid-template-columns: max-content 1fr;
	gap: 1px;
}
.notaninfobox .infobox-rows .infobox-row {
	display: contents;
}

.notaninfobox .infobox-row .infobox-row-label,
.notaninfobox .infobox-row .infobox-row-field {
	padding: 4px;
}

.notaninfobox .infobox-row .infobox-row-label {
	font-weight: bold;
	display: flex;
	align-items: center;
}
.community-updates {
  background: #fff0e6;
  padding: 15px;
  border-radius: 10px;
  margin-top: 20px;
}
.community-updates ul li {
  list-style: none;
  padding: 10px;
  background: #fff;
  margin: 5px 0;
  border-radius: 5px;
  box-shadow: 0 2px 5px rgba(0,0,0,0.1);
}
.community-updates ul li a {
  color: #337ab7;
  text-decoration: none;
  font-weight: bold;
}
.notaninfobox .infobox-rows .infobox-row:nth-child(2n) .infobox-row-label,
.notaninfobox .infobox-rows .infobox-row:nth-child(2n) .infobox-row-field {
	background-color: var(--custom-table-alternate-background);
}

/* Infoboxes with tabber */
.tabber-container-infobox .tabber .tabbertab,
.tabber-container-infobox ul.tabbernav li a,
.tabber-container-infobox ul.tabbernav li.tabberactive a {
	background: none;
	border: none;
}

.tabber-container-infobox .tabber .tabbertab {
	padding: 0;
}

.tabber-container-infobox ul.tabbernav {
	font: inherit;
	font-size: 100%;
}

.tabber-container-infobox ul.tabbernav li a:hover {
	color: #000;
}

.tabber-container-infobox ul.tabbernav > li {
	margin-bottom: 5px;
	padding: 0;
}
.announcement-content span {
  display: inline-block;
  white-space: nowrap;
  animation: marquee 15s linear infinite;
}
.mw-mainpage-header {
    background: linear-gradient(to bottom right, #B9A3FF, #8C47E7);
    box-shadow: grey 0px 0px 5px;
    border-radius: 20px;
    color: #000;
    font-size: 1.5em;
    text-shadow: white 0px 0px 10px, white 0px 0px 10px;
    padding: 20px;
    text-align: center;
}

.mw-mainpage-header h1 {
    font-size: 2.5em;
    margin-bottom: 10px;
}

.mw-mainpage-header p {
    font-size: 1.2em;
    margin: 5px 0;
}
.tabber-container-infobox ul.tabbernav > li > a {
	color: #595959;
	padding-bottom: 1px;
	display: block;
}

/* To prevent the tabs from jumping around when they become active or inactive
 * due to the font-weight changing from normal to bold and vice versa, add an
 * invisible ::before which contains the same text as the tab's text, but
 * bolded. This way the element in which unbolded text sits is sized according
 * to the bolded text, preventing it from resizing upon being selected.
 */
.tabber-container-infobox ul.tabbernav > li > a::before {
	display: block;
	content: attr(alt);
	font-weight: bold;
	height: 0;
	color: transparent;
	overflow: hidden;
	visibility: hidden;
}

.tabber-container-infobox ul.tabbernav > li.tabberactive {
	border: none;
}

.modulebox {
  border: 1px solid #ccc;
  padding: 10px;
  margin: 10px 0;
  background-color: #f9f9f9;
}

.tabber-container-infobox ul.tabbernav > li.tabberactive > a {
	font-weight: bold;
	color: var(--link-color);
	border-bottom: 2px solid var(--custom-mcwiki-header-color);
}

.infobox-rows p {
	margin: 0;
}

/* Merge adjacent dls in the infobox, since they're usually supposed to be one,
 * but the wiki screws up sometimes.
 */
.infobox-rows dl + dl {
	margin-top: -0.4em;
}

.infobox-rows dl:last-child {
	margin-bottom: 0.2em;
}

.infobox-footer {
	text-align: center;
}

/* 页面底部导航框（2011年8月16日引自中文维基）(所谓大家族模板) */
table.navbox{
    border:1px solid #aaa;
    clear:both;
    margin:auto;
    padding:1px;
    text-align:center;
    width:100%;
}
 
table.navbox + table.navbox{
    margin-top:-1px;
}
 
.navbox-title,
.navbox-abovebelow,
table.navbox th{
    padding-left:1em;
    padding-right:1em;
    text-align:center;
}
 
.navbox-group{
    font-weight:700;
    white-space:nowrap;
}
 
.navbox,
.navbox-subgroup{
    background:none repeat scroll 0 0 var(--theme-card-background-color, #fdfdfd);
}
 
.navbox-list{
    border-color:#fdfdfd;
}
 
.navbox-title,
table.navbox th{
    background:none repeat scroll 0 0 #a5e4a5;
}
 
.navbox-abovebelow,
.navbox-group,
.navbox-subgroup .navbox-title{
    background:none repeat scroll 0 0 #c0ecc0;
}
 
.navbox-subgroup .navbox-group,
.navbox-subgroup .navbox-abovebelow{
    background:none repeat scroll 0 0 #e6f6e6;
}
 
.navbox-even{
    background:none repeat scroll 0 0 #f5fcf5;
}
 
.navbox-odd{
    background:none repeat scroll 0 0 #fdfdfd;
}
.collapseButton {
    float: right;
    font-weight: 400;
    text-align: right;
    width: auto;
}
.navbox .collapseButton {
    width: 6em;
}
.navbar {
    position: relative;
    min-height: 23px !important;
    margin-bottom: 0px !important;
    border: 1px solid transparent;
}
.navbox-title .Wikiplus-Edit-EveryWhereBtn {
	display: none;
}

@media only screen and (max-width:759px){
	.infotable {
	    width: 90%;
	    float: none;
	    margin: 0 auto;
	}
	
	/*.navbox {*/
	/*	display:none;*/
	/*}*/
	/*“查·论·编”在小屏幕时基本用不到（也很难点到）*/
	.navbox-title>div{
        display: none;
    }
    /*把内边距去掉*/
    .navbox-group,
    .navbox-group >div{
        padding-left: 0 !important;
        padding-right: 0 !important;
        text-align: center;
    }
}

/* h1标题字体 */
body h1 {
    font-family: "Microsoft YaHei", "微软雅黑", sans-serif !important;
}

/* 本段内容来自萌娘百科 https://zh.moegirl.org.cn/MediaWiki:Gadget-site-styles.css 感谢贡献！*/
/* 版权协定：知识共享 署名-非商业性使用-相同方式共享 3.0 */

.heimu,
.heimu rt{
    --heimu-color:#252525;
    --heimu-text-color:#fff;
    --heimu-link-color:#add8e6;
    --heimu-visited-link-color:#c5cae9;
    --heimu-new-link-color:#fcc;
    --heimu-new-visited-link-color:#ef9a9a;
    --heimu-extiw-visited-link-color:#d1c4e9;

    background-color:var(--heimu-color);
}

.heimu,
.heimu a,
a .heimu,
a.new .heimu,
span.heimu a:visited,
span.heimu a.new,
span.heimu a.external,
span.heimu a.external:visited,
span.heimu a.extiw,
span.heimu a.extiw:visited,
span.heimu a.mw-disambig,
span.heimu a.mw-redirect{
    transition:color 0.13s linear;
    color:var(--heimu-color);
    text-shadow:none;
}

span.heimu:hover,
span.heimu:active{
    color:var(--heimu-text-color);
}

span.heimu:hover a,
a:hover span.heimu{
    color:var(--heimu-link-color);
}

span.heimu:hover a:visited,
a:visited:hover span.heimu{
    color:var(--heimu-visited-link-color);
}

span.heimu:hover a.new,
a.new:hover span.heimu{
    color:var(--heimu-new-link-color);
}

span.heimu a.new:hover:visited,
a.new:hover:visited span.heimu{
    color:var(--heimu-new-visited-link-color);
}

span.heimu:hover a.extiw:visited,
a.extiw:visited:hover span.heimu{
    color:var(--heimu-extiw-visited-link-color);
}
[color-mode="dark"] .heimu,
[color-mode="dark"] .heimu rt{
    --heimu-color:#5e6272;
}

/*
	该文档为一个hover特效库，由一些常用的效果以及GitHub上的开源项目“Hover.css”的一些部分构成。
	请使用hovers在页面中进行载入。
*/

/* hover状态切换 */
.hover-change,
.hover-remote {
  position: relative;
  display: inline-block;
  transition: opacity 0.5s linear;
}

.hover-change-before,
.hover-change-after,
.hover-remote-target {
  transition: inherit;
}

.hover-change-after,
.hover-remote-target {
  opacity: 0;
  position: absolute;
  top: 0;
  left: 0;
}
.hover-remote-target {
  left: 100%;
}

.hover-change-after[style^='right:'],
.hover-change-after[style*=' right:'],
.hover-remote-after[style^='right:'],
.hover-remote-after[style*=' right:'] {
  left: initial;
}

.hover-change-after[style^='bottom:'],
.hover-change-after[style*=' bottom:'],
.hover-remote-after[style^='bottom:'],
.hover-remote-after[style*=' bottom:'] {
  top: initial;
}

.hover-change-after:hover,
.hover-remote-target {
  opacity: 0;
  margin-left: -9999px;
}

/* 主要用于制作hover形式的标签页(tab)切换 */
.hover-tab-mode {
  position: relative;
  transition: none;
}
.hover-tab-mode .hover-remote {
  transition: inherit;
  position: static;
}

/* 闪烁效果 */
.hover-change.flash:hover .hover-change-before {
  margin-left: -9999px;
}

.hover-change:hover > .hover-change-before,
.hover-remote > .hover-remote-target,
.hover-change:hover > a > .hover-change-before,
.hover-remote > a > .hover-remote-target {
  opacity: 0;
}

.hover-change:hover > .hover-change-after,
.hover-remote:hover > .hover-remote-target,
.hover-change:hover > a > .hover-change-after,
.hover-remote:hover > a > .hover-remote-target {
  opacity: 1;
  margin-left: initial;
}

/* 基类 */
[class*='hovers-'] {
  display: inline-block;
  box-shadow: 0 0 1px rgba(0, 0, 0, 0);
  transform: perspective(1px) translateZ(0);
  vertical-align: middle;
  transition-duration: 0.25s;
  transition-property: all;
}

/* 旋转放大 */
.hovers-rotate-shrink {
  transition-duration: 0.5s;
  transform: rotate(0) scale(0.75);
}
.hovers-rotate-shrink:hover {
  transform: rotate(360deg) scale(1);
}

.hovers-rotate-shrink-reverse {
  transition-duration: 0.5s;
  transform: rotate(360deg) scale(0.75);
}

.hovers-rotate-shrink-reverse:hover {
  transform: rotate(0) scale(1);
}

/* 旋转 */
.hovers-rotate,
.hovers-rotate-reverse:hover {
  transition-duration: 0.5s;
  transform: rotate(0);
}

.hovers-rotate-reverse,
.hovers-rotate:hover {
  transition-duration: 0.5s;
  transform: rotate(360deg);
}

/* 正常 => 浅 */
.hovers-fade-deep,
.hovers-fade,
.hovers-fade-shallow {
  opacity: 1;
}
.hovers-fade-deep:hover,
.hovers-fade-deep.active {
  opacity: 0.35;
}
.hovers-fade:hover,
.hovers-fade.active {
  opacity: 0.5;
}
.hovers-fade-shallow:hover,
.hovers-fade-shallow.active {
  opacity: 0.75;
}

/* 浅 => 正常 */
.hovers-bloom-deep {
  opacity: 0.35;
}
.hovers-bloom {
  opacity: 0.5;
}
.hovers-bloom-shallow {
  opacity: 0.75;
}

.hovers-bloom-deep:hover,
.hovers-bloom-deep.active,
.hovers-bloom:hover,
.hovers-bloom.active,
.hovers-bloom-shallow:hover,
.hovers-bloom-shallow.active {
  opacity: 1;
}

/* 正常 => 大 */
.hovers-grow-deep,
.hovers-grow,
.hovers-grow-shallow {
  transform: scale(1);
}
.hovers-grow-deep:hover,
.hovers-grow-deep.active {
  transform: scale(1.5);
}
.hovers-grow:hover,
.hovers-grow.active {
  transform: scale(1.25);
}
.hovers-grow-shallow:hover,
.hovers-grow-shallow.active {
  transform: scale(1.1);
}

/* 正常 => 小 */
.hovers-shrink-deep:hover,
.hovers-shrink-deep.active,
.hovers-shrink:hover,
.hovers-shrink.active,
.hovers-shrink-shallow:hover,
.hovers-shrink-shallow.active {
  transform: scale(1);
}
.hovers-shrink-deep {
  transform: scale(0.5);
}
.hovers-shrink {
  transform: scale(0.75);
}
.hovers-shrink-shallow {
  transform: scale(0.9);
}

/* 左右抖动 */
@keyframes shake-flexible {
  25% {
    transform: translateX(-0.0625em);
  }

  50% {
    transform: translateX(0.0625em);
  }

  75% {
    transform: translateX(-0.0625em);
  }
}

.hovers-shake-flexible:hover,
.hovers-shake-flexible.active {
  animation: shake-flexible 0.5s ease-out;
}

@keyframes shake {
  25% {
    transform: translateX(-8px);
  }

  50% {
    transform: translateX(8px);
  }

  75% {
    transform: translateX(-8px);
  }
}

.hovers-shake:hover,
.hovers-shake.active {
  animation: shake 0.5s ease-out;
}

/* 上下抖动 */
@keyframes bounce-flexible {
  25% {
    transform: translateY(-0.0625em);
  }

  50% {
    transform: translateY(0.0625em);
  }

  75% {
    transform: translateY(-0.0625em);
  }
}

.hovers-bounce-flexible:hover,
.hovers-bounce-flexible.active {
  animation: bounce-flexible 0.5s ease-out;
}

@keyframes bounce {
  25% {
    transform: translateY(-8px);
  }

  50% {
    transform: translateY(8px);
  }

  75% {
    transform: translateY(-8px);
  }
}

.hovers-bounce:hover,
.hovers-bounce.active {
  position: relative;
  left: 0;
  animation: bounce 0.5s ease-out;
}

/* 绕顶端中点抖动 */
@keyframes swing {
  20% {
    transform: rotate3d(0, 0, 1, 10deg);
  }

  40% {
    transform: rotate3d(0, 0, 1, -10deg);
  }

  60% {
    transform: rotate3d(0, 0, 1, 5deg);
  }

  80% {
    transform: rotate3d(0, 0, 1, -5deg);
  }

  to {
    transform: rotate3d(0, 0, 1, 0deg);
  }
}

.hovers-swing {
  transform-origin: top center;
}
.hovers-swing:hover,
.hovers-swing.active {
  animation: swing 0.75s ease-out;
}

/* 正常 => 大 */
@keyframes pulse-grow {
  to {
    transform: scale(1.1);
  }
}

.hovers-pulse-grow:hover,
.hovers-pulse-grow.active {
  animation: pulse-grow 0.5s linear infinite alternate;
}

/* 正常 => 小 */
@keyframes pulse-shrink {
  to {
    transform: scale(0.9);
  }
}

.hovers-pulse-shrink:hover,
.hovers-pulse-shrink.active {
  animation: pulse-shrink 0.5s linear infinite alternate;
}

/* 正常 => 小 */
@keyframes push {
  50% {
    transform: scale(0.8);
  }
}

.hovers-push:hover,
.hovers-push.active {
  animation: push 0.3s linear;
}

/* 正常 => 大 */
@keyframes pop {
  50% {
    transform: scale(1.2);
  }
}

.hovers-pop:hover,
.hovers-pop.active {
  animation: pop 0.3s linear;
}

/* 正常 => 大 => 正常 => 大 */
.hovers-bounce-in:hover,
.hovers-bounce-in.active {
  transform: scale(1.2);
  transition-duration: 0.5s;
  transition-timing-function: cubic-bezier(0.47, 2.02, 0.31, -0.36);
}

/* 正常 => 小 => 正常 => 小 */
.hovers-bounce-out:hover,
.hovers-bounce-out.active {
  transform: scale(0.8);
  transition-duration: 0.5s;
  transition-timing-function: cubic-bezier(0.47, 2.02, 0.31, -0.36);
}

/* 倾斜 */
.hovers-tilt:hover,
.hovers-tilt.active {
  transition-duration: 0.3s;
  transform: rotate(4deg);
}

/* 倾斜 + 放大 */
.hovers-grow-rotate:hover,
.hovers-grow-rotate.active {
  transition-duration: 0.3s;
  transform: scale(1.1) rotate(4deg);
}

/* 升起 */
.hovers-float:hover,
.hovers-float.active {
  transition-duration: 0.3s;
  transition-timing-function: ease-out;
  transform: translateY(-8px);
}

/* 下沉 */
.hovers-sink:hover,
.hovers-sink.active {
  transition-duration: 0.3s;
  transition-timing-function: ease-out;
  transform: translateY(8px);
}

/* 飘浮 */
@keyframes bob {
  0% {
    transform: translateY(-10px);
  }
  50% {
    transform: translateY(-5px);
  }
  100% {
    transform: translateY(-10px);
  }
}
@keyframes bob-float {
  100% {
    transform: translateY(-10px);
  }
}

.hovers-bob:hover,
.hovers-bob.active {
  animation-name: bob-float, bob;
  animation-duration: 0.3s, 1.5s;
  animation-delay: 0s, 0.3s;
  animation-timing-function: ease-out, ease-in-out;
  animation-iteration-count: 1, infinite;
  animation-fill-mode: forwards;
  animation-direction: normal, alternate;
}

/* 悬挂 */
@keyframes hang {
  0% {
    transform: translateY(10px);
  }
  50% {
    transform: translateY(5px);
  }
  100% {
    transform: translateY(10px);
  }
}
@keyframes hang-sink {
  100% {
    transform: translateY(10px);
  }
}

.hovers-hang:hover,
.hovers-hang.active {
  animation-name: hang-sink, hang;
  animation-duration: 0.3s, 1.5s;
  animation-delay: 0s, 0.3s;
  animation-timing-function: ease-out, ease-in-out;
  animation-iteration-count: 1, infinite;
  animation-fill-mode: forwards;
  animation-direction: normal, alternate;
}

/* 非对称 */
.hovers-skew:hover,
.hovers-skew.active {
  transform: skew(-10deg);
}

/* 非对称-左 */
.hovers-skew-forward {
  transform-origin: 0 100%;
}
.hovers-skew-forward:hover,
.hovers-skew-forward.active {
  transform: skew(-10deg);
}

/* 非对称-右 */
.hovers-skew-backward {
  transform-origin: 0 100%;
}
.hovers-skew-backward:hover,
.hovers-skew-backward.active {
  transform: skew(10deg);
}

/* 垂直抖动 */
@keyframes wobble-vertical {
  16.65% {
    transform: translateY(8px);
  }
  33.3% {
    transform: translateY(-6px);
  }
  49.95% {
    transform: translateY(4px);
  }
  66.6% {
    transform: translateY(-2px);
  }
  83.25% {
    transform: translateY(1px);
  }
  100% {
    transform: translateY(0);
  }
}

.hovers-wobble-vertical:hover,
.hovers-wobble-vertical.active {
  animation-name: wobble-vertical;
  animation-duration: 1s;
  animation-timing-function: ease-in-out;
  animation-iteration-count: 1;
}

/* 水平抖动 */
@keyframes wobble-horizontal {
  16.65% {
    transform: translateX(8px);
  }
  33.3% {
    transform: translateX(-6px);
  }
  49.95% {
    transform: translateX(4px);
  }
  66.6% {
    transform: translateX(-2px);
  }
  83.25% {
    transform: translateX(1px);
  }
  100% {
    transform: translateX(0);
  }
}
.hovers-wobble-horizontal:hover,
.hovers-wobble-horizontal.active {
  animation-name: wobble-horizontal;
  animation-duration: 1s;
  animation-timing-function: ease-in-out;
  animation-iteration-count: 1;
}

/* 右下弹回 */
@keyframes wobble-to-bottom-right {
  16.65% {
    transform: translate(8px, 8px);
  }
  33.3% {
    transform: translate(-6px, -6px);
  }
  49.95% {
    transform: translate(4px, 4px);
  }
  66.6% {
    transform: translate(-2px, -2px);
  }
  83.25% {
    transform: translate(1px, 1px);
  }
  100% {
    transform: translate(0, 0);
  }
}

.hovers-wobble-to-bottom-right:hover, 
.hovers-wobble-to-bottom-right.active {
  animation-name: wobble-to-bottom-right;
  animation-duration: 1s;
  animation-timing-function: ease-in-out;
  animation-iteration-count: 1;
}

/* 右上弹回 */
@keyframes wobble-to-top-right {
  16.65% {
    transform: translate(8px, -8px)
  }
  33.3% {
    transform: translate(-6px, 6px);
  }
  49.95% {
    transform: translate(4px, -4px);
  }
  66.6% {
    transform: translate(-2px, 2px);
  }
  83.25% {
    transform: translate(1px, -1px);
  }
  100% {
    transform: translate(0);
  }
}

.hovers-wobble-to-top-right:hover,
.hovers-wobble-to-top-right.active {
  animation-name: wobble-to-top-right;
  animation-duration: 1s;
  animation-timing-function: ease-in-out;
  animation-iteration-count: 1;
}

/* 果冻 */
@keyframes wobble-top {
  16.65% {
    transform: skew(-12deg);
  }
  33.3% {
    transform: skew(10deg);
  }
  49.95% {
    transform: skew(-6deg);
  }
  66.6% {
    transform: skew(4deg);
  }
  83.25% {
    transform: skew(-2deg);
  }
  100% {
    transform: skew(0);
  }
}

/* 赘肉 */
.hovers-wobble-top {
  transform-origin: 0 100%;
}
.hovers-wobble-top:hover,
.hovers-wobble-top.active {
  animation-name: wobble-top;
  animation-duration: 1s;
  animation-timing-function: ease-in-out;
  animation-iteration-count: 1;
}

@keyframes wobble-bottom {
  16.65% {
    transform: skew(-12deg);
  }
  33.3% {
    transform: skew(10deg);
  }
  49.95% {
    transform: skew(-6deg);
  }
  66.6% {
    transform: skew(4deg);
  }
  83.25% {
    transform: skew(-2deg);
  }
  100% {
    transform: skew(0);
  }
}

.hovers-wobble-bottom {
  transform-origin: 100% 0;
}
.hovers-wobble-bottom:hover,
.hovers-wobble-bottom.active {
  animation-name: wobble-bottom;
  animation-duration: 1s;
  animation-timing-function: ease-in-out;
  animation-iteration-count: 1;
}

/* 颤动 */
@keyframes wobble-skew {
  16.65% {
    transform: skew(-12deg);
  }
  33.3% {
    transform: skew(10deg);
  }
  49.95% {
    transform: skew(-6deg);
  }
  66.6% {
    transform: skew(4deg);
  }
  83.25% {
    transform: skew(-2deg);
  }
  100% {
    transform: skew(0);
  }
}
.hovers-wobble-skew:hover,
.hovers-wobble-skew.active {
  animation-name: wobble-skew;
  animation-duration: 1s;
  animation-timing-function: ease-in-out;
  animation-iteration-count: 1;
}

/* 振动 */
@keyframes buzz {
  50% {
    transform: translateX(3px) rotate(2deg);
  }
  100% {
    transform: translateX(-3px) rotate(-2deg);
  }
}

.hovers-buzz:hover,
.hovers-buzz.active {
  animation-name: buzz;
  animation-duration: 0.15s;
  animation-timing-function: linear;
  animation-iteration-count: infinite;
}

/* 振出 */
@keyframes buzz-out {
  10% {
    transform: translateX(3px) rotate(2deg);
  }
  20% {
    transform: translateX(-3px) rotate(-2deg);
  }
  30% {
    transform: translateX(3px) rotate(2deg);
  }
  40% {
    transform: translateX(-3px) rotate(-2deg);
  }
  50% {
    transform: translateX(2px) rotate(1deg);
  }
  60% {
    transform: translateX(-2px) rotate(-1deg);
  }
  70% {
    transform: translateX(2px) rotate(1deg);
  }
  80% {
    transform: translateX(-2px) rotate(-1deg);
  }
  90% {
    transform: translateX(1px) rotate(0);
  }
  100% {
    transform: translateX(-1px) rotate(0);
  }
}

.hovers-buzz-out:hover,
.hovers-buzz-out.active {
  animation-name: buzz-out;
  animation-duration: 0.75s;
  animation-timing-function: linear;
  animation-iteration-count: 1;
}

/* 右移 */
.hovers-forward:hover,
.hovers-forward.active {
  transform: translateX(8px);
}

/* 左移 */
.hovers-backward:hover,
.hovers-backward.active {
  transform: translateX(-8px);
}

/* 自由移动 */
.hovers-top,
.hovers-left,
.hovers-bottom,
.hovers-right {
  transition: all 0.5s;
}

.hovers-top:hover,
.hovers-top.active {
  transform: translateY(-0.0625em);
}

.hovers-left:hover,
.hovers-left.active {
  transform: translateX(-0.0625em);
}

.hovers-bottom:hover,
.hovers-bottom.active {
  transform: translateY(0.0625em);
}

.hovers-right:hover,
.hovers-right.active {
  transform: translateX(0.0625em);
}

/* 滤镜 */
.hovers-blur,
.hovers-blur-reverse,
.hovers-brightness,
.hovers-brightness-reverse,
.hovers-contrast,
.hovers-contrast-reverse,
.hovers-grayscale,
.hovers-grayscale-reverse,
.hovers-invert,
.hovers-invert-reverse,
.hovers-saturate,
.hovers-saturate-reverse,
.hovers-sepia,
.hovers-sepia-reverse,
.hovers-hue-rotate,
.hovers-hue-rotate-reverse {
  transition-duration: 0.75s;
}

.hovers-blur:hover,
.hovers-blur.active,
.hovers-brightness:hover,
.hovers-brightness.active,
.hovers-contrast:hover,
.hovers-contrast.active,
.hovers-grayscale:hover,
.hovers-grayscale.active,
.hovers-invert:hover,
.hovers-invert.active,
.hovers-saturate:hover,
.hovers-saturate.active,
.hovers-sepia:hover,
.hovers-sepia.active,
.hovers-hue-rotate:hover,
.hovers-hue-rotate.active {
  filter: initial;
}

.hovers-blur {
  filter: blur(5px);
}

.hovers-blur-reverse:hover,
.hovers-blur-reverse.active {
  filter: blur(5px);
}

.hovers-brightness {
  filter: brightness(50%);
}

.hovers-brightness-reverse:hover,
.hovers-brightness-reverse.active {
  filter: brightness(50%);
}

.hovers-contrast {
  filter: contrast(50%);
}

.hovers-contrast-reverse:hover,
.hovers-contrast-reverse.active {
  filter: contrast(50%);
}

.hovers-grayscale {
  filter: grayscale(100%);
}

.hovers-grayscale-reverse:hover, 
.hovers-grayscale-reverse.active {
  filter: grayscale(100%);
}

.hovers-invert {
  filter: invert(100%);
}

.hovers-invert-reverse:hover,
.hovers-invert-reverse.active {
  filter: invert(100%);
}

.hovers-saturate {
  filter: saturate(200%);
}

.hovers-saturate-reverse:hover,
.hovers-saturate-reverse.active {
  filter: saturate(200%);
}

.hovers-sepia {
  filter: sepia(100%);
}

.hovers-sepia-reverse:hover,
.hovers-sepia-reverse.acitve {
  filter: sepia(100%);
}

.hovers-hue-rotate {
  filter: hue-rotate(180deg);
}

.hovers-hue-rotate-reverse:hover,
.hovers-hue-rotate-reverse.active {
  filter: hue-rotate(180deg);
}

/* 背景滑动 */
.hovers-sweep-to-right,
.hovers-sweep-to-left,
.hovers-sweep-to-bottom,
.hovers-sweep-to-top,
.hovers-radial-out,
.hovers-radial-in {
  position: relative;
  transition-duration: 0.3s;
  transition-timing-function: ease-out;
  overflow: hidden;
}

.hovers-sweep-to-right:before,
.hovers-sweep-to-left:before,
.hovers-sweep-to-bottom:before,
.hovers-sweep-to-top:before,
.hovers-radial-out:before,
.hovers-radial-in:before {
  content: '';
  position: absolute;
  z-index: 10;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: inherit;
  transform: scaleX(0);
  transition: inherit;
}
.hovers-sweep-to-bottom:before,
.hovers-sweep-to-top:before {
  transform: scaleY(0);
}
.hovers-radial-out:before,
.hovers-radial-in:before {
  border-radius: 50%;
  transform: scale(0);
}
.hovers-radial-in:before {
  transform: scale(2);
}

.hovers-sweep-to-right:before {
  transform-origin: 0 50%;
}
.hovers-sweep-to-left:before {
  transform-origin: 100% 50%;
}
.hovers-sweep-to-bottom:before {
  transform-origin: 50% 0;
}
.hovers-sweep-to-top:before {
  transform-origin: 50% 100%;
}
.hovers-radial-out:hover:before,
.hovers-radial-out.active:before {
  transform: scale(2);
}
.hovers-radial-in:hover:before,
.hovers-radial-in.active:before {
  transform: scale(0);
}

.hovers-sweep-to-right .hovers-content.center,
.hovers-sweep-to-left .hovers-content.center,
.hovers-sweep-to-bottom .hovers-content.center,
.hovers-sweep-to-top .hovers-content.center,
.hovers-radial-out .hovers-content.center,
.hovers-radial-in .hovers-content.center {
  display: flex;
  align-items: center;
  justify-content: center;
  word-break: break-all;
}

.hovers-sweep-to-right:hover:before,
.hovers-sweep-to-left:hover:before,
.hovers-sweep-to-bottom:hover:before,
.hovers-sweep-to-top:hover:before,
.hovers-sweep-to-right.active:before,
.hovers-sweep-to-left:hover:before,
.hovers-sweep-to-bottom:hover:before,
.hovers-sweep-to-top:hover:before {
  transform: scaleX(1);
}

.hovers-sweep-to-right .hovers-content,
.hovers-sweep-to-left .hovers-content,
.hovers-sweep-to-bottom .hovers-content,
.hovers-sweep-to-top .hovers-content,
.hovers-radial-out .hovers-content,
.hovers-radial-in .hovers-content {
  width: 100%;
  height: 100%;
  position: absolute;
  transition-property: all;
  transition-duration: inherit;
  top: 0;
  left: 0;
  z-index: 11;
}

.hovers-sweep-to-right .hovers-content {
  left: initial;
  right: 100%;
}
.hovers-sweep-to-right:hover .hovers-content,
.hovers-sweep-to-right.active .hovers-content {
  right: 0;
}

.hovers-sweep-to-left .hovers-content {
  left: 100%;
}
.hovers-sweep-to-left:hover .hovers-content,
.hovers-sweep-to-left.active .hovers-content {
  left: 0;
}

.hovers-sweep-to-bottom .hovers-content {
  top: initial;
  bottom: 100%;
}
.hovers-sweep-to-bottom:hover .hovers-content,
.hovers-sweep-to-bottom.active .hovers-content {
  bottom: 0;
}

.hovers-sweep-to-top .hovers-content {
  top: 100%;
}
.hovers-sweep-to-top:hover .hovers-content,
.hovers-sweep-to-top.active .hovers-content {
  top: 0;
}

.hovers-radial-out .hovers-content,
.hovers-radial-in:hover .hovers-content,
.hovers-radial-in.active .hovers-content {
  opacity: 0;
}

.hovers-radial-in .hovers-content,
.hovers-radial-out:hover .hovers-content,
.hovers-radial-out.active .hovers-content {
  opacity: 1;
}

/* 默认em */
.hovers-border,
.hovers-trim,
.hovers-ripple-out,
.hovers-ripple-in,
.hovers-outline-out,
.hovers-outline-in,
.hovers-reveal {
  font-size: 160px;
  line-height: 16px;
}

/* 内边框滑出 */
.hovers-border,
.hovers-trim {
  position: relative;
  top: 0;
  left: 0;
  transition: all 0.3s;
}

.hovers-border:before {
  content: '';
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  box-sizing: border-box;
  transition: inherit;
  border-width: calc(0.0625em * 0.6);
  border-color: inherit;
  border-style: solid;
  border-radius: inherit;
  opacity: 0;
}

.hovers-border:hover:before,
.hovers-border.active:before {
  opacity: 1;
}

/* 带边距内边框 */
.hovers-trim:before {
  content: '';
  position: absolute;
  top: calc(0.0625em * 0.4);
  left: calc(0.0625em * 0.4);
  bottom: calc(0.0625em * 0.4);
  right: calc(0.0625em * 0.4);
  transition: inherit;
  border-width: calc(0.0625em * 0.6);
  border-color: inherit;
  border-style: solid;
  opacity: 0;
  border-radius: inherit;
}

.hovers-trim:hover:before,
.hovers-trim.active:before {
  opacity: 1;
}

/* 边框飞出与飞入 */
.hovers-ripple-out,
.hovers-ripple-in,
.hovers-outline-out,
.hovers-outline-in,
.hovers-reveal {
  animation-duration: 0.7s;
  animation-timing-function: ease-out;
  transition: all 0.3s;
}

.hovers-ripple-out:before,
.hovers-ripple-in:before,
.hovers-outline-out:before,
.hovers-outline-in:before,
.hovers-reveal:before {
  content: '';
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  animation: inherit;
  transition: inherit;
  border-width: calc(0.0625em * 0.6);
  border-color: inherit;
  border-style: solid;
  border-radius: inherit;
}
.hovers-ripple-out:before {
  opacity: 0;
}
.hovers-ripple-in:before {
  top: calc(-0.0625em * 1.2);
  right: calc(-0.0625em * 1.2);
  bottom: calc(-0.0625em * 1.2);
  left: calc(-0.0625em * 1.2);
  opacity: 0;
}
.hovers-outline-out:before {
  opacity: 0;
}
.hovers-outline-out:before {
  top: calc(-0.0625em * 1.6);
  right: calc(-0.0625em * 1.6);
  bottom: calc(-0.0625em * 1.6);
  left: calc(-0.0625em * 1.6);
  opacity: 0;
}
.hovers-reveal:before {
  border-width: 0;
  opacity: 0;
}

@keyframes ripple-out {
  50% {
    opacity: 1;
  }

  100% {
    top: calc(-0.0625em * 1.2);
    right: calc(-0.0625em * 1.2);
    bottom: calc(-0.0625em * 1.2);
    left: calc(-0.0625em * 1.2);
    opacity: 0;
  }
}
.hovers-ripple-out:hover:before,
.hovers-ripple-out.active:before {
  animation-name: ripple-out;
}

@keyframes ripple-in {
  50% {
    opacity: 1;
  }

  100% {
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    opacity: 0;
  }
}
.hovers-ripple-in:hover:before,
.hovers-ripple-in.active:before {
  animation-name: ripple-in;
}

.hovers-outline-out:hover:before,
.hovers-outline-in:hover:before,
.hovers-outline-out.active:before,
.hovers-outline-in:hover:before {
  top: calc(-0.0625em * 0.8);
  right: calc(-0.0625em * 0.8);
  bottom: calc(-0.0625em * 0.8);
  left: calc(-0.0625em * 0.8);
  opacity: 1;
}

.hovers-reveal:hover:before,
.hovers-reveal.active:before {
  transform: translateY(0);
  border-width: calc(0.0625em * 0.4);
  opacity: 1;
}

/* 圆角化 */
.hovers-round-corners {
  overflow: hidden;
}
.hovers-round-corners:hover,
.hovers-round-corners.active {
  border-radius: 0.0625em;
}

/* 重叠：翻转切换 */

.hover-turn {
  position: relative;
  transform: translateZ(1px);
}

.hover-turn-before,
.hover-turn-after {
  position: absolute;
  top: 0;
  left: 0;
}

@keyframes hover-turn {
  from {
    transform: rotateY(-90deg);
  }

  50% {
    transform: scale(1.2);
  }

  to {
    transform: rotateY(0);
  }
}

.hover-turn:not(:hover) .hover-turn-before,
.hover-turn:hover .hover-turn-after {
  animation: hover-turn 0.5s;
}

.hover-turn:hover .hover-turn-before,
.hover-turn:not(:hover) .hover-turn-after {
	opacity: 0;
}
/* [[Category:在模板名字空间下的CSS页面]] */

/*
.colormu_toggle_on是为了黑幕开关(MediaWiki:Gadget-heimu-toggle.js)做适配。
.colormu-drk、.colormu-bri分别是暗色背景和亮色背景，
暗色背景的文字通常是浅色，在半隐背景后，颜色需要变成深色。
*/
 
.colormu-drk {
	color: #FFF;
}
.colormu-bri {
	color: #000;
}
.colormu-drk:not(.colormu_toggle_on) a {
	color: #add8e6;
}
.colormu-drk:not(.colormu_toggle_on) a.new {
	color: #FCC;
}
.colormu>span, .colormu a, .colormu a>span {
	transition: color 0.2s;
}
 
.colormu:not(:hover):not(:active):not(.colormu_toggle_on)>span,
.colormu:not(:hover):not(:active):not(.colormu_toggle_on) a {
	color: transparent;
}
 
/* for T:Coloredlink in T:彩幕 */
.colormu:not(:hover):not(:active):not(.colormu_toggle_on) a>span {
	color: transparent !important;
}
 
/* for T:彩幕 in link */
a .colormu-bri {
	color: inherit;
}
a:hover .colormu>span, a:active .colormu>span,
/* and for MediaWiki:Gadget-heimu-toggle.js */
.colormu-drk.colormu_toggle_on, .colormu_toggle_on>span, .colormu-drk.colormu_toggle_on a>span {
	color: inherit !important;
}
 
/* [[Category:在模板名字空间下的CSS页面]] */

@@ 第1行： / 第1行： @@
 /* 这里放置的CSS将应用于所有皮肤 */
 @import url("https://fonts.googleapis.com/css2?family=Press+Start+2P&display=swap");
 @import url("https://fastly.jsdelivr.net/gh/hoah2333/Fonts@main/Typeface-VonwaonBitmap-16px.css");
@@ 第72行： / 第71行： @@
 	--custom-topic-30-days: #bbb;
 	--custom-topic-7-days: #ddd;
-	/* CRT效果相关变量 - 精细调整 */
-	--crt-primary-scanline-alpha: 0.12; /* 主扫描线透明度 */
-	--crt-secondary-scanline-alpha: 0.08; /* 副扫描线透明度 */
-	--crt-fast-scanline-alpha: 0.25; /* 快速扫描线透明度 */
-	--crt-flicker-alpha: 0.04; /* 屏幕闪烁强度 */
-	--crt-noise-alpha: 0.03; /* 噪点强度 */
-	--crt-glow-radius: 0.08em;
-	--crt-glow-color: rgba(0, 255, 100, 0.2); /* 辉光颜色和强度 */
-	--crt-text-shadow: 0 0 var(--crt-glow-radius) var(--crt-glow-color);
-	--crt-vignette-opacity: 0.12; /* 暗角效果强度 */
-	/* 网格背景相关变量 */
-	--grid-color: rgba(0, 0, 0, 0.08);
-	--grid-size: 40px;
-	--grid-line-width: 1px;
-	/* 字体设置 - 只使用VonwaonBitmap */
-	--pixel-font-16: 'VonwaonBitmap 16px', monospace;
-	--pixel-font-12: 'VonwaonBitmap 12px', monospace;
-	--title-font: var(--pixel-font-16);
-	--body-font: var(--pixel-font-16);
-	--small-font: var(--pixel-font-12);
-	--UI-font: var(--pixel-font-12);
-	/* 字体大小设置 */
-	--base-font-size: 15px;
-	--small-font-size: 13px;
-	--title-scale: 1.3;
-	--code-scale: 0.9;
-	/* 边框和内间距设置 */
-    --side-border-thickness: 0.1rem;
-    --main-border-thickness: 0.05rem;
-    /* 启用/禁用CRT效果 */
-    --crt-effects-display: block;
-    /* 质感相关变量 */
-    --glass-opacity: 0.92;
-    --glass-blur: 0px; /* 模糊效果 - 如果浏览器支持 */
-    --inset-shadow-depth: 25px;
-    --border-shine: rgba(255, 255, 255, 0.1);
-    --box-depth: 1px 1px 3px rgba(0, 0, 0, 0.15);
 }
+--pixel-font-16: 'VonwaonBitmap 16px', monospace;
-/* CRT效果动画 */
+  --pixel-font-12: 'VonwaonBitmap 12px', monospace;
-@keyframes flicker {
+  --title-font: var(--pixel-font-16);
-%, 100% { opacity: 0.98; }
+  --body-font: var(--pixel-font-16);
-% { opacity: 0.94; }
+  --small-font: var(--pixel-font-12);
-% { opacity: 0.99; }
+  --UI-font: var(--pixel-font-12);
-% { opacity: 0.95; }
-% { opacity: 0.98; }
+  .notaninfobox {
-% { opacity: 0.91; }
+	position: relative;
-% { opacity: 0.99; }
+	clear: right;
-% { opacity: 0.93; }
+	margin: 0 0 1em 1em;
+	width: 350px;
+	font-size: 90%;
+	background-color: var(--custom-table-background);
+	float: right;
+	border: 1px solid var(--custom-border-gray);
+	padding: 2px;
+	overflow: auto;
+	z-index: 1;
+	overflow-wrap: anywhere;
 }
+@media all and (max-width: 511px) {
-/* 主扫描线动画 - 更慢、更明显 */
+	.notaninfobox {
-@keyframes primary-scanline {
+		float: none;
-% { transform: translateY(-20px); }
+		margin-left: 0;
-% { transform: translateY(100vh); }
+		width: auto;
+	}
 }
+@media all and (max-width: 337px) {
-/* 副扫描线动画 - 中速移动 */
+	.notaninfobox {
-@keyframes secondary-scanline {
+		margin-left: -16px;
-% { transform: translateY(-100vh); }
+		margin-right: -16px;
-% { transform: translateY(100vh); }
+		border-left: none;
+		border-right: none;
+	}
 }
-/* 快速扫描线动画 - 快速闪过，更加随机 */
+.notaninfobox > .infobox-title {
-@keyframes fast-scanline {
+	font-weight: bold;
-%, 5% { opacity: 0; transform: translateY(-100vh); }
+	text-align: center;
-% { opacity: var(--crt-fast-scanline-alpha); }
+	font-size: 120%;
-% { opacity: var(--crt-fast-scanline-alpha); }
+	background-color: #BCD4F5;
-% { opacity: 0; }
-% { opacity: 0; transform: translateY(100vh); }
 }
+.infobox-imagearea {
-@keyframes crt-on {
+	text-align: center;
-% { opacity: 0; filter: brightness(5) saturate(0); }
+	padding: 4px;
-% { opacity: 0.3; filter: brightness(3) saturate(0.2); }
-% { opacity: 0.7; filter: brightness(2) saturate(0.5); }
-% { opacity: 0.8; filter: brightness(1.5) saturate(0.8); }
-% { opacity: 1; filter: brightness(1) saturate(1); }
 }
+.infobox-imagearea > div:not(:first-child) {
-/* 全局和背景样式 - 增强质感 */
+	padding-top: 1em;
-html {
-    min-height: 100%;
-    background-color: #ffffff;
-    background-image:
-        /* 网格线 */
-        linear-gradient(var(--grid-color) var(--grid-line-width), transparent var(--grid-line-width)),
-        linear-gradient(90deg, var(--grid-color) var(--grid-line-width), transparent var(--grid-line-width)),
-        /* 精细噪点纹理 */
-        url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='4' height='4' viewBox='0 0 4 4'%3E%3Cpath fill='%239C92AC' fill-opacity='0.08' d='M1 3h1v1H1V3zm2-2h1v1H3V1z'%3E%3C/path%3E%3C/svg%3E");
-    background-size: var(--grid-size) var(--grid-size), var(--grid-size) var(--grid-size), auto;
-    background-position: center center;
-    animation: crt-on 2s ease-out;
-    overflow-x: hidden; /* 防止水平滚动条出现 */
 }
+/* Horizontally centre animated images */
-body {
+.infobox-imagearea .animated {
-    font-family: var(--body-font);
+	display: inline-flex;
-    font-size: var(--base-font-size);
+	align-items: center;
-    line-height: 1.65;
-    color: #222;
-    position: relative;
-    min-height: calc(100vh - 2rem);
-    margin: 1rem;
-    padding: 1.5rem;
-    background-color: rgba(255, 255, 255, var(--glass-opacity));
-    border-radius: 4px;
-    border: 1px solid var(--border-shine);
-    box-shadow:
-        var(--box-depth),
-3px 12px rgba(0, 0, 0, 0.05),
-        inset 0 0 var(--inset-shadow-depth) rgba(0, 255, 100, 0.04);
-    animation: flicker 120s infinite alternate ease-in-out;
-    overflow: hidden; /* 隐藏超出部分，配合扫描线 */
-    backdrop-filter: blur(var(--glass-blur)); /* 支持的浏览器会有磨砂玻璃效果 */
-    -webkit-backdrop-filter: blur(var(--glass-blur));
 }
-/* 添加暗角效果 - 增强CRT显示器质感 */
+.notaninfobox .infobox-rows {
-body::before {
+	display: grid;
-    content: "";
+	grid-template-columns: max-content 1fr;
-    display: var(--crt-effects-display);
+	gap: 1px;
-    position: fixed;
-    top: 0;
-    left: 0;
-    width: 100%;
-    height: 100%;
-    pointer-events: none;
-    z-index: 9998;
-    background: radial-gradient(
-        circle at center,
-        transparent 40%,
-        rgba(0, 0, 0, var(--crt-vignette-opacity)) 140%
-    );
-    mix-blend-mode: multiply;
 }
+.notaninfobox .infobox-rows .infobox-row {
-/* CRT扫描线效果 - 使用新的三种不同类型的扫描线 */
+	display: contents;
-/* 1. 主扫描线 - 较宽的水平线 */
-.crt-primary-scanline {
-    content: "";
-    display: var(--crt-effects-display);
-    position: fixed;
-    top: 0;
-    left: 0;
-    width: 100%;
-    height: 8px; /* 主扫描线较宽 */
-    background: linear-gradient(
-        to bottom,
-        transparent 0%,
-        rgba(0, 0, 0, var(--crt-primary-scanline-alpha)) 40%,
-        rgba(0, 0, 0, calc(var(--crt-primary-scanline-alpha) * 1.5)) 50%,
-        rgba(0, 0, 0, var(--crt-primary-scanline-alpha)) 60%,
-        transparent 100%
-    );
-    pointer-events: none;
-    z-index: 9995;
-    opacity: 0.85;
-    animation: primary-scanline 12s linear infinite;
 }
-/* 2. 副扫描线 - 细小的水平扫描线纹理 */
+.notaninfobox .infobox-row .infobox-row-label,
-.crt-secondary-scanline {
+.notaninfobox .infobox-row .infobox-row-field {
-    content: "";
+	padding: 4px;
-    display: var(--crt-effects-display);
-    position: fixed;
-    top: 0;
-    left: 0;
-    width: 100%;
-    height: 100%;
-    background: repeating-linear-gradient(
-        to bottom,
-        transparent 0px,
-        transparent 3px,
-        rgba(0, 0, 0, var(--crt-secondary-scanline-alpha)) 4px,
-        rgba(0, 0, 0, var(--crt-secondary-scanline-alpha)) 4px
-    );
-    background-size: 100% 8px;
-    pointer-events: none;
-    z-index: 9994;
-    opacity: 0.7;
-    animation: secondary-scanline 18s linear infinite;
 }
-/* 3. 快速扫描线 - 闪烁通过的亮条 */
+.notaninfobox .infobox-row .infobox-row-label {
-.crt-fast-scanline {
+	font-weight: bold;
-    content: "";
+	display: flex;
-    display: var(--crt-effects-display);
+	align-items: center;
-    position: fixed;
-    top: 0;
-    left: 0;
-    width: 100%;
-    height: 2px; /* 快速扫描线很窄 */
-    background: linear-gradient(
-        to bottom,
-        transparent 0%,
-        rgba(255, 255, 255, 0.5) 50%,
-        transparent 100%
-    );
-    pointer-events: none;
-    z-index: 9996;
-    opacity: 0;
-    animation: fast-scanline 2.5s cubic-bezier(0.15, 0.85, 0.5, 1) infinite;
 }
+.community-updates {
-/* 标题样式 - 只使用VonwaonBitmap 16px字体 */
+  background: #fff0e6;
-h1, h2, h3, h4, h5, h6 {
+  padding: 15px;
-    font-family: var(--title-font);
+  border-radius: 10px;
-    font-size: calc(var(--base-font-size) * var(--title-scale));
+  margin-top: 20px;
-    font-weight: normal;
-    text-shadow: var(--crt-text-shadow),
-1px 1px rgba(0, 0, 0, 0.1);
-    letter-spacing: 0.03em;
-    position: relative;
-    margin-top: 1.8em;
-    margin-bottom: 1em;
-    padding-bottom: 0.5em;
-    border-bottom: 1px solid rgba(0, 0, 0, 0.1);
-    color: #111;
-    line-height: 1.5;
 }
+.community-updates ul li {
-h1::after, h2::after, h3::after {
+  list-style: none;
-    content: "";
+  padding: 10px;
-    position: absolute;
+  background: #fff;
-    bottom: -1px;
+  margin: 5px 0;
-    left: 0;
+  border-radius: 5px;
-    width: 100%;
+  box-shadow: 0 2px 5px rgba(0,0,0,0.1);
-    height: 1px;
-    background: linear-gradient(
-        to right,
-        var(--crt-glow-color),
-        transparent 90%
-    );
 }
+.community-updates ul li a {
-body h1 {
+  color: #337ab7;
-    font-size: calc(var(--base-font-size) * 1.7);
+  text-decoration: none;
-    text-transform: uppercase;
+  font-weight: bold;
-    padding-left: 10px;
-    border-left: 3px solid var(--crt-glow-color);
 }
+.notaninfobox .infobox-rows .infobox-row:nth-child(2n) .infobox-row-label,
-h2 { font-size: calc(var(--base-font-size) * 1.5); }
+.notaninfobox .infobox-rows .infobox-row:nth-child(2n) .infobox-row-field {
-h3 { font-size: calc(var(--base-font-size) * 1.3); }
+	background-color: var(--custom-table-alternate-background);
-h4 { font-size: calc(var(--base-font-size) * 1.2); }
-h5, h6 { font-size: calc(var(--base-font-size) * 1.1); }
-/* 链接样式 - 增强质感 */
-a {
-    color: var(--link-color);
-    text-decoration: none;
-    position: relative;
-    transition: all 0.25s ease;
-    padding: 1px 3px;
-    border-radius: 2px;
-    text-shadow: 0 0 3px rgba(0, 100, 255, 0.15);
-    font-family: var(--pixel-font-16);
 }
-a:hover {
+/* Infoboxes with tabber */
-    color: var(--link-color-active);
+.tabber-container-infobox .tabber .tabbertab,
-    background-color: rgba(250, 167, 0, 0.1);
+.tabber-container-infobox ul.tabbernav li a,
-    text-shadow: 0 0 var(--crt-glow-radius) rgba(250, 167, 0, 0.4);
+.tabber-container-infobox ul.tabbernav li.tabberactive a {
-    transform: translateY(-1px);
+	background: none;
-    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);
+	border: none;
 }
-a:active {
+.tabber-container-infobox .tabber .tabbertab {
-    transform: translateY(0);
+	padding: 0;
-    box-shadow: none;
 }
-/* 标记链接是可交互的 - 添加小图标 */
+.tabber-container-infobox ul.tabbernav {
-a[href]:not(.mw-selflink)::before {
+	font: inherit;
-    content: '>';
+	font-size: 100%;
-    display: inline-block;
-    margin-right: 3px;
-    font-size: 0.8em;
-    opacity: 0.6;
-    transition: all 0.2s ease;
 }
-a[href]:not(.mw-selflink):hover::before {
+.tabber-container-infobox ul.tabbernav li a:hover {
-    opacity: 1;
+	color: #000;
-    transform: translateX(1px);
 }
-a.new {
+.tabber-container-infobox ul.tabbernav > li {
-    color: #ba0000;
+	margin-bottom: 5px;
-    text-shadow: 0 0 3px rgba(186, 0, 0, 0.2);
+	padding: 0;
 }
+.announcement-content span {
-a.new:hover {
+  display: inline-block;
-    background-color: rgba(186, 0, 0, 0.1);
+  white-space: nowrap;
-    text-shadow: 0 0 var(--crt-glow-radius) rgba(186, 0, 0, 0.4);
+  animation: marquee 15s linear infinite;
-}
-/* Infobox样式 - 增强质感 */
-.notaninfobox {
-    position: relative;
-    clear: right;
-    margin: 0 0 1em 1em;
-    width: 350px;
-    font-size: calc(var(--base-font-size) * 0.9);
-    font-family: var(--small-font);
-    background-color: rgba(248, 249, 250, 0.95);
-    float: right;
-    border: 1px solid rgba(0, 0, 0, 0.15);
-    padding: 0;
-    overflow: auto;
-    z-index: 1;
-    overflow-wrap: anywhere;
-    box-shadow:
-px 2px 5px rgba(0, 0, 0, 0.1),
-        inset 0 0 10px rgba(0, 255, 100, 0.04);
-    animation: flicker 80s infinite alternate;
-    border-radius: 3px;
 }
+.mw-mainpage-header {
-.notaninfobox > .infobox-title {
+     background: linear-gradient(to bottom right, #B9A3FF, #8C47E7);
-     font-family: var(--title-font);
+    box-shadow: grey 0px 0px 5px;
-     font-weight: normal;
+    border-radius: 20px;
+    color: #000;
+    font-size: 1.5em;
+     text-shadow: white 0px 0px 10px, white 0px 0px 10px;
+    padding: 20px;
      text-align: center;
-    font-size: 110%;
-    background: linear-gradient(to bottom, #d5e5fb, var(--custom-mcwiki-header-color));
-    color: #333;
-    text-shadow: 0 1px 1px rgba(255, 255, 255, 0.5), var(--crt-text-shadow);
-    padding: 8px 4px;
-    border-bottom: 1px solid rgba(0, 0, 0, 0.15);
-    position: relative;
-    overflow: hidden;
 }
-/* 给标题添加光泽效果 */
+.mw-mainpage-header h1 {
-.notaninfobox > .infobox-title::after {
+     font-size: 2.5em;
-     content: "";
+     margin-bottom: 10px;
-    position: absolute;
-    top: 0;
-    left: -150%;
-    width: 150%;
-    height: 100%;
-     background: linear-gradient(
-        to right,
-        transparent 0%,
-        rgba(255, 255, 255, 0) 0%,
-        rgba(255, 255, 255, 0.4) 50%,
-        rgba(255, 255, 255, 0) 100%
-    );
-    transform: rotate(35deg);
-    animation: shine 6s infinite;
 }
-@keyframes shine {
+.mw-mainpage-header p {
-% { left: -150%; }
+     font-size: 1.2em;
-% { left: -150%; }
+     margin: 5px 0;
-% { left: 150%; }
-% { left: 150%; }
 }
+.tabber-container-infobox ul.tabbernav > li > a {
-.notaninfobox .infobox-row .infobox-row-label {
+	color: #595959;
-    font-family: var(--UI-font);
+	padding-bottom: 1px;
-    font-weight: 600;
+	display: block;
-    color: #444;
-    text-shadow: none;
-    letter-spacing: 0.03em;
 }
-/* 表格样式 - 增强质感 */
+/* To prevent the tabs from jumping around when they become active or inactive
-table {
+ * due to the font-weight changing from normal to bold and vice versa, add an
-    border: 1px solid #ccc;
+ * invisible ::before which contains the same text as the tab's text, but
-    background-color: rgba(248, 249, 250, 0.95);
+ * bolded. This way the element in which unbolded text sits is sized according
-    box-shadow:
+ * to the bolded text, preventing it from resizing upon being selected.
-        var(--box-depth),
+ */
-        inset 0 0 15px rgba(240, 240, 240, 0.8);
+.tabber-container-infobox ul.tabbernav > li > a::before {
-    border-radius: 3px;
+	display: block;
-    margin: 1.2em 0;
+	content: attr(alt);
-    font-family: var(--pixel-font-12);
+	font-weight: bold;
+	height: 0;
+	color: transparent;
+	overflow: hidden;
+	visibility: hidden;
 }
-table caption {
+.tabber-container-infobox ul.tabbernav > li.tabberactive {
-    font-family: var(--title-font);
+	border: none;
-    font-size: calc(var(--base-font-size) * 1.05);
-    padding: 8px;
-    font-weight: normal;
-    text-shadow: var(--crt-text-shadow);
 }
-table th {
+.modulebox {
-    background: linear-gradient(to bottom, #f8f9fa, var(--custom-table-header-background));
+  border: 1px solid #ccc;
-    color: #333;
+  padding: 10px;
-    font-family: var(--title-font);
+  margin: 10px 0;
-    font-weight: normal;
+  background-color: #f9f9f9;
-    text-shadow: 0 1px 1px rgba(255, 255, 255, 0.5), var(--crt-text-shadow);
-    padding: 10px 14px;
-    border-bottom: 2px solid rgba(0, 0, 0, 0.1);
 }
-table td, table th {
+.tabber-container-infobox ul.tabbernav > li.tabberactive > a {
-    border: 1px solid #e0e0e0;
+	font-weight: bold;
-    padding: 8px 12px;
+	color: var(--link-color);
-    transition: all 0.2s ease;
+	border-bottom: 2px solid var(--custom-mcwiki-header-color);
-    font-size: calc(var(--base-font-size) * 0.95);
 }
-table tr:nth-child(even) td {
+.infobox-rows p {
-    background-color: rgba(240, 241, 242, 0.7);
+	margin: 0;
 }
-table tr:hover td {
+/* Merge adjacent dls in the infobox, since they're usually supposed to be one,
-    background-color: rgba(0, 255, 100, 0.08);
+ * but the wiki screws up sometimes.
+ */
+.infobox-rows dl + dl {
+	margin-top: -0.4em;
 }
-/* 代码样式 - 增强科技感 */
+.infobox-rows dl:last-child {
-pre, code {
+	margin-bottom: 0.2em;
-    font-family: var(--pixel-font-12);
-    font-size: calc(var(--base-font-size) * var(--code-scale));
-    background-color: rgba(232, 232, 232, 0.8);
-    border: 1px solid #d0d0d0;
-    padding: 0.3em 0.5em;
-    text-shadow: none;
-    border-radius: 3px;
-    color: #1a1a1a;
-    position: relative;
 }
-pre {
+.infobox-footer {
-    padding: 1em;
+	text-align: center;
-    overflow-x: auto;
-    background-color: rgba(228, 230, 232, 0.9);
-    box-shadow:
-        inset 0 1px 4px rgba(0,0,0,0.15),
-1px 0 rgba(255,255,255,0.7);
-    counter-reset: line;
-    margin: 1.5em 0;
 }
-/* 添加代码行号 */
+/* 页面底部导航框（2011年8月16日引自中文维基）(所谓大家族模板) */
-pre code {
+table.navbox{
-     display: block;
+     border:1px solid #aaa;
-     position: relative;
+     clear:both;
-     background: transparent;
+     margin:auto;
-     border: none;
+     padding:1px;
-     box-shadow: none;
+     text-align:center;
-     padding: 0;
+     width:100%;
-    counter-increment: line;
 }
-pre code::before {
+table.navbox + table.navbox{
-    content: counter(line);
+     margin-top:-1px;
-    display: inline-block;
-    width: 1.5em;
-     margin-right: 1em;
-    color: #888;
-    text-align: right;
-    user-select: none;
 }
-/* 确保文本内容清晰可读 */
+.navbox-title,
-p, li, td, th, figcaption, blockquote, cite {
+.navbox-abovebelow,
-     font-family: var(--body-font);
+table.navbox th{
-     line-height: 1.65;
+     padding-left:1em;
-    letter-spacing: 0.01em;
+     padding-right:1em;
-    position: relative;
+     text-align:center;
-     text-shadow: var(--crt-text-shadow);
 }
-/* 小字体元素 */
+.navbox-group{
-.small, small, .text-small, figcaption, .caption, .info, .note {
+     font-weight:700;
-     font-family: var(--small-font);
+     white-space:nowrap;
-     font-size: var(--small-font-size);
 }
-/* 图片效果 - 增强质感 */
+.navbox,
-img {
+.navbox-subgroup{
-    max-width: 100%;
+     background:none repeat scroll 0 0 var(--theme-card-background-color, #fdfdfd);
-    height: auto;
-    transition: all 0.3s ease;
-    border-radius: 3px;
-     border: 1px solid rgba(0, 0, 0, 0.1);
-    box-shadow: 0 1px 3px rgba(0,0,0,0.05);
-    filter: contrast(1.02) brightness(1.01); /* 轻微增强对比度 */
 }
-img:hover {
+.navbox-list{
-    box-shadow:
+     border-color:#fdfdfd;
-3px 8px rgba(0, 0, 0, 0.15),
-0 10px var(--crt-glow-color);
-    transform: scale(1.02) translateY(-2px);
-     border-color: rgba(0, 255, 100, 0.3);
-    filter: contrast(1.05) brightness(1.02);
 }
-/* 滚动条样式 - 像素风格 */
+.navbox-title,
-::-webkit-scrollbar {
+table.navbox th{
-     width: 12px;
+     background:none repeat scroll 0 0 #a5e4a5;
-    height: 12px;
 }
-::-webkit-scrollbar-track {
+.navbox-abovebelow,
-     background: rgba(0, 0, 0, 0.04);
+.navbox-group,
-    border-radius: 0;
+.navbox-subgroup .navbox-title{
-    box-shadow: inset 0 0 4px rgba(0,0,0,0.1);
+     background:none repeat scroll 0 0 #c0ecc0;
 }
-::-webkit-scrollbar-thumb {
+.navbox-subgroup .navbox-group,
-    background: repeating-linear-gradient(
+.navbox-subgroup .navbox-abovebelow{
-        to bottom,
+     background:none repeat scroll 0 0 #e6f6e6;
-        #aaa 0px,
-        #aaa 2px,
-        #999 3px,
-        #999 5px
-    );
-    border-radius: 0;
-    border: 1px solid rgba(0, 0, 0, 0.2);
-     box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.3);
 }
-::-webkit-scrollbar-thumb:hover {
+.navbox-even{
-     background: repeating-linear-gradient(
+     background:none repeat scroll 0 0 #f5fcf5;
-        to bottom,
-        #bbb 0px,
-        #bbb 2px,
-        #aaa 3px,
-        #aaa 5px
-    );
 }
-/* 引用块样式 */
+.navbox-odd{
-blockquote {
+     background:none repeat scroll 0 0 #fdfdfd;
-     border-left: 3px solid var(--crt-glow-color);
-    margin: 1em 0;
-    padding: 0.5em 1em;
-    background: rgba(240, 240, 240, 0.5);
-    position: relative;
-    font-family: var(--body-font);
 }
+.collapseButton {
-blockquote::before {
+     float: right;
-    content: """;
+     font-weight: 400;
-    position: absolute;
+     text-align: right;
-    top: 0;
+     width: auto;
-    left: 10px;
-    font-size: 2em;
-    color: rgba(0, 0, 0, 0.1);
-    font-family: serif;
-}
-/* 按钮样式 - 像素风格 */
-.collapseButton, button, .mw-ui-button, input[type="button"], input[type="submit"] {
-     font-family: var(--UI-font);
-     font-size: calc(var(--base-font-size) * 0.85);
-    padding: 4px 10px;
-    border: 2px solid #666;
-    border-bottom: 4px solid #444;
-    border-right: 4px solid #444;
-    border-radius: 0;
-    background: #ddd;
-    color: #333;
-    text-transform: uppercase;
-    cursor: pointer;
-    transition: all 0.15s ease;
-    text-shadow: 0 1px 0 rgba(255, 255, 255, 0.5);
-    margin: 2px 4px;
-    position: relative;
-     text-align: center;
-}
-.collapseButton:hover, button:hover, .mw-ui-button:hover, input[type="button"]:hover, input[type="submit"]:hover {
-    background: #eee;
-    border-color: #777;
-    border-bottom-color: #555;
-    border-right-color: #555;
-     transform: translateY(-1px);
-}
-.collapseButton:active, button:active, .mw-ui-button:active, input[type="button"]:active, input[type="submit"]:active {
-    background: #ccc;
-    border: 2px solid #444;
-    border-top: 4px solid #666;
-    border-left: 4px solid #666;
-    transform: translateY(1px);
-    text-shadow: none;
 }
 .navbox .collapseButton {
      width: 6em;
 }
+.navbar {
-/* 边栏样式 - 复古科幻风格 */
-.side-block {
-    background:
-        linear-gradient(135deg, rgba(0, 255, 100, 0.05) 0%, transparent 100%),
-        linear-gradient(to bottom, rgba(220, 230, 240, 0.85), rgba(190, 210, 225, 0.95));
-    border: 1px solid rgba(0, 0, 0, 0.15);
-    border-radius: 0;
-    margin: 0.5rem 0.5rem 1rem 0;
-    padding: 0;
-    box-shadow:
-        var(--box-depth),
-        inset 0 0 20px rgba(0, 200, 255, 0.07);
-    font-family: var(--UI-font);
      position: relative;
-     overflow: hidden;
+     min-height: 23px !important;
+    margin-bottom: 0px !important;
+    border: 1px solid transparent;
 }
+.navbox-title .Wikiplus-Edit-EveryWhereBtn {
-.side-block::before {
+	display: none;
-    content: "";
-    position: absolute;
-    top: 0;
-    left: 0;
-    width: 100%;
-    height: 2px;
-    background: linear-gradient(to right, transparent, var(--crt-glow-color), transparent);
 }
-.side-block::after {
+@media only screen and (max-width:759px){
-    content: "";
+	.infotable {
-    position: absolute;
+	    width: 90%;
-    bottom: 0;
+	    float: none;
-    left: 0;
+	    margin: 0 auto;
-    width: 100%;
-    height: 1px;
-    background: linear-gradient(to right, transparent, rgba(0, 0, 0, 0.1), transparent);
-}
-.side-block .heading {
-    font-family: var(--title-font);
-    font-size: calc(var(--base-font-size) * 0.95);
-    color: #222;
-    text-shadow: 0 1px 0 rgba(255, 255, 255, 0.5), var(--crt-text-shadow);
-    padding: 0.5rem 0.7rem;
-    border-bottom: 1px solid rgba(0, 0, 0, 0.15);
-    background: linear-gradient(to bottom, #e8f0f8, #c8d8e8);
-    letter-spacing: 0.05em;
-    position: relative;
-    text-transform: uppercase;
-}
-.side-block .heading::after {
-    content: "";
-    position: absolute;
-    bottom: 0;
-    left: 0;
-    width: 100%;
-    height: 1px;
-    background: linear-gradient(to right, rgba(255, 255, 255, 0.7), rgba(255, 255, 255, 0));
-}
-.side-block .heading p {
-    margin: 0;
-    padding: 0;
-}
-.side-block div.menu-item {
-    border-bottom: 1px solid rgba(0, 0, 0, 0.07);
-    border-top: 1px solid rgba(255, 255, 255, 0.7);
-    position: relative;
-}
-.side-block div.menu-item:last-child {
-    border-bottom: none;
-}
-.side-block div.menu-item a {
-    display: block;
-    padding: 0.5rem 0.7rem;
-    color: var(--link-color);
-    text-decoration: none;
-    font-size: calc(var(--base-font-size) * 0.9);
-    transition: all 0.2s ease;
-    text-shadow: 0 0 2px rgba(0, 100, 255, 0.1);
-    position: relative;
-    overflow: hidden;
-}
-.side-block div.menu-item a:hover {
-    background-color: rgba(0, 150, 255, 0.1);
-    color: var(--link-color-active);
-    text-shadow: 0 0 5px rgba(0, 150, 255, 0.3);
-    transform: translateX(2px);
-}
-.side-block div.menu-item a::before {
-    content: '►';
-    display: inline-block;
-    margin-right: 5px;
-    font-size: 0.8em;
-    opacity: 0;
-    transition: all 0.2s ease;
-    transform: translateX(-5px);
-}
-.side-block div.menu-item a:hover::before {
-    opacity: 0.7;
-    transform: translateX(0);
-}
-/* CRT页面启动效果 - 暗角、闪烁和亮线 */
-.crt-startup-effect {
-    position: fixed;
-    top: 0;
-    left: 0;
-    width: 100%;
-    height: 100%;
-    background-color: #000;
-    z-index: 10000;
-    opacity: 1;
-    pointer-events: none;
-    animation: crt-startup-fade 2.5s forwards;
-}
-@keyframes crt-startup-fade {
-% { opacity: 1; }
-% { opacity: 0.7; }
-% { opacity: 0.9; }
-% { opacity: 0.6; }
-% { opacity: 0.9; }
-% { opacity: 0.2; }
-% { opacity: 0; }
-% { opacity: 0; visibility: hidden; }
-}
-/* 页面加载后自动添加CRT效果元素 */
-document.addEventListener('DOMContentLoaded', function() {
-    // 创建一个隐藏/显示扫描线效果的按钮
-    var toggleButton = document.createElement('button');
-    toggleButton.innerHTML = '切换扫描线';
-    toggleButton.style.position = 'fixed';
-    toggleButton.style.bottom = '10px';
-    toggleButton.style.right = '10px';
-    toggleButton.style.zIndex = '10000';
-    toggleButton.style.fontSize = '12px';
-    toggleButton.style.padding = '4px 8px';
-    toggleButton.style.opacity = '0.7';
-    // 添加事件监听
-    toggleButton.addEventListener('click', function() {
-        var root = document.documentElement;
-        var currentDisplay = getComputedStyle(root).getPropertyValue('--crt-effects-display').trim();
-        if (currentDisplay === 'block' || currentDisplay === '') {
-            root.style.setProperty('--crt-effects-display', 'none');
-            toggleButton.innerHTML = '显示扫描线';
-        } else {
-            root.style.setProperty('--crt-effects-display', 'block');
-            toggleButton.innerHTML = '隐藏扫描线';
-        }
-    });
-    document.body.appendChild(toggleButton);
-    // 添加扫描线和启动效果元素
-    var body = document.querySelector('body');
-    // 主扫描线
-    var primaryScanline = document.createElement('div');
-    primaryScanline.className = 'crt-primary-scanline';
-    body.appendChild(primaryScanline);
-    // 副扫描线
-    var secondaryScanline = document.createElement('div');
-    secondaryScanline.className = 'crt-secondary-scanline';
-    body.appendChild(secondaryScanline);
-    // 快速扫描线
-    var fastScanline = document.createElement('div');
-    fastScanline.className = 'crt-fast-scanline';
-    body.appendChild(fastScanline);
-    // 启动效果
-    var startupEffect = document.createElement('div');
-    startupEffect.className = 'crt-startup-effect';
-    body.appendChild(startupEffect);
-});
-/* 媒体查询 */
-@media screen and (max-width: 768px) {
-	:root {
-		--base-font-size: 14px;
-        --small-font-size: 12px;
 	}
-    body {
-        padding: 1rem;
+	/*.navbox {*/
-        margin: 0.5rem;
+	/*	display:none;*/
-    }
+	/*}*/
-}
+	/*“查·论·编”在小屏幕时基本用不到（也很难点到）*/
+	.navbox-title>div{
-@media screen and (min-width: 1440px) {
+         display: none;
-	:root {
-		--base-font-size: 16px;
-        --small-font-size: 14px;
-	}
-}
-/* 打印样式优化 */
-@media print {
-    :root {
-        --crt-effects-display: none;
-    }
-    html, body {
-        background: #fff !important;
-        color: #000 !important;
-    }
-    body::before,
-    .crt-primary-scanline,
-    .crt-secondary-scanline,
-    .crt-fast-scanline,
-    .crt-startup-effect {
-        display: none !important;
-    }
-    * {
-        text-shadow: none !important;
-        box-shadow: none !important;
-        animation: none !important;
-        border-color: #ddd !important;
-    }
-    a {
-        color: #000 !important;
-        text-decoration: underline !important;
-    }
-    a::before {
-         display: none !important;
      }
+     /*把内边距去掉*/
-     pre, code {
+     .navbox-group,
-         border: 1px solid #ddd;
+    .navbox-group >div{
-         background: #f8f8f8 !important;
+         padding-left: 0 !important;
+         padding-right: 0 !important;
+        text-align: center;
      }
 }
-/* 继续22222.txt中断部分的CSS */
-.mw-ui-button.mw-ui-primary:active, button.primary:active, input[type="submit"].primary:active {
+/* h1标题字体 */
-  background: linear-gradient(to bottom, #28e, #39f);
+body h1 {
-  border: 2px solid #05c;
+    font-family: "Microsoft YaHei", "微软雅黑", sans-serif !important;
-  border-top: 4px solid #16d;
-  border-left: 4px solid #16d;
-  transform: translateY(1px);
-  text-shadow: none;
-  box-shadow: inset 0 2px 5px rgba(0, 0, 0, 0.1);
 }
-/* 导航容器 - 更精致的复古科幻风格 */
+/* 本段内容来自萌娘百科 https://zh.moegirl.org.cn/MediaWiki:Gadget-site-styles.css 感谢贡献！*/
-.navbox {
+/* 版权协定：知识共享 署名-非商业性使用-相同方式共享 3.0 */
-  background-color: rgba(255, 255, 255, 0.95);
-  border: 1px solid var(--custom-navbox-top);
-  border-radius: 3px;
-  color: #222;
-  margin: 1.5em 0;
-  padding: 4px;
-  font-family: var(--small-font);
-  font-size: var(--small-font-size);
-  box-shadow:
-    var(--box-depth),
-    inset 0 0 20px rgba(0, 255, 100, 0.02);
-  position: relative;
-  overflow: hidden;
-}
-/* 导航标题 */
+.heimu,
-.navbox-title {
+.heimu rt{
-  background: linear-gradient(to bottom, #f8f9fa, var(--custom-navbox-top));
+    --heimu-color:#252525;
-  border: 1px solid var(--custom-navbox-top);
+    --heimu-text-color:#fff;
-  border-radius: 2px;
+    --heimu-link-color:#add8e6;
-  color: #222;
+    --heimu-visited-link-color:#c5cae9;
-  padding: 8px 12px;
+    --heimu-new-link-color:#fcc;
-  font-family: var(--title-font);
+    --heimu-new-visited-link-color:#ef9a9a;
-  font-weight: normal;
+    --heimu-extiw-visited-link-color:#d1c4e9;
-  text-align: center;
-  text-shadow: 0 1px 0 rgba(255, 255, 255, 0.5), var(--crt-text-shadow);
-  position: relative;
-}
-/* 导航组 */
+    background-color:var(--heimu-color);
-.navbox-group {
-  background-color: var(--custom-navbox-middle);
-  border: 1px solid var(--custom-navbox-top);
-  color: #444;
-  font-weight: normal;
-  padding: 6px 10px;
-  text-align: right;
-  white-space: nowrap;
-  letter-spacing: 0.03em;
-  border-right: 2px solid rgba(0, 0, 0, 0.1);
 }
-/* 导航列表 */
+.heimu,
-.navbox-list {
+.heimu a,
-  background-color: var(--custom-navbox-thru);
+a .heimu,
-  border: 1px solid var(--custom-navbox-middle);
+a.new .heimu,
-  padding: 6px 10px;
+span.heimu a:visited,
-  text-align: left;
+span.heimu a.new,
-  line-height: 1.5;
+span.heimu a.external,
+span.heimu a.external:visited,
+span.heimu a.extiw,
+span.heimu a.extiw:visited,
+span.heimu a.mw-disambig,
+span.heimu a.mw-redirect{
+    transition:color 0.13s linear;
+    color:var(--heimu-color);
+    text-shadow:none;
 }
-/* 导航行悬停效果 */
+span.heimu:hover,
-.navbox tr:hover td.navbox-list {
+span.heimu:active{
-  background-color: rgba(0, 255, 100, 0.05);
+    color:var(--heimu-text-color);
 }
-/* 导航装饰 */
+span.heimu:hover a,
-.navbox::before {
+a:hover span.heimu{
-  content: "";
+    color:var(--heimu-link-color);
-  position: absolute;
-  top: 0;
-  left: 0;
-  width: 100%;
-  height: 1px;
-  background: linear-gradient(
-    to right,
-    transparent,
-    rgba(255, 255, 255, 0.8),
-    transparent
-  );
 }
-/* 提示框和消息样式 - 像素化科幻风格 */
+span.heimu:hover a:visited,
-.notice {
+a:visited:hover span.heimu{
-  position: relative;
+    color:var(--heimu-visited-link-color);
-  margin: 1.5em 0;
-  padding: 1em 1em 1em 4em;
-  border-radius: 3px;
-  border-left: 4px solid transparent;
-  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
-  font-family: var(--small-font);
-  animation: micro-flicker 2s infinite alternate ease-in-out;
 }
-.notice::before {
+span.heimu:hover a.new,
-  font-family: var(--UI-font);
+a.new:hover span.heimu{
-  position: absolute;
+    color:var(--heimu-new-link-color);
-  left: 1em;
-  top: 50%;
-  transform: translateY(-50%);
-  font-size: 1.8em;
-  opacity: 0.8;
 }
-/* 成功消息 */
+span.heimu a.new:hover:visited,
-.notice-success {
+a.new:hover:visited span.heimu{
-  background-color: rgba(230, 250, 230, 0.4);
+    color:var(--heimu-new-visited-link-color);
-  border-color: #6c6;
 }
-.notice-success::before {
+span.heimu:hover a.extiw:visited,
-  content: "✓";
+a.extiw:visited:hover span.heimu{
-  color: #6c6;
+    color:var(--heimu-extiw-visited-link-color);
 }
+[color-mode="dark"] .heimu,
-/* 错误消息 */
+[color-mode="dark"] .heimu rt{
-.notice-error {
+    --heimu-color:#5e6272;
-  background-color: rgba(255, 230, 230, 0.4);
-  border-color: #c66;
 }
-.notice-error::before {
+/*
-  content: "✗";
+	该文档为一个hover特效库，由一些常用的效果以及GitHub上的开源项目“Hover.css”的一些部分构成。
-  color: #c66;
+	请使用hovers在页面中进行载入。
-}
+*/
-/* 警告消息 */
-.notice-warning {
-  background-color: rgba(255, 240, 230, 0.4);
-  border-color: #f93;
-}
-.notice-warning::before {
-  content: "⚠";
-  color: #f93;
-}
-/* 信息消息 */
+/* hover状态切换 */
-.notice-info {
+.hover-change,
-  background-color: rgba(220, 237, 255, 0.4);
+.hover-remote {
-  border-color: #69c;
-}
-.notice-info::before {
-  content: "ℹ";
-  color: #69c;
-}
-/* 表单元素 - 复古科幻风格 */
-input[type="text"],
-input[type="password"],
-input[type="email"],
-input[type="number"],
-input[type="search"],
-textarea,
-select {
-  font-family: var(--pixel-font-12);
-  font-size: calc(var(--base-font-size) * 0.9);
-  color: #333;
-  background-color: rgba(240, 245, 250, 0.95);
-  border: 2px solid #aaa;
-  border-radius: 0;
-  padding: 6px 10px;
-  margin: 4px 0;
-  box-shadow:
-    inset 0 1px 3px rgba(0, 0, 0, 0.1),
-1px 0 rgba(255, 255, 255, 0.7);
-  transition: all 0.2s ease;
-}
-/* 输入元素悬停状态 */
-input[type="text"]:hover,
-input[type="password"]:hover,
-input[type="email"]:hover,
-input[type="number"]:hover,
-input[type="search"]:hover,
-textarea:hover,
-select:hover {
-  border-color: #999;
-  background-color: rgba(245, 248, 250, 0.98);
-}
-/* 输入元素焦点状态 */
-input[type="text"]:focus,
-input[type="password"]:focus,
-input[type="email"]:focus,
-input[type="number"]:focus,
-input[type="search"]:focus,
-textarea:focus,
-select:focus {
-  outline: none;
-  border-color: rgba(0, 150, 255, 0.6);
-  box-shadow:
-    inset 0 1px 3px rgba(0, 0, 0, 0.05),
-0 8px rgba(0, 150, 255, 0.3);
-  background-color: #fff;
-}
-/* 文本区域 */
-textarea {
-  resize: vertical;
-  min-height: 80px;
-  line-height: 1.5;
-}
-/* 复选框和单选按钮 - 复古科幻风格 */
-input[type="checkbox"],
-input[type="radio"] {
-  position: relative;
-  width: 16px;
-  height: 16px;
-  margin: 3px 5px 3px 0;
-  vertical-align: middle;
-  cursor: pointer;
-  appearance: none;
-  -webkit-appearance: none;
-  border: 1px solid #999;
-  background-color: rgba(240, 245, 250, 0.9);
-  transition: all 0.2s ease;
-}
-input[type="checkbox"] {
-  border-radius: 2px;
-}
-input[type="radio"] {
-  border-radius: 50%;
-}
-/* 复选框和单选按钮悬停状态 */
-input[type="checkbox"]:hover,
-input[type="radio"]:hover {
-  border-color: #666;
-  background-color: rgba(245, 248, 250, 0.95);
-}
-/* 复选框和单选按钮选中状态 */
-input[type="checkbox"]:checked,
-input[type="radio"]:checked {
-  border-color: #0078d7;
-  background-color: rgba(0, 120, 215, 0.1);
-}
-/* 复选框选中状态图标 */
-input[type="checkbox"]:checked::after {
-  content: "";
-  position: absolute;
-  left: 4px;
-  top: 1px;
-  width: 5px;
-  height: 10px;
-  border: solid #0078d7;
-  border-width: 0 2px 2px 0;
-  transform: rotate(45deg);
-}
-/* 单选按钮选中状态图标 */
-input[type="radio"]:checked::after {
-  content: "";
-  position: absolute;
-  left: 3px;
-  top: 3px;
-  width: 8px;
-  height: 8px;
-  border-radius: 50%;
-  background-color: #0078d7;
-}
-/* 标签样式 */
-label {
-  font-family: var(--pixel-font-12);
-  font-size: calc(var(--base-font-size) * 0.9);
-  margin: 0 10px 0 2px;
-  vertical-align: middle;
-  cursor: pointer;
-}
-/* 分页导航 - 复古科幻风格 */
-.pagination {
-  display: flex;
-  justify-content: center;
-  align-items: center;
-  margin: 2em 0;
-  font-family: var(--UI-font);
-  font-size: calc(var(--base-font-size) * 0.85);
-}
-.pagination a,
-.pagination span {
-  display: inline-flex;
-  justify-content: center;
-  align-items: center;
-  min-width: 32px;
-  height: 32px;
-  margin: 0 3px;
-  padding: 0 10px;
-  text-align: center;
-  line-height: 1;
-  border: 1px solid #ccc;
-  border-radius: 0;
-  background-color: rgba(240, 245, 250, 0.8);
-  color: #444;
-  text-decoration: none;
-  transition: all 0.2s ease;
-  position: relative;
-  overflow: hidden;
-}
-/* 分页导航悬停效果 */
-.pagination a:hover {
-  border-color: #999;
-  background-color: rgba(0, 150, 255, 0.1);
-  color: var(--link-color-active);
-  transform: translateY(-1px);
-  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
-}
-/* 当前页面 */
-.pagination .current {
-  border-color: #666;
-  background-color: rgba(30, 30, 30, 0.8);
-  color: #fff;
-  font-weight: normal;
-  box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.2);
-  text-shadow: 0 1px 1px rgba(0, 0, 0, 0.5);
-}
-/* 下拉菜单 - 复古科幻风格 */
-.dropdown {
    position: relative;
    display: inline-block;
-   font-family: var(--UI-font);
+   transition: opacity 0.5s linear;
-  font-size: calc(var(--base-font-size) * 0.9);
 }
-.dropdown-toggle {
+.hover-change-before,
-  display: inline-flex;
+.hover-change-after,
-  align-items: center;
+.hover-remote-target {
-  padding: 6px 12px;
+   transition: inherit;
-  background-color: rgba(240, 245, 250, 0.9);
-  border: 1px solid #ccc;
-  border-radius: 0;
-  cursor: pointer;
-   transition: all 0.2s ease;
 }
-.dropdown-toggle::after {
+.hover-change-after,
-  content: "▼";
+.hover-remote-target {
-  font-size: 0.7em;
+   opacity: 0;
-  margin-left: 8px;
-  transition: transform 0.2s ease;
-}
-.dropdown-toggle:hover {
-  background-color: rgba(245, 248, 250, 0.95);
-  border-color: #999;
-}
-.dropdown-toggle:hover::after {
-  transform: translateY(2px);
-}
-.dropdown-menu {
-  position: absolute;
-  top: 100%;
-  left: 0;
-  z-index: 1000;
-  display: none;
-  min-width: 160px;
-  padding: 5px 0;
-  margin: 2px 0 0;
-  background-color: rgba(250, 252, 255, 0.95);
-  border: 1px solid #ccc;
-  border-radius: 0;
-  box-shadow: 0 6px 12px rgba(0, 0, 0, 0.15);
-}
-.dropdown-menu.show {
-  display: block;
-  animation: dropdown-fade 0.2s ease-in-out;
-}
-@keyframes dropdown-fade {
-   from {
-    opacity: 0;
-    transform: translateY(-10px);
-  }
-  to {
-    opacity: 1;
-    transform: translateY(0);
-  }
-}
-.dropdown-item {
-  display: block;
-  padding: 6px 15px;
-  clear: both;
-  text-decoration: none;
-  color: #333;
-  white-space: nowrap;
-  transition: all 0.15s ease;
-  position: relative;
-}
-.dropdown-item:hover {
-  background-color: rgba(0, 150, 255, 0.1);
-  color: var(--link-color-active);
-  padding-left: 18px;
-}
-.dropdown-divider {
-  height: 1px;
-  margin: 6px 0;
-  background-color: #eee;
-}
-/* 终端窗口 - 复古科幻风格 */
-.terminal {
-  background-color: var(--terminal-bg);
-  color: var(--console-text-color);
-  font-family: var(--pixel-font-12);
-  padding: 15px;
-  margin: 1.5em 0;
-  border-radius: 3px;
-  border: 1px solid rgba(0, 0, 0, 0.3);
-  box-shadow:
-    inset 0 0 15px rgba(0, 0, 0, 0.3),
-2px 5px rgba(0, 0, 0, 0.1);
-  position: relative;
-  overflow: hidden;
-}
-/* 终端窗口标题栏 */
-.terminal::before {
-  content: "TERMINAL";
-  display: block;
    position: absolute;
    top: 0;
    left: 0;
-  width: 100%;
-  padding: 4px 10px;
-  background: linear-gradient(to bottom, #444, #333);
-  color: #ddd;
-  font-size: 0.8em;
-  text-align: center;
-  border-bottom: 1px solid #222;
-  text-shadow: 0 1px 1px rgba(0, 0, 0, 0.5);
 }
+.hover-remote-target {
-/* 终端内容 */
+   left: 100%;
-.terminal-content {
-   margin-top: 25px;
-  line-height: 1.4;
-  overflow-x: auto;
-  white-space: pre-wrap;
 }
-/* 终端命令提示符 */
+.hover-change-after[style^='right:'],
-.terminal-prompt {
+.hover-change-after[style*=' right:'],
-  color: #0f0;
+.hover-remote-after[style^='right:'],
-   margin-right: 5px;
+.hover-remote-after[style*=' right:'] {
+   left: initial;
 }
-/* 终端命令行 */
+.hover-change-after[style^='bottom:'],
-.terminal-line {
+.hover-change-after[style*=' bottom:'],
-  margin: 5px 0;
+.hover-remote-after[style^='bottom:'],
-   word-break: break-all;
+.hover-remote-after[style*=' bottom:'] {
+   top: initial;
 }
-/* 终端光标闪烁 */
+.hover-change-after:hover,
-.terminal-cursor {
+.hover-remote-target {
-  display: inline-block;
+   opacity: 0;
-  width: 0.5em;
+   margin-left: -9999px;
-  height: 1em;
-  background-color: var(--console-indicator-color);
-   vertical-align: middle;
-   animation: console-blink 1s infinite;
 }
-/* 加载指示器 - 复古科幻风格 */
+/* 主要用于制作hover形式的标签页(tab)切换 */
-.loading {
+.hover-tab-mode {
-  display: inline-block;
    position: relative;
-   width: 80px;
+   transition: none;
-  height: 20px;
-  margin: 1em auto;
-  text-align: center;
 }
+.hover-tab-mode .hover-remote {
-.loading div {
+   transition: inherit;
-  display: inline-block;
+   position: static;
-  width: 8px;
-  height: 8px;
-  margin: 0 3px;
-  background-color: rgba(0, 200, 100, 0.8);
-  border-radius: 0;
-  animation: loading 1.2s cubic-bezier(0, 0.5, 0.5, 1) infinite;
-}
-.loading div:nth-child(1) {
-   animation-delay: -0.24s;
-}
-.loading div:nth-child(2) {
-   animation-delay: -0.12s;
 }
-.loading div:nth-child(3) {
+/* 闪烁效果 */
-   animation-delay: 0;
+.hover-change.flash:hover .hover-change-before {
+   margin-left: -9999px;
 }
-@keyframes loading {
+.hover-change:hover > .hover-change-before,
-% {
+.hover-remote > .hover-remote-target,
-    transform: scaleY(1);
+.hover-change:hover > a > .hover-change-before,
-    background-color: rgba(0, 200, 100, 0.8);
+.hover-remote > a > .hover-remote-target {
-  }
-% {
-    transform: scaleY(2);
-    background-color: rgba(0, 255, 100, 0.8);
-  }
-% {
-    transform: scaleY(1);
-    background-color: rgba(0, 200, 100, 0.8);
-  }
-}
-/* 工具提示 - 复古科幻风格 */
-.tooltip {
-  position: relative;
-  display: inline-block;
-  cursor: help;
-}
-.tooltip .tooltip-text {
-  visibility: hidden;
-  width: 200px;
-  background-color: rgba(20, 20, 20, 0.9);
-  color: #fff;
-  text-align: center;
-  border-radius: 0;
-  padding: 8px 12px;
-  position: absolute;
-  z-index: 1001;
-  bottom: 125%;
-  left: 50%;
-  margin-left: -100px;
-  font-family: var(--small-font);
-  font-size: var(--small-font-size);
-  line-height: 1.4;
    opacity: 0;
-  transition: opacity 0.2s, transform 0.2s;
-  transform: translateY(10px);
-  box-shadow: 0 5px 15px rgba(0, 0, 0, 0.2);
-  border: 1px solid #444;
-  text-shadow: none;
 }
-/* 工具提示箭头 */
+.hover-change:hover > .hover-change-after,
-.tooltip .tooltip-text::after {
+.hover-remote:hover > .hover-remote-target,
-  content: "";
+.hover-change:hover > a > .hover-change-after,
-  position: absolute;
+.hover-remote:hover > a > .hover-remote-target {
-  top: 100%;
-  left: 50%;
-  margin-left: -5px;
-  border-width: 5px;
-  border-style: solid;
-  border-color: rgba(20, 20, 20, 0.9) transparent transparent transparent;
-}
-/* 显示工具提示 */
-.tooltip:hover .tooltip-text {
-  visibility: visible;
    opacity: 1;
-   transform: translateY(0);
+   margin-left: initial;
 }
-/* 徽章 - 复古科幻风格 */
+/* 基类 */
-.badge {
+[class*='hovers-'] {
    display: inline-block;
-   padding: 2px 6px;
+   box-shadow: 0 0 1px rgba(0, 0, 0, 0);
-  font-size: 0.8em;
+   transform: perspective(1px) translateZ(0);
-   font-family: var(--UI-font);
-  line-height: 1;
-  text-align: center;
-  white-space: nowrap;
    vertical-align: middle;
-   background-color: #777;
+   transition-duration: 0.25s;
-  color: #fff;
+   transition-property: all;
-  border-radius: 0;
-  margin: 0 3px;
-  border: 1px solid rgba(0, 0, 0, 0.2);
-   box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2);
-  text-shadow: 0 1px 0 rgba(0, 0, 0, 0.5);
 }
-.badge-primary {
+/* 旋转放大 */
-   background-color: #0078d7;
+.hovers-rotate-shrink {
+   transition-duration: 0.5s;
+  transform: rotate(0) scale(0.75);
 }
+.hovers-rotate-shrink:hover {
-.badge-success {
+   transform: rotate(360deg) scale(1);
-   background-color: #5cb85c;
 }
-.badge-info {
+.hovers-rotate-shrink-reverse {
-   background-color: #5bc0de;
+   transition-duration: 0.5s;
+  transform: rotate(360deg) scale(0.75);
 }
-.badge-warning {
+.hovers-rotate-shrink-reverse:hover {
-   background-color: #f0ad4e;
+   transform: rotate(0) scale(1);
 }
-.badge-danger {
+/* 旋转 */
-   background-color: #d9534f;
+.hovers-rotate,
+.hovers-rotate-reverse:hover {
+   transition-duration: 0.5s;
+  transform: rotate(0);
 }
-/* 进度条 - 复古科幻风格 */
+.hovers-rotate-reverse,
-.progress {
+.hovers-rotate:hover {
-   height: 20px;
+   transition-duration: 0.5s;
-  margin: 1em 0;
+   transform: rotate(360deg);
-  background-color: rgba(220, 225, 230, 0.8);
-   border-radius: 0;
-  box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.1);
-  overflow: hidden;
-  border: 1px solid #ccc;
-  position: relative;
 }
-.progress-bar {
+/* 正常 => 浅 */
-  height: 100%;
+.hovers-fade-deep,
-  background: repeating-linear-gradient(
+.hovers-fade,
-deg,
+.hovers-fade-shallow {
-    rgba(0, 200, 100, 0.8),
+   opacity: 1;
-    rgba(0, 200, 100, 0.8) 10px,
-    rgba(0, 220, 110, 0.9) 10px,
-    rgba(0, 220, 110, 0.9) 20px
-  );
-  box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.15);
-   transition: width 0.6s ease;
-  position: relative;
-  animation: progress-animation 2s linear infinite;
 }
+.hovers-fade-deep:hover,
-@keyframes progress-animation {
+.hovers-fade-deep.active {
-% {
+   opacity: 0.35;
-    background-position: 0 0;
-  }
-% {
-    background-position: 40px 0;
-  }
 }
+.hovers-fade:hover,
-.progress-text {
+.hovers-fade.active {
-  position: absolute;
+   opacity: 0.5;
-  top: 0;
-  left: 0;
-  width: 100%;
-  height: 100%;
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  color: #333;
-  font-family: var(--UI-font);
-  font-size: 0.8em;
-   text-shadow: 0 1px 0 rgba(255, 255, 255, 0.5);
 }
+.hovers-fade-shallow:hover,
-/* 标签页 - 复古科幻风格 */
+.hovers-fade-shallow.active {
-.tabs {
+   opacity: 0.75;
-  margin: 1.5em 0;
-  border-radius: 0;
-  background-color: rgba(255, 255, 255, 0.9);
-   border: 1px solid #ccc;
-  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
 }
-.tabs-nav {
+/* 浅 => 正常 */
-   display: flex;
+.hovers-bloom-deep {
-  list-style: none;
+   opacity: 0.35;
-  padding: 0;
-  margin: 0;
-  background-color: rgba(240, 245, 250, 0.8);
-  border-bottom: 1px solid #ccc;
 }
+.hovers-bloom {
-.tabs-nav li {
+   opacity: 0.5;
-   margin: 0;
 }
+.hovers-bloom-shallow {
-.tabs-nav a {
+   opacity: 0.75;
-   display: block;
-  padding: 8px 15px;
-  text-decoration: none;
-  color: #555;
-  border-right: 1px solid #ddd;
-  font-family: var(--UI-font);
-  font-size: calc(var(--base-font-size) * 0.9);
-  transition: all 0.2s ease;
-  background: linear-gradient(to bottom, #f5f5f5, #e5e5e5);
-  border-bottom: 3px solid transparent;
 }
-.tabs-nav a:hover {
+.hovers-bloom-deep:hover,
-  background: linear-gradient(to bottom, #fff, #f0f0f0);
+.hovers-bloom-deep.active,
-  color: #333;
+.hovers-bloom:hover,
-  transform: none;
+.hovers-bloom.active,
-   box-shadow: none;
+.hovers-bloom-shallow:hover,
+.hovers-bloom-shallow.active {
+   opacity: 1;
 }
-.tabs-nav a.active {
+/* 正常 => 大 */
-  background: #fff;
+.hovers-grow-deep,
-  color: #333;
+.hovers-grow,
-  border-bottom: 3px solid var(--crt-glow-color);
+.hovers-grow-shallow {
-   box-shadow: inset 0 1px 0 rgba(255, 255, 255, 1);
+   transform: scale(1);
 }
+.hovers-grow-deep:hover,
-.tabs-content {
+.hovers-grow-deep.active {
-   padding: 15px;
+   transform: scale(1.5);
-  border-radius: 0 0 3px 3px;
 }
+.hovers-grow:hover,
-.tab-pane {
+.hovers-grow.active {
-   display: none;
+   transform: scale(1.25);
 }
+.hovers-grow-shallow:hover,
-.tab-pane.active {
+.hovers-grow-shallow.active {
-   display: block;
+   transform: scale(1.1);
-  animation: fade-in 0.3s ease-in-out;
 }
-@keyframes fade-in {
+/* 正常 => 小 */
-  from {
+.hovers-shrink-deep:hover,
-    opacity: 0;
+.hovers-shrink-deep.active,
-  }
+.hovers-shrink:hover,
-  to {
+.hovers-shrink.active,
-    opacity: 1;
+.hovers-shrink-shallow:hover,
-  }
+.hovers-shrink-shallow.active {
+  transform: scale(1);
 }
+.hovers-shrink-deep {
-/* 卡片 - 复古科幻风格 */
+   transform: scale(0.5);
-.card {
-  background-color: rgba(255, 255, 255, 0.95);
-  border: 1px solid rgba(0, 0, 0, 0.15);
-  border-radius: 0;
-   margin: 1em 0;
-  box-shadow:
-    var(--box-depth),
-    inset 0 0 10px rgba(0, 255, 100, 0.02);
-  position: relative;
-  overflow: hidden;
-  transition: all 0.3s ease;
 }
+.hovers-shrink {
-.card:hover {
+   transform: scale(0.75);
-   transform: translateY(-3px);
-  box-shadow:
-5px 15px rgba(0, 0, 0, 0.1),
-    inset 0 0 10px rgba(0, 255, 100, 0.04);
 }
+.hovers-shrink-shallow {
-.card::before {
+   transform: scale(0.9);
-   content: "";
-  position: absolute;
-  top: 0;
-  left: 0;
-  width: 100%;
-  height: 2px;
-  background: linear-gradient(to right, transparent, var(--crt-glow-color), transparent);
 }
-.card-header {
+/* 左右抖动 */
-   background: linear-gradient(to bottom, #f8f9fa, #e8eaec);
+@keyframes shake-flexible {
-  padding: 10px 15px;
+% {
-  border-bottom: 1px solid rgba(0, 0, 0, 0.1);
+    transform: translateX(-0.0625em);
-  font-family: var(--title-font);
+   }
-  font-size: calc(var(--base-font-size) * 1.1);
-  color: #333;
-  text-shadow: 0 1px 0 rgba(255, 255, 255, 0.5), var(--crt-text-shadow);
-   position: relative;
-}
-.card-body {
+% {
-  padding: 15px;
+    transform: translateX(0.0625em);
-  font-family: var(--body-font);
+  }
-}
-.card-footer {
+% {
-  background-color: rgba(245, 248, 250, 0.7);
+    transform: translateX(-0.0625em);
-   padding: 10px 15px;
+   }
-  border-top: 1px solid rgba(0, 0, 0, 0.1);
 }
-/* 侧边栏 - 复古科幻风格 */
+.hovers-shake-flexible:hover,
-.sidebar {
+.hovers-shake-flexible.active {
-  width: var(--sidebar-width);
+   animation: shake-flexible 0.5s ease-out;
-  max-height: var(--sidebar-max-height);
-  margin-top: var(--sidebar-top-offset);
-  background:
-    linear-gradient(135deg, rgba(0, 255, 100, 0.05) 0%, transparent 100%),
-    linear-gradient(to bottom, rgba(220, 230, 240, 0.9), rgba(190, 210, 225, 0.95));
-  border: 1px solid rgba(0, 0, 0, 0.2);
-  border-radius: 3px;
-  box-shadow:
-    var(--box-depth),
-    inset 0 0 20px rgba(0, 200, 255, 0.07);
-   overflow-y: auto;
-  position: sticky;
-  top: var(--sidebar-top-offset);
-  transition: all 0.3s ease;
 }
-.sidebar-header {
+@keyframes shake {
-   background: linear-gradient(to bottom, #445, #334);
+% {
-  color: #fff;
+    transform: translateX(-8px);
-  padding: 12px 15px;
+   }
-  font-family: var(--title-font);
-   font-size: calc(var(--base-font-size) * 1.1);
-  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.3);
-  text-align: center;
-  border-bottom: 1px solid #223;
-  letter-spacing: 0.05em;
-  position: relative;
-}
-.sidebar-header::after {
+% {
-  content: "";
+    transform: translateX(8px);
-  position: absolute;
+  }
-  bottom: 0;
-   left: 0;
-  width: 100%;
-  height: 1px;
-  background: linear-gradient(to right, transparent, rgba(255, 255, 255, 0.2), transparent);
-}
-.sidebar-section {
+% {
-  padding: 10px 15px;
+    transform: translateX(-8px);
-   border-bottom: 1px solid rgba(0, 0, 0, 0.1);
+   }
 }
-.sidebar-section:last-child {
+.hovers-shake:hover,
-   border-bottom: none;
+.hovers-shake.active {
+   animation: shake 0.5s ease-out;
 }
-.sidebar-title {
+/* 上下抖动 */
-   font-family: var(--UI-font);
+@keyframes bounce-flexible {
-  font-size: calc(var(--base-font-size) * 0.95);
+% {
-   color: #333;
+    transform: translateY(-0.0625em);
-  margin: 0 0 8px 0;
+   }
-  padding-bottom: 5px;
-  border-bottom: 1px dashed rgba(0, 0, 0, 0.1);
-  text-shadow: 0 1px 0 rgba(255, 255, 255, 0.5);
-}
-.sidebar-list {
+% {
-  list-style: none;
+    transform: translateY(0.0625em);
-  margin: 0;
+   }
-   padding: 0;
-}
-.sidebar-list li {
+% {
-  margin: 5px 0;
+    transform: translateY(-0.0625em);
-   padding: 0;
+   }
 }
-.sidebar-list a {
+.hovers-bounce-flexible:hover,
-  display: block;
+.hovers-bounce-flexible.active {
-  padding: 5px 8px;
+   animation: bounce-flexible 0.5s ease-out;
-  color: var(--link-color);
-  text-decoration: none;
-  font-size: calc(var(--base-font-size) * 0.9);
-   transition: all 0.2s ease;
-  text-shadow: 0 0 2px rgba(0, 100, 255, 0.1);
-  border-left: 2px solid transparent;
 }
-/* 继续22222.txt中断部分的CSS */
+@keyframes bounce {
+% {
+    transform: translateY(-8px);
+  }
-.mw-ui-button.mw-ui-primary:active, button.primary:active, input[type="submit"].primary:active {
+% {
-  background: linear-gradient(to bottom, #28e, #39f);
+    transform: translateY(8px);
-  border: 2px solid #05c;
+   }
-  border-top: 4px solid #16d;
-  border-left: 4px solid #16d;
-  transform: translateY(1px);
-   text-shadow: none;
-  box-shadow: inset 0 2px 5px rgba(0, 0, 0, 0.1);
-}
-/* 导航容器 - 更精致的复古科幻风格 */
+% {
-.navbox {
+    transform: translateY(-8px);
-  background-color: rgba(255, 255, 255, 0.95);
+   }
-  border: 1px solid var(--custom-navbox-top);
-   border-radius: 3px;
-  color: #222;
-  margin: 1.5em 0;
-  padding: 4px;
-  font-family: var(--small-font);
-  font-size: var(--small-font-size);
-  box-shadow:
-    var(--box-depth),
-    inset 0 0 20px rgba(0, 255, 100, 0.02);
-  position: relative;
-  overflow: hidden;
 }
-/* 导航标题 */
+.hovers-bounce:hover,
-.navbox-title {
+.hovers-bounce.active {
-  background: linear-gradient(to bottom, #f8f9fa, var(--custom-navbox-top));
-  border: 1px solid var(--custom-navbox-top);
-  border-radius: 2px;
-  color: #222;
-  padding: 8px 12px;
-  font-family: var(--title-font);
-  font-weight: normal;
-  text-align: center;
-  text-shadow: 0 1px 0 rgba(255, 255, 255, 0.5), var(--crt-text-shadow);
    position: relative;
-}
-/* 导航组 */
-.navbox-group {
-  background-color: var(--custom-navbox-middle);
-  border: 1px solid var(--custom-navbox-top);
-  color: #444;
-  font-weight: normal;
-  padding: 6px 10px;
-  text-align: right;
-  white-space: nowrap;
-  letter-spacing: 0.03em;
-  border-right: 2px solid rgba(0, 0, 0, 0.1);
-}
-/* 导航列表 */
-.navbox-list {
-  background-color: var(--custom-navbox-thru);
-  border: 1px solid var(--custom-navbox-middle);
-  padding: 6px 10px;
-  text-align: left;
-  line-height: 1.5;
-}
-/* 导航行悬停效果 */
-.navbox tr:hover td.navbox-list {
-  background-color: rgba(0, 255, 100, 0.05);
-}
-/* 导航装饰 */
-.navbox::before {
-  content: "";
-  position: absolute;
-  top: 0;
    left: 0;
-   width: 100%;
+   animation: bounce 0.5s ease-out;
-  height: 1px;
-  background: linear-gradient(
-    to right,
-    transparent,
-    rgba(255, 255, 255, 0.8),
-    transparent
-  );
 }
-/* 提示框和消息样式 - 像素化科幻风格 */
+/* 绕顶端中点抖动 */
-.notice {
+@keyframes swing {
-   position: relative;
+% {
-  margin: 1.5em 0;
+    transform: rotate3d(0, 0, 1, 10deg);
-  padding: 1em 1em 1em 4em;
+   }
-  border-radius: 3px;
-  border-left: 4px solid transparent;
-  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
-   font-family: var(--small-font);
-  animation: micro-flicker 2s infinite alternate ease-in-out;
-}
-.notice::before {
+% {
-  font-family: var(--UI-font);
+    transform: rotate3d(0, 0, 1, -10deg);
-  position: absolute;
+   }
-  left: 1em;
-   top: 50%;
-  transform: translateY(-50%);
-   font-size: 1.8em;
-  opacity: 0.8;
-}
-/* 成功消息 */
+% {
-.notice-success {
+    transform: rotate3d(0, 0, 1, 5deg);
-  background-color: rgba(230, 250, 230, 0.4);
+   }
-   border-color: #6c6;
-}
-.notice-success::before {
+% {
-  content: "✓";
+    transform: rotate3d(0, 0, 1, -5deg);
-   color: #6c6;
+   }
-}
-/* 错误消息 */
+  to {
-.notice-error {
+    transform: rotate3d(0, 0, 1, 0deg);
-  background-color: rgba(255, 230, 230, 0.4);
+   }
-   border-color: #c66;
 }
-.notice-error::before {
+.hovers-swing {
-   content: "✗";
+   transform-origin: top center;
-  color: #c66;
 }
+.hovers-swing:hover,
-/* 警告消息 */
+.hovers-swing.active {
-.notice-warning {
+   animation: swing 0.75s ease-out;
-   background-color: rgba(255, 240, 230, 0.4);
-  border-color: #f93;
 }
-.notice-warning::before {
+/* 正常 => 大 */
-   content: "⚠";
+@keyframes pulse-grow {
-   color: #f93;
+   to {
+    transform: scale(1.1);
+   }
 }
-/* 信息消息 */
+.hovers-pulse-grow:hover,
-.notice-info {
+.hovers-pulse-grow.active {
-   background-color: rgba(220, 237, 255, 0.4);
+   animation: pulse-grow 0.5s linear infinite alternate;
-  border-color: #69c;
 }
-.notice-info::before {
+/* 正常 => 小 */
-   content: "ℹ";
+@keyframes pulse-shrink {
-   color: #69c;
+   to {
+    transform: scale(0.9);
+   }
 }
-/* 表单元素 - 复古科幻风格 */
+.hovers-pulse-shrink:hover,
-input[type="text"],
+.hovers-pulse-shrink.active {
-input[type="password"],
+   animation: pulse-shrink 0.5s linear infinite alternate;
-input[type="email"],
-input[type="number"],
-input[type="search"],
-textarea,
-select {
-  font-family: var(--pixel-font-12);
-  font-size: calc(var(--base-font-size) * 0.9);
-   color: #333;
-  background-color: rgba(240, 245, 250, 0.95);
-  border: 2px solid #aaa;
-  border-radius: 0;
-  padding: 6px 10px;
-  margin: 4px 0;
-  box-shadow:
-    inset 0 1px 3px rgba(0, 0, 0, 0.1),
-1px 0 rgba(255, 255, 255, 0.7);
-  transition: all 0.2s ease;
 }
-/* 输入元素悬停状态 */
+/* 正常 => 小 */
-input[type="text"]:hover,
+@keyframes push {
-input[type="password"]:hover,
+% {
-input[type="email"]:hover,
+    transform: scale(0.8);
-input[type="number"]:hover,
+  }
-input[type="search"]:hover,
-textarea:hover,
-select:hover {
-   border-color: #999;
-  background-color: rgba(245, 248, 250, 0.98);
 }
-/* 输入元素焦点状态 */
+.hovers-push:hover,
-input[type="text"]:focus,
+.hovers-push.active {
-input[type="password"]:focus,
+   animation: push 0.3s linear;
-input[type="email"]:focus,
-input[type="number"]:focus,
-input[type="search"]:focus,
-textarea:focus,
-select:focus {
-  outline: none;
-  border-color: rgba(0, 150, 255, 0.6);
-   box-shadow:
-    inset 0 1px 3px rgba(0, 0, 0, 0.05),
-0 8px rgba(0, 150, 255, 0.3);
-  background-color: #fff;
 }
-/* 文本区域 */
+/* 正常 => 大 */
-textarea {
+@keyframes pop {
-   resize: vertical;
+% {
-  min-height: 80px;
+    transform: scale(1.2);
-   line-height: 1.5;
+   }
 }
-/* 复选框和单选按钮 - 复古科幻风格 */
+.hovers-pop:hover,
-input[type="checkbox"],
+.hovers-pop.active {
-input[type="radio"] {
+   animation: pop 0.3s linear;
-  position: relative;
-  width: 16px;
-  height: 16px;
-  margin: 3px 5px 3px 0;
-  vertical-align: middle;
-  cursor: pointer;
-  appearance: none;
-  -webkit-appearance: none;
-  border: 1px solid #999;
-  background-color: rgba(240, 245, 250, 0.9);
-   transition: all 0.2s ease;
 }
-input[type="checkbox"] {
+/* 正常 => 大 => 正常 => 大 */
-   border-radius: 2px;
+.hovers-bounce-in:hover,
+.hovers-bounce-in.active {
+   transform: scale(1.2);
+  transition-duration: 0.5s;
+  transition-timing-function: cubic-bezier(0.47, 2.02, 0.31, -0.36);
 }
-input[type="radio"] {
+/* 正常 => 小 => 正常 => 小 */
-   border-radius: 50%;
+.hovers-bounce-out:hover,
+.hovers-bounce-out.active {
+   transform: scale(0.8);
+  transition-duration: 0.5s;
+  transition-timing-function: cubic-bezier(0.47, 2.02, 0.31, -0.36);
 }
-/* 复选框和单选按钮悬停状态 */
+/* 倾斜 */
-input[type="checkbox"]:hover,
+.hovers-tilt:hover,
-input[type="radio"]:hover {
+.hovers-tilt.active {
-   border-color: #666;
+   transition-duration: 0.3s;
-   background-color: rgba(245, 248, 250, 0.95);
+   transform: rotate(4deg);
 }
-/* 复选框和单选按钮选中状态 */
+/* 倾斜 + 放大 */
-input[type="checkbox"]:checked,
+.hovers-grow-rotate:hover,
-input[type="radio"]:checked {
+.hovers-grow-rotate.active {
-   border-color: #0078d7;
+   transition-duration: 0.3s;
-   background-color: rgba(0, 120, 215, 0.1);
+   transform: scale(1.1) rotate(4deg);
 }
-/* 复选框选中状态图标 */
+/* 升起 */
-input[type="checkbox"]:checked::after {
+.hovers-float:hover,
-   content: "";
+.hovers-float.active {
-   position: absolute;
+   transition-duration: 0.3s;
-  left: 4px;
+   transition-timing-function: ease-out;
-  top: 1px;
+   transform: translateY(-8px);
-  width: 5px;
-  height: 10px;
-  border: solid #0078d7;
-  border-width: 0 2px 2px 0;
-   transform: rotate(45deg);
 }
-/* 单选按钮选中状态图标 */
+/* 下沉 */
-input[type="radio"]:checked::after {
+.hovers-sink:hover,
-   content: "";
+.hovers-sink.active {
-   position: absolute;
+   transition-duration: 0.3s;
-  left: 3px;
+   transition-timing-function: ease-out;
-  top: 3px;
+   transform: translateY(8px);
-  width: 8px;
-   height: 8px;
-  border-radius: 50%;
-  background-color: #0078d7;
 }
-/* 标签样式 */
+/* 飘浮 */
-label {
+@keyframes bob {
-   font-family: var(--pixel-font-12);
+% {
-   font-size: calc(var(--base-font-size) * 0.9);
+    transform: translateY(-10px);
-   margin: 0 10px 0 2px;
+   }
-   vertical-align: middle;
+% {
-   cursor: pointer;
+    transform: translateY(-5px);
+   }
+% {
+    transform: translateY(-10px);
+   }
 }
+@keyframes bob-float {
-/* 分页导航 - 复古科幻风格 */
+% {
-.pagination {
+    transform: translateY(-10px);
-   display: flex;
+   }
-  justify-content: center;
-  align-items: center;
-  margin: 2em 0;
-  font-family: var(--UI-font);
-   font-size: calc(var(--base-font-size) * 0.85);
 }
-.pagination a,
+.hovers-bob:hover,
-.pagination span {
+.hovers-bob.active {
-   display: inline-flex;
+   animation-name: bob-float, bob;
-  justify-content: center;
+   animation-duration: 0.3s, 1.5s;
-  align-items: center;
+   animation-delay: 0s, 0.3s;
-   min-width: 32px;
+   animation-timing-function: ease-out, ease-in-out;
-  height: 32px;
+   animation-iteration-count: 1, infinite;
-  margin: 0 3px;
+   animation-fill-mode: forwards;
-   padding: 0 10px;
+   animation-direction: normal, alternate;
-   text-align: center;
-   line-height: 1;
-   border: 1px solid #ccc;
-  border-radius: 0;
-   background-color: rgba(240, 245, 250, 0.8);
-  color: #444;
-  text-decoration: none;
-  transition: all 0.2s ease;
-  position: relative;
-  overflow: hidden;
 }
-/* 分页导航悬停效果 */
+/* 悬挂 */
-.pagination a:hover {
+@keyframes hang {
-   border-color: #999;
+% {
-  background-color: rgba(0, 150, 255, 0.1);
+    transform: translateY(10px);
-   color: var(--link-color-active);
+   }
-   transform: translateY(-1px);
+% {
-   box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
+    transform: translateY(5px);
+   }
+% {
+    transform: translateY(10px);
+   }
 }
+@keyframes hang-sink {
-/* 当前页面 */
+% {
-.pagination .current {
+    transform: translateY(10px);
-   border-color: #666;
+   }
-  background-color: rgba(30, 30, 30, 0.8);
-  color: #fff;
-  font-weight: normal;
-  box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.2);
-   text-shadow: 0 1px 1px rgba(0, 0, 0, 0.5);
 }
-/* 下拉菜单 - 复古科幻风格 */
+.hovers-hang:hover,
-.dropdown {
+.hovers-hang.active {
-   position: relative;
+   animation-name: hang-sink, hang;
-   display: inline-block;
+   animation-duration: 0.3s, 1.5s;
-   font-family: var(--UI-font);
+  animation-delay: 0s, 0.3s;
-   font-size: calc(var(--base-font-size) * 0.9);
+   animation-timing-function: ease-out, ease-in-out;
+   animation-iteration-count: 1, infinite;
+  animation-fill-mode: forwards;
+  animation-direction: normal, alternate;
 }
-.dropdown-toggle {
+/* 非对称 */
-  display: inline-flex;
+.hovers-skew:hover,
-  align-items: center;
+.hovers-skew.active {
-  padding: 6px 12px;
+   transform: skew(-10deg);
-  background-color: rgba(240, 245, 250, 0.9);
-  border: 1px solid #ccc;
-  border-radius: 0;
-  cursor: pointer;
-  transition: all 0.2s ease;
-}
-.dropdown-toggle::after {
-   content: "▼";
-  font-size: 0.7em;
-  margin-left: 8px;
-  transition: transform 0.2s ease;
 }
-.dropdown-toggle:hover {
+/* 非对称-左 */
-   background-color: rgba(245, 248, 250, 0.95);
+.hovers-skew-forward {
-  border-color: #999;
+   transform-origin: 0 100%;
 }
+.hovers-skew-forward:hover,
-.dropdown-toggle:hover::after {
+.hovers-skew-forward.active {
-   transform: translateY(2px);
+   transform: skew(-10deg);
 }
-.dropdown-menu {
+/* 非对称-右 */
-  position: absolute;
+.hovers-skew-backward {
-  top: 100%;
+   transform-origin: 0 100%;
-  left: 0;
-  z-index: 1000;
-  display: none;
-  min-width: 160px;
-  padding: 5px 0;
-   margin: 2px 0 0;
-  background-color: rgba(250, 252, 255, 0.95);
-  border: 1px solid #ccc;
-  border-radius: 0;
-  box-shadow: 0 6px 12px rgba(0, 0, 0, 0.15);
 }
+.hovers-skew-backward:hover,
-.dropdown-menu.show {
+.hovers-skew-backward.active {
-   display: block;
+   transform: skew(10deg);
-  animation: dropdown-fade 0.2s ease-in-out;
 }
-@keyframes dropdown-fade {
+/* 垂直抖动 */
-   from {
+@keyframes wobble-vertical {
-     opacity: 0;
+.65% {
-     transform: translateY(-10px);
+    transform: translateY(8px);
+  }
+.3% {
+    transform: translateY(-6px);
+  }
+.95% {
+     transform: translateY(4px);
+  }
+.6% {
+     transform: translateY(-2px);
+  }
+.25% {
+    transform: translateY(1px);
    }
-   to {
+% {
-    opacity: 1;
      transform: translateY(0);
    }
 }
-.dropdown-item {
+.hovers-wobble-vertical:hover,
-  display: block;
+.hovers-wobble-vertical.active {
-  padding: 6px 15px;
+   animation-name: wobble-vertical;
-   clear: both;
+   animation-duration: 1s;
-   text-decoration: none;
+   animation-timing-function: ease-in-out;
-   color: #333;
+   animation-iteration-count: 1;
-  white-space: nowrap;
-  transition: all 0.15s ease;
-   position: relative;
 }
-.dropdown-item:hover {
+/* 水平抖动 */
-   background-color: rgba(0, 150, 255, 0.1);
+@keyframes wobble-horizontal {
-   color: var(--link-color-active);
+.65% {
-   padding-left: 18px;
+    transform: translateX(8px);
+  }
+.3% {
+    transform: translateX(-6px);
+   }
+.95% {
+    transform: translateX(4px);
+  }
+.6% {
+    transform: translateX(-2px);
+   }
+.25% {
+    transform: translateX(1px);
+   }
+% {
+    transform: translateX(0);
+  }
 }
+.hovers-wobble-horizontal:hover,
-.dropdown-divider {
+.hovers-wobble-horizontal.active {
-   height: 1px;
+   animation-name: wobble-horizontal;
-   margin: 6px 0;
+  animation-duration: 1s;
-   background-color: #eee;
+   animation-timing-function: ease-in-out;
+   animation-iteration-count: 1;
 }
-/* 终端窗口 - 复古科幻风格 */
+/* 右下弹回 */
-.terminal {
+@keyframes wobble-to-bottom-right {
-  background-color: var(--terminal-bg);
+.65% {
-   color: var(--console-text-color);
+    transform: translate(8px, 8px);
-   font-family: var(--pixel-font-12);
+   }
-   padding: 15px;
+.3% {
-   margin: 1.5em 0;
+    transform: translate(-6px, -6px);
-   border-radius: 3px;
+   }
-   border: 1px solid rgba(0, 0, 0, 0.3);
+.95% {
-   box-shadow:
+    transform: translate(4px, 4px);
-    inset 0 0 15px rgba(0, 0, 0, 0.3),
+   }
-2px 5px rgba(0, 0, 0, 0.1);
+.6% {
-   position: relative;
+    transform: translate(-2px, -2px);
-  overflow: hidden;
+   }
+.25% {
+    transform: translate(1px, 1px);
+   }
+% {
+     transform: translate(0, 0);
+   }
 }
-/* 终端窗口标题栏 */
+.hovers-wobble-to-bottom-right:hover,
-.terminal::before {
+.hovers-wobble-to-bottom-right.active {
-   content: "TERMINAL";
+   animation-name: wobble-to-bottom-right;
-  display: block;
+   animation-duration: 1s;
-  position: absolute;
+   animation-timing-function: ease-in-out;
-  top: 0;
+   animation-iteration-count: 1;
-  left: 0;
-  width: 100%;
-  padding: 4px 10px;
-  background: linear-gradient(to bottom, #444, #333);
-   color: #ddd;
-   font-size: 0.8em;
-  text-align: center;
-   border-bottom: 1px solid #222;
-  text-shadow: 0 1px 1px rgba(0, 0, 0, 0.5);
 }
-/* 终端内容 */
+/* 右上弹回 */
-.terminal-content {
+@keyframes wobble-to-top-right {
-   margin-top: 25px;
+.65% {
-   line-height: 1.4;
+    transform: translate(8px, -8px)
-   overflow-x: auto;
+  }
-   white-space: pre-wrap;
+.3% {
+    transform: translate(-6px, 6px);
+   }
+.95% {
+    transform: translate(4px, -4px);
+  }
+.6% {
+    transform: translate(-2px, 2px);
+   }
+.25% {
+    transform: translate(1px, -1px);
+   }
+% {
+    transform: translate(0);
+  }
 }
-/* 终端命令提示符 */
+.hovers-wobble-to-top-right:hover,
-.terminal-prompt {
+.hovers-wobble-to-top-right.active {
-   color: #0f0;
+   animation-name: wobble-to-top-right;
-   margin-right: 5px;
+  animation-duration: 1s;
+  animation-timing-function: ease-in-out;
+   animation-iteration-count: 1;
 }
-/* 终端命令行 */
+/* 果冻 */
-.terminal-line {
+@keyframes wobble-top {
-   margin: 5px 0;
+.65% {
-   word-break: break-all;
+    transform: skew(-12deg);
+  }
+.3% {
+    transform: skew(10deg);
+  }
+.95% {
+    transform: skew(-6deg);
+  }
+.6% {
+    transform: skew(4deg);
+   }
+.25% {
+    transform: skew(-2deg);
+  }
+% {
+    transform: skew(0);
+  }
 }
-/* 终端光标闪烁 */
+/* 赘肉 */
-.terminal-cursor {
+.hovers-wobble-top {
-   display: inline-block;
+   transform-origin: 0 100%;
-  width: 0.5em;
-  height: 1em;
-  background-color: var(--console-indicator-color);
-  vertical-align: middle;
-  animation: console-blink 1s infinite;
 }
+.hovers-wobble-top:hover,
-/* 加载指示器 - 复古科幻风格 */
+.hovers-wobble-top.active {
-.loading {
+   animation-name: wobble-top;
-   display: inline-block;
+   animation-duration: 1s;
-   position: relative;
+   animation-timing-function: ease-in-out;
-   width: 80px;
+   animation-iteration-count: 1;
-   height: 20px;
-  margin: 1em auto;
-  text-align: center;
 }
-.loading div {
+@keyframes wobble-bottom {
-  display: inline-block;
+.65% {
-   width: 8px;
+    transform: skew(-12deg);
-   height: 8px;
+   }
-   margin: 0 3px;
+.3% {
-   background-color: rgba(0, 200, 100, 0.8);
+    transform: skew(10deg);
-   border-radius: 0;
+   }
-   animation: loading 1.2s cubic-bezier(0, 0.5, 0.5, 1) infinite;
+.95% {
+    transform: skew(-6deg);
+   }
+.6% {
+    transform: skew(4deg);
+   }
+.25% {
+    transform: skew(-2deg);
+   }
+% {
+    transform: skew(0);
+  }
 }
-.loading div:nth-child(1) {
+.hovers-wobble-bottom {
-   animation-delay: -0.24s;
+   transform-origin: 100% 0;
 }
+.hovers-wobble-bottom:hover,
-.loading div:nth-child(2) {
+.hovers-wobble-bottom.active {
-   animation-delay: -0.12s;
+  animation-name: wobble-bottom;
+  animation-duration: 1s;
+   animation-timing-function: ease-in-out;
+  animation-iteration-count: 1;
 }
-.loading div:nth-child(3) {
+/* 颤动 */
-  animation-delay: 0;
+@keyframes wobble-skew {
-}
+.65% {
+    transform: skew(-12deg);
-@keyframes loading {
+  }
-% {
+.3% {
-     transform: scaleY(1);
+    transform: skew(10deg);
-     background-color: rgba(0, 200, 100, 0.8);
+  }
+.95% {
+     transform: skew(-6deg);
+  }
+.6% {
+     transform: skew(4deg);
    }
-% {
+.25% {
-     transform: scaleY(2);
+     transform: skew(-2deg);
-    background-color: rgba(0, 255, 100, 0.8);
    }
 % {
-     transform: scaleY(1);
+     transform: skew(0);
-    background-color: rgba(0, 200, 100, 0.8);
    }
 }
+.hovers-wobble-skew:hover,
-/* 工具提示 - 复古科幻风格 */
+.hovers-wobble-skew.active {
-.tooltip {
+   animation-name: wobble-skew;
-  position: relative;
+   animation-duration: 1s;
-  display: inline-block;
+   animation-timing-function: ease-in-out;
-  cursor: help;
+   animation-iteration-count: 1;
-}
-.tooltip .tooltip-text {
-  visibility: hidden;
-  width: 200px;
-  background-color: rgba(20, 20, 20, 0.9);
-   color: #fff;
-  text-align: center;
-  border-radius: 0;
-   padding: 8px 12px;
-  position: absolute;
-  z-index: 1001;
-   bottom: 125%;
-  left: 50%;
-  margin-left: -100px;
-  font-family: var(--small-font);
-   font-size: var(--small-font-size);
-  line-height: 1.4;
-  opacity: 0;
-  transition: opacity 0.2s, transform 0.2s;
-  transform: translateY(10px);
-  box-shadow: 0 5px 15px rgba(0, 0, 0, 0.2);
-  border: 1px solid #444;
-  text-shadow: none;
 }
-/* 工具提示箭头 */
+/* 振动 */
-.tooltip .tooltip-text::after {
+@keyframes buzz {
-   content: "";
+% {
-   position: absolute;
+    transform: translateX(3px) rotate(2deg);
-   top: 100%;
+   }
-  left: 50%;
+% {
-  margin-left: -5px;
+    transform: translateX(-3px) rotate(-2deg);
-   border-width: 5px;
+   }
-  border-style: solid;
-  border-color: rgba(20, 20, 20, 0.9) transparent transparent transparent;
 }
-/* 显示工具提示 */
+.hovers-buzz:hover,
-.tooltip:hover .tooltip-text {
+.hovers-buzz.active {
-   visibility: visible;
+   animation-name: buzz;
-   opacity: 1;
+   animation-duration: 0.15s;
-   transform: translateY(0);
+   animation-timing-function: linear;
+  animation-iteration-count: infinite;
 }
-/* 徽章 - 复古科幻风格 */
+/* 振出 */
-.badge {
+@keyframes buzz-out {
-   display: inline-block;
+% {
-   padding: 2px 6px;
+    transform: translateX(3px) rotate(2deg);
-   font-size: 0.8em;
+   }
-   font-family: var(--UI-font);
+% {
-   line-height: 1;
+    transform: translateX(-3px) rotate(-2deg);
-   text-align: center;
+   }
-   white-space: nowrap;
+% {
-   vertical-align: middle;
+    transform: translateX(3px) rotate(2deg);
-   background-color: #777;
+   }
-   color: #fff;
+% {
-   border-radius: 0;
+    transform: translateX(-3px) rotate(-2deg);
-   margin: 0 3px;
+   }
-  border: 1px solid rgba(0, 0, 0, 0.2);
+% {
-   box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2);
+    transform: translateX(2px) rotate(1deg);
-   text-shadow: 0 1px 0 rgba(0, 0, 0, 0.5);
+   }
+% {
+    transform: translateX(-2px) rotate(-1deg);
+   }
+% {
+    transform: translateX(2px) rotate(1deg);
+   }
+% {
+    transform: translateX(-2px) rotate(-1deg);
+   }
+% {
+    transform: translateX(1px) rotate(0);
+   }
+% {
+    transform: translateX(-1px) rotate(0);
+  }
 }
-.badge-primary {
+.hovers-buzz-out:hover,
-   background-color: #0078d7;
+.hovers-buzz-out.active {
+   animation-name: buzz-out;
+  animation-duration: 0.75s;
+  animation-timing-function: linear;
+  animation-iteration-count: 1;
 }
-.badge-success {
+/* 右移 */
-   background-color: #5cb85c;
+.hovers-forward:hover,
+.hovers-forward.active {
+   transform: translateX(8px);
 }
-.badge-info {
+/* 左移 */
-   background-color: #5bc0de;
+.hovers-backward:hover,
+.hovers-backward.active {
+   transform: translateX(-8px);
 }
-.badge-warning {
+/* 自由移动 */
-   background-color: #f0ad4e;
+.hovers-top,
+.hovers-left,
+.hovers-bottom,
+.hovers-right {
+   transition: all 0.5s;
 }
-.badge-danger {
+.hovers-top:hover,
-   background-color: #d9534f;
+.hovers-top.active {
+   transform: translateY(-0.0625em);
 }
-/* 进度条 - 复古科幻风格 */
+.hovers-left:hover,
-.progress {
+.hovers-left.active {
-  height: 20px;
+   transform: translateX(-0.0625em);
-  margin: 1em 0;
-  background-color: rgba(220, 225, 230, 0.8);
-  border-radius: 0;
-   box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.1);
-  overflow: hidden;
-  border: 1px solid #ccc;
-  position: relative;
 }
-.progress-bar {
+.hovers-bottom:hover,
-  height: 100%;
+.hovers-bottom.active {
-  background: repeating-linear-gradient(
+   transform: translateY(0.0625em);
-deg,
-    rgba(0, 200, 100, 0.8),
-    rgba(0, 200, 100, 0.8) 10px,
-    rgba(0, 220, 110, 0.9) 10px,
-    rgba(0, 220, 110, 0.9) 20px
-   );
-  box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.15);
-  transition: width 0.6s ease;
-  position: relative;
-  animation: progress-animation 2s linear infinite;
 }
-@keyframes progress-animation {
+.hovers-right:hover,
-% {
+.hovers-right.active {
-    background-position: 0 0;
+   transform: translateX(0.0625em);
-   }
-% {
-    background-position: 40px 0;
-  }
 }
-.progress-text {
+/* 滤镜 */
-  position: absolute;
+.hovers-blur,
-  top: 0;
+.hovers-blur-reverse,
-  left: 0;
+.hovers-brightness,
-  width: 100%;
+.hovers-brightness-reverse,
-  height: 100%;
+.hovers-contrast,
-  display: flex;
+.hovers-contrast-reverse,
-  align-items: center;
+.hovers-grayscale,
-  justify-content: center;
+.hovers-grayscale-reverse,
-  color: #333;
+.hovers-invert,
-  font-family: var(--UI-font);
+.hovers-invert-reverse,
-  font-size: 0.8em;
+.hovers-saturate,
-   text-shadow: 0 1px 0 rgba(255, 255, 255, 0.5);
+.hovers-saturate-reverse,
+.hovers-sepia,
+.hovers-sepia-reverse,
+.hovers-hue-rotate,
+.hovers-hue-rotate-reverse {
+   transition-duration: 0.75s;
 }
-/* 标签页 - 复古科幻风格 */
+.hovers-blur:hover,
-.tabs {
+.hovers-blur.active,
-  margin: 1.5em 0;
+.hovers-brightness:hover,
-  border-radius: 0;
+.hovers-brightness.active,
-  background-color: rgba(255, 255, 255, 0.9);
+.hovers-contrast:hover,
-  border: 1px solid #ccc;
+.hovers-contrast.active,
-  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
+.hovers-grayscale:hover,
+.hovers-grayscale.active,
+.hovers-invert:hover,
+.hovers-invert.active,
+.hovers-saturate:hover,
+.hovers-saturate.active,
+.hovers-sepia:hover,
+.hovers-sepia.active,
+.hovers-hue-rotate:hover,
+.hovers-hue-rotate.active {
+  filter: initial;
 }
-.tabs-nav {
+.hovers-blur {
-   display: flex;
+   filter: blur(5px);
-  list-style: none;
-  padding: 0;
-  margin: 0;
-  background-color: rgba(240, 245, 250, 0.8);
-  border-bottom: 1px solid #ccc;
 }
-.tabs-nav li {
+.hovers-blur-reverse:hover,
-   margin: 0;
+.hovers-blur-reverse.active {
+   filter: blur(5px);
 }
-.tabs-nav a {
+.hovers-brightness {
-   display: block;
+   filter: brightness(50%);
-  padding: 8px 15px;
-  text-decoration: none;
-  color: #555;
-  border-right: 1px solid #ddd;
-  font-family: var(--UI-font);
-  font-size: calc(var(--base-font-size) * 0.9);
-  transition: all 0.2s ease;
-  background: linear-gradient(to bottom, #f5f5f5, #e5e5e5);
-  border-bottom: 3px solid transparent;
 }
-.tabs-nav a:hover {
+.hovers-brightness-reverse:hover,
-   background: linear-gradient(to bottom, #fff, #f0f0f0);
+.hovers-brightness-reverse.active {
-  color: #333;
+   filter: brightness(50%);
-  transform: none;
-  box-shadow: none;
 }
-.tabs-nav a.active {
+.hovers-contrast {
-   background: #fff;
+   filter: contrast(50%);
-  color: #333;
-  border-bottom: 3px solid var(--crt-glow-color);
-  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 1);
 }
-.tabs-content {
+.hovers-contrast-reverse:hover,
-   padding: 15px;
+.hovers-contrast-reverse.active {
-  border-radius: 0 0 3px 3px;
+   filter: contrast(50%);
 }
-.tab-pane {
+.hovers-grayscale {
-   display: none;
+   filter: grayscale(100%);
 }
-.tab-pane.active {
+.hovers-grayscale-reverse:hover,
-   display: block;
+.hovers-grayscale-reverse.active {
-  animation: fade-in 0.3s ease-in-out;
+   filter: grayscale(100%);
 }
-@keyframes fade-in {
+.hovers-invert {
-   from {
+   filter: invert(100%);
-    opacity: 0;
-  }
-  to {
-    opacity: 1;
-  }
 }
-/* 卡片 - 复古科幻风格 */
+.hovers-invert-reverse:hover,
-.card {
+.hovers-invert-reverse.active {
-  background-color: rgba(255, 255, 255, 0.95);
+   filter: invert(100%);
-  border: 1px solid rgba(0, 0, 0, 0.15);
-  border-radius: 0;
-  margin: 1em 0;
-   box-shadow:
-    var(--box-depth),
-    inset 0 0 10px rgba(0, 255, 100, 0.02);
-  position: relative;
-  overflow: hidden;
-  transition: all 0.3s ease;
 }
-.card:hover {
+.hovers-saturate {
-   transform: translateY(-3px);
+   filter: saturate(200%);
-  box-shadow:
-5px 15px rgba(0, 0, 0, 0.1),
-    inset 0 0 10px rgba(0, 255, 100, 0.04);
 }
-.card::before {
+.hovers-saturate-reverse:hover,
-   content: "";
+.hovers-saturate-reverse.active {
-  position: absolute;
+   filter: saturate(200%);
-  top: 0;
-  left: 0;
-  width: 100%;
-  height: 2px;
-  background: linear-gradient(to right, transparent, var(--crt-glow-color), transparent);
 }
-.card-header {
+.hovers-sepia {
-   background: linear-gradient(to bottom, #f8f9fa, #e8eaec);
+   filter: sepia(100%);
-  padding: 10px 15px;
-  border-bottom: 1px solid rgba(0, 0, 0, 0.1);
-  font-family: var(--title-font);
-  font-size: calc(var(--base-font-size) * 1.1);
-  color: #333;
-  text-shadow: 0 1px 0 rgba(255, 255, 255, 0.5), var(--crt-text-shadow);
-  position: relative;
 }
-.card-body {
+.hovers-sepia-reverse:hover,
-   padding: 15px;
+.hovers-sepia-reverse.acitve {
-  font-family: var(--body-font);
+   filter: sepia(100%);
 }
-.card-footer {
+.hovers-hue-rotate {
-   background-color: rgba(245, 248, 250, 0.7);
+   filter: hue-rotate(180deg);
-  padding: 10px 15px;
-  border-top: 1px solid rgba(0, 0, 0, 0.1);
 }
-/* 侧边栏 - 复古科幻风格 */
+.hovers-hue-rotate-reverse:hover,
-.sidebar {
+.hovers-hue-rotate-reverse.active {
-  width: var(--sidebar-width);
+   filter: hue-rotate(180deg);
-  max-height: var(--sidebar-max-height);
-  margin-top: var(--sidebar-top-offset);
-  background:
-    linear-gradient(135deg, rgba(0, 255, 100, 0.05) 0%, transparent 100%),
-    linear-gradient(to bottom, rgba(220, 230, 240, 0.9), rgba(190, 210, 225, 0.95));
-  border: 1px solid rgba(0, 0, 0, 0.2);
-  border-radius: 3px;
-  box-shadow:
-    var(--box-depth),
-    inset 0 0 20px rgba(0, 200, 255, 0.07);
-   overflow-y: auto;
-  position: sticky;
-  top: var(--sidebar-top-offset);
-  transition: all 0.3s ease;
 }
-.sidebar-header {
+/* 背景滑动 */
-  background: linear-gradient(to bottom, #445, #334);
+.hovers-sweep-to-right,
-  color: #fff;
+.hovers-sweep-to-left,
-  padding: 12px 15px;
+.hovers-sweep-to-bottom,
-  font-family: var(--title-font);
+.hovers-sweep-to-top,
-  font-size: calc(var(--base-font-size) * 1.1);
+.hovers-radial-out,
-  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.3);
+.hovers-radial-in {
-  text-align: center;
-  border-bottom: 1px solid #223;
-  letter-spacing: 0.05em;
    position: relative;
+  transition-duration: 0.3s;
+  transition-timing-function: ease-out;
+  overflow: hidden;
 }
-.sidebar-header::after {
+.hovers-sweep-to-right:before,
-   content: "";
+.hovers-sweep-to-left:before,
+.hovers-sweep-to-bottom:before,
+.hovers-sweep-to-top:before,
+.hovers-radial-out:before,
+.hovers-radial-in:before {
+   content: '';
    position: absolute;
+  z-index: 10;
+  top: 0;
+  left: 0;
+  right: 0;
    bottom: 0;
-   left: 0;
+   background: inherit;
-   width: 100%;
+   transform: scaleX(0);
-   height: 1px;
+   transition: inherit;
-  background: linear-gradient(to right, transparent, rgba(255, 255, 255, 0.2), transparent);
+}
+.hovers-sweep-to-bottom:before,
+.hovers-sweep-to-top:before {
+  transform: scaleY(0);
 }
+.hovers-radial-out:before,
-.sidebar-section {
+.hovers-radial-in:before {
-   padding: 10px 15px;
+   border-radius: 50%;
-   border-bottom: 1px solid rgba(0, 0, 0, 0.1);
+   transform: scale(0);
 }
+.hovers-radial-in:before {
-.sidebar-section:last-child {
+   transform: scale(2);
-   border-bottom: none;
 }
-.sidebar-title {
+.hovers-sweep-to-right:before {
-  font-family: var(--UI-font);
+   transform-origin: 0 50%;
-  font-size: calc(var(--base-font-size) * 0.95);
-  color: #333;
-  margin: 0 0 8px 0;
-   padding-bottom: 5px;
-  border-bottom: 1px dashed rgba(0, 0, 0, 0.1);
-  text-shadow: 0 1px 0 rgba(255, 255, 255, 0.5);
 }
+.hovers-sweep-to-left:before {
-.sidebar-list {
+   transform-origin: 100% 50%;
-   list-style: none;
-  margin: 0;
-  padding: 0;
 }
+.hovers-sweep-to-bottom:before {
-.sidebar-list li {
+   transform-origin: 50% 0;
-   margin: 5px 0;
-  padding: 0;
 }
+.hovers-sweep-to-top:before {
-.sidebar-list a {
+   transform-origin: 50% 100%;
-  display: block;
-  padding: 5px 8px;
-  color: var(--link-color);
-  text-decoration: none;
-  font-size: calc(var(--base-font-size) * 0.9);
-   transition: all 0.2s ease;
-  text-shadow: 0 0 2px rgba(0, 100, 255, 0.1);
-  border-left: 2px solid transparent;
 }
+.hovers-radial-out:hover:before,
-.sidebar-list a:hover {
+.hovers-radial-out.active:before {
-  background-color: rgba(0, 150, 255, 0.1);
+   transform: scale(2);
-  color: var(--link-color-active);
-  text-shadow: 0 0 5px rgba(0, 150, 255, 0.3);
-   transform: translateX(2px);
-  border-left: 2px solid var(--crt-glow-color);
 }
+.hovers-radial-in:hover:before,
-.sidebar-list a.active {
+.hovers-radial-in.active:before {
-   background-color: rgba(0, 200, 100, 0.1);
+   transform: scale(0);
-  color: #008851;
-  border-left: 2px solid #008851;
-  font-weight: normal;
 }
-/* 弹窗对话框 - 复古科幻风格 */
+.hovers-sweep-to-right .hovers-content.center,
-.modal {
+.hovers-sweep-to-left .hovers-content.center,
-  position: fixed;
+.hovers-sweep-to-bottom .hovers-content.center,
-  top: 0;
+.hovers-sweep-to-top .hovers-content.center,
-  left: 0;
+.hovers-radial-out .hovers-content.center,
-  width: 100%;
+.hovers-radial-in .hovers-content.center {
-  height: 100%;
-  background-color: rgba(0, 0, 0, 0.5);
    display: flex;
+  align-items: center;
    justify-content: center;
-   align-items: center;
+   word-break: break-all;
-  z-index: 1050;
-  opacity: 0;
-  visibility: hidden;
-  transition: all 0.3s ease;
 }
-.modal.show {
+.hovers-sweep-to-right:hover:before,
-   opacity: 1;
+.hovers-sweep-to-left:hover:before,
-  visibility: visible;
+.hovers-sweep-to-bottom:hover:before,
+.hovers-sweep-to-top:hover:before,
+.hovers-sweep-to-right.active:before,
+.hovers-sweep-to-left:hover:before,
+.hovers-sweep-to-bottom:hover:before,
+.hovers-sweep-to-top:hover:before {
+   transform: scaleX(1);
 }
-.modal-dialog {
+.hovers-sweep-to-right .hovers-content,
+.hovers-sweep-to-left .hovers-content,
+.hovers-sweep-to-bottom .hovers-content,
+.hovers-sweep-to-top .hovers-content,
+.hovers-radial-out .hovers-content,
+.hovers-radial-in .hovers-content {
    width: 100%;
-   max-width: 500px;
+   height: 100%;
-   margin: 1.75rem;
+   position: absolute;
-   background-color: rgba(245, 250, 255, 0.95);
+   transition-property: all;
-   border: 1px solid rgba(0, 0, 0, 0.2);
+   transition-duration: inherit;
-   border-radius: 0;
+   top: 0;
-   box-shadow:
+   left: 0;
-10px 25px rgba(0, 0, 0, 0.3),
+   z-index: 11;
-    inset 0 0 30px rgba(0, 255, 100, 0.05);
-   transform: translateY(-50px);
-  transition: transform 0.3s ease;
-  position: relative;
-  overflow: hidden;
 }
-.modal.show .modal-dialog {
+.hovers-sweep-to-right .hovers-content {
-   transform: translateY(0);
+   left: initial;
+  right: 100%;
 }
+.hovers-sweep-to-right:hover .hovers-content,
-.modal-header {
+.hovers-sweep-to-right.active .hovers-content {
-  display: flex;
+   right: 0;
-  align-items: center;
-  justify-content: space-between;
-  padding: 12px 15px;
-  border-bottom: 1px solid #e9ecef;
-   background: linear-gradient(to bottom, #f8f9fa, #e8eaec);
 }
-.modal-title {
+.hovers-sweep-to-left .hovers-content {
-  margin: 0;
+   left: 100%;
-  font-family: var(--title-font);
-  font-size: calc(var(--base-font-size) * 1.1);
-  color: #333;
-   text-shadow: 0 1px 0 rgba(255, 255, 255, 0.5), var(--crt-text-shadow);
 }
+.hovers-sweep-to-left:hover .hovers-content,
-.modal-close {
+.hovers-sweep-to-left.active .hovers-content {
-  padding: 0;
+   left: 0;
-  background-color: transparent;
-  border: 0;
-  float: right;
-  font-size: 1.5rem;
-  font-weight: 700;
-  line-height: 1;
-  color: #000;
-  text-shadow: 0 1px 0 #fff;
-   opacity: 0.5;
-  cursor: pointer;
 }
-.modal-close:hover {
+.hovers-sweep-to-bottom .hovers-content {
-   opacity: 0.75;
+   top: initial;
-   text-shadow: 0 0 5px rgba(0, 0, 0, 0.2);
+   bottom: 100%;
 }
+.hovers-sweep-to-bottom:hover .hovers-content,
-.modal-body {
+.hovers-sweep-to-bottom.active .hovers-content {
-  padding: 15px;
+  bottom: 0;
-  font-family: var(--body-font);
 }
-.modal-footer {
+.hovers-sweep-to-top .hovers-content {
-  display: flex;
+   top: 100%;
-  align-items: center;
-  justify-content: flex-end;
-  padding: 12px 15px;
-   border-top: 1px solid #e9ecef;
-  background-color: rgba(245, 248, 250, 0.7);
 }
+.hovers-sweep-to-top:hover .hovers-content,
-.modal-footer > button {
+.hovers-sweep-to-top.active .hovers-content {
-   margin-left: 5px;
+   top: 0;
 }
-/* 自定义滚动条 */
+.hovers-radial-out .hovers-content,
-.custom-scrollbar {
+.hovers-radial-in:hover .hovers-content,
-  scrollbar-width: thin;
+.hovers-radial-in.active .hovers-content {
-   scrollbar-color: #999 #f5f5f5;
+   opacity: 0;
 }
-.custom-scrollbar::-webkit-scrollbar {
+.hovers-radial-in .hovers-content,
-   width: 8px;
+.hovers-radial-out:hover .hovers-content,
-  height: 8px;
+.hovers-radial-out.active .hovers-content {
+   opacity: 1;
 }
-.custom-scrollbar::-webkit-scrollbar-track {
+/* 默认em */
-  background: rgba(0, 0, 0, 0.03);
+.hovers-border,
-   border-radius: 0;
+.hovers-trim,
+.hovers-ripple-out,
+.hovers-ripple-in,
+.hovers-outline-out,
+.hovers-outline-in,
+.hovers-reveal {
+  font-size: 160px;
+   line-height: 16px;
 }
-.custom-scrollbar::-webkit-scrollbar-thumb {
+/* 内边框滑出 */
-  background: repeating-linear-gradient(
+.hovers-border,
-    to bottom,
+.hovers-trim {
-    #aaa 0px,
+   position: relative;
-    #aaa 2px,
+   top: 0;
-    #999 3px,
+   left: 0;
-    #999 5px
+   transition: all 0.3s;
-  );
-  border-radius: 0;
-  border: 1px solid rgba(0, 0, 0, 0.1);
-}
-/* 打字机效果文本 */
-.typewriter {
-  overflow: hidden;
-  white-space: nowrap;
-  border-right: 2px solid var(--console-text-color);
-  animation: typing 3.5s steps(40, end), blink-caret 0.75s step-end infinite;
-  display: inline-block;
-}
-@keyframes typing {
-   from { width: 0 }
-  to { width: 100% }
-}
-@keyframes blink-caret {
-  from, to { border-color: transparent }
-% { border-color: var(--console-text-color) }
-}
-/* 折叠面板 - 复古科幻风格 */
-.accordion {
-  margin: 1.5em 0;
-   border: 1px solid #ccc;
-  border-radius: 0;
-   background-color: rgba(255, 255, 255, 0.9);
-   box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
-}
-.accordion-item {
-  border-bottom: 1px solid #ddd;
-}
-.accordion-item:last-child {
-  border-bottom: none;
-}
-.accordion-header {
-  padding: 0;
-  margin: 0;
 }
-.accordion-button {
+.hovers-border:before {
-   display: block;
+   content: '';
    width: 100%;
-   padding: 12px 15px;
+   height: 100%;
-  background: linear-gradient(to bottom, #f8f9fa, #e8eaec);
-  color: #333;
-  text-align: left;
-  border: none;
-  cursor: pointer;
-  font-family: var(--title-font);
-  font-size: calc(var(--base-font-size) * 1);
-  font-weight: normal;
-  text-shadow: 0 1px 0 rgba(255, 255, 255, 0.5);
-  position: relative;
-  transition: all 0.3s ease;
-}
-.accordion-button::after {
-  content: "▼";
    position: absolute;
-   right: 15px;
+   top: 0;
-   top: 50%;
+   left: 0;
-   transform: translateY(-50%);
+   box-sizing: border-box;
-   font-size: 0.7em;
+  transition: inherit;
-   transition: transform 0.3s ease;
+   border-width: calc(0.0625em * 0.6);
+   border-color: inherit;
+  border-style: solid;
+  border-radius: inherit;
+  opacity: 0;
 }
-.accordion-button.collapsed::after {
+.hovers-border:hover:before,
-   transform: translateY(-50%) rotate(-90deg);
+.hovers-border.active:before {
+   opacity: 1;
 }
-.accordion-button:hover {
+/* 带边距内边框 */
-   background: linear-gradient(to bottom, #fff, #f0f0f0);
+.hovers-trim:before {
+   content: '';
+  position: absolute;
+  top: calc(0.0625em * 0.4);
+  left: calc(0.0625em * 0.4);
+  bottom: calc(0.0625em * 0.4);
+  right: calc(0.0625em * 0.4);
+  transition: inherit;
+  border-width: calc(0.0625em * 0.6);
+  border-color: inherit;
+  border-style: solid;
+  opacity: 0;
+  border-radius: inherit;
 }
-.accordion-body {
+.hovers-trim:hover:before,
-  padding: 15px;
+.hovers-trim.active:before {
-  display: none;
+   opacity: 1;
-   font-family: var(--body-font);
 }
-.accordion-body.show {
+/* 边框飞出与飞入 */
-   display: block;
+.hovers-ripple-out,
+.hovers-ripple-in,
+.hovers-outline-out,
+.hovers-outline-in,
+.hovers-reveal {
+   animation-duration: 0.7s;
+  animation-timing-function: ease-out;
+  transition: all 0.3s;
 }
-/* 文章卡片 - 复古科幻风格 */
+.hovers-ripple-out:before,
-.article-card {
+.hovers-ripple-in:before,
-  display: flex;
+.hovers-outline-out:before,
-  flex-direction: column;
+.hovers-outline-in:before,
-  margin: 1.5em 0;
+.hovers-reveal:before {
-  background-color: rgba(255, 255, 255, 0.95);
+   content: '';
-  border: 1px solid rgba(0, 0, 0, 0.15);
-  border-radius: 0;
-  box-shadow:
-    var(--box-depth),
-    inset 0 0 10px rgba(0, 255, 100, 0.02);
-  overflow: hidden;
-  transition: all 0.3s ease;
-  position: relative;
-}
-.article-card::before {
-   content: "";
    position: absolute;
    top: 0;
+  right: 0;
+  bottom: 0;
    left: 0;
-   width: 100%;
+   animation: inherit;
-   height: 2px;
+   transition: inherit;
-   background: linear-gradient(to right, transparent, var(--crt-glow-color), transparent);
+   border-width: calc(0.0625em * 0.6);
+  border-color: inherit;
+  border-style: solid;
+  border-radius: inherit;
 }
+.hovers-ripple-out:before {
-.article-card:hover {
+   opacity: 0;
-   transform: translateY(-3px);
-  box-shadow:
-5px 15px rgba(0, 0, 0, 0.1),
-    inset 0 0 10px rgba(0, 255, 100, 0.04);
 }
+.hovers-ripple-in:before {
-.article-header {
+   top: calc(-0.0625em * 1.2);
-   padding: 15px;
+   right: calc(-0.0625em * 1.2);
-   border-bottom: 1px solid rgba(0, 0, 0, 0.1);
+  bottom: calc(-0.0625em * 1.2);
+  left: calc(-0.0625em * 1.2);
+  opacity: 0;
 }
+.hovers-outline-out:before {
-.article-title {
+   opacity: 0;
-   margin: 0 0 10px 0;
-  font-family: var(--title-font);
-  font-size: calc(var(--base-font-size) * 1.3);
-  color: #333;
-  text-shadow: var(--crt-text-shadow);
 }
+.hovers-outline-out:before {
-.article-meta {
+   top: calc(-0.0625em * 1.6);
-   display: flex;
+   right: calc(-0.0625em * 1.6);
-   align-items: center;
+   bottom: calc(-0.0625em * 1.6);
-   font-family: var(--small-font);
+   left: calc(-0.0625em * 1.6);
-   font-size: var(--small-font-size);
+   opacity: 0;
-   color: #777;
 }
+.hovers-reveal:before {
-.article-author {
+   border-width: 0;
-   margin-right: 15px;
+  opacity: 0;
 }
-.article-date {
+@keyframes ripple-out {
-   margin-right: 15px;
+% {
-}
+    opacity: 1;
+  }
-.article-thumbnail {
+% {
-   width: 100%;
+    top: calc(-0.0625em * 1.2);
-  height: 200px;
+    right: calc(-0.0625em * 1.2);
-  object-fit: cover;
+    bottom: calc(-0.0625em * 1.2);
-  border-bottom: 1px solid rgba(0, 0, 0, 0.1);
+    left: calc(-0.0625em * 1.2);
+    opacity: 0;
+  }
 }
+.hovers-ripple-out:hover:before,
-.article-content {
+.hovers-ripple-out.active:before {
-  padding: 15px;
+   animation-name: ripple-out;
-  flex: 1;
-   font-family: var(--body-font);
 }
-.article-footer {
+@keyframes ripple-in {
-   display: flex;
+% {
-  align-items: center;
+    opacity: 1;
-  justify-content: space-between;
+   }
-  padding: 10px 15px;
-   background-color: rgba(245, 248, 250, 0.7);
-  border-top: 1px solid rgba(0, 0, 0, 0.1);
-}
-.article-tags {
+% {
-  display: flex;
+    top: 0;
-  flex-wrap: wrap;
+    right: 0;
-  gap: 5px;
+    bottom: 0;
+    left: 0;
+    opacity: 0;
+  }
 }
+.hovers-ripple-in:hover:before,
-.article-tag {
+.hovers-ripple-in.active:before {
-  display: inline-block;
+   animation-name: ripple-in;
-  padding: 2px 6px;
-  font-size: 0.8em;
-  font-family: var(--UI-font);
-  background-color: rgba(0, 150, 255, 0.1);
-  color: var(--link-color);
-   border-radius: 0;
-  border: 1px solid rgba(0, 150, 255, 0.2);
-  transition: all 0.2s ease;
 }
-.article-tag:hover {
+.hovers-outline-out:hover:before,
-   background-color: rgba(0, 150, 255, 0.2);
+.hovers-outline-in:hover:before,
-   color: var(--link-color-active);
+.hovers-outline-out.active:before,
-   transform: translateY(-1px);
+.hovers-outline-in:hover:before {
+   top: calc(-0.0625em * 0.8);
+  right: calc(-0.0625em * 0.8);
+   bottom: calc(-0.0625em * 0.8);
+   left: calc(-0.0625em * 0.8);
+  opacity: 1;
 }
-/* 网格布局 - 复古科幻风格 */
+.hovers-reveal:hover:before,
-.grid {
+.hovers-reveal.active:before {
-   display: grid;
+   transform: translateY(0);
-   grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));
+   border-width: calc(0.0625em * 0.4);
-   gap: 20px;
+   opacity: 1;
-  margin: 1.5em 0;
 }
-.grid-item {
+/* 圆角化 */
-  background-color: rgba(255, 255, 255, 0.95);
+.hovers-round-corners {
-  border: 1px solid rgba(0, 0, 0, 0.15);
-  border-radius: 0;
-  padding: 15px;
-  box-shadow: var(--box-depth);
-  transition: all 0.3s ease;
-  position: relative;
    overflow: hidden;
 }
+.hovers-round-corners:hover,
-.grid-item::before {
+.hovers-round-corners.active {
-  content: "";
+   border-radius: 0.0625em;
-  position: absolute;
-  top: 0;
-  left: 0;
-  width: 100%;
-  height: 2px;
-  background: linear-gradient(to right, transparent, var(--crt-glow-color), transparent);
-  opacity: 0;
-  transition: opacity 0.3s ease;
-}
-.grid-item:hover {
-  transform: translateY(-3px);
-  box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1);
-}
-.grid-item:hover::before {
-  opacity: 1;
-}
-/* 按钮组 - 复古科幻风格 */
-.btn-group {
-  display: inline-flex;
-  vertical-align: middle;
-}
-.btn-group button {
-  margin: 0;
-   border-radius: 0;
-}
-.btn-group button:not(:first-child) {
-  border-left: none;
-}
-.btn-group button:first-child {
-  border-top-left-radius: 0;
-  border-bottom-left-radius: 0;
 }
-.btn-group button:last-child {
+/* 重叠：翻转切换 */
-  border-top-right-radius: 0;
-  border-bottom-right-radius: 0;
-}
-/* 通知横幅 - 复古科幻风格 */
+.hover-turn {
-.banner {
-  display: flex;
-  align-items: center;
-  margin: 1.5em 0;
-  padding: 12px 15px;
-  background-color: rgba(245, 248, 250, 0.9);
-  border: 1px solid rgba(0, 0, 0, 0.15);
-  border-radius: 0;
-  box-shadow: var(--box-depth);
    position: relative;
-   overflow: hidden;
+   transform: translateZ(1px);
 }
-.banner::before {
+.hover-turn-before,
-  content: "";
+.hover-turn-after {
    position: absolute;
    top: 0;
    left: 0;
-  width: 100%;
-  height: 2px;
-  background: linear-gradient(to right, transparent, var(--crt-glow-color), transparent);
 }
-.banner-icon {
+@keyframes hover-turn {
-   margin-right: 15px;
+   from {
-  font-size: 1.5em;
+    transform: rotateY(-90deg);
-   color: #777;
+   }
-}
-.banner-content {
+% {
-  flex: 1;
+    transform: scale(1.2);
-   font-family: var(--body-font);
+   }
-}
-.banner-title {
+  to {
-  font-family: var(--title-font);
+    transform: rotateY(0);
-  font-size: calc(var(--base-font-size) * 1.1);
+   }
-   margin: 0 0 5px 0;
-  color: #333;
 }
-.banner-text {
+.hover-turn:not(:hover) .hover-turn-before,
-   margin: 0;
+.hover-turn:hover .hover-turn-after {
-  color: #555;
+   animation: hover-turn 0.5s;
 }
-.banner-close {
+.hover-turn:hover .hover-turn-before,
-  margin-left: 15px;
+.hover-turn:not(:hover) .hover-turn-after {
-  cursor: pointer;
+	opacity: 0;
-  color: #777;
-  font-size: 1.2em;
-  transition: all 0.2s ease;
 }
+/* [[Category:在模板名字空间下的CSS页面]] */
-.banner-close:hover {
+/*
-  color: #333;
+.colormu_toggle_on是为了黑幕开关(MediaWiki:Gadget-heimu-toggle.js)做适配。
-  transform: scale(1.1);
+.colormu-drk、.colormu-bri分别是暗色背景和亮色背景，
-}
+暗色背景的文字通常是浅色，在半隐背景后，颜色需要变成深色。
+*/
-/* 主题变换按钮 - 复古科幻风格 */
-.theme-switch {
+.colormu-drk {
-  position: fixed;
+	color: #FFF;
-  bottom: 20px;
-  right: 20px;
-  z-index: 1000;
-  background-color: rgba(20, 20, 20, 0.8);
-  color: #fff;
-  border: none;
-  border-radius: 0;
-  padding: 8px 12px;
-  font-family: var(--UI-font);
-  font-size: calc(var(--base-font-size) * 0.8);
-  cursor: pointer;
-  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.2);
-  transition: all 0.2s ease;
-  display: flex;
-  align-items: center;
-  gap: 5px;
 }
+.colormu-bri {
-.theme-switch-icon {
+	color: #000;
-  font-size: 1.2em;
 }
+.colormu-drk:not(.colormu_toggle_on) a {
-.theme-switch:hover {
+	color: #add8e6;
-  background-color: rgba(30, 30, 30, 0.9);
-  transform: translateY(-2px);
-  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.3);
 }
+.colormu-drk:not(.colormu_toggle_on) a.new {
-/* 页脚 - 复古科幻风格 */
+	color: #FCC;
-.footer {
-  margin-top: 3rem;
-  padding: 2rem 0;
-  background-color: rgba(240, 245, 250, 0.9);
-  border-top: 1px solid rgba(0, 0, 0, 0.1);
-  font-family: var(--small-font);
-  font-size: var(--small-font-size);
-  text-align: center;
-  position: relative;
 }
+.colormu>span, .colormu a, .colormu a>span {
-.footer::before {
+	transition: color 0.2s;
-  content: "";
-  position: absolute;
-  top: 0;
-  left: 0;
-  width: 100%;
-  height: 1px;
-  background: linear-gradient(to right, transparent, rgba(255, 255, 255, 0.8), transparent);
 }
-.footer-links {
+.colormu:not(:hover):not(:active):not(.colormu_toggle_on)>span,
-  display: flex;
+.colormu:not(:hover):not(:active):not(.colormu_toggle_on) a {
-  justify-content: center;
+	color: transparent;
-  flex-wrap: wrap;
-  gap: 20px;
-  margin-bottom: 1rem;
 }
-.footer-link {
+/* for T:Coloredlink in T:彩幕 */
-  color: var(--link-color);
+.colormu:not(:hover):not(:active):not(.colormu_toggle_on) a>span {
-  text-decoration: none;
+	color: transparent !important;
-  transition: all 0.2s ease;
 }
-.footer-link:hover {
+/* for T:彩幕 in link */
-  color: var(--link-color-active);
+a .colormu-bri {
-  text-shadow: 0 0 3px rgba(0, 150, 255, 0.3);
+	color: inherit;
 }
+a:hover .colormu>span, a:active .colormu>span,
-.footer-copyright {
+/* and for MediaWiki:Gadget-heimu-toggle.js */
-  color: #777;
+.colormu-drk.colormu_toggle_on, .colormu_toggle_on>span, .colormu-drk.colormu_toggle_on a>span {
-  margin: 0;
+	color: inherit !important;
 }
-/* 媒体查询 - 响应式布局 */
+/* [[Category:在模板名字空间下的CSS页面]] */
-@media screen and (max-width: 768px) {
-  :root {
-    --base-font-size: 14px;
-    --small-font-size: 12px;
-  }
-  body {
-    padding: 1rem;
-    margin: 0.5rem;
-  }
-  .sidebar {
-    width: 100%;
-    max-height: none;
-    margin-top: 1rem;
-    position: static;
-  }
-  .grid {
-    grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
-  }
-  .notaninfobox {
-    float: none;
-    width: 100%;
-    margin: 1em 0;
-  }
-  .modal-dialog {
-    margin: 1rem;
-    max-width: 100%;
-  }
-}
-@media screen and (min-width: 1440px) {
-  :root {
-    --base-font-size: 16px;
-    --small-font-size: 14px;
-  }
-  body {
-    width: 80%;
-    max-width: 1400px;
-  }
-}
-/* 打印样式优化 */
-@media print {
-  :root {
-    --crt-effects-display: none;
-  }
-  html, body {
-    background: #fff !important;
-    color: #000 !important;
-  }
-  body::before,
-  body::after,
-  .crt-primary-scanline,
-  .crt-secondary-scanline,
-  .crt-fast-scanline,
-  .crt-scanline-shadow,
-  .crt-curve-effect,
-  .crt-monitor-frame,
-  .crt-reflection,
-  .theme-switch {
-    display: none !important;
-  }
-  * {
-    text-shadow: none !important;
-    box-shadow: none !important;
-    animation: none !important;
-    border-color: #ddd !important;
-  }
-  a {
-    color: #000 !important;
-    text-decoration: underline !important;
-  }
-  a::before {
-    display: none !important;
-  }
-  pre, code {
-    border: 1px solid #ddd;
-    background: #f8f8f8 !important;
-  }
-  .notaninfobox,
-  .card,
-  .article-card,
-  .sidebar,
-  .banner,
-  .modal {
-    box-shadow: none !important;
-    border: 1px solid #ddd !important;
-  }
-}
-/* 为JS操作预留的类 */
-.hidden {
-  display: none !important;
-}
-.visible {
-  display: block !important;
-}
-.invisible {
-  visibility: hidden !important;
-}
-.transparent {
-  opacity: 0 !important;
-}
-.no-transitions {
-  transition: none !important;
-}
-/* 页面加载后自动添加CRT效果元素和功能性JS */
-document.addEventListener('DOMContentLoaded', function() {
-  // 创建一个隐藏/显示CRT效果的按钮
-  var toggleButton = document.createElement('button');
-  toggleButton.innerHTML = '切换CRT效果';
-  toggleButton.className = 'theme-switch';
-  toggleButton.innerHTML = '<span class="theme-switch-icon">📺</span> CRT效果';
-  // 添加事件监听
-  toggleButton.addEventListener('click', function() {
-    var root = document.documentElement;
-    var currentDisplay = getComputedStyle(root).getPropertyValue('--crt-effects-display').trim();
-    if (currentDisplay === 'block' || currentDisplay === '') {
-      root.style.setProperty('--crt-effects-display', 'none');
-      toggleButton.innerHTML = '<span class="theme-switch-icon">📺</span> 显示CRT';
-    } else {
-      root.style.setProperty('--crt-effects-display', 'block');
-      toggleButton.innerHTML = '<span class="theme-switch-icon">📺</span> 隐藏CRT';
-    }
-  });
-  document.body.appendChild(toggleButton);
-  // 添加CRT效果元素
-  var body = document.querySelector('body');
-  // CRT曲面效果
-  var crtCurveEffect = document.createElement('div');
-  crtCurveEffect.className = 'crt-curve-effect';
-  body.appendChild(crtCurveEffect);
-  // CRT显示器边框
-  var crtMonitorFrame = document.createElement('div');
-  crtMonitorFrame.className = 'crt-monitor-frame';
-  body.appendChild(crtMonitorFrame);
-  // CRT反光效果
-  var crtReflection = document.createElement('div');
-  crtReflection.className = 'crt-reflection';
-  body.appendChild(crtReflection);
-  // 主扫描线
-  var primaryScanline = document.createElement('div');
-  primaryScanline.className = 'crt-primary-scanline';
-  body.appendChild(primaryScanline);
-  // 副扫描线
-  var secondaryScanline = document.createElement('div');
-  secondaryScanline.className = 'crt-secondary-scanline';
-  body.appendChild(secondaryScanline);
-  // 快速扫描线
-  var fastScanline = document.createElement('div');
-  fastScanline.className = 'crt-fast-scanline';
-  body.appendChild(fastScanline);
-  // 扫描线阴影
-  var scanlineShadow = document.createElement('div');
-  scanlineShadow.className = 'crt-scanline-shadow';
-  body.appendChild(scanlineShadow);
-  // 标签页功能
-  var tabLinks = document.querySelectorAll('.tabs-nav a');
-  tabLinks.forEach(function(link) {
-    link.addEventListener('click', function(e) {
-      e.preventDefault();
-      // 移除所有活动类
-      tabLinks.forEach(function(l) {
-        l.classList.remove('active');
-      });
-      // 添加活动类到当前链接
-      this.classList.add('active');
-      // 获取目标面板ID
-      var targetId = this.getAttribute('href').substring(1);
-      // 隐藏所有面板
-      var tabPanes = document.querySelectorAll('.tab-pane');
-      tabPanes.forEach(function(pane) {
-        pane.classList.remove('active');
-      });
-      // 显示目标面板
-      document.getElementById(targetId).classList.add('active');
-    });
-  });
-  // 折叠面板功能
-  var accordionButtons = document.querySelectorAll('.accordion-button');
-  accordionButtons.forEach(function(button) {
-    button.addEventListener('click', function() {
-      this.classList.toggle('collapsed');
-      var target = this.getAttribute('data-target');
-      var body = document.querySelector(target);
-      if (body.classList.contains('show')) {
-        body.classList.remove('show');
-      } else {
-        body.classList.add('show');
-      }
-    });
-  });
-  // 实现打字机效果
-  var typewriterElements = document.querySelectorAll('.typewriter');
-  typewriterElements.forEach(function(element) {
-    var text = element.textContent;
-    element.innerHTML = "";
-    element.style.width = "0";
-    var i = 0;
-    var speed = 50; // 打字速度，毫秒每字符
-    function typeWriter() {
-      if (i < text.length) {
-        element.innerHTML += text.charAt(i);
-        i++;
-        setTimeout(typeWriter, speed);
-      }
-    }
-    // 文本可见后开始打字效果
-    var observer = new IntersectionObserver(function(entries) {
-      entries.forEach(function(entry) {
-        if (entry.isIntersecting) {
-          typeWriter();
-          observer.unobserve(element);
-        }
-      });
-    });
-    observer.observe(element);
-  });
-});