/* Nuclear Epoch Wiki — TBH 系皮肤（1:1 复刻 taskbarhero.wiki 结构/数值）
   规则数值取自原站 SvelteKit 编译 CSS（computed verbatim），零 Tailwind 依赖。
   资源路径：CSS 在 /assets/nuclearepoch/fa/css/，图标在 ../img/ui/ */

@font-face{font-family:'LatoWiki';src:url(../fonts/LatoWiki.woff2) format('woff2'),url(../fonts/Lato-Semibold.ttf) format('truetype');font-weight:600;font-display:swap}
@font-face{font-family:'OrangeKid';src:url(../fonts/OrangeKid.woff2) format('woff2'),url(../fonts/OrangeKid.ttf) format('truetype');font-display:swap}
@font-face{font-family:'DOSVGA';src:url(../fonts/DOSVGA.woff2) format('woff2'),url(../fonts/PerfectDOSVGA437.ttf) format('truetype');font-display:swap}
@font-face{font-family:'Oswald';src:url(../fonts/Oswald-Regular.woff2) format('woff2');font-weight:400;font-display:swap}
@font-face{font-family:'Oswald';src:url(../fonts/Oswald-SemiBold.woff2) format('woff2');font-weight:600;font-display:swap}
@font-face{font-family:'Oswald';src:url(../fonts/Oswald-Bold.woff2) format('woff2');font-weight:700;font-display:swap}

:root{
  /* 颜色（原站 :root 变量原样） */
  --color-bg:#14161b;--color-ink:#e8eaf1;--color-dim:#9aa1b5;--color-faint:#646b80;
  --color-panel:#1c1f27;--color-panel2:#232733;--color-panel3:#2b3140;
  --color-line:#3e4248;--color-line2:#555a61;--color-tan:#c9b896;
  --color-gold:#f6b73c;--color-gold2:#c5871c;--wiki-gold:#d59b35;
  --wiki-red:#8e1719;--wiki-red-dark:#3b1012;--wiki-paper:#a98554;--wiki-metal:#4d5157;--wiki-stone:#24272a;
  --color-rare:#2f8bfc;--color-legendary:#fc9c0c;--color-uncommon:#54fc0c;
  --color-immortal:#fc2424;--color-divine:#fce454;--color-arcana:#b40cfc;
  /* 字体 */
  --font-sans:'LatoWiki','Inter',system-ui,sans-serif;
  --font-pixel:'Oswald','OrangeKid','DOSVGA',monospace;
  --font-dos:'DOSVGA','Courier New',monospace;
  /* 布局 */
  --topbar-h:3.25rem;--announce-h:0px;--shell-max:1460px;--center-max:1270px;--sidebar-w:252px;
  /* 旧别名兼容（保留少量自制类用） */
  --gold:var(--wiki-gold);--gold-bright:var(--color-gold);--brand:var(--wiki-red);
  --panel:var(--color-panel);--bg:var(--color-bg);--ink:var(--color-ink);--dim:var(--color-dim);
  --faint:var(--color-faint);--line:var(--color-line);--line2:var(--color-line2);
  --stone:var(--wiki-stone);--metal:var(--wiki-metal);--frame-border:#111;
  --rarity-common:#9aa1b5;--rarity-uncommon:#54fc0c;--rarity-rare:#2f8bfc;
  --rarity-epic:#b40cfc;--rarity-legendary:#fc9c0c;--rarity-immortal:#fc2424;
}

