跳转到内容
打开/关闭菜单
  • 451 条目
  • 798 文件
  • 22 用户
  • 8951 编辑
Blockland Wiki
打开/关闭外观设置菜单
打开/关闭个人菜单
未登录
未登录用户的IP地址会在进行任意编辑后公开展示。

模板:在积雨云上空相遇/styles.css:修订间差异

来自Blockland Wiki
无编辑摘要
无编辑摘要
 
(未显示同一用户的5个中间版本)
第2行: 第2行:
/*
/*
  * 積乱雲の上で、出会う。
  * 積乱雲の上で、出会う。
  * SUMMER SKYGLASS 4.0
  * Crystal Summer 5.2
  * Full Navbox Sky Experience
  * Clean Ice-White Edition
*
* TemplateStyles / Citizen / Vector
  */
  */


/* ===== 01. 外层:明亮天空卡片 ===== */
/* ================================
  1. Navbox 外框
  ================================ */


.navbox.sekiun-navbox,
.navbox.sekiun-navbox,
html body.skin-citizen .navbox.sekiun-navbox {
html body.skin-citizen .navbox.sekiun-navbox {
     position: relative !important;
     position: relative !important;
     background: #99DDF7 !important;
    width: 100%;
     border: 2px solid #45CFF2 !important;
    box-sizing: border-box;
     border-radius: 18px !important;
 
     background: light-dark(#FFFFFF, #183440) !important;
 
     border: 2px solid #72D4F0 !important;
     border-radius: 16px !important;
 
     border-collapse: separate !important;
     border-collapse: separate !important;
     border-spacing: 0 !important;
     border-spacing: 0 !important;
第19行: 第28行:


     box-shadow:
     box-shadow:
         0 7px 28px rgba(27,172,231,.26),
         0 5px 22px rgba(29,163,219,.16) !important;
        0 0 15px rgba(65,205,245,.20) !important;


     transition:
     transition:
         border-color .35s ease,
         border-color .3s ease,
         box-shadow .35s ease;
         box-shadow .3s ease;
}
}


.navbox.sekiun-navbox:hover,
.navbox.sekiun-navbox:hover,
html body.skin-citizen .navbox.sekiun-navbox:hover {
html body.skin-citizen .navbox.sekiun-navbox:hover {
     border-color: #00C9F5 !important;
     border-color: #37C8ED !important;
 
     box-shadow:
     box-shadow:
         0 10px 36px rgba(12,169,232,.38),
         0 7px 26px rgba(29,163,219,.23),
         0 0 24px rgba(57,213,255,.30) !important;
         0 0 12px rgba(79,213,232,.12) !important;
}
}


/* ===== 02. 整卡云层定位 ===== */
/* ================================
  2. 积雨云背景
  ================================ */


/*
.navbox.sekiun-navbox .navbox-inner,
* navbox-inner 是定位容器。
* 标题单元格和标题 div 保持 static,
* 这样绝对定位的云图可以覆盖整张内部表格。
*/
 
.sekiun-navbox .navbox-inner,
html body.skin-citizen .navbox.sekiun-navbox .navbox-inner {
html body.skin-citizen .navbox.sekiun-navbox .navbox-inner {
     position: relative;
     position: relative !important;
    z-index: 0;
     background: transparent !important;
     background: transparent !important;
}
.sekiun-navbox .navbox-title,
.sekiun-navbox .sekiun-title-inner,
html body.skin-citizen .navbox.sekiun-navbox .navbox-title,
html body.skin-citizen .navbox.sekiun-navbox .sekiun-title-inner {
    position: static !important;
}
}


.sekiun-navbox .sekiun-sky {
.sekiun-navbox .sekiun-sky {
    display: block;
     position: absolute;
     position: absolute;
     top: 0;
     top: 0;
    left: 0;
     right: 0;
     right: 0;
     bottom: 0;
     bottom: 0;
    left: 0;


     display: block;
     z-index: 0;
     overflow: hidden;
     overflow: hidden;
     border-radius: 15px;
     border-radius: 14px;
    z-index: 0;
}
}
/* 图片本体:覆盖整个 Navbox */


.sekiun-navbox .sekiun-sky img {
.sekiun-navbox .sekiun-sky img {
第84行: 第80行:
     object-position: center 43%;
     object-position: center 43%;


     transform: scale(1.025);
     transform: scale(1.01);
     transition: transform 1.3s ease;
     transition: transform 1.1s ease;
}
}
/* Hover:整个云层向前推进 */


.sekiun-navbox:hover .sekiun-sky img {
.sekiun-navbox:hover .sekiun-sky img {
     transform: scale(1.09);
     transform: scale(1.04);
}
}


/* ===== 03. 云层光影 ===== */
/* ================================
  3. 标题区域
  ================================ */


.sekiun-navbox .sekiun-sky::after {
.navbox.sekiun-navbox .navbox-title,
    content: "";
html body.skin-citizen .navbox.sekiun-navbox .navbox-title,
     position: absolute;
html body.skin-citizen .navbox.sekiun-navbox .navbox-title:not([style*="background"]) {
    top: 0;
     position: static !important;
     right: 0;
 
     bottom: 0;
     padding: 19px 8px 17px !important;
    left: 0;
     text-align: center !important;


     background: linear-gradient(
     background: transparent !important;
        110deg,
        rgba(30,174,241,.11),
        rgba(255,255,255,.03) 45%,
        rgba(28,180,246,.16)
    );


     z-index: 1;
     border: 0 !important;
     transition: background-color .4s ease;
    border-bottom: 1px solid rgba(255,255,255,.65) !important;
     border-radius: 0 !important;
}
}


/* ===== 04. 标题:作品主视觉 ===== */
/* 标题容器真正居中 */
 
.sekiun-navbox .sekiun-title-box {
    display: block !important;
    position: static !important;


.sekiun-navbox .navbox-title,
     margin: 0 4em !important;
html body.skin-citizen .navbox.sekiun-navbox .navbox-title {
     padding: 0 !important;
     padding: 25px 10px 20px !important;
     background: transparent !important;


     border: 0 !important;
     width: auto !important;
     border-bottom: 2px solid rgba(255,255,255,.72) !important;
     height: auto !important;


     text-align: center;
     text-align: center !important;
     color: #064965 !important;
     visibility: visible !important;
    opacity: 1 !important;
}
}


/* 标题里的真实内容高于云层 */
/* 日文标题 */


.sekiun-navbox .sekiun-title-text {
.sekiun-navbox .sekiun-title-text {
     display: inline-block;
     display: block;
     position: relative;
     position: relative;
     z-index: 3;
     z-index: 2;


     padding: 7px 16px;
     color: #FFFFFF;
    border-radius: 10px;
 
    background: rgba(233,251,255,.75);
    border: 1px solid rgba(255,255,255,.88);


    color: #074C68;
     font-size: 1.34em;
     font-size: 1.22em;
     font-weight: 800;
     font-weight: 800;
     letter-spacing: .07em;
     letter-spacing: .065em;
    line-height: 1.5;


     text-shadow: 0 1px 3px #FFFFFF;
     text-shadow:
        0 2px 8px rgba(0,47,86,.65),
        1px 1px 0 #175C85,
        -1px 1px 0 #175C85,
        1px -1px 0 #175C85,
        -1px -1px 0 #175C85;
}


    box-shadow:
/* 标题链接 */
        0 4px 17px rgba(19,103,152,.21),
        inset 0 1px 0 #FFFFFF;


    transition:
.navbox.sekiun-navbox .sekiun-title-text a,
        transform .35s ease,
html body.skin-citizen .navbox.sekiun-navbox .sekiun-title-text a[href],
        box-shadow .35s ease;
html body.skin-citizen .navbox.sekiun-navbox .sekiun-title-text a[href]:visited {
    color: #FFFFFF !important;
    text-decoration: none !important;
}
}


.sekiun-navbox:hover .sekiun-title-text {
.navbox.sekiun-navbox .sekiun-title-text a:hover {
     transform: translateY(-2px);
     color: #E1FAFF !important;
 
    box-shadow:
        0 6px 25px rgba(12,135,205,.30),
        0 0 16px rgba(120,230,255,.50);
}
}


第171行: 第164行:
     display: block;
     display: block;
     position: relative;
     position: relative;
     z-index: 3;
     z-index: 2;


     margin-top: 8px;
     margin-top: 5px;
    font-size: .65em;
    font-weight: 700;
    letter-spacing: .24em;


     color: #FFFFFF;
     color: #FFFFFF;
     text-shadow:
     font-size: .68em;
        0 1px 4px rgba(0,65,105,.85),
    font-weight: 700;
        0 0 12px rgba(0,65,105,.50);
    letter-spacing: .18em;
}