*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;height:100%;overflow:hidden}
body.layout-body{
  background:linear-gradient(rgba(12,13,15,.1),rgba(10,10,12,.94) 704px),
    linear-gradient(90deg,rgba(32,70,57,.34),transparent 22%,transparent 78%,rgba(96,38,34,.28)),
    url(ui/bg-page.png) no-repeat fixed 50% 0%/980px,
    var(--color-bg);
  color:var(--color-ink);font-family:var(--font-sans);font-size:16px;line-height:1.5;
  height:100vh;overflow:hidden;
}
body:before,body:after{content:"";z-index:-1;top:var(--topbar-h);width:max(260px,calc((100vw - min(100vw - 28px,var(--shell-max)))/2 + 160px));pointer-events:none;opacity:.42;image-rendering:pixelated;position:fixed;bottom:0}
body:before{background:linear-gradient(90deg,#0f1212eb,#0f121252 64%,#0f121200),radial-gradient(circle at 24% 46%,#f6b73c33,#0000 300px),url(../img/ui/bg-left-1.png) 0/cover no-repeat;left:0}
body:after{background:linear-gradient(270deg,#140c0deb,#140c0d52 64%,#140c0d00),radial-gradient(circle at 76% 46%,#89161847,#0000 310px),url(../img/ui/bg-right-1.png) 100%/cover no-repeat;right:0}
a{color:var(--color-ink);text-decoration:none;transition:color .15s}
a:hover{color:var(--color-gold)}
ul{list-style:none}
img{max-width:100%}
.hidden{display:none!important}
::-webkit-scrollbar{width:8px;height:8px}
::-webkit-scrollbar-track{background:var(--color-bg)}
::-webkit-scrollbar-thumb{background:var(--color-line)}
::-webkit-scrollbar-thumb:hover{background:var(--color-line2)}
*{scrollbar-width:thin;scrollbar-color:var(--color-line) var(--color-bg)}

/* ===== Tailwind 原子工具等价（footer 等处用到，零框架原生实现） ===== */
.flex{display:flex}.flex-col{flex-direction:column}.flex-row{flex-direction:row}
.inline-block{display:inline-block}.inline-flex{display:inline-flex}.grid{display:grid}.block{display:block}
.items-center{align-items:center}.items-start{align-items:flex-start}.justify-between{justify-content:space-between}
.justify-center{justify-content:center}.md\:flex-row{flex-direction:row}
.md\:justify-between{justify-content:space-between}.md\:text-right{text-align:right}
.gap-2{gap:.5rem}.gap-6{gap:1.5rem}.gap-8{gap:2rem}.gap-x-10{column-gap:2.5rem}.gap-y-6{row-gap:1.5rem}
.grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}
.sm\:grid-cols-4{grid-template-columns:repeat(2,minmax(0,1fr))}
.max-w-sm{max-width:24rem}.min-w-0{min-width:0}
.text-sm{font-size:.875rem}.text-base{font-size:1rem}.text-\[12px\]{font-size:12px}.text-\[13px\]{font-size:13px}.text-\[11px\]{font-size:11px}
.text-dim{color:var(--color-dim)}.text-faint{color:var(--color-faint)}.text-ink{color:var(--color-ink)}.text-gold{color:var(--color-gold)}
.text-\[\#ffd24a\]{color:#ffd24a}
.font-dos{font-family:var(--font-dos)}.font-pixel{font-family:var(--font-pixel)}
.tracking-wider{letter-spacing:.05em}.tracking-\[1\.5px\]{letter-spacing:1.5px}.tracking-\[3px\]{letter-spacing:3px}
.uppercase{text-transform:uppercase}.leading-relaxed{line-height:1.625}
.border-t{border-top:1px solid var(--color-line)}.border-t-2{border-top:2px solid var(--color-line)}.border-line{border-color:var(--color-line)}
.border{border:1px solid var(--color-line)}.mt-2{margin-top:.5rem}.mt-8{margin-top:2rem}.mb-2\.5{margin-bottom:.625rem}.pt-5{padding-top:1.25rem}
.space-y-1\.5>*+*{margin-top:.375rem}
.shrink-0{flex-shrink:0}.align-\[-0\.18em\]{vertical-align:-.18em}
.transition{transition-property:color,background-color,border-color;transition-duration:.15s}
.hover\:text-gold:hover{color:var(--color-gold)}
@media(min-width:640px){
  .sm\:grid-cols-4{grid-template-columns:repeat(4,minmax(0,1fr))}
}
@media(min-width:768px){
  .md\:flex-row{flex-direction:row}.md\:justify-between{justify-content:space-between}
}

/* ===== announce 公告条 ===== */
.announce{z-index:200;text-align:center;background:linear-gradient(90deg,#96171b8c,#78121433 30%,transparent 55%),linear-gradient(#8f191c,#5d1416);border-bottom:2px solid #0b0c0d;justify-content:center;align-items:center;gap:10px;height:var(--announce-h);padding:0 44px 0 14px;display:flex;position:relative;box-shadow:0 2px #00000073}
.announce-ic{object-fit:contain;filter:drop-shadow(0 1px #0009);flex:none;width:18px;height:18px}
.announce-text{color:#fbe7c8;text-overflow:ellipsis;white-space:nowrap;text-shadow:1px 1px #00000080;font-size:13px;line-height:1;overflow:hidden}
.announce-text b{color:#ffe27a;font-family:var(--font-dos);text-transform:uppercase;letter-spacing:.5px}
.announce-text a{color:#fff;font-weight:700;text-decoration:underline;text-underline-offset:2px}
.announce-text a:hover{color:#ffe27a}
.announce-text .sep{opacity:.5;margin:0 2px}
.announce-x{color:#fff0c8;cursor:pointer;background:#0000002e;border:1px solid #ffffff40;place-items:center;width:24px;height:24px;font-size:17px;line-height:1;display:grid;position:absolute;top:50%;right:8px;transform:translateY(-50%)}
.announce-x:hover{background:#00000059;border-color:#ffe27a}

/* ===== site-topbar ===== */
.site-topbar{z-index:80;height:var(--topbar-h);background:linear-gradient(#ffffff0f,transparent 42%),linear-gradient(90deg,#78161847,transparent 18% 82%,#b46d1c2e),#161719;border-bottom:2px solid #070809;position:relative;top:0;box-shadow:0 3px #00000085}
.site-topbar svg{width:16px;height:16px;flex:none}
.site-topbar-shell{grid-template-columns:minmax(0,150px) minmax(0,var(--center-max)) minmax(0,150px);width:min(calc(100vw - 28px),var(--shell-max));gap:clamp(12px,2vw,28px);height:100%;margin:0 auto;display:grid}
.site-topbar-inner{grid-column:2;align-items:center;gap:12px;min-width:0;display:flex}
.topbar-menu{background:#241809;border:2px solid #5a442c;justify-content:center;align-items:center;width:40px;height:36px;display:none;box-shadow:inset 0 0 0 1px #ffd4752e;cursor:pointer}
.topbar-menu-lines{gap:4px;width:18px;display:grid}
.topbar-menu-lines span{background:#f2c66d;height:2px;display:block;box-shadow:0 1px #000}
.brand-lockup{isolation:isolate;min-width:218px;height:100%;color:var(--color-ink);align-items:center;gap:10px;margin-left:0px;padding:0 10px 0 12px;text-decoration:none;display:flex;position:relative}
.brand-lockup:before{content:"";z-index:-1;filter:drop-shadow(0 3px #0000005c);background:linear-gradient(180deg,#2a2d33,#131519);border:1px solid #3a3d42;border-radius:2px;position:absolute;inset:-3px 0 -13px}
.brand-logo{height:55px;width:auto;object-fit:contain;flex:none;filter:drop-shadow(0 2px #00000080)}
.brand-text{font-family:var(--font-pixel);color:#fff3c4;text-shadow:1px 1px #3b1300;font-size:24px;line-height:.9}
.brand-text small{font-family:var(--font-dos);color:#f5b73a;text-shadow:1px 1px #000;margin-top:2px;font-size:15px;display:block}
.topbar-search{background:linear-gradient(#ffffff09,transparent),#0f1012;border:2px solid #41454b;flex:0 460px;align-items:center;gap:8px;min-width:240px;max-width:460px;padding:6px 10px;display:flex;box-shadow:inset 0 0 0 1px #060606}
.topbar-search:focus-within{border-color:var(--wiki-gold);box-shadow:inset 0 0 0 1px #060606,0 0 0 2px #d59b3529}
.topbar-search input{min-width:0;color:var(--color-ink);background:transparent;border:0;outline:none;flex:1;font-size:14px;font-family:var(--font-sans)}
.topbar-search input::placeholder{color:var(--color-faint)}
.topbar-search>img{width:16px;height:16px;image-rendering:pixelated;flex:none}
.topbar-hotkey{min-width:21px;color:var(--color-faint);font-family:var(--font-dos);text-align:center;border:1px solid #434852;font-size:11px}
.discord-link{color:#c9cdd6;flex-shrink:0;align-items:center;margin-left:auto;transition:color .1s,transform .1s;display:flex}
.discord-link svg{width:26px;height:26px}
.discord-link:hover{color:#5865f2;transform:translateY(-1px)}
.save-loader{flex-shrink:0;position:relative}
.save-button{color:#d5c7a5;height:34px;font-family:var(--font-dos);cursor:pointer;background:linear-gradient(#ffffff0a,transparent),#16181c;border:2px solid #4a4e55;align-items:center;gap:7px;padding:0 9px;font-size:12px;display:flex}
.save-button:hover{border-color:var(--wiki-gold);color:#fff3c4}
.save-button-label{display:none}
.save-button>img{width:16px;height:16px;image-rendering:pixelated}
.account-signin{border:2px solid var(--wiki-gold);color:#ffe9a8;height:34px;font-family:var(--font-dos);text-transform:uppercase;background:linear-gradient(#d59b3533,transparent),#1a140a;align-items:center;gap:6px;padding:0 11px;font-size:12px;text-decoration:none;display:flex}
.account-signin svg{width:16px;height:16px}
.account-signin:hover{color:#fff;background:linear-gradient(#d59b3552,transparent),#1a140a}
.topbar-lang{position:relative;margin-left:0}
.language-button{height:34px;color:var(--color-dim);font-family:var(--font-dos);background:#101114;border:2px solid #3b3f45;align-items:center;gap:6px;padding:0 8px;font-size:12px;display:flex;cursor:pointer}
.language-button:hover{border-color:var(--wiki-gold);color:#fff3c4}
.language-button>img{width:16px;height:16px;image-rendering:pixelated}
.language-menu{position:absolute;top:calc(100% + 8px);right:-4px;min-width:min(300px,100vw - 16px);background:#141518;border:2px solid #4d5157;box-shadow:0 10px #00000061;z-index:90;display:none;grid-template-columns:repeat(2,minmax(128px,1fr))}
.topbar-lang.open .language-menu{display:grid}
.language-menu .menu-section{grid-column:1/-1;color:var(--color-gold);font-family:var(--font-dos);letter-spacing:.5px;text-transform:uppercase;font-size:10px;padding:7px 10px 4px;border-bottom:1px solid #2f3339}
.language-menu .menu-section:not(:first-child){border-top:1px solid #2f3339}
.language-menu button{display:flex;align-items:center;gap:8px;width:100%;padding:9px 10px;background:transparent;border:0;border-bottom:1px solid #2f3339;color:var(--color-dim);font-family:var(--font-sans);font-size:16px;cursor:pointer;text-align:left}
.language-menu button:hover,.language-menu button.is-current{color:var(--color-gold);background:#24272b}
.language-menu button span{font-family:var(--font-dos);color:var(--color-faint);font-size:11px;width:24px}

/* ===== app-shell / gutter / frame ===== */
.app-shell{grid-template-columns:minmax(0,150px) minmax(0,var(--center-max)) minmax(0,150px);width:min(calc(100vw - 28px),var(--shell-max));height:calc(100vh - var(--topbar-h) - var(--announce-h,0px));gap:clamp(12px,2vw,28px);margin:0 auto;padding:32px 0 4px;display:grid;overflow:hidden}
.app-gutter{pointer-events:none;min-width:0;height:100%;position:relative;overflow:hidden}
.app-gutter img{position:absolute;bottom:0;max-height:70vh;image-rendering:pixelated;opacity:.5;filter:drop-shadow(0 0 20px #000)}
.app-gutter-left img{left:0}.app-gutter-right img{right:0}
.app-frame{grid-column:2;grid-template-columns:var(--sidebar-w) minmax(0,1fr);align-items:stretch;gap:16px;min-width:0;height:100%;min-height:0;display:grid}

/* ===== wiki-sidebar ===== */
.wiki-sidebar{z-index:60;background:linear-gradient(#8e171933,transparent 86px),#181a1d;border:2px solid #111;width:var(--sidebar-w);height:100%;max-height:100%;position:relative;display:flex;flex-direction:column;overflow:hidden;box-shadow:0 0 0 2px #464a50,0 0 0 4px #111,0 10px #00000052}
.wiki-sidebar-scroll{flex:1 1 auto;min-height:0;overflow-y:auto;-webkit-overflow-scrolling:touch;overscroll-behavior:contain;padding-bottom:env(safe-area-inset-bottom)}
.wiki-sidebar-head{z-index:2;background:linear-gradient(#26708d, #3a4677 58%, #232426);border-bottom:2px solid #101113;align-items:center;gap:10px;min-height:46px;padding:8px 10px;display:flex;position:sticky;top:0;box-shadow:0 2px #00000073}
.wiki-sidebar-head img{object-fit:contain;width:27px;height:27px}
.wiki-sidebar-head strong{font-family:var(--font-pixel);color:#fff3c4;text-shadow:1px 1px #000;font-size:18px;line-height:1}
.wiki-sidebar-head span{color:#d1a256;font-family:var(--font-dos);margin-top:2px;font-size:10px;display:block}
.nav-group{margin:10px 8px 15px}
.nav-group-title{color:var(--color-gold);font-family:var(--font-dos);text-transform:uppercase;align-items:center;gap:8px;margin:0 0 6px;font-size:12px;display:flex}
.nav-group-title:before{content:"";width:14px;height:14px;image-rendering:pixelated;background:url(ui/mark-gold.png) 50%/contain no-repeat,linear-gradient(var(--color-gold),var(--color-gold))}
.nav-link{min-height:39px;color:var(--color-dim);border:1px solid transparent;grid-template-columns:30px minmax(0,1fr) auto;align-items:center;gap:9px;padding:5px 9px 5px 6px;text-decoration:none;display:grid;position:relative}
.nav-link:hover,.nav-link.is-active{color:var(--color-ink);background:linear-gradient(90deg,#d59b3533,#d59b350a),#24272b;border-color:#5a442c}
.nav-link.is-active{color:var(--color-gold);box-shadow:inset 3px 0 0 var(--color-gold)}
.nav-link-icon{background:url(ui/frame-slot.png) 50%/100% 100% no-repeat;place-items:center;width:30px;height:30px;display:grid}
.nav-link-icon img{object-fit:contain;filter:drop-shadow(0 2px #00000073);width:23px;height:23px;image-rendering:pixelated}
.nav-link-label{text-overflow:ellipsis;white-space:nowrap;min-width:0;font-size:13px;font-weight:800;overflow:hidden}
.nav-link-count{color:var(--color-faint);font-family:var(--font-dos);font-size:10px}
.nav-link-meta{align-items:center;gap:6px;display:flex}
.nav-link-new{border:1px solid var(--color-gold);color:var(--color-gold);font-family:var(--font-dos);letter-spacing:.5px;background:#fce4541f;flex-shrink:0;padding:1px 5px;font-size:9px;line-height:1.4}
.nav-link-beta{color:#9bd0f5;font-family:var(--font-dos);letter-spacing:.5px;background:#65aee024;border:1px solid #65aee0;flex-shrink:0;padding:1px 5px;font-size:9px;line-height:1.4}

/* ===== wiki-main-frame ===== */
.wiki-main{min-width:0;height:100%;min-height:0}
.wiki-main-frame{background:linear-gradient(180deg,#96171b42,transparent 54px),linear-gradient(180deg,#ffffff09,transparent 220px),radial-gradient(circle at 50% -80px,#f6b73c1a,transparent 280px),var(--color-panel);border:2px solid #111;flex-direction:column;height:100%;min-height:0;display:flex;position:relative;overflow:visible;box-shadow:0 0 0 2px #4a4d51,0 0 0 4px #151618,0 12px #0000006b,inset 0 0 0 1px #ffffff0a}
.wiki-main-titlebar{z-index:30;min-height:46px;image-rendering:pixelated;background:url(../img/ui/mainTextBg.png) 50%/100% 100% no-repeat;border-bottom:2px solid #101113;flex:none;justify-content:center;align-items:center;display:flex;position:relative;box-shadow:0 2px #0000008c}
.wiki-title-ornament{width:156px;height:53px;image-rendering:pixelated;pointer-events:none;z-index:2;background:url(../img/ui/dragonHead.png) 50%/contain no-repeat;position:absolute;top:-40px;left:50%;transform:translate(-50%)}
.wiki-title-text{text-align:center;letter-spacing:.1em;text-transform:uppercase;color:#ffd24a;text-shadow:1px 1px #5a1010,-1px 1px #5a1010,1px -1px #5a1010,-1px -1px #5a1010,0 2px 2px #0009;white-space:nowrap;width:100%;font-size:18px;font-weight:800;line-height:1}
.wiki-page-scroll{overscroll-behavior:contain;scrollbar-gutter:stable;flex-direction:column;flex:auto;gap:4rem;min-height:0;display:flex;overflow:hidden auto}
.wiki-main-content{min-width:0;max-width:100%;padding:clamp(12px,1.4vw,18px) clamp(18px,2.2vw,30px) clamp(18px,2.2vw,30px)}
.article-prose{max-width:780px;color:#cdd2dc;font-size:15px;line-height:1.75}
.article-prose h2{font-family:var(--font-pixel);color:#fff0c8;font-size:30px;line-height:1.1;margin:34px 0 12px;text-shadow:1px 1px #260909}
.article-prose h2:first-child{margin-top:8px}
.article-prose h3{font-family:var(--font-pixel);color:#fff3c4;font-size:22px;margin:22px 0 8px}
.article-prose p{margin:0 0 14px}
.article-prose ul{margin:0 0 16px;padding-left:22px}
.article-prose li{margin:5px 0}
.article-prose li::marker{color:var(--color-gold)}
.article-prose strong{color:#fff0c8}
.article-prose a{color:var(--color-gold);text-decoration:underline;text-underline-offset:2px}
.article-prose a:hover{color:#fff3c4}
.article-prose blockquote{border-left:3px solid var(--wiki-red);background:rgba(143,25,28,.14);padding:12px 16px;margin:20px 0;color:#d2c9b5}
.article-prose hr{border:0;border-top:1px solid var(--color-line);margin:26px 0}

/* ===== article header (面包屑 + 标题，文章页专用) ===== */
.article-breadcrumb{align-items:center;flex-wrap:wrap;font-size:13px;color:#8a8576;margin-bottom:14px;display:flex}
.article-breadcrumb a,.article-breadcrumb span{position:relative;padding:0 8px}
.article-breadcrumb>*:first-child{padding-left:0}
.article-breadcrumb>*+*::before{content:"›";position:absolute;left:-2px;color:#5a564b}
.article-breadcrumb a{color:#f2b443;text-decoration:none}
.article-breadcrumb a:hover{text-decoration:underline}
.article-head{margin-bottom:14px;padding-bottom:6px;border-bottom:1px solid var(--color-line)}
.article-title{font-family:var(--font-pixel);color:#fff0c8;font-size:clamp(28px,3.4vw,40px);line-height:1.15;margin:0 0 10px;word-break:break-word}
.article-lead{color:#a39b86;font-size:15px;line-height:1.6;margin:0;max-width:760px;overflow-wrap:break-word}
.article-prose code{font-family:var(--font-dos);background:#0e0f12;padding:1px 6px;color:#ffd24a;font-size:13px}

/* ===== home-hero ===== */
.home-hero{background:linear-gradient(#376fac94,#181a1d33 82px),linear-gradient(90deg,#1f453c61,transparent 46%),#17191c;border:2px solid #111;grid-template-columns:minmax(0,1.05fr) minmax(320px,.95fr);align-items:stretch;gap:clamp(18px,3vw,34px);margin-bottom:32px;display:grid;position:relative;overflow:hidden;box-shadow:0 0 0 2px #4b4f55,0 0 0 4px #121315,0 10px #00000057}
.home-hero:before{content:"";opacity:.55;pointer-events:none;background:linear-gradient(transparent,#00000061);position:absolute;inset:0}
.home-hero-copy,.home-hero-visual{z-index:1;min-width:0;position:relative}
.home-hero-copy{flex-direction:column;padding:clamp(24px,3vw,38px);display:flex}
.eyebrow{color:#f2b443;font-size:12px;font-family:var(--font-sans);align-items:center;gap:6px;margin-bottom:8px;display:inline-flex}
.eyebrow:before{content:"";background:url(ui/mark-notice.png) 50%/contain no-repeat,linear-gradient(#f2b443,#f2b443);width:16px;height:14px;display:inline-block}
.home-hero-title{font-family:var(--font-pixel);background:linear-gradient(90deg,#fff0c8,#f2b443);-webkit-background-clip:text;background-clip:text;color:transparent;margin:0;font-size:clamp(38px,4.4vw,58px);line-height:1.05;word-break:break-word}
.home-hero-title span{color:#f2b443;display:block}
.home-hero-text{color:#d2c9b5;overflow-wrap:break-word;max-width:560px;margin-top:12px;font-size:15px;line-height:1.55}
.home-hero-actions{flex-wrap:wrap;gap:10px;margin-top:18px;display:flex}
.game-button{color:#fff3c4;min-height:40px;font-family:var(--font-dos);text-shadow:1px 1px #000;filter:drop-shadow(0 3px #0000005c);background:url(../img/ui/tapButton.png) 50%/100% 100% no-repeat,#73300d;border:2px solid #3a1b08;justify-content:center;align-items:center;gap:8px;padding:0 18px;font-size:13px;text-decoration:none;display:inline-flex;cursor:pointer}
.game-button:hover{transform:translateY(-1px)}
.game-button.secondary{color:#f2b443;background:linear-gradient(#ffffff0a,transparent),#1a1c20;border-color:#4a4e55}
.game-button img,.game-button svg{width:16px;height:16px;image-rendering:pixelated}
.hero-stat-strip{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;width:min(100%,420px);display:grid}
.hero-stat{background:#0b0c0eb8;border:1px solid #4a4e55;min-width:0;padding:10px}
.hero-stat b{color:#f2b443;font-family:var(--font-dos);font-size:13px;font-weight:400;display:block}
.hero-stat span{color:#b9b2a1;text-overflow:ellipsis;white-space:nowrap;margin-top:3px;font-size:12px;display:block;overflow:hidden}
.home-hero-visual{flex-direction:column;justify-content:center;align-items:center;gap:14px;padding:22px 24px 22px 0;display:flex}
.game-window{background:linear-gradient(#9417194d,transparent 74px),#151719;border:2px solid #0b0c0d;width:min(100%,390px);max-width:390px;margin-left:auto;position:relative;box-shadow:0 0 0 2px #4c5056,0 0 0 4px #111,0 10px #00000057}
.game-window-title{color:#f7c568;height:36px;font-family:var(--font-pixel);text-shadow:1px 1px #000;background:linear-gradient(#8b1d1d,#581214 58%,#310a0d);border-bottom:2px solid #0b0c0d;justify-content:center;align-items:center;font-size:24px;display:flex}
.game-window-body{grid-template-columns:114px minmax(0,1fr);gap:14px;padding:16px;display:grid}

/* ===== patch-banner ===== */
.patch-banner{background:linear-gradient(#96171b42,transparent 54px),#181a1d;border:2px solid #111;margin:0 0 4px;box-shadow:0 0 0 2px #4a4d51,0 0 0 4px #151618,0 8px #0000006b;display:flex;align-items:center;gap:12px;padding:10px 16px;color:var(--color-dim);font-family:var(--font-dos);font-size:13px}
.patch-banner b{color:#ffe27a;text-transform:uppercase;letter-spacing:.5px}

/* ===== home-section-head ===== */
.home-section-head{justify-content:space-between;align-items:end;gap:18px;margin:34px 0 16px;display:flex}
.home-section-head h2{color:#fff0c8;margin:4px 0 0;font-family:var(--font-pixel);font-size:24px;font-weight:900}

/* ===== ugc lanes ===== */
.ugc-lane-head{align-items:center;gap:12px;margin:26px 0 12px;display:flex}
.ugc-lane-label{color:var(--color-gold);font-family:var(--font-dos);text-transform:uppercase;flex:none;align-items:center;gap:8px;font-size:14px;display:inline-flex}
.ugc-lane-label img{object-fit:contain;width:19px;height:19px;image-rendering:pixelated;filter:drop-shadow(0 2px #00000073)}
.ugc-lane-all{color:var(--color-dim);font-family:var(--font-dos);text-transform:uppercase;white-space:nowrap;flex:none;font-size:12px;text-decoration:none}
.ugc-lane-all:hover{color:#f2b443}
.ugc-row{gap:12px;display:grid}
.ugc-row-build{grid-template-columns:repeat(auto-fill,minmax(214px,1fr))}
.ugc-row-guide{grid-template-columns:repeat(auto-fill,minmax(248px,1fr))}
.ugc-row-tier{grid-template-columns:repeat(auto-fill,minmax(240px,1fr))}
.ugc-card{border:2px solid #494d52;border-top-width:3px;border-top-color:var(--kind,#494d52);background:linear-gradient(#ffffff08,transparent),#17191c;flex-direction:column;text-decoration:none;transition:transform .1s,border-color .1s;display:flex;position:relative;overflow:hidden;box-shadow:inset 0 0 0 1px #070809,0 3px #00000040}
.ugc-card:hover{border-color:var(--color-gold);transform:translateY(-2px)}
.ugc-build{--kind:#d59b35;gap:8px;min-height:150px;padding:11px 12px}
.ugc-tier{--kind:#c23a3c;background:linear-gradient(#89161829,transparent 56px),#17191c;gap:8px;min-height:150px;padding:11px 12px}
.ugc-guide{--kind:#3f8ddd}
.ugc-top{justify-content:space-between;align-items:center;gap:8px;display:flex}
.ugc-tag{color:#f6e6c0;max-width:74%;font-family:var(--font-dos);text-transform:uppercase;white-space:nowrap;text-overflow:ellipsis;background:#100d09db;border:1.5px solid #5a4324;align-items:center;gap:5px;padding:2px 7px;font-size:9.5px;display:inline-flex;overflow:hidden}
.ugc-tag.tier{color:#f3c9c9;background:#280c0ddb;border-color:#6e2a2b}
.ugc-tag img{object-fit:contain;flex:none;width:13px;height:13px}
.ugc-score{color:#f2b443;font-family:var(--font-dos);white-space:nowrap;flex:none;font-size:12px}
.ugc-title{color:#f1eadc;font-family:var(--font-dos);text-transform:uppercase;-webkit-line-clamp:2;line-clamp:2;-webkit-box-orient:vertical;margin:0;font-size:14px;font-weight:800;line-height:1.2;display:-webkit-box;overflow:hidden}
.ugc-foot{flex-wrap:wrap;align-items:center;gap:6px 8px;margin-top:auto;padding-top:4px;display:flex}
.ugc-party{flex-wrap:wrap;gap:5px;display:flex}
.ugc-by{color:var(--color-faint);font-family:var(--font-dos);text-transform:uppercase;font-size:10px}
.ugc-tier-rank{flex-wrap:wrap;gap:6px;display:flex}
.ugc-guide-cover{background:#101216;border-bottom:2px solid #30343a;place-items:center;height:104px;display:grid;overflow:hidden}
.ugc-guide-cover img{object-fit:cover;width:100%;height:100%}
.ugc-guide-ph{font-family:var(--font-pixel);color:#3f444d;font-size:36px}
.ugc-guide-body{flex-direction:column;gap:5px;min-height:0;padding:11px 12px;display:flex}
.ugc-sum{color:#a9a08d;-webkit-line-clamp:2;line-clamp:2;-webkit-box-orient:vertical;font-size:11.5px;line-height:1.35;display:-webkit-box;overflow:hidden}
.ugc-guide-meta{color:var(--color-faint);font-family:var(--font-dos);text-transform:uppercase;flex-wrap:wrap;gap:8px;margin-top:auto;padding-top:2px;font-size:9.5px;display:flex}

/* ===== numbers-grid ===== */
.numbers-grid{grid-template-columns:repeat(auto-fill,minmax(120px,1fr));gap:10px;display:grid}
.number-tile{background:#181a1d;border:2px solid #494d52;flex-direction:column;gap:2px;padding:11px 13px;text-decoration:none;transition:transform .1s,border-color .1s;display:flex;box-shadow:inset 0 0 0 1px #0a0b0c}
.number-tile:hover{border-color:var(--color-gold);transform:translateY(-2px)}
.number-tile b{color:#f2b443;font-family:var(--font-dos);font-size:20px;line-height:1}
.number-tile span{color:var(--color-dim);font-size:12px}

/* ===== category-grid ===== */
.category-grid{grid-template-columns:repeat(auto-fill,minmax(235px,1fr));gap:12px;display:grid}
.category-card{background:linear-gradient(90deg,#d59b3524,transparent 48%),#181a1d;border:2px solid #494d52;grid-template-columns:54px minmax(0,1fr);align-items:center;gap:12px;min-height:88px;padding:12px;text-decoration:none;display:grid;position:relative;overflow:hidden;box-shadow:inset 0 0 0 1px #0a0b0c,0 3px #00000040}
.category-card:hover{border-color:var(--wiki-gold);transform:translateY(-2px)}
.category-card:before{content:"";background:#8e1719;width:4px;position:absolute;inset:0 auto 0 0}
.category-card-icon{background:url(ui/frame-badge.png) 50%/100% 100% no-repeat;place-items:center;width:54px;height:54px;display:grid}
.category-card-icon img{object-fit:contain;border-radius:5px;width:30px;height:30px;image-rendering:pixelated}
.category-card h3{color:#f1eadc;align-items:baseline;gap:8px;margin:0;font-size:15px;font-weight:900;display:flex}
.category-card h3 span{color:#f2b443;font-family:var(--font-dos);font-size:11px;font-weight:400}
.category-card p{color:#a9a08d;margin:4px 0 0;font-size:12px}

/* ===== hero-roster ===== */
.hero-roster{grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:12px;display:grid}

/* ===== site-footer ===== */
.site-footer{background:#0c0e122e;flex:none;margin-top:auto;border-top:2px solid var(--color-line);padding:28px clamp(18px,2.2vw,30px) 36px;color:var(--color-dim);font-size:14px}
.site-footer a{color:var(--color-dim);transition:color .15s}
.site-footer a:hover{color:var(--color-gold)}
.site-footer .ft-title{font-family:var(--font-dos);font-size:11px;letter-spacing:1.5px;color:var(--color-faint);text-transform:uppercase;margin-bottom:.625rem}
.site-footer .ft-logo{font-family:var(--font-pixel);letter-spacing:.05em;color:var(--color-ink)}
.site-footer .ft-logo b{font-size:16px}
.site-footer .ft-logo .wiki{letter-spacing:3px;color:var(--color-gold)}
.site-footer .ft-desc{margin-top:.5rem;font-size:13px;line-height:1.625;color:var(--color-faint);max-width:24rem}
.site-footer .ft-cols{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:2.5rem;row-gap:1.5rem}
.site-footer .ft-col li{margin-bottom:.375rem}
.site-footer .ft-bottom{margin-top:2rem;display:flex;flex-direction:column;gap:.5rem;border-top:1px solid var(--color-line);padding-top:1.25rem;font-size:12px;color:var(--color-faint)}
@media(min-width:640px){
  .site-footer .ft-wrap{display:flex;flex-direction:row;justify-content:space-between}
  .site-footer .ft-cols{grid-template-columns:repeat(4,minmax(0,1fr))}
  .site-footer .ft-bottom{flex-direction:row;align-items:flex-start;justify-content:space-between}
  .site-footer .ft-bottom .ft-legal{max-width:62%;text-align:right}
}

/* ===== mobile sidebar (克隆站自制抽屉，保留) ===== */
.mobile-sidebar-btn{display:none;position:fixed;left:1rem;bottom:5rem;width:44px;height:44px;border-radius:50%;background:var(--wiki-stone);border:2px solid var(--color-gold);color:var(--color-gold);cursor:pointer;z-index:60;align-items:center;justify-content:center;font-size:1.2rem;box-shadow:0 4px 14px rgba(0,0,0,.4)}
.mobile-sidebar-backdrop{position:fixed;inset:0;background:rgba(0,0,0,.6);z-index:70;opacity:0;visibility:hidden;transition:opacity .3s,visibility .3s}
.mobile-sidebar-backdrop.active{opacity:1;visibility:visible}
.mobile-sidebar-panel{position:fixed;left:0;top:0;bottom:0;width:280px;background:var(--wiki-stone);border-right:2px solid #111;z-index:71;transform:translateX(-100%);transition:transform .3s ease;overflow-y:auto;padding-top:1rem}
.mobile-sidebar-panel.active{transform:translateX(0)}
.mobile-sidebar-panel .wiki-sidebar-head{text-align:center;font-family:var(--font-dos);font-size:1.2rem;color:var(--color-gold);padding:.6rem;border-bottom:2px solid #101113}

/* ===== 响应式（≤1024px：抽屉式 sidebar，显示汉堡） ===== */
@media(max-width:1200px){
  .home-hero{grid-template-columns:1fr}
  .home-hero-visual{justify-content:center;padding:0 0 22px}
}
@media(max-width:1024px){
  html{height:100%;overflow:hidden}
  body.layout-body{height:100vh;overflow:hidden}
  .app-shell{width:100%;padding:0;display:block;height:calc(100vh - var(--topbar-h) - var(--announce-h,0px));overflow:hidden}
  .app-gutter{display:none}
  .app-frame{display:block;height:100%}
  .wiki-sidebar{position:fixed;top:var(--topbar-h);left:0;width:min(82vw,300px);max-height:calc(100vh - var(--topbar-h));transform:translateX(-110%);transition:transform .18s ease;z-index:80;box-shadow:4px 0 24px rgba(0,0,0,.6)}
  .wiki-sidebar.is-open{transform:translateX(0)}
  .mobile-sidebar-panel{display:none}
  .wiki-main-frame{box-shadow:none;border-left:0;border-right:0}
  .wiki-main-titlebar{display:none}
  .topbar-menu{display:flex}
  .site-topbar-shell{width:calc(100vw - 14px);display:block}
  .site-topbar-inner{width:100%;height:100%}
  .brand-lockup{min-width:190px}
  .mobile-sidebar-btn{display:none}
}
/* ===== 响应式（≤768px） ===== */
@media(max-width:768px){
  .site-topbar-shell{width:calc(100vw - 14px)}
  .site-topbar-inner{gap:8px;width:100%}
  .brand-lockup{width:148px;min-width:0;padding-right:7px}
  .brand-text{font-size:19px}
  .brand-text small{font-size:9px}
  .topbar-search{display:none}
  .announce-text{font-size:11px}
  .home-hero{grid-template-columns:1fr;overflow:hidden}
  .home-hero-visual{justify-content:center;padding:0 0 22px}
  .game-window{width:min(100%,330px);max-width:calc(100% - 16px);margin-left:auto;margin-right:auto}
  .game-window-body{grid-template-columns:1fr}
  .home-hero-copy{padding:22px 16px}
  .home-hero-title{font-size:42px}
  .home-hero-actions{grid-template-columns:1fr;display:grid}
  .home-hero-actions .game-button{width:min(100%,292px)}
  .category-grid,.hero-roster{grid-template-columns:1fr}
  .ugc-row-build,.ugc-row-guide,.ugc-row-tier{grid-template-columns:1fr}
  .wiki-main-content{padding:18px 14px 24px}
  .site-footer{padding:24px 14px 32px}
}

/* ===== FAQ (details/summary 折叠) ===== */
.faq-list{display:flex;flex-direction:column;gap:8px;margin-bottom:8px}
.faq-list details{background:linear-gradient(#ffffff08,transparent),#17191c;border:2px solid #494d52;box-shadow:inset 0 0 0 1px #070809,0 3px #00000040}
.faq-list summary{cursor:pointer;padding:14px 16px 14px 40px;font-family:var(--font-pixel);color:#fff0c8;font-size:15px;line-height:1.3;list-style:none;position:relative}
.faq-list summary::-webkit-details-marker{display:none}
.faq-list summary:before{content:"+";position:absolute;left:16px;top:50%;transform:translateY(-50%);color:var(--color-gold);font-size:18px;font-weight:700;font-family:var(--font-dos)}
.faq-list details[open] summary:before{content:"-"}
.faq-list summary:hover{color:var(--color-gold)}
.faq-list details p{padding:0 16px 14px 40px;color:var(--color-dim);font-size:14px;line-height:1.6}
.faq-list details p a{color:var(--color-gold);text-decoration:underline}

/* ===== 文章列表区 (All guides) ===== */
.article-grid{grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:14px;margin-bottom:40px;display:grid}
.article-card{background:linear-gradient(#ffffff08,transparent),#17191c;border:2px solid #494d52;border-top-width:3px;border-top-color:var(--color-gold);flex-direction:column;padding:16px;text-decoration:none;transition:transform .1s,border-color .1s;display:flex;position:relative;overflow:hidden;box-shadow:inset 0 0 0 1px #070809,0 3px #00000040}
.article-card:hover{border-color:var(--color-gold);transform:translateY(-2px)}
.article-card-group{color:var(--color-gold);font-family:var(--font-dos);text-transform:uppercase;letter-spacing:1px;font-size:10px;margin-bottom:6px}
.article-card h3{color:#fff0c8;font-family:var(--font-pixel);font-size:17px;font-weight:400;margin-bottom:6px;line-height:1.2}
.article-card p{color:var(--color-dim);font-size:13px;line-height:1.5;flex:auto}
.article-card-more{color:var(--color-gold);font-family:var(--font-dos);text-transform:uppercase;font-size:11px;margin-top:10px;letter-spacing:.5px}
.hero-video{position:relative;width:min(100%,420px);aspect-ratio:16/9;margin-top:20px;border:2px solid #494d52;box-shadow:inset 0 0 0 1px #070809,0 3px #00000040;background:#000}
.hero-video iframe{position:absolute;inset:0;width:100%;height:100%;border:0}

/* ===== 文章 TOC：头部右侧浮动 + 滚出后 FAB 抽屉 ===== */
.doc-toc{float:right;width:min(260px,42%);margin:.2rem 0 1.25rem 1.5rem;padding:.45rem .9rem .8rem;background:linear-gradient(#ffffff0a,transparent),var(--color-panel);border:2px solid #111;box-shadow:0 0 0 2px #4a4d51,0 6px #0000004a;max-height:min(420px,55vh);overflow:auto;scrollbar-width:thin;scrollbar-color:#5a442c transparent;position:relative;z-index:5}
.doc-toc-head{display:flex;align-items:center;justify-content:space-between;padding:.1rem 0 .45rem;border-bottom:1px solid #ffffff20;margin-bottom:.35rem}
.doc-toc-title{font-family:var(--font-dos);font-size:12px;letter-spacing:.08em;color:var(--color-gold);text-transform:uppercase}
.doc-toc-body{display:flex;flex-direction:column}
.doc-toc-link{display:block;padding:.32rem .25rem;font-size:13px;line-height:1.35;color:var(--color-ink);text-decoration:none;border-left:2px solid transparent;transition:color .15s,background .15s,border-color .15s}
.doc-toc-link:hover{color:#fff;background:#ffffff0a;border-left-color:var(--color-gold)}

.toc-fab{position:absolute;right:10px;top:62%;z-index:75;width:44px;height:44px;display:none;align-items:center;justify-content:center;background:linear-gradient(#ffffff1a,transparent),var(--color-panel);border:2px solid var(--color-gold);color:#fff;cursor:pointer;box-shadow:0 0 0 2px #111,0 6px #0000006b;border-radius:8px}
.toc-fab.show{display:flex}
.toc-fab svg{width:22px;height:22px}
.back-top{position:absolute;right:10px;top:calc(62% + 52px);z-index:74;width:44px;height:44px;display:none;align-items:center;justify-content:center;background:linear-gradient(#ffffff1a,transparent),var(--color-panel);border:2px solid var(--color-gold);color:#fff;cursor:pointer;box-shadow:0 0 0 2px #111,0 6px #0000006b;border-radius:8px}
.back-top.show{display:flex}
.back-top:hover{color:var(--color-gold)}
.back-top svg{width:22px;height:22px}

.doc-toc-close{display:none;background:transparent;border:0;color:var(--color-ink);font-size:22px;line-height:1;cursor:pointer;padding:0 2px}
.toc-popover .doc-toc-close{display:block}
.toc-popover{position:fixed;top:auto;right:auto;bottom:auto;left:auto;transform:none;margin:0;float:none;width:min(300px,80vw);max-height:min(60vh,480px);z-index:90;box-shadow:0 0 0 2px #4a4d51,0 14px 30px #000a}
.toc-popover[hidden]{display:none!important}

@media(max-width:768px){.doc-toc{float:none;width:auto;margin:0 0 1rem;max-height:none}}

/* ===== 相关文章（标题下，固定宽卡片横向滚动 + 左右箭头） ===== */
.related-row{display:flex;align-items:stretch;gap:6px;margin:0 0 1.25rem;max-width:900px}
.related-nav{flex:none;width:28px;background:linear-gradient(#ffffff0a,transparent),var(--color-panel);border:1px solid #3a3d42;color:var(--color-gold);font-size:22px;line-height:1;cursor:pointer;border-radius:4px;transition:opacity .2s,color .15s,border-color .15s;display:flex;align-items:center;justify-content:center}
.related-nav:hover{color:#fff;border-color:var(--color-gold)}
.related-nav.is-hidden{opacity:0;pointer-events:none}
.related-scroll{display:flex;gap:8px;overflow-x:auto;scroll-behavior:smooth;scrollbar-width:none;padding-bottom:6px;min-width:0}
.related-scroll::-webkit-scrollbar{display:none}
.related-card{flex:none;width:280px;padding:8px 12px;background:linear-gradient(#ffffff08,transparent),var(--color-panel);border:1px solid #3a3d42;border-left:3px solid var(--color-gold);color:var(--color-ink);text-decoration:none;font-size:13px;line-height:1.35;transition:border-color .15s,color .15s,background .15s}
.related-card:hover{color:#fff;background:#ffffff14;border-color:var(--color-gold)}
.related-card-more{color:var(--color-gold)}