/* Citizen 标题链接覆盖 */
     text-shadow: 0 1px 5px rgba(0,55,92,.80);
 
html body.skin-citizen .navbox.sekiun-navbox .navbox-title a[href],
html body.skin-citizen .navbox.sekiun-navbox .navbox-title a[href]:visited {
    color: #074C68 !important;
     text-decoration: none !important;
}
 
html body.skin-citizen .navbox.sekiun-navbox .navbox-title a[href]:hover {
    color: #0089B4 !important;
}
}


/* 折叠按钮与 navbar 始终在上层 */
/* 折叠按钮 */


.sekiun-navbox .navbox-title .navbar,
.sekiun-navbox .navbox-title .navbar,
.sekiun-navbox .navbox-title .mw-collapsible-toggle,
.sekiun-navbox .navbox-title .mw-collapsible-toggle {
html body.skin-citizen .navbox.sekiun-navbox .navbox-title .navbar,
html body.skin-citizen .navbox.sekiun-navbox .navbox-title .mw-collapsible-toggle {
     position: relative !important;
     position: relative !important;
     z-index: 5;
     z-index: 4;
}
}


/* ===== 05. 内容单元格叠在图片上 ===== */
/* ================================
  4. 正文内容结构
  ================================ */


.sekiun-navbox .navbox-group,
.sekiun-navbox .navbox-group,
.sekiun-navbox .navbox-list,
.sekiun-navbox .navbox-list,
.sekiun-navbox .navbox-abovebelow,
.sekiun-navbox .navbox-abovebelow {
html body.skin-citizen .navbox.sekiun-navbox .navbox-group,
html body.skin-citizen .navbox.sekiun-navbox .navbox-list,
html body.skin-citizen .navbox.sekiun-navbox .navbox-abovebelow {
     position: relative;
     position: relative;
     z-index: 2;
     z-index: 1;
}
}


/* 作品标识条 */
/*
* 这里不再使用半透明材质。
* 让内容区拥有真正纯净的底色。
*/


html body.skin-citizen .navbox.sekiun-navbox .navbox-abovebelow,
/* 分组:冰蓝色 */
.navbox.sekiun-navbox .navbox-abovebelow {
    text-align: center;
    padding: 10px 14px !important;
    border: 0 !important;
}


.sekiun-navbox .sekiun-kicker {
.navbox.sekiun-navbox .navbox-group,
    font-size: .85em;
html body.skin-citizen .navbox.sekiun-navbox .navbox-group,
    font-weight: 800;
html body.skin-citizen .navbox.sekiun-navbox .navbox-group:not([style*="background"]) {
    letter-spacing: .16em;
     background: light-dark(#EAF7FE, #234858) !important;
     color: #086183;
}


/* 上方标识条 */
     color: light-dark(#165A76, #D7F4FC) !important;
 
/* ===== 06. 分组浮层 ===== */
 
.sekiun-navbox .navbox-group,
html body.skin-citizen .navbox.sekiun-navbox .navbox-inner .navbox-group {
     background: rgba(210,244,255,.79) !important;
    color: #07566E !important;


     text-align: center !important;
     text-align: center !important;
     padding: 13px 15px !important;
    font-weight: 700;
    font-weight: 800;
     padding: 9px 13px !important;


     border-right: 2px solid rgba(75,205,241,.55) !important;
    border: 0 !important;
     border-top: 1px solid rgba(255,255,255,.55) !important;
     border-right: 1px solid light-dark(#D3EAF3, #365E70) !important;
     border-top: 1px solid light-dark(#E0F1F7, #365E70) !important;
}
}


/* ===== 07. 成员列表:浮在云层之上 ===== */
/* 成员列表:不透明冰白 */


.sekiun-navbox .navbox-list,
.navbox.sekiun-navbox .navbox-list,
html body.skin-citizen .navbox.sekiun-navbox .navbox-inner .navbox-list {
html body.skin-citizen .navbox.sekiun-navbox .navbox-list,
     background: rgba(246,253,255,.54) !important;
html body.skin-citizen .navbox.sekiun-navbox .navbox-list:not([style*="background"]) {
     color: #17475A !important;
     background: light-dark(#FFFFFF, #1B3947) !important;
    border-top: 1px solid rgba(255,255,255,.42) !important;
     background-image: none !important;
}


html body.skin-citizen .navbox.sekiun-navbox .navbox-inner .navbox-even {
     color: light-dark(#24495B, #DCEFF6) !important;
     background: rgba(216,245,255,.46) !important;
}


html body.skin-citizen .navbox.sekiun-navbox .navbox-list > div {
     border: 0 !important;
     padding: 12px 15px !important;
     border-top: 1px solid light-dark(#E0F1F7, #365E70) !important;
     line-height: 2;
}
}


/* ===== 08. 成员标签 ===== */
/* 偶数行只保留极轻微的区别 */


.sekiun-navbox .sekiun-member {
.navbox.sekiun-navbox .navbox-list.navbox-even,
     display: inline-block;
html body.skin-citizen .navbox.sekiun-navbox .navbox-list.navbox-even {
     margin: 3px 4px 3px 0;
     background: light-dark(#F7FCFF, #20404F) !important;
    padding: 5px 10px;
     background-image: none !important;
}


    background: rgba(255,255,255,.74);
/* 覆盖 Citizen 原来的左边框 */
    border: 1px solid rgba(136,220,244,.82);
    border-radius: 8px;


    box-shadow: 0 2px 9px rgba(22,151,199,.10);
html body.skin-citizen .navbox.sekiun-navbox .navbox-group + .navbox-list,
 
html body.skin-citizen .navbox.sekiun-navbox .navbox-list-with-group,
    transition:
html body.skin-citizen .navbox.sekiun-navbox .navbox-list1 {
        transform .25s ease,
    border-left: 0 !important;
        background-color .25s ease,
        box-shadow .25s ease;
}
}


.sekiun-navbox .sekiun-member:hover {
/* 正文留白 */
    transform: translateY(-3px);
    background: rgba(231,251,255,.98);


    box-shadow:
.navbox.sekiun-navbox .navbox-list > div,
        0 5px 18px rgba(12,165,214,.27),
html body.skin-citizen .navbox.sekiun-navbox .navbox-list > div {
        0 0 11px rgba(107,221,253,.34);
    padding: 10px 15px !important;
    line-height: 1.85;
}
}


.sekiun-navbox .sekiun-role {
/* ================================
    margin-left: 5px;
  5. 成员文字
    font-size: .72em;
  ================================ */
    font-weight: 700;
    letter-spacing: .04em;
    color: #54899A;
}


/* 链接颜色 */
/* 职务文字 */


html body.skin-citizen .navbox.sekiun-navbox .navbox-list a[href],
.sekiun-navbox .sekiun-role {
html body.skin-citizen .navbox.sekiun-navbox .navbox-list a[href]:visited {
     font-size: .76em;
     color: #087C9E !important;
     font-weight: 600;
     font-weight: 700;
     letter-spacing: .01em;
     text-decoration: none;
}


html body.skin-citizen .navbox.sekiun-navbox .navbox-list a[href]:hover {
     color: light-dark(#668B9B, #AACBD8);
     color: #00A7D8 !important;
     margin-right: 5px;
     text-shadow: 0 0 9px rgba(65,212,245,.45);
}
}


html body.skin-citizen .navbox.sekiun-navbox a.new[href] {
/* 页面链接 */
    color: #BD3558 !important;
}


/* ===== 09. 作品宣言 ===== */
.navbox.sekiun-navbox .navbox-list a[href],
html body.skin-citizen .navbox.sekiun-navbox .navbox-list a[href] {
    color: light-dark(#087B9C, #A0E7F8) !important;


/* 最后一行采用更醒目的蓝色 */
    font-weight: 600;
    text-decoration: none;


.sekiun-navbox .navbox-abovebelow:last-child,
     transition:
html body.skin-citizen .navbox.sekiun-navbox .navbox-inner .navbox-abovebelow:last-child {
         color .2s ease,
     background: linear-gradient(
         text-shadow .2s ease;
         100deg,
        rgba(10,142,193,.87),
         rgba(72,202,235,.88),
        rgba(11,151,203,.87)
    ) !important;
 
    color: #FFFFFF !important;
    border-top: 2px solid rgba(255,255,255,.65) !important;
}
}


.sekiun-navbox .sekiun-quote {
.navbox.sekiun-navbox .navbox-list a[href]:hover,
     display: block;
html body.skin-citizen .navbox.sekiun-navbox .navbox-list a[href]:hover {
    padding: 4px 6px;
     color: light-dark(#00A4CA, #E1FBFF) !important;


    font-size: 1.03em;
     text-shadow: 0 0 8px rgba(65,205,240,.35);
    font-weight: 800;
    letter-spacing: .035em;
    line-height: 1.7;
    color: #FFFFFF;
 
     text-shadow:
        0 1px 4px rgba(0,65,102,.56),
        0 0 15px rgba(227,251,255,.44);
}
}


.sekiun-navbox .sekiun-quote-sub {
/* 未创建页面 */
    display: block;
    margin-top: 3px;


    font-size: .76em;
.navbox.sekiun-navbox .navbox-list a.new[href],
    font-weight: 700;
html body.skin-citizen .navbox.sekiun-navbox .navbox-list a.new[href] {
    letter-spacing: .15em;
     color: light-dark(#BF4266, #FFA4BB) !important;
     color: #E0FAFF;
}
}


/* ===== 10. 深色模式 ===== */
/* ================================
  6. 底部作品宣言
  ================================ */


html.skin-theme-clientpref-night body.skin-citizen .navbox.sekiun-navbox,
.navbox.sekiun-navbox .navbox-abovebelow,
html.skin-theme-clientpref-black body.skin-citizen .navbox.sekiun-navbox {
html body.skin-citizen .navbox.sekiun-navbox .navbox-abovebelow,
     background: #12374D !important;
html body.skin-citizen .navbox.sekiun-navbox .navbox-abovebelow:not([style*="background"]) {
     border-color: #39ADD1 !important;
     background: light-dark(#EAF7FC, #234858) !important;
}
     background-image: none !important;


html.skin-theme-clientpref-night .sekiun-navbox .sekiun-sky::after,
     color: light-dark(#115E7C, #D6F3FC) !important;
html.skin-theme-clientpref-black .sekiun-navbox .sekiun-sky::after {
     background: linear-gradient(
        110deg,
        rgba(4,24,42,.63),
        rgba(6,49,75,.42),
        rgba(4,24,42,.63)
    );
}


html.skin-theme-clientpref-night .sekiun-navbox .sekiun-title-text,
     padding: 12px 15px !important;
html.skin-theme-clientpref-black .sekiun-navbox .sekiun-title-text {
     text-align: center !important;
     background: rgba(16,56,79,.90);
    color: #DDF9FF;
    border-color: rgba(137,223,248,.50);
     text-shadow: none;
}


html.skin-theme-clientpref-night body.skin-citizen .sekiun-navbox .navbox-title a[href],
    border: 0 !important;
html.skin-theme-clientpref-black body.skin-citizen .sekiun-navbox .navbox-title a[href] {
    border-top: 1px solid light-dark(#C8E8F3, #39667A) !important;
    color: #DDF9FF !important;
}
}


html.skin-theme-clientpref-night body.skin-citizen .sekiun-navbox .navbox-inner .navbox-group,
/* 日语台词 */
html.skin-theme-clientpref-black body.skin-citizen .sekiun-navbox .navbox-inner .navbox-group {
    background: rgba(23,73,95,.84) !important;
    color: #DDF6FF !important;
}


html.skin-theme-clientpref-night body.skin-citizen .sekiun-navbox .navbox-inner .navbox-list,
.sekiun-navbox .sekiun-quote {
html.skin-theme-clientpref-black body.skin-citizen .sekiun-navbox .navbox-inner .navbox-list {
     display: inline-block;
     background: rgba(17,49,68,.78) !important;
    color: #DDF5FC !important;
}


html.skin-theme-clientpref-night .sekiun-navbox .sekiun-member,
    font-size: .96em;
html.skin-theme-clientpref-black .sekiun-navbox .sekiun-member {
     font-weight: 700;
    background: rgba(23,74,95,.91);
    letter-spacing: .025em;
     border-color: #4A9FB8;
    line-height: 1.7;
}
 
html.skin-theme-clientpref-night body.skin-citizen .sekiun-navbox .navbox-list a[href],
html.skin-theme-clientpref-black body.skin-citizen .sekiun-navbox .navbox-list a[href] {
    color: #A1ECFC !important;
}


html.skin-theme-clientpref-night .sekiun-navbox .sekiun-role,
     color: light-dark(#125E7D, #D6F3FC);
html.skin-theme-clientpref-black .sekiun-navbox .sekiun-role {
     color: #9CCBD8;
}
}


/* ===== 11. 手机端 ===== */
/* ================================
  7. 手机端
  ================================ */


@media screen and (max-width: 640px) {
@media screen and (max-width: 640px) {
    .navbox.sekiun-navbox .navbox-title,
     html body.skin-citizen .navbox.sekiun-navbox .navbox-title {
     html body.skin-citizen .navbox.sekiun-navbox .navbox-title {
         padding: 18px 6px !important;
         padding: 16px 5px !important;
    }
 
    .sekiun-navbox .sekiun-title-box {
        margin: 0 2.2em !important;
     }
     }


     .sekiun-navbox .sekiun-title-text {
     .sekiun-navbox .sekiun-title-text {
         font-size: 1em;
         font-size: 1.08em;
        padding: 7px 9px;
         letter-spacing: .015em;
         letter-spacing: 0;
     }
     }


     .sekiun-navbox .sekiun-title-en {
     .sekiun-navbox .sekiun-title-en {
         font-size: .55em;
         font-size: .59em;
         letter-spacing: .10em;
         letter-spacing: .10em;
     }
     }


     html body.skin-citizen .navbox.sekiun-navbox .navbox-group {
     .navbox.sekiun-navbox .navbox-group {
         padding: 8px !important;
         padding: 7px !important;
    }
 
    html body.skin-citizen .navbox.sekiun-navbox .navbox-list > div {
        padding: 8px !important;
     }
     }


     .sekiun-navbox .sekiun-member {
     .navbox.sekiun-navbox .navbox-list > div {
         margin: 3px 2px;
         padding: 8px 10px !important;
         padding: 5px 7px;
         overflow-wrap: anywhere;
     }
     }


第460行: 第369行:
}
}


/* ===== 12. 减少动画 ===== */
/* ================================
  8. 减少动态效果
  ================================ */


@media (prefers-reduced-motion: reduce) {
@media (prefers-reduced-motion: reduce) {
     .sekiun-navbox,
     .sekiun-navbox,
     .sekiun-navbox img,
     .sekiun-navbox img,
     .sekiun-navbox .sekiun-member,
     .sekiun-navbox a {
    .sekiun-navbox .sekiun-title-text {
         transition: none !important;
         transition: none !important;
     }
     }
}
}

2026年10月8日 (四) 20:38的最新版本


/*
 * 積乱雲の上で、出会う。
 * Crystal Summer 5.2
 * Clean Ice-White Edition
 *
 * TemplateStyles / Citizen / Vector
 */

/* ================================
   1. Navbox 外框
   ================================ */

.navbox.sekiun-navbox,
html body.skin-citizen .navbox.sekiun-navbox {
    position: relative !important;
    width: 100%;
    box-sizing: border-box;

    background: light-dark(#FFFFFF, #183440) !important;

    border: 2px solid #72D4F0 !important;
    border-radius: 16px !important;

    border-collapse: separate !important;
    border-spacing: 0 !important;
    overflow: visible !important;

    box-shadow:
        0 5px 22px rgba(29,163,219,.16) !important;

    transition:
        border-color .3s ease,
        box-shadow .3s ease;
}

.navbox.sekiun-navbox:hover,
html body.skin-citizen .navbox.sekiun-navbox:hover {
    border-color: #37C8ED !important;

    box-shadow:
        0 7px 26px rgba(29,163,219,.23),
        0 0 12px rgba(79,213,232,.12) !important;
}

/* ================================
   2. 积雨云背景
   ================================ */

.navbox.sekiun-navbox .navbox-inner,
html body.skin-citizen .navbox.sekiun-navbox .navbox-inner {
    position: relative !important;
    background: transparent !important;
}

.sekiun-navbox .sekiun-sky {
    display: block;
    position: absolute;

    top: 0;
    left: 0;
    right: 0;
    bottom: 0;

    z-index: 0;
    overflow: hidden;
    border-radius: 14px;
}

.sekiun-navbox .sekiun-sky img {
    position: absolute;
    top: 0;
    left: 0;

    width: 100% !important;
    height: 100% !important;
    max-width: none !important;

    object-fit: cover;
    object-position: center 43%;

    transform: scale(1.01);
    transition: transform 1.1s ease;
}

.sekiun-navbox:hover .sekiun-sky img {
    transform: scale(1.04);
}

/* ================================
   3. 标题区域
   ================================ */

.navbox.sekiun-navbox .navbox-title,
html body.skin-citizen .navbox.sekiun-navbox .navbox-title,
html body.skin-citizen .navbox.sekiun-navbox .navbox-title:not([style*="background"]) {
    position: static !important;

    padding: 19px 8px 17px !important;
    text-align: center !important;

    background: transparent !important;

    border: 0 !important;
    border-bottom: 1px solid rgba(255,255,255,.65) !important;
    border-radius: 0 !important;
}

/* 标题容器真正居中 */

.sekiun-navbox .sekiun-title-box {
    display: block !important;
    position: static !important;

    margin: 0 4em !important;
    padding: 0 !important;

    width: auto !important;
    height: auto !important;

    text-align: center !important;
    visibility: visible !important;
    opacity: 1 !important;
}

/* 日文标题 */

.sekiun-navbox .sekiun-title-text {
    display: block;
    position: relative;
    z-index: 2;

    color: #FFFFFF;

    font-size: 1.34em;
    font-weight: 800;
    letter-spacing: .065em;
    line-height: 1.5;

    text-shadow:
        0 2px 8px rgba(0,47,86,.65),
        1px 1px 0 #175C85,
        -1px 1px 0 #175C85,
        1px -1px 0 #175C85,
        -1px -1px 0 #175C85;
}

/* 标题链接 */

.navbox.sekiun-navbox .sekiun-title-text a,
html body.skin-citizen .navbox.sekiun-navbox .sekiun-title-text a[href],
html body.skin-citizen .navbox.sekiun-navbox .sekiun-title-text a[href]:visited {
    color: #FFFFFF !important;
    text-decoration: none !important;
}

.navbox.sekiun-navbox .sekiun-title-text a:hover {
    color: #E1FAFF !important;
}

/* 英文副标题 */

.sekiun-navbox .sekiun-title-en {
    display: block;
    position: relative;
    z-index: 2;

    margin-top: 5px;

    color: #FFFFFF;
    font-size: .68em;
    font-weight: 700;
    letter-spacing: .18em;

    text-shadow: 0 1px 5px rgba(0,55,92,.80);
}

/* 折叠按钮 */

.sekiun-navbox .navbox-title .navbar,
.sekiun-navbox .navbox-title .mw-collapsible-toggle {
    position: relative !important;
    z-index: 4;
}

/* ================================
   4. 正文内容结构
   ================================ */

.sekiun-navbox .navbox-group,
.sekiun-navbox .navbox-list,
.sekiun-navbox .navbox-abovebelow {
    position: relative;
    z-index: 1;
}

/*
 * 这里不再使用半透明材质。
 * 让内容区拥有真正纯净的底色。
 */

/* 分组:冰蓝色 */

.navbox.sekiun-navbox .navbox-group,
html body.skin-citizen .navbox.sekiun-navbox .navbox-group,
html body.skin-citizen .navbox.sekiun-navbox .navbox-group:not([style*="background"]) {
    background: light-dark(#EAF7FE, #234858) !important;

    color: light-dark(#165A76, #D7F4FC) !important;

    text-align: center !important;
    font-weight: 700;
    padding: 9px 13px !important;

    border: 0 !important;
    border-right: 1px solid light-dark(#D3EAF3, #365E70) !important;
    border-top: 1px solid light-dark(#E0F1F7, #365E70) !important;
}

/* 成员列表:不透明冰白 */

.navbox.sekiun-navbox .navbox-list,
html body.skin-citizen .navbox.sekiun-navbox .navbox-list,
html body.skin-citizen .navbox.sekiun-navbox .navbox-list:not([style*="background"]) {
    background: light-dark(#FFFFFF, #1B3947) !important;
    background-image: none !important;

    color: light-dark(#24495B, #DCEFF6) !important;

    border: 0 !important;
    border-top: 1px solid light-dark(#E0F1F7, #365E70) !important;
}

/* 偶数行只保留极轻微的区别 */

.navbox.sekiun-navbox .navbox-list.navbox-even,
html body.skin-citizen .navbox.sekiun-navbox .navbox-list.navbox-even {
    background: light-dark(#F7FCFF, #20404F) !important;
    background-image: none !important;
}

/* 覆盖 Citizen 原来的左边框 */

html body.skin-citizen .navbox.sekiun-navbox .navbox-group + .navbox-list,
html body.skin-citizen .navbox.sekiun-navbox .navbox-list-with-group,
html body.skin-citizen .navbox.sekiun-navbox .navbox-list1 {
    border-left: 0 !important;
}

/* 正文留白 */

.navbox.sekiun-navbox .navbox-list > div,
html body.skin-citizen .navbox.sekiun-navbox .navbox-list > div {
    padding: 10px 15px !important;
    line-height: 1.85;
}

/* ================================
   5. 成员文字
   ================================ */

/* 职务文字 */

.sekiun-navbox .sekiun-role {
    font-size: .76em;
    font-weight: 600;
    letter-spacing: .01em;

    color: light-dark(#668B9B, #AACBD8);
    margin-right: 5px;
}

/* 页面链接 */

.navbox.sekiun-navbox .navbox-list a[href],
html body.skin-citizen .navbox.sekiun-navbox .navbox-list a[href] {
    color: light-dark(#087B9C, #A0E7F8) !important;

    font-weight: 600;
    text-decoration: none;

    transition:
        color .2s ease,
        text-shadow .2s ease;
}

.navbox.sekiun-navbox .navbox-list a[href]:hover,
html body.skin-citizen .navbox.sekiun-navbox .navbox-list a[href]:hover {
    color: light-dark(#00A4CA, #E1FBFF) !important;

    text-shadow: 0 0 8px rgba(65,205,240,.35);
}

/* 未创建页面 */

.navbox.sekiun-navbox .navbox-list a.new[href],
html body.skin-citizen .navbox.sekiun-navbox .navbox-list a.new[href] {
    color: light-dark(#BF4266, #FFA4BB) !important;
}

/* ================================
   6. 底部作品宣言
   ================================ */

.navbox.sekiun-navbox .navbox-abovebelow,
html body.skin-citizen .navbox.sekiun-navbox .navbox-abovebelow,
html body.skin-citizen .navbox.sekiun-navbox .navbox-abovebelow:not([style*="background"]) {
    background: light-dark(#EAF7FC, #234858) !important;
    background-image: none !important;

    color: light-dark(#115E7C, #D6F3FC) !important;

    padding: 12px 15px !important;
    text-align: center !important;

    border: 0 !important;
    border-top: 1px solid light-dark(#C8E8F3, #39667A) !important;
}

/* 日语台词 */

.sekiun-navbox .sekiun-quote {
    display: inline-block;

    font-size: .96em;
    font-weight: 700;
    letter-spacing: .025em;
    line-height: 1.7;

    color: light-dark(#125E7D, #D6F3FC);
}

/* ================================
   7. 手机端
   ================================ */

@media screen and (max-width: 640px) {
    .navbox.sekiun-navbox .navbox-title,
    html body.skin-citizen .navbox.sekiun-navbox .navbox-title {
        padding: 16px 5px !important;
    }

    .sekiun-navbox .sekiun-title-box {
        margin: 0 2.2em !important;
    }

    .sekiun-navbox .sekiun-title-text {
        font-size: 1.08em;
        letter-spacing: .015em;
    }

    .sekiun-navbox .sekiun-title-en {
        font-size: .59em;
        letter-spacing: .10em;
    }

    .navbox.sekiun-navbox .navbox-group {
        padding: 7px !important;
    }

    .navbox.sekiun-navbox .navbox-list > div {
        padding: 8px 10px !important;
        overflow-wrap: anywhere;
    }

    .sekiun-navbox .sekiun-quote {
        font-size: .88em;
    }
}

/* ================================
   8. 减少动态效果
   ================================ */

@media (prefers-reduced-motion: reduce) {
    .sekiun-navbox,
    .sekiun-navbox img,
    .sekiun-navbox a {
        transition: none !important;
    }
}