/* ===========================================================
   凡人修仙传 · 同道修仙录
   墨绿·灿金·噬金虫荧光 主题
   匹配 gen_pages.js 生成的HTML结构
   =========================================================== */

@import url("https://fonts.googleapis.com/css2?family=Noto+Serif+SC:wght@400;500;700;900&family=Cinzel:wght@400;500;700&family=Playfair+Display:wght@400;700;900&display=swap");

/* ===== CSS Variables ===== */
:root {
  --mo:#060f06; --mo2:#0a1a0a; --mo3:#0f2a0f; --mo4:#143014; --mo5:#1a3a1a;
  --black:#020602;
  --can:#f5d76e; --can2:#ffd700; --can3:#f0c040; --can4:#e8b830; --can5:#fff4cc;
  --shi:#a8ff60; --shi2:#d4ff88; --shi3:#60e040;
  --shi-glow:rgba(168,255,96,0.6); --can-glow:rgba(245,215,110,0.7);
  --text-main:#e8e4d8; --text-sub:#9ab89a; --text-weak:#5a7a5a; --text-title:var(--can);
  --red:#e06060; --green:#60c060;
  --line:rgba(245,215,110,0.30); --line-soft:rgba(245,215,110,0.14); --line-strong:rgba(245,215,110,0.60);
  --bg-panel:rgba(10,26,10,0.72); --bg-panel-2:rgba(6,15,6,0.78); --bg-card:rgba(15,42,15,0.55);
  --bg-input:rgba(6,15,6,0.90);
  --serif:"Noto Serif SC","思源宋体","宋体","Songti SC","SimSun","STSong",serif;
  --sans:"Noto Sans SC","微软雅黑","Microsoft YaHei",sans-serif;

  /* Compatibility aliases */
  --jade:var(--shi); --jade-dark:var(--shi3); --jade-light:var(--shi2);
  --gold:var(--can); --gold-dark:var(--can4); --gold-light:var(--can5);
  --ink:var(--text-main); --ink-light:var(--text-sub); --ink-muted:var(--text-weak);
  --border:var(--line); --red:#bb4444;
  --text-light:var(--text-sub); --text:var(--text-main);
  --bg-dark:var(--mo); --bg-darker:var(--black); --bg-light:var(--mo3);
}

/* ===== Reset & Base ===== */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0;}
html{scroll-behavior:smooth;}
html,body{
  font-family:var(--serif);color:var(--text-main);
  background-color:var(--black);
  line-height:1.9;letter-spacing:0.02em;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}

/* ===== Global Video Background ===== */
#global-bg-video-wrap{
  position:fixed;inset:0;z-index:-2;
  overflow:hidden;pointer-events:none;
}
#global-bg-video{
  position:absolute;inset:-10px;
  width:calc(100% + 20px);height:calc(100% + 20px);
  object-fit:cover;
  filter:brightness(0.28) contrast(1.05) saturate(0.7) hue-rotate(-15deg);
}
#global-bg-overlay{
  position:absolute;inset:0;z-index:1;
  background:
    radial-gradient(ellipse at 50% 40%,rgba(15,42,15,0.4),transparent 65%),
    linear-gradient(180deg,rgba(2,6,2,0.82) 0%,rgba(6,15,6,0.55) 40%,rgba(10,26,10,0.5) 70%,rgba(2,6,2,0.9) 100%);
}

/* Fallback gradient when no video */
body::before{
  content:"";position:fixed;inset:0;z-index:-3;
  background:
    radial-gradient(ellipse at 20% 0%,rgba(20,48,20,0.6),transparent 50%),
    radial-gradient(ellipse at 80% 100%,rgba(15,42,15,0.5),transparent 50%),
    radial-gradient(ellipse at 50% 50%,rgba(10,26,10,0.3),transparent 70%),
    linear-gradient(180deg,#020602 0%,#060f06 25%,#0a1a0a 50%,#060f06 75%,#020602 100%);
}

/* ===== Shijin Particle Canvas ===== */
#shijin-canvas{
  position:fixed!important;inset:0;
  width:100vw!important;height:100vh!important;
  z-index:1!important;pointer-events:none;opacity:0.88;
}

/* ===== Navigation ===== */
.nav{
  position:fixed;top:0;left:0;right:0;z-index:1000;
  display:flex;align-items:center;justify-content:space-between;
  padding:0 1.5rem;height:56px;
  background:rgba(2,6,2,0.92);
  backdrop-filter:blur(12px);
  border-bottom:1px solid var(--line-soft);
}
.nav-brand{
  font-family:var(--serif-en);
  font-size:1.1rem;font-weight:700;color:var(--can);
  text-decoration:none;letter-spacing:0.08em;
  white-space:nowrap;
}
.nav-links{
  display:flex;list-style:none;gap:0;margin:0;padding:0;
  flex-wrap:wrap;justify-content:center;
}
.nav-links li{margin:0;}
.nav-links a{
  display:block;padding:0.4rem 0.65rem;
  font-size:0.82rem;font-family:var(--sans);
  color:var(--text-sub);text-decoration:none;
  border-bottom:2px solid transparent;
  transition:color .2s,border-color .2s;
}
.nav-links a:hover,.nav-links a.active{
  color:var(--can);
  border-bottom-color:var(--can);
}
.theme-switch a{
  color:var(--gold) !important;
  border:1px solid rgba(245,215,110,0.35) !important;
  border-radius:3px;
  margin-left:0.25rem;
  background:rgba(245,215,110,0.08);
}
.theme-switch a:hover{
  background:rgba(245,215,110,0.16);
  color:#fff !important;
}
.nav-right{
  display:flex;align-items:center;gap:0.6rem;
  font-size:0.8rem;font-family:var(--sans);
}
.nav-right #userBadge{
  color:var(--text-sub);padding:0.2rem 0.5rem;
  border:1px solid var(--line-soft);background:var(--bg-panel);
  border-radius:2px;
}
.dev-toggle{
  font-size:0.75rem;padding:0.25rem 0.6rem;
  border:1px solid var(--line);border-radius:2px;
  background:var(--bg-card);color:var(--can3);
  text-decoration:none;cursor:pointer;
  transition:all .2s;
}
.dev-toggle:hover{background:rgba(15,42,15,0.7);color:var(--can);}

/* Mobile nav */
@media(max-width:900px){
  .nav{flex-wrap:wrap;height:auto;padding:0.5rem 1rem;}
  .nav-links a{padding:0.3rem 0.5rem;font-size:0.75rem;}
  .nav-links{order:3;width:100%;justify-content:flex-start;margin-top:0.3rem;}
  .nav-right{font-size:0.7rem;}
}

/* Nav toggle (hamburger) */
.nav-toggle{display:none;background:none;border:1px solid var(--line);color:var(--text-main);font-size:1.4rem;padding:0.2rem 0.5rem;cursor:pointer;border-radius:2px;}
@media(max-width:900px){.nav-toggle{display:block;}.nav-links:not(.open){display:none;}.nav-links.open{display:flex;}}

/* Theme toggle button (深色/白色 切换) */
.theme-toggle{
  margin-left:auto;
  font-size:0.8rem;font-family:var(--sans);
  padding:0.3rem 0.7rem;cursor:pointer;
  border:1px solid rgba(245,215,110,0.4);
  background:rgba(245,215,110,0.08);
  color:var(--can);border-radius:2px;
  white-space:nowrap;letter-spacing:0.04em;
  transition:all .2s;
}
.theme-toggle:hover{background:rgba(245,215,110,0.16);color:#fff;}
@media(max-width:900px){.theme-toggle{margin-left:auto;font-size:0.72rem;padding:0.25rem 0.5rem;}}

/* ===== Cards & Badges ===== */
.card{border:1px solid var(--line-soft);background:var(--bg-card);transition:all 0.3s;}
.card:hover{border-color:var(--can);transform:translateY(-2px);}
.card-body{padding:1.2rem;}
.card-body h3{font-size:1.05rem;color:var(--can);margin-bottom:0.5rem;}
.card-body p{font-size:0.88rem;color:var(--text-sub);line-height:1.6;}

.badge{display:inline-block;padding:0.2rem 0.6rem;font-size:0.72rem;font-family:var(--sans);background:rgba(245,215,110,0.1);color:var(--can);border:1px solid var(--line-soft);border-radius:2px;margin:0.2rem 0.4rem 0.2rem 0;}
.badge-level{background:rgba(168,255,96,0.1);color:var(--shi);}

.small{font-size:0.78rem;color:var(--text-weak);margin-top:0.5rem;}

/* ===== Chapter List (novel page) ===== */
.volume-group{margin-bottom:2rem;}
.volume-title{font-size:1.15rem;color:var(--can);padding-bottom:0.5rem;border-bottom:1px solid var(--line-soft);margin-bottom:1rem;font-family:var(--serif);}
.vol-count{font-size:0.8rem;color:var(--text-weak);font-weight:400;}
.chapter-list{display:flex;flex-direction:column;gap:0.5rem;}
.chapter-item{padding:0.8rem 1rem;background:var(--bg-card);border-left:3px solid var(--line-soft);transition:all 0.2s;}
.chapter-item:hover{border-left-color:var(--can);background:var(--bg-panel);}
.chapter-header{display:flex;align-items:center;gap:0.8rem;margin-bottom:0.3rem;}
.chapter-id{font-family:var(--sans);font-size:0.75rem;color:var(--can);font-weight:700;min-width:2.5rem;}
.chapter-title{font-size:0.95rem;color:var(--text-main);font-weight:500;}
.chapter-summary{font-size:0.82rem;color:var(--text-sub);line-height:1.5;}

/* ===== Timeline ===== */
.timeline-date{display:block;font-size:0.75rem;color:var(--can);font-weight:600;margin-bottom:0.3rem;}
.timeline-dot{position:absolute;left:-2.45rem;top:0.5rem;width:10px;height:10px;background:var(--can);border-radius:50%;}

/* ===== Q&A ===== */
.qa-options{display:flex;flex-wrap:wrap;gap:0.5rem;margin:0.8rem 0;}
.qa-opt{padding:0.4rem 0.9rem;font-size:0.85rem;border:1px solid var(--line-soft);background:var(--bg-card);color:var(--text-sub);cursor:pointer;border-radius:2px;transition:all 0.2s;font-family:var(--sans);}
.qa-opt:hover{border-color:var(--can);color:var(--can);}
.qa-opt.selected{border-color:var(--can);background:rgba(245,215,110,0.1);color:var(--can);}
.qa-q{font-size:0.95rem;color:var(--text-main);font-weight:500;margin-bottom:0.3rem;}
.qa-show{display:inline-block;font-size:0.78rem;color:var(--can3);cursor:pointer;margin-top:0.3rem;text-decoration:underline;}
.qa-answer{max-height:0;overflow:hidden;transition:max-height 0.3s;font-size:0.82rem;color:var(--text-sub);margin-top:0.3rem;padding:0 0.5rem;}
.qa-answer.show{max-height:200px;padding:0.5rem;}
.correct{color:var(--green);font-weight:600;}
.explain{color:var(--text-weak);margin-top:0.3rem;font-style:italic;}

/* ===== Dev Panel ===== */
.dev-table{width:100%;border-collapse:collapse;margin-top:1rem;font-size:0.85rem;}
.dev-table th,.dev-table td{padding:0.6rem 0.8rem;text-align:left;border-bottom:1px solid var(--line-soft);}
.dev-table th{color:var(--can);font-weight:600;background:var(--bg-panel);}
.dev-table td{color:var(--text-sub);}
.dev-table a{color:var(--can3);text-decoration:none;}

/* ===== Hero Section ===== */
.hero{
  min-height:100vh;
  display:flex;align-items:center;justify-content:center;
  position:relative;overflow:hidden;
  text-align:center;padding:6rem 1.5rem 3rem;
}
.hero-bg-text{
  position:absolute;inset:0;
  display:flex;align-items:center;justify-content:center;
  font-family:var(--serif-en);
  font-size:clamp(6rem,15vw,18rem);font-weight:900;
  color:rgba(245,215,110,0.06);
  pointer-events:none;user-select:none;
  letter-spacing:0.15em;
}
.hero-content{position:relative;z-index:2;max-width:800px;}
.hero-badge{
  display:inline-block;margin-bottom:1rem;
  padding:0.35rem 1.2rem;
  border:1px solid var(--line);
  background:var(--bg-panel);
  font-family:var(--sans);font-size:0.85rem;
  color:var(--can3);letter-spacing:0.1em;
  border-radius:2px;
}
.hero-title{
  font-family:var(--serif-en);
  font-size:clamp(2.5rem,6vw,4.5rem);font-weight:900;
  color:var(--can);
  text-shadow:0 0 60px var(--can-glow),0 0 120px rgba(245,215,110,0.3);
  letter-spacing:0.12em;margin-bottom:0.5rem;
}
.hero-subtitle{
  font-family:var(--serif);
  font-size:clamp(1rem,2.5vw,1.4rem);
  color:var(--shi2);
  text-shadow:0 0 20px var(--shi-glow);
  margin-bottom:1.2rem;
}
.hero-desc{
  font-family:var(--sans);
  font-size:0.95rem;color:var(--text-sub);
  line-height:1.8;max-width:600px;margin:0 auto 2rem;
}
.hero-buttons{display:flex;gap:1rem;justify-content:center;flex-wrap:wrap;margin-bottom:2.5rem;}
.hero-stats{
  display:flex;gap:1.5rem;justify-content:center;flex-wrap:wrap;
}
.hero-stat{
  text-align:center;min-width:70px;
}
.hero-stat-num{
  font-family:var(--serif-en);font-size:1.8rem;font-weight:700;
  color:var(--can);text-shadow:0 0 15px var(--can-glow);
}
.hero-stat-label{
  font-family:var(--sans);font-size:0.75rem;
  color:var(--text-weak);
  margin-top:0.15rem;
}

/* ===== Announcements ===== */
.announcements{
  background:rgba(10,26,10,0.85);
  border-top:1px solid var(--line);border-bottom:1px solid var(--line-soft);
  padding:0.8rem 1.5rem;
}
.announcements-inner{
  max-width:1100px;margin:0 auto;
  display:flex;align-items:center;gap:0.8rem;
  font-family:var(--sans);
}
.announcements-label{
  background:var(--can);color:var(--black);
  padding:0.15rem 0.6rem;font-size:0.7rem;font-weight:700;
  border-radius:2px;white-space:nowrap;
}

/* ===== Sections ===== */
.section{
  padding:4rem 1.5rem;
  position:relative;z-index:1;
}
.section-alt{
  background:rgba(6,15,6,0.45);
}
.container{max-width:1100px;margin:0 auto;}
.section-title{
  font-family:var(--serif-en);
  font-size:2rem;font-weight:700;
  color:var(--can);text-align:center;
  text-shadow:0 0 30px var(--can-glow);
  margin-bottom:0.5rem;
  letter-spacing:0.06em;
}
.section-subtitle{
  font-family:var(--sans);font-size:0.95rem;
  color:var(--text-sub);text-align:center;
  margin-bottom:1.5rem;
}
.divider{
  width:60px;height:2px;background:var(--line-strong);
  margin:0 auto 2rem;
}

/* ===== Grids ===== */
.grid,.grid-auto{
  display:grid;gap:1.2rem;
}
.grid-auto{grid-template-columns:repeat(auto-fill,minmax(280px,1fr));}
.grid-2{grid-template-columns:repeat(2,1fr);}
.grid-3{grid-template-columns:repeat(3,1fr);}
@media(max-width:768px){
  .grid-2,.grid-3{grid-template-columns:1fr;}
  .grid-auto{grid-template-columns:repeat(auto-fill,minmax(240px,1fr));}
}

/* ===== Buttons ===== */
.btn{
  display:inline-block;padding:0.6rem 1.8rem;
  font-family:var(--sans);font-size:0.9rem;font-weight:500;
  border:1px solid var(--line);border-radius:2px;
  background:var(--bg-panel);color:var(--text-main);
  cursor:pointer;text-decoration:none;
  transition:all .25s;
}
.btn:hover{background:var(--bg-panel-2);border-color:var(--line-strong);}
.btn-primary{
  background:linear-gradient(135deg,var(--can4),var(--can3));
  color:var(--black);border-color:var(--can);font-weight:700;
}
.btn-primary:hover{
  background:linear-gradient(135deg,var(--can),var(--can3));
  box-shadow:0 0 25px var(--can-glow);
}
.btn-outline{
  border-color:var(--can);color:var(--can);
  background:transparent;
}
.btn-outline:hover{
  background:rgba(245,215,110,0.1);
  box-shadow:0 0 15px rgba(245,215,110,0.2);
}
.btn-full{width:100%;text-align:center;}
.btn-sm{padding:0.3rem 0.8rem;font-size:0.78rem;}
.btn:active{transform:scale(0.97);}

/* ===== Tabs ===== */
.tabs{display:flex;gap:0.4rem;justify-content:center;flex-wrap:wrap;margin-bottom:1.5rem;}
.tab{
  padding:0.45rem 1rem;
  font-family:var(--sans);font-size:0.85rem;
  background:var(--bg-panel);border:1px solid var(--line-soft);
  color:var(--text-sub);cursor:pointer;
  border-radius:2px;transition:all .2s;
}
.tab:hover{color:var(--can);border-color:var(--line);}
.tab.active{
  background:rgba(245,215,110,0.12);color:var(--can);
  border-color:var(--can);
}
.tab-lg{padding:0.55rem 1.2rem;font-size:0.9rem;}

/* ===== Filter Chips ===== */
.filter-chips{display:flex;gap:0.4rem;flex-wrap:wrap;justify-content:center;margin-bottom:1.5rem;}
.filter-chip{
  padding:0.3rem 0.8rem;
  font-family:var(--sans);font-size:0.78rem;
  background:var(--bg-panel);border:1px solid var(--line-soft);
  color:var(--text-sub);cursor:pointer;
  border-radius:2px;transition:all .2s;
}
.filter-chip:hover{color:var(--can);border-color:var(--line);}
.filter-chip.active{background:rgba(245,215,110,0.15);color:var(--can);border-color:var(--can);}

/* ===== Search ===== */
.search-bar{margin-bottom:1.5rem;}
.search-bar input{
  width:100%;max-width:500px;margin:0 auto;display:block;
  padding:0.6rem 1rem;
  font-family:var(--sans);font-size:0.9rem;
  background:var(--bg-input);border:1px solid var(--line);
  color:var(--text-main);border-radius:2px;
  outline:none;transition:border-color .2s;
}
.search-bar input:focus{border-color:var(--can);}
.search-bar input::placeholder{color:var(--text-weak);}

/* ===== Character Cards ===== */
.char-card{
  background:var(--bg-card);border:1px solid var(--line-soft);
  padding:1.2rem;border-radius:2px;
  transition:border-color .3s,transform .2s;
  position:relative;min-height:140px;
  cursor:pointer;
}
.char-card:hover{border-color:var(--can);transform:translateY(-2px);}
.char-card::after{
  content:"点击查看详情";position:absolute;right:0.6rem;bottom:0.4rem;
  font-size:0.65rem;color:var(--text-weak);opacity:0.6;
  pointer-events:none;
}
.char-avatar{
  width:100px;height:120px;border-radius:2px;
  display:flex;align-items:center;justify-content:center;
  font-size:1.8rem;float:left;margin-right:1rem;
  border:1px solid var(--line-soft);overflow:hidden;
  background:linear-gradient(135deg,var(--gold-soft)22,var(--gold-soft)44);
  box-shadow:0 2px 8px rgba(0,0,0,0.3);
}
.char-avatar img{
  width:100%;height:100%;
  object-fit:cover;object-position:center top;
  display:block;
}
.char-avatar span{line-height:1;}
.char-info{overflow:hidden;}
.char-name{
  font-family:var(--serif-en);font-size:1.05rem;font-weight:700;
  color:var(--can);margin-bottom:0.15rem;
}
.char-title{
  font-family:var(--sans);font-size:0.78rem;
  color:var(--shi2);margin-bottom:0.35rem;
}
.char-desc{
  font-family:var(--sans);font-size:0.82rem;
  color:var(--text-sub);line-height:1.6;
  display:-webkit-box;-webkit-line-clamp:4;
  -webkit-box-orient:vertical;overflow:hidden;
}
.char-tags{display:flex;gap:0.3rem;flex-wrap:wrap;margin-top:0.4rem;}
.char-tag{
  padding:0.1rem 0.45rem;font-size:0.68rem;
  background:rgba(168,255,96,0.08);color:var(--shi);
  border:1px solid rgba(168,255,96,0.2);border-radius:2px;
}

/* ===== Character Detail Modal ===== */
.char-modal-overlay{
  position:fixed;inset:0;background:rgba(2,6,2,0.85);
  display:none;align-items:center;justify-content:center;
  z-index:1000;padding:1rem;backdrop-filter:blur(3px);
}
.char-modal-overlay.show{display:flex;}
.char-modal{
  background:var(--bg-card);border:1px solid var(--can);
  border-radius:2px;max-width:720px;width:100%;max-height:90vh;
  display:flex;flex-direction:column;box-shadow:0 20px 60px rgba(0,0,0,0.6);
}
.char-modal-header{
  display:flex;align-items:flex-start;gap:1.2rem;
  padding:1.5rem;border-bottom:1px solid var(--line-soft);
}
.char-modal-avatar{
  width:120px;height:150px;border-radius:2px;overflow:hidden;
  border:1px solid var(--line-soft);flex-shrink:0;
  background:linear-gradient(135deg,var(--gold-soft)22,var(--gold-soft)44);
  display:flex;align-items:center;justify-content:center;font-size:2.5rem;
}
.char-modal-avatar img{width:100%;height:100%;object-fit:cover;object-position:center top;}
.char-modal-title h2{
  font-family:var(--serif);font-size:1.4rem;color:var(--can);margin:0 0 0.3rem;
}
.char-modal-meta{
  font-size:0.82rem;color:var(--shi2);line-height:1.7;
}
.char-modal-meta span{display:inline-block;margin-right:0.8rem;}
.char-modal-body{
  padding:1.5rem;overflow-y:auto;font-size:0.9rem;
  line-height:1.8;color:var(--text-sub);
}
.char-modal-body h4{
  color:var(--can);font-size:0.95rem;margin:1rem 0 0.4rem;
  border-left:2px solid var(--can);padding-left:0.5rem;
}
.char-modal-body h4:first-child{margin-top:0;}
.char-modal-body p{margin:0.4rem 0;}
.char-modal-body .rel-list,.char-modal-body .appear-list{
  display:flex;flex-wrap:wrap;gap:0.4rem;
}
.char-modal-body .rel-tag,.char-modal-body .appear-tag{
  padding:0.15rem 0.6rem;font-size:0.75rem;
  background:rgba(245,215,110,0.08);color:var(--can);
  border:1px solid rgba(245,215,110,0.25);border-radius:2px;
}
.char-modal-close{
  position:absolute;top:1rem;right:1rem;
  background:none;border:none;color:var(--text-weak);
  font-size:1.6rem;cursor:pointer;line-height:1;
}
.char-modal-close:hover{color:var(--can);}
.char-modal-wrap{position:relative;}

/* ===== Treasure Cards ===== */
.treasure-card{
  background:var(--bg-card);border:1px solid var(--line-soft);
  padding:1.2rem;border-radius:2px;
  transition:border-color .3s;
  position:relative;
}
.treasure-card:hover{border-color:var(--can3);}
.treasure-name{
  font-family:var(--serif);font-size:1.05rem;font-weight:700;
  color:var(--can3);margin-bottom:0.2rem;
}
.treasure-type{
  font-family:var(--sans);font-size:0.72rem;color:var(--shi);
  margin-bottom:0.4rem;text-transform:uppercase;letter-spacing:0.05em;
}
.treasure-desc{
  font-family:var(--sans);font-size:0.82rem;
  color:var(--text-sub);line-height:1.6;
}
.treasure-rank{
  position:absolute;top:0.6rem;right:0.8rem;
  font-family:var(--serif-en);font-size:0.7rem;
  color:var(--can);background:rgba(245,215,110,0.08);
  padding:0.15rem 0.5rem;border:1px solid var(--line);
}

/* ===== Beast Cards ===== */
.beast-card{
  background:var(--bg-card);border:1px solid var(--line-soft);
  padding:1.2rem;border-radius:2px;text-align:center;
  transition:border-color .3s;
}
.beast-card:hover{border-color:var(--shi);}
.beast-icon{font-size:2.5rem;margin-bottom:0.5rem;}
.beast-name{
  font-family:var(--serif);font-size:1.05rem;font-weight:700;
  color:var(--can);margin-bottom:0.15rem;
}
.beast-level{
  font-family:var(--serif-en);font-size:0.72rem;color:var(--shi);
  margin-bottom:0.4rem;text-transform:uppercase;letter-spacing:0.05em;
}
.beast-desc{
  font-family:var(--sans);font-size:0.82rem;
  color:var(--text-sub);line-height:1.6;
}

/* ===== Wiki Cards ===== */
.wiki-card{
  background:var(--bg-card);border:1px solid var(--line-soft);
  padding:1.2rem;border-radius:2px;
  transition:border-color .3s;
}
.wiki-card:hover{border-color:var(--line);}
.wiki-card-title{
  display:flex;align-items:center;gap:0.5rem;
  font-family:var(--serif);font-size:1rem;font-weight:700;
  color:var(--can);margin-bottom:0.5rem;
}
.wiki-card-title .icon{font-size:1.3rem;}
.wiki-card-desc{
  font-family:var(--sans);font-size:0.85rem;
  color:var(--text-sub);line-height:1.7;
}

/* ===== Chapter Grid ===== */
.chapter-grid{
  display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));
  gap:0.8rem;
}
.chapter-card{
  background:var(--bg-card);border:1px solid var(--line-soft);
  padding:1rem;border-radius:2px;
  transition:border-color .3s;
}
.chapter-card:hover{border-color:var(--can);}
.chapter-num{
  font-family:var(--serif-en);font-size:0.72rem;color:var(--can3);
  margin-bottom:0.2rem;
}
.chapter-name{
  font-family:var(--serif);font-size:0.95rem;font-weight:500;
  color:var(--text-main);margin-bottom:0.3rem;
}
.chapter-desc{
  font-family:var(--sans);font-size:0.78rem;
  color:var(--text-weak);line-height:1.5;
}

/* ===== Anime ===== */
.anime-season{
  background:var(--bg-card);border:1px solid var(--line);
  padding:1.5rem;border-radius:2px;margin-bottom:1.2rem;
}
.anime-season-title{
  font-family:var(--serif-en);font-size:1.2rem;font-weight:700;
  color:var(--can);margin-bottom:1rem;
}
.anime-info-grid{
  display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));
  gap:0.8rem;
}
.anime-info-item{
  background:var(--bg-panel);padding:0.7rem 1rem;border-radius:2px;
}
.anime-info-label{
  font-family:var(--sans);font-size:0.72rem;color:var(--text-weak);
  margin-bottom:0.2rem;
}
.anime-info-value{
  font-family:var(--serif);font-size:0.9rem;color:var(--text-main);
}

/* ===== Music ===== */
.music-grid{display:flex;flex-direction:column;gap:0.6rem;}
.music-card{
  display:flex;align-items:center;gap:1rem;
  background:var(--bg-card);border:1px solid var(--line-soft);
  padding:1rem;border-radius:2px;
  transition:border-color .3s,background .3s;
}
.music-card:hover{border-color:var(--can3);background:rgba(245,215,110,0.05);}
.music-icon{font-size:1.8rem;flex-shrink:0;}
.music-info{flex:1;}
.music-name{
  font-family:var(--serif);font-size:0.95rem;font-weight:500;
  color:var(--text-main);
}
.music-artist{
  font-family:var(--sans);font-size:0.78rem;color:var(--text-sub);
  margin-top:0.15rem;
}
.music-link{
  font-family:var(--sans);font-size:0.82rem;color:var(--can3);
  flex-shrink:0;
}

/* ===== Footer ===== */
.footer{
  background:rgba(2,6,2,0.95);
  border-top:2px solid var(--line-strong);
  padding:3rem 1.5rem 2rem;
  font-family:var(--sans);position:relative;z-index:1;
}
.footer-grid{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));
  gap:2rem;max-width:1100px;margin:0 auto;
}
.footer-col-title{
  font-family:var(--serif);font-size:1rem;font-weight:700;
  color:var(--can);margin-bottom:0.8rem;
  letter-spacing:0.04em;
}
.footer-links{list-style:none;padding:0;margin:0;}
.footer-links li{margin-bottom:0.4rem;}
.footer-links a{
  color:var(--text-sub);text-decoration:none;font-size:0.85rem;
  transition:color .2s;
}
.footer-links a:hover{color:var(--can);}
.footer-bottom{
  text-align:center;margin-top:2.5rem;padding-top:1.5rem;
  border-top:1px solid var(--line-soft);
  font-size:0.78rem;color:var(--text-weak);
  max-width:1100px;margin-left:auto;margin-right:auto;
}

/* ===== Login Overlay ===== */
.login-overlay{
  position:fixed;inset:0;z-index:9999;
  background:rgba(0,0,0,0.8);backdrop-filter:blur(6px);
  display:none;align-items:center;justify-content:center;
}
.login-overlay.show{display:flex;}
.login-modal{
  background:var(--mo2);border:1px solid var(--line-strong);
  padding:2rem;border-radius:2px;
  max-width:420px;width:90%;position:relative;
  box-shadow:0 0 60px rgba(245,215,110,0.1);
}
.login-close{
  position:absolute;top:0.6rem;right:1rem;
  font-size:1.3rem;color:var(--text-weak);cursor:pointer;
  transition:color .2s;
}
.login-close:hover{color:var(--can);}
.login-title{
  font-family:var(--serif-en);font-size:1.3rem;font-weight:700;
  color:var(--can);text-align:center;margin-bottom:0.4rem;
}
.login-subtitle{
  font-family:var(--sans);font-size:0.85rem;
  color:var(--text-sub);text-align:center;margin-bottom:1.5rem;
}
.login-tabs{display:flex;gap:0;margin-bottom:1.5rem;border-bottom:1px solid var(--line);}
.login-tab{
  flex:1;text-align:center;padding:0.5rem;
  font-family:var(--sans);font-size:0.9rem;
  color:var(--text-sub);cursor:pointer;
  border-bottom:2px solid transparent;
  transition:all .2s;
}
.login-tab.active{
  color:var(--can);border-bottom-color:var(--can);
}

/* ===== Forms ===== */
.form-group{margin-bottom:1rem;}
.form-label{
  display:block;margin-bottom:0.3rem;
  font-family:var(--sans);font-size:0.8rem;color:var(--text-sub);
}
.required{color:var(--red);}
.optional{color:var(--text-weak);font-size:0.75rem;}
.form-error{color:var(--red);font-size:0.78rem;margin:0.5rem 0;display:none;}
.form-success{color:var(--green);font-size:0.78rem;margin:0.5rem 0;display:none;}
input[type="text"],input[type="email"],input[type="password"],
input[type="tel"],input[type="number"],select,textarea{
  width:100%;padding:0.55rem 0.8rem;
  font-family:var(--sans);font-size:0.88rem;
  background:var(--bg-input);border:1px solid var(--line);
  color:var(--text-main);border-radius:2px;
  outline:none;transition:border-color .2s;
}
input:focus,select:focus,textarea:focus{
  border-color:var(--can);
}
textarea{resize:vertical;min-height:100px;}

/* ===== QA Section ===== */
.qa-item{
  background:var(--bg-card);border:1px solid var(--line-soft);
  padding:1.2rem;border-radius:2px;margin-bottom:0.8rem;
  transition:border-color .3s;
}
.qa-item:hover{border-color:var(--line);}
.qa-badges{display:flex;gap:0.4rem;margin-bottom:0.5rem;}
.qa-cat-badge{
  padding:0.1rem 0.5rem;font-size:0.68rem;border-radius:2px;
  background:rgba(245,215,110,0.1);color:var(--can3);
  border:1px solid var(--line-soft);
}
.qa-diff-badge{
  padding:0.1rem 0.5rem;font-size:0.68rem;border-radius:2px;
  background:rgba(168,255,96,0.08);color:var(--shi);
  border:1px solid rgba(168,255,96,0.2);
}
.qa-q{
  font-family:var(--serif);font-size:0.95rem;font-weight:500;
  color:var(--text-main);margin-bottom:0.6rem;
}
.qa-opts{display:flex;flex-direction:column;gap:0.3rem;}
.qa-opt{
  padding:0.5rem 0.8rem;border-radius:2px;cursor:pointer;
  background:var(--bg-panel);border:1px solid var(--line-soft);
  font-family:var(--sans);font-size:0.85rem;color:var(--text-sub);
  transition:all .2s;
}
.qa-opt:hover{color:var(--can);border-color:var(--line);}
.qa-opt.selected{
  background:rgba(168,255,96,0.08);border-color:var(--shi);
  color:var(--shi2);
}
.qa-answer{
  margin-top:0.6rem;padding:0.6rem 0.8rem;
  background:rgba(168,255,96,0.05);border-left:3px solid var(--shi);
  font-family:var(--sans);font-size:0.85rem;color:var(--shi2);
  border-radius:0 2px 2px 0;
}

/* ===== Timeline ===== */
.timeline{position:relative;padding-left:2rem;}
.timeline::before{
  content:"";position:absolute;left:0;top:0;bottom:0;
  width:2px;background:linear-gradient(180deg,var(--can),var(--shi),transparent);
}
.timeline-item{
  background:var(--bg-card);border:1px solid var(--line-soft);
  padding:1rem 1.2rem;border-radius:2px;margin-bottom:1rem;
  position:relative;
}
.timeline-item::before{
  content:"";position:absolute;left:-2.35rem;top:1.2rem;
  width:10px;height:10px;border-radius:50%;
  background:var(--can);border:2px solid var(--mo);
  box-shadow:0 0 10px var(--can-glow);
}
.timeline-item-title{
  font-family:var(--serif);font-size:1rem;font-weight:700;
  color:var(--can);margin-bottom:0.3rem;
}
.timeline-item-desc{
  font-family:var(--sans);font-size:0.85rem;
  color:var(--text-sub);line-height:1.7;
}

/* ===== Quote Cards ===== */
.quote-card{
  background:var(--bg-card);border:1px solid var(--line-soft);
  padding:1.5rem;border-radius:2px;margin-bottom:1rem;
  border-left:3px solid var(--can);
}
.quote-text{
  font-family:var(--serif);font-size:1rem;font-style:italic;
  color:var(--text-main);line-height:1.8;
}
.quote-source{
  font-family:var(--sans);font-size:0.8rem;color:var(--can3);
  text-align:right;margin-top:0.8rem;
}

/* ===== Map / Region ===== */
.map-region{
  background:var(--bg-card);border:1px solid var(--line-soft);
  padding:1.2rem;border-radius:2px;margin-bottom:0.8rem;
}
.map-region-name{
  font-family:var(--serif);font-size:1.05rem;font-weight:700;
  color:var(--can);margin-bottom:0.4rem;
}
.map-region-desc{
  font-family:var(--sans);font-size:0.85rem;
  color:var(--text-sub);line-height:1.7;
}

/* ===== Faction Cards ===== */
.faction-card{
  background:var(--bg-card);border:1px solid var(--line-soft);
  padding:1.2rem;border-radius:2px;text-align:center;
  transition:border-color .3s;
}
.faction-card:hover{border-color:var(--can);}
.faction-name{
  font-family:var(--serif-en);font-size:1.05rem;font-weight:700;
  color:var(--can);margin-bottom:0.2rem;
}
.faction-type{
  font-family:var(--sans);font-size:0.72rem;color:var(--shi);
  margin-bottom:0.5rem;text-transform:uppercase;letter-spacing:0.05em;
}
.faction-desc{
  font-family:var(--sans);font-size:0.82rem;
  color:var(--text-sub);line-height:1.6;
}

/* ===== Disclaimer ===== */
.disclaimer{
  background:rgba(245,215,110,0.04);border:1px solid var(--line);
  padding:1.2rem;border-radius:2px;
  font-family:var(--sans);font-size:0.85rem;color:var(--text-sub);
  line-height:1.8;
}
.disclaimer-title{
  font-family:var(--serif);font-weight:700;color:var(--can3);
  margin-bottom:0.5rem;
}

/* ===== Fan Cards ===== */
.fan-card{
  background:var(--bg-card);border:1px solid var(--line-soft);
  padding:1.2rem;border-radius:2px;
}

/* ===== Comments ===== */
.comment-section{margin-top:1rem;}
.comment-type-tabs{margin-bottom:1.5rem;}
.comment-form{
  background:var(--bg-card);border:1px solid var(--line-soft);
  padding:1.2rem;border-radius:2px;margin-bottom:1.5rem;
}
.comment-form-title{
  font-family:var(--serif);font-size:1rem;font-weight:700;
  color:var(--can);margin-bottom:0.8rem;
}
.comment-meta-row{display:flex;gap:1rem;flex-wrap:wrap;}
.comment-input{
  width:100%;min-height:80px;margin-bottom:1rem;
  padding:0.6rem;font-family:var(--sans);font-size:0.88rem;
  background:var(--bg-input);border:1px solid var(--line);
  color:var(--text-main);resize:vertical;border-radius:2px;
}
.comment-list{display:flex;flex-direction:column;gap:0.8rem;}

/* ===== Search Box (all listing pages) ===== */
.search-bar{
  display:flex;gap:0.6rem;max-width:500px;margin:0 auto 2rem auto;
  flex-wrap:wrap;justify-content:center;
}
.search-bar input{
  flex:1;min-width:200px;padding:0.6rem 1rem;
  background:var(--bg-input);border:1px solid var(--line);
  color:var(--text-main);font-family:var(--sans);
  font-size:0.92rem;border-radius:2px;outline:none;
  transition:border-color 0.2s;
}
.search-bar input:focus{
  border-color:var(--can);box-shadow:0 0 8px rgba(245,215,110,0.15);
}
.search-bar input::placeholder{color:var(--text-weak);}
.search-bar .btn-search{
  padding:0.6rem 1.4rem;background:var(--can4);
  color:var(--black);border:none;font-family:var(--serif);
  font-weight:700;font-size:0.92rem;cursor:pointer;
  border-radius:2px;transition:background 0.2s;
}
.search-bar .btn-search:hover{background:var(--can2);}
.no-results{
  text-align:center;color:var(--text-weak);padding:2rem;
  font-size:1rem;grid-column:1/-1;
}

/* ===== Filter Chips ===== */
.filter-chips{
  display:flex;flex-wrap:wrap;gap:0.5rem;justify-content:center;
  margin-bottom:2rem;
}
.filter-chip{
  padding:0.35rem 1rem;background:var(--bg-card);
  border:1px solid var(--line-soft);color:var(--text-sub);
  font-size:0.85rem;cursor:pointer;border-radius:2px;
  transition:all 0.2s;user-select:none;
}
.filter-chip:hover,.filter-chip.active{
  background:var(--can4);color:var(--black);border-color:var(--can);
  font-weight:700;
}

/* ===== Feedback Form ===== */
.feedback-section{
  margin-top:3rem;padding:2rem 0;
  border-top:1px solid var(--line-soft);
}
.feedback-section h3{
  text-align:center;font-family:var(--serif);
  color:var(--can);font-size:1.2rem;margin-bottom:1.5rem;
}
.feedback-form{
  background:var(--bg-card);border:1px solid var(--line-soft);
  padding:1.5rem;border-radius:2px;max-width:600px;margin:0 auto;
}
.feedback-form .form-group{margin-bottom:1rem;}
.feedback-form label{
  display:block;color:var(--text-sub);font-size:0.85rem;
  margin-bottom:0.35rem;font-family:var(--sans);
}
.feedback-form select{
  width:100%;padding:0.55rem 0.8rem;
  background:var(--bg-input);border:1px solid var(--line);
  color:var(--text-main);font-family:var(--sans);
  border-radius:2px;
}
.feedback-form textarea{
  width:100%;min-height:100px;padding:0.6rem 0.8rem;
  background:var(--bg-input);border:1px solid var(--line);
  color:var(--text-main);font-family:var(--sans);
  font-size:0.88rem;resize:vertical;border-radius:2px;
}
.feedback-form textarea:focus,.feedback-form select:focus{
  border-color:var(--can);outline:none;
  box-shadow:0 0 6px rgba(245,215,110,0.12);
}
.feedback-form .char-count{
  text-align:right;font-size:0.78rem;color:var(--text-weak);
  margin-top:0.2rem;
}
.feedback-form .btn-submit{
  display:block;width:100%;padding:0.65rem;
  background:var(--can4);color:var(--black);
  border:none;font-family:var(--serif);font-weight:700;
  font-size:0.95rem;cursor:pointer;border-radius:2px;
  transition:background 0.2s;
}
.feedback-form .btn-submit:hover{background:var(--can2);}
.feedback-toast{
  position:fixed;bottom:2rem;left:50%;transform:translateX(-50%);
  background:var(--can4);color:var(--black);padding:0.8rem 2rem;
  border-radius:2px;font-weight:700;z-index:9999;
  opacity:0;transition:opacity 0.3s;pointer-events:none;
}
.feedback-toast.show{opacity:1;}

/* ===== Forum Posts ===== */
.forum-post{
  background:var(--bg-card);border:1px solid var(--line-soft);
  padding:1.2rem;margin-bottom:0.8rem;
  border-radius:2px;
}

/* ===== Dev Panel ===== */
.dev-section{margin-bottom:2rem;}
.dev-section-title{
  font-family:var(--serif-en);font-size:1.2rem;font-weight:700;
  color:var(--can);margin-bottom:1rem;
  padding-bottom:0.4rem;border-bottom:1px solid var(--line-soft);
}
.dev-stat-row{
  display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));
  gap:0.8rem;
}
.dev-stat-card{
  background:var(--bg-card);border:1px solid var(--line-soft);
  padding:1rem;text-align:center;border-radius:2px;
}
.dev-stat-icon{font-size:1.5rem;margin-bottom:0.3rem;}
.dev-stat-num{
  font-family:var(--serif-en);font-size:1.5rem;font-weight:700;
  color:var(--can);
}
.dev-stat-label{
  font-family:var(--sans);font-size:0.72rem;color:var(--text-weak);
  margin-top:0.2rem;
}
.dev-table{
  width:100%;border-collapse:collapse;
  font-family:var(--sans);font-size:0.82rem;
  background:var(--bg-card);border:1px solid var(--line-soft);
  border-radius:2px;overflow:auto;
}
.dev-table th,.dev-table td{
  padding:0.5rem 0.6rem;text-align:left;
  border-bottom:1px solid var(--line-soft);
  color:var(--text-sub);
}
.dev-table th{background:var(--bg-panel);color:var(--can);font-weight:700;font-size:0.75rem;}
.dev-login{
  max-width:400px;margin:0 auto;text-align:center;
  background:var(--bg-card);border:1px solid var(--line);
  padding:2rem;border-radius:2px;
}
.dev-login-title{
  font-family:var(--serif);font-size:1.1rem;font-weight:700;
  color:var(--can);
}

/* ===== B站数据 ===== */
.bili-data-container{
  display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));
  gap:0.8rem;margin-bottom:1rem;
}
.bili-data-container .bili-stat{
  background:var(--bg-card);border:1px solid var(--line-soft);
  padding:0.8rem 1rem;text-align:center;border-radius:2px;
}
.bili-data-container .bili-stat-value{
  font-family:var(--serif-en);font-size:1.3rem;font-weight:700;
  color:var(--can);
}
.bili-data-container .bili-stat-label{
  font-family:var(--sans);font-size:0.72rem;color:var(--text-weak);
  margin-top:0.15rem;
}
.bili-update-time{
  text-align:center;font-family:var(--sans);
  font-size:0.78rem;color:var(--text-weak);
  margin-top:0.5rem;
}

/* ===== Back to Top ===== */
.back-to-top{
  position:fixed;bottom:2rem;right:2rem;z-index:999;
  width:42px;height:42px;
  background:var(--bg-card);border:1px solid var(--line);
  color:var(--can);font-size:1.2rem;cursor:pointer;
  border-radius:2px;display:flex;align-items:center;justify-content:center;
  transition:all .3s;opacity:0;pointer-events:none;
}
.back-to-top.visible{opacity:1;pointer-events:auto;}
.back-to-top:hover{background:rgba(245,215,110,0.15);border-color:var(--can);}

/* ===== Particles (legacy) ===== */
.particles{
  position:fixed;inset:0;pointer-events:none;z-index:0;
}

/* ===== Links ===== */
a{color:var(--can3);text-decoration:none;transition:color .2s;}
a:hover{color:var(--can);}

/* ===== Music Panel ===== */
#music-toggle-btn:hover{
  background:rgba(15,42,15,0.95);
  border-color:rgba(245,215,110,0.8);
  box-shadow:0 0 25px rgba(245,215,110,0.4);
  transform:scale(1.08);
}
#music-panel::-webkit-scrollbar{width:3px;}
#music-panel::-webkit-scrollbar-thumb{background:rgba(245,215,110,0.2);border-radius:2px;}
#music-panel .music-track-item.playing{background:rgba(245,215,110,0.1);}
#music-panel .music-track-item .music-play-icon{color:#7cb87c;transition:color 0.2s;}
#music-panel .music-track-item:hover .music-play-icon{color:#f5d76e;}
#music-panel .music-track-item:hover span:last-child{color:#f5d76e;}

/* ===== Update Log Link ===== */
.nav-log-link{
  display:block;padding:0.4rem 0.65rem;
  font-size:0.78rem;font-family:var(--sans);
  color:var(--shi2);text-decoration:none;
  border-bottom:2px solid transparent;
  transition:color .2s,border-color .2s;
}
.nav-log-link:hover{
  color:var(--can);
  border-bottom-color:var(--can);
}

/* ===== Scrollbar ===== */
::-webkit-scrollbar{width:6px;}
::-webkit-scrollbar-track{background:var(--black);}
::-webkit-scrollbar-thumb{background:var(--mo4);border-radius:3px;}
::-webkit-scrollbar-thumb:hover{background:var(--mo5);}

/* ===== Responsive ===== */
@media(max-width:768px){
  .hero{padding:5rem 1rem 2rem;}
  .hero-title{font-size:2rem;}
  .hero-stats{gap:0.8rem;}
  .hero-stat-num{font-size:1.3rem;}
  .section{padding:2.5rem 1rem;}
  .section-title{font-size:1.5rem;}
  .nav-links a{padding:0.3rem 0.4rem;font-size:0.72rem;}
  .chapter-grid{grid-template-columns:1fr;}
  .bili-data-container{grid-template-columns:repeat(auto-fill,minmax(140px,1fr));}
  .dev-stat-row{grid-template-columns:repeat(2,1fr);}
}

/* ===== 试卷中心 ===== */
.exam-modal-overlay{position:fixed;inset:0;background:rgba(0,0,0,0.7);display:none;align-items:flex-start;justify-content:center;z-index:1000;padding:2rem 1rem;overflow:auto;}
.exam-modal-overlay.show{display:flex;}
.exam-modal{background:var(--card);border:1px solid var(--line);border-radius:8px;max-width:760px;width:100%;padding:2rem;position:relative;margin:auto;box-shadow:0 10px 40px rgba(0,0,0,0.4);}
.exam-close{position:absolute;top:0.8rem;right:1rem;background:none;border:none;color:var(--text-primary);font-size:1.8rem;cursor:pointer;line-height:1;}
.exam-modal h2{margin-bottom:1rem;color:var(--gold-primary);}
.exam-q{margin-bottom:1.2rem;padding-bottom:1rem;border-bottom:1px dashed var(--line);}
.exam-qtext{font-weight:600;margin-bottom:0.6rem;color:var(--text-primary);}
.exam-opts{display:flex;flex-direction:column;gap:0.5rem;}
.exam-opt{padding:0.6rem 0.9rem;border:1px solid var(--line);border-radius:4px;cursor:pointer;transition:all 0.15s;color:var(--text-primary);}
.exam-opt:hover{border-color:var(--gold-primary);}
.exam-opt.picked{background:rgba(139,105,20,0.12);border-color:var(--gold-primary);}
.exam-actions{display:flex;gap:1rem;justify-content:flex-end;margin-top:1rem;}
.exam-score{font-size:1.2rem;font-weight:700;color:var(--green-light);margin-bottom:1rem;}
.exam-review{padding:0.8rem;margin-bottom:0.8rem;border-radius:6px;border:1px solid var(--line);}
.exam-review.ok{background:rgba(74,140,63,0.08);}
.exam-review.no{background:rgba(200,60,60,0.08);}
.exam-tag{margin-left:0.5rem;font-size:0.9rem;}
.exam-ra{margin-top:0.3rem;color:var(--text-primary);}
.exam-exp{margin-top:0.3rem;color:var(--text-weak);font-size:0.92rem;}

/* ===========================================================
   WHITE THEME OVERRIDES (body.theme-white)
   素白 · 墨金 · 浅青绿 · 背景视频
   =========================================================== */

body.theme-white {
  --mo:#fafaf8; --mo2:#f5f3ef; --mo3:#eeebe5; --mo4:#e8e4dc; --mo5:#e0dbd2;
  --black:#fafaf8;
  --can:#8b6914; --can2:#a67c00; --can3:#c4941a; --can4:#d4a520; --can5:#2a2008;
  --shi:#4a8c3f; --shi2:#367a2b; --shi3:#60b050;
  --shi-glow:rgba(74,140,63,0.3); --can-glow:rgba(196,148,26,0.4);
  --text-main:#2a2520; --text-sub:#5a5040; --text-weak:#8a7e6e;
  --text-title:var(--can);
  --red:#c0392b; --green:#27ae60;
  --line:rgba(180,160,130,0.4); --line-soft:rgba(200,185,160,0.25); --line-strong:rgba(160,140,110,0.6);
  --bg-panel:rgba(255,255,255,0.85); --bg-panel-2:rgba(250,250,248,0.9); --bg-card:rgba(255,255,255,0.75);
  --bg-input:rgba(255,255,255,0.95);
  --jade:var(--shi); --jade-dark:var(--shi3); --jade-light:var(--shi2);
  --gold:var(--can); --gold-dark:var(--can4); --gold-light:var(--can5);
  --ink:var(--text-main); --ink-light:var(--text-sub); --ink-muted:var(--text-weak);
  --border:var(--line);
  --text-light:var(--text-sub); --text:var(--text-main);
  --bg-dark:var(--mo); --bg-darker:#f0ede8; --bg-light:var(--mo3);
  background-color:transparent;
  color:var(--text-main);
}

/* White theme: base background layers */
body.theme-white {
  background-color:transparent;
}

/* White theme: fallback & video background */
body.theme-white::before{
  background:
    radial-gradient(ellipse at 20% 0%,rgba(230,220,200,0.6),transparent 50%),
    radial-gradient(ellipse at 80% 100%,rgba(220,210,190,0.5),transparent 50%),
    radial-gradient(ellipse at 50% 50%,rgba(240,235,225,0.4),transparent 70%),
    linear-gradient(180deg,#fafaf8 0%,#f5f3ef 25%,#eeebe5 50%,#f5f3ef 75%,#fafaf8 100%);
}

/* White theme: video background */
body.theme-white #global-bg-video-wrap{
  position:fixed;inset:0;z-index:-2;overflow:hidden;pointer-events:none;
}
body.theme-white #global-bg-video{
  position:absolute;inset:-10px;
  width:calc(100% + 20px);height:calc(100% + 20px);
  object-fit:cover;
  filter:brightness(1.05) contrast(0.95) saturate(0.8);
}
body.theme-white #global-bg-overlay{
  position:absolute;inset:0;z-index:1;
  background:
    radial-gradient(ellipse at 50% 40%,rgba(255,255,255,0.3),transparent 65%),
    linear-gradient(180deg,rgba(255,255,255,0.75) 0%,rgba(252,250,248,0.65) 40%,rgba(250,248,245,0.7) 70%,rgba(255,255,255,0.85) 100%);
}

/* White theme: particles reduced opacity */
body.theme-white #shijin-canvas{opacity:0.5;}

/* White theme: nav */
body.theme-white .nav{
  background:rgba(255,255,255,0.92);
  box-shadow:0 1px 8px rgba(0,0,0,0.04);
}

/* White theme: cards shadow */
body.theme-white .card,
body.theme-white .char-card,
body.theme-white .treasure-card,
body.theme-white .beast-card,
body.theme-white .wiki-card,
body.theme-white .chapter-card,
body.theme-white .anime-season,
body.theme-white .music-card,
body.theme-white .faction-card,
body.theme-white .fan-card,
body.theme-white .comment-form,
body.theme-white .map-region,
body.theme-white .bili-stat,
body.theme-white .dev-stat-card,
body.theme-white .dev-login,
body.theme-white .forum-post,
body.theme-white .qa-item,
body.theme-white .timeline-item,
body.theme-white .feedback-form,
body.theme-white .chapter-item{
  box-shadow:0 2px 12px rgba(0,0,0,0.06);
}
body.theme-white .card:hover,
body.theme-white .char-card:hover,
body.theme-white .chapter-item:hover{
  box-shadow:0 4px 20px rgba(0,0,0,0.1);
}

/* White theme: char avatar */
body.theme-white .char-avatar{
  background:linear-gradient(135deg,#f5f0e8,#ede5d8);
  box-shadow:0 2px 8px rgba(0,0,0,0.08);
}

/* White theme: char modal */
body.theme-white .char-modal-overlay{background:rgba(0,0,0,0.5);}
body.theme-white .char-modal{
  background:#fff;
  box-shadow:0 20px 60px rgba(0,0,0,0.2);
}
body.theme-white .char-modal-avatar{background:linear-gradient(135deg,#f5f0e8,#ede5d8);}
body.theme-white .char-modal-body .rel-tag,
body.theme-white .char-modal-body .appear-tag{
  background:rgba(139,105,20,0.06);
  color:var(--can);
  border:1px solid rgba(139,105,20,0.2);
}

/* White theme: login modal */
body.theme-white .login-modal{
  background:#fff;
  box-shadow:0 20px 60px rgba(0,0,0,0.15);
}
body.theme-white .login-overlay{background:rgba(0,0,0,0.5);}

/* White theme: badges */
body.theme-white .badge{background:rgba(139,105,20,0.08);}
body.theme-white .badge-level{background:rgba(74,140,63,0.08);}
body.theme-white .char-tag{background:rgba(74,140,63,0.08);border-color:rgba(74,140,63,0.2);}

/* White theme: tabs & chips */
body.theme-white .tab.active{background:rgba(139,105,20,0.08);}
body.theme-white .filter-chip.active{background:rgba(139,105,20,0.1);}
body.theme-white .qa-cat-badge{background:rgba(139,105,20,0.06);}
body.theme-white .qa-diff-badge{background:rgba(74,140,63,0.06);border-color:rgba(74,140,63,0.2);}
body.theme-white .qa-opt.selected{background:rgba(74,140,63,0.06);}
body.theme-white .qa-answer{background:rgba(74,140,63,0.04);}

/* White theme: treasure rank */
body.theme-white .treasure-rank{background:rgba(139,105,20,0.06);}

/* White theme: section alt */
body.theme-white .section-alt{background:rgba(255,255,255,0.4);}

/* White theme: hero */
body.theme-white .hero-bg-text{color:rgba(139,105,20,0.04);}
body.theme-white .hero-title{text-shadow:0 0 40px var(--can-glow),0 0 80px rgba(139,105,20,0.15);}
body.theme-white .hero-subtitle{text-shadow:none;}
body.theme-white .hero-stat-num{text-shadow:none;}

/* White theme: section title */
body.theme-white .section-title{text-shadow:0 0 20px var(--can-glow);}

/* White theme: announcements */
body.theme-white .announcements{background:rgba(255,255,255,0.85);box-shadow:0 1px 6px rgba(0,0,0,0.04);}
body.theme-white .announcements-label{background:var(--can);color:#fff;}

/* White theme: buttons */
body.theme-white .btn-primary{color:#fff;}
body.theme-white .btn-outline:hover{background:rgba(139,105,20,0.06);box-shadow:none;}

/* White theme: filter chips hover */
body.theme-white .filter-chip:hover,
body.theme-white .filter-chip.active{color:#fff;}

/* White theme: music hover */
body.theme-white .music-card:hover{background:rgba(139,105,20,0.03);}
body.theme-white #music-toggle-btn:hover{background:rgba(255,255,255,0.95);border-color:rgba(139,105,20,0.6);box-shadow:none;transform:scale(1.08);}
body.theme-white #music-panel::-webkit-scrollbar-thumb{background:rgba(139,105,20,0.15);}
body.theme-white #music-panel .music-track-item.playing{background:rgba(139,105,20,0.06);}
body.theme-white #music-panel .music-track-item .music-play-icon{color:#4a8c3f;}
body.theme-white #music-panel .music-track-item:hover .music-play-icon{color:#8b6914;}
body.theme-white #music-panel .music-track-item:hover span:last-child{color:#8b6914;}

/* White theme: footer */
body.theme-white .footer{background:rgba(255,255,255,0.9);box-shadow:0 -1px 8px rgba(0,0,0,0.04);}

/* White theme: back to top */
body.theme-white .back-to-top{box-shadow:0 2px 8px rgba(0,0,0,0.08);}
body.theme-white .back-to-top:hover{background:rgba(139,105,20,0.08);}

/* White theme: timeline dot */
body.theme-white .timeline-item::before{border-color:#fafaf8;}

/* White theme: scrollbar */
body.theme-white ::-webkit-scrollbar-track{background:#f5f3ef;}
body.theme-white ::-webkit-scrollbar-thumb{background:#d5d0c5;border-radius:3px;}
body.theme-white ::-webkit-scrollbar-thumb:hover{background:#c0b9a8;}

/* White theme: disclaimer */
body.theme-white .disclaimer{background:rgba(139,105,20,0.03);}

/* White theme: search focus */
body.theme-white .search-bar input:focus{box-shadow:0 0 8px rgba(139,105,20,0.1);}
body.theme-white .feedback-form textarea:focus,
body.theme-white .feedback-form select:focus{box-shadow:0 0 6px rgba(139,105,20,0.08);}

/* White theme: dev toggle */
body.theme-white .dev-toggle:hover{background:rgba(255,255,255,0.9);}

/* White theme: search btn & feedback btn text color */
body.theme-white .search-bar .btn-search{color:#fff;}
body.theme-white .feedback-form .btn-submit{color:#fff;}
body.theme-white .feedback-toast{color:#fff;}

/* White theme: theme switch button */
body.theme-white .theme-switch a{
  color:#8b6914 !important;
  border-color:rgba(139,105,20,0.35) !important;
  background:rgba(139,105,20,0.06) !important;
}
body.theme-white .theme-switch a:hover{
  background:rgba(139,105,20,0.12) !important;
  color:#5a3e00 !important;
}

/* ===========================================================
   V2.7.0 UI 精修：SVG 功能图标 / 焦点可见态 / 内容图标容器 / 无障碍
   =========================================================== */

/* ---- 导航主题切换图标（SVG mask：深色=太阳 去白版；白主题=月亮 回深色） ---- */
.theme-toggle{display:inline-flex;align-items:center;gap:0.45rem;}
.theme-toggle .tt-icon,
#themeToggleBtn .tt-icon{
  display:inline-block;width:1em;height:1em;flex-shrink:0;
  background:currentColor;
  -webkit-mask:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M12 3v2M12 19v2M5.64 5.64l1.42 1.42M16.94 16.94l1.42 1.42M3 12h2M19 12h2M5.64 18.36l1.42-1.42M16.94 7.06l1.42-1.42M12 7a5 5 0 1 0 0 10 5 5 0 0 0 0-10z'/></svg>") no-repeat center/contain;
  mask:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M12 3v2M12 19v2M5.64 5.64l1.42 1.42M16.94 16.94l1.42 1.42M3 12h2M19 12h2M5.64 18.36l1.42-1.42M16.94 7.06l1.42-1.42M12 7a5 5 0 1 0 0 10 5 5 0 0 0 0-10z'/></svg>") no-repeat center/contain;
}
/* 白主题时切换按钮图标 = 月亮（回深色） */
body.theme-white .theme-toggle .tt-icon,
body.theme-white #themeToggleBtn .tt-icon{
  -webkit-mask:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M21 12.79A9 9 0 1 1 11.21 3 7 7 0 0 0 21 12.79z'/></svg>") no-repeat center/contain;
  mask:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M21 12.79A9 9 0 1 1 11.21 3 7 7 0 0 0 21 12.79z'/></svg>") no-repeat center/contain;
}
/* ---- 汉堡菜单图标（三条线） ---- */
.nav-toggle{display:none;background:none;border:1px solid var(--line);color:var(--text-main);
  width:38px;height:38px;align-items:center;justify-content:center;cursor:pointer;border-radius:4px;
  line-height:1;font-size:0;}
.nav-toggle .nt-icon{
  display:inline-block;width:20px;height:20px;
  background:currentColor;
  -webkit-mask:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M3 6h18M3 12h18M3 18h18' stroke='black' stroke-width='2' fill='none' stroke-linecap='round'/></svg>") no-repeat center/contain;
  mask:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M3 6h18M3 12h18M3 18h18' stroke='black' stroke-width='2' fill='none' stroke-linecap='round'/></svg>") no-repeat center/contain;
}
@media(max-width:900px){.nav-toggle{display:inline-flex;}}

/* ---- 键盘焦点可见态（无障碍） ---- */
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,
[tabindex]:focus-visible{
  outline:2px solid var(--can);outline-offset:2px;border-radius:2px;
}
body.theme-white a:focus-visible,body.theme-white button:focus-visible,
body.theme-white input:focus-visible,body.theme-white select:focus-visible,
body.theme-white textarea:focus-visible{outline-color:#8b6914;}

/* ---- 文本选中态 ---- */
::selection{background:rgba(245,215,110,0.85);color:#020602;}
body.theme-white ::selection{background:rgba(139,105,20,0.85);color:#fff;}

/* ---- 卡片 hover 统一抬升 ---- */
.card,.char-card,.treasure-card,.beast-card,.wiki-card,.chapter-card,
.anime-season,.music-card,.faction-card,.timeline-item,.forum-post{
  transition:border-color .3s,transform .25s,box-shadow .3s;
}
.card:hover,.treasure-card:hover,.beast-card:hover,.wiki-card:hover,.chapter-card:hover,
.faction-card:hover,.timeline-item:hover,.forum-post:hover{transform:translateY(-3px);box-shadow:0 6px 24px rgba(0,0,0,0.35);}
body.theme-white .card:hover,body.theme-white .treasure-card:hover,
body.theme-white .beast-card:hover,body.theme-white .wiki-card:hover,
body.theme-white .chapter-card:hover,body.theme-white .faction-card:hover,
body.theme-white .timeline-item:hover,body.theme-white .forum-post:hover{box-shadow:0 8px 28px rgba(0,0,0,0.12);}

/* ---- 内容 emoji 统一视觉（妖兽/道具等卡片标题图标，保守） ---- */
.grid .card h3,.grid-auto .card h3,.beast-card h3,.treasure-card h3,.music-card h3,
.faction-card h3,.chapter-card h3,.timeline-item-title,.char-name{
  line-height:1.7;overflow-wrap:break-word;
}
h3 .badge{vertical-align:middle;margin-left:0.2rem;}

/* ---- 无图角色头像：统一剪影占位 ---- */
.char-avatar > span{font-size:2rem;line-height:1;display:block;text-align:center;}

/* ---- 减少动态偏好 ---- */
@media (prefers-reduced-motion: reduce){
  *,*::before,*::after{animation-duration:0.01ms!important;animation-iteration-count:1!important;transition-duration:0.01ms!important;scroll-behavior:auto!important;}
}

/* ---- 移动端微调：反馈/搜索间距 ---- */
@media(max-width:768px){
  .section{padding:2.5rem 1rem;}
  .hero{padding:5rem 1rem 2rem;}
  .section-title{font-size:1.5rem;}
  .feedback-section h3{font-size:1.05rem;}
  .back-to-top{right:1rem;bottom:1rem;width:38px;height:38px;}
}

/* ---- 首页 hero 数据卡片（SVG 图标化数字） ---- */
.hero-stats{gap:2.2rem;}
.hero-stats .hs-item{
  display:flex;flex-direction:column;align-items:center;gap:0.1rem;
  min-width:88px;
}
.hero-stats .hs-ic{
  width:26px;height:26px;margin-bottom:0.2rem;
  stroke:var(--can);stroke-width:1.6;fill:none;
  filter:drop-shadow(0 0 6px var(--can-glow));
}
.hero-stats .hs-item b{
  font-family:var(--serif-en);font-size:1.7rem;font-weight:700;
  color:var(--can);text-shadow:0 0 14px var(--can-glow);line-height:1.2;
}
.hero-stats .hs-item em{
  font-style:normal;font-family:var(--sans);font-size:0.72rem;
  color:var(--text-weak);letter-spacing:0.06em;
}
body.theme-white .hero-stats .hs-ic{stroke:#8b6914;filter:drop-shadow(0 0 4px rgba(139,105,20,0.25));}
body.theme-white .hero-stats .hs-item b{color:#8b6914;text-shadow:0 0 8px rgba(139,105,20,0.2);}
@media(max-width:768px){
  .hero-stats{gap:1.2rem;}
  .hero-stats .hs-item{min-width:72px;}
  .hero-stats .hs-item b{font-size:1.3rem;}
  .hero-stats .hs-ic{width:20px;height:20px;}
}

/* ===========================================================
   V2.9.0 视觉体验升级：主动动效系统 / 滚动浮现 / 卡片流光 / 氛围增强
   =========================================================== */

/* ---- 页面入场：主内容淡入上浮 ---- */
@keyframes frx-fade-up{
  from{opacity:0;transform:translateY(18px);}
  to{opacity:1;transform:translateY(0);}
}
.hero-content{animation:frx-fade-up .8s cubic-bezier(.22,.61,.36,1) both;}
.hero + .section{animation:frx-fade-up .9s .15s cubic-bezier(.22,.61,.36,1) both;}

/* ---- hero 标题辉光呼吸 ---- */
@keyframes frx-glow-breathe{
  0%,100%{text-shadow:0 0 30px rgba(245,215,110,.45),0 0 80px rgba(245,215,110,.2);}
  50%{text-shadow:0 0 55px rgba(245,215,110,.75),0 0 130px rgba(245,215,110,.35);}
}
.hero-title{animation:frx-glow-breathe 4.5s ease-in-out infinite;}

/* ---- hero 副标题渐显 ---- */
@keyframes frx-fade-delay{
  from{opacity:0;transform:translateY(10px);}
  to{opacity:1;transform:translateY(0);}
}
.hero-subtitle{animation:frx-fade-delay .8s .35s cubic-bezier(.22,.61,.36,1) both;}
.hero-stats{animation:frx-fade-delay .8s .55s cubic-bezier(.22,.61,.36,1) both;}

/* ---- 滚动浮现（JS 加 .reveal 类） ---- */
.reveal{opacity:0;transform:translateY(26px);transition:opacity .7s cubic-bezier(.22,.61,.36,1),transform .7s cubic-bezier(.22,.61,.36,1);will-change:opacity,transform;}
.reveal.in{opacity:1;transform:translateY(0);}

/* ---- 卡片金色流光描边（hover 扫过；timeline-item 含左装饰线故不裁剪） ---- */
.card,.char-card,.treasure-card,.beast-card,.wiki-card,.chapter-card,
.anime-season,.music-card,.faction-card,.forum-post,
.qa-item,.map-region,.feedback-form{
  position:relative;overflow:hidden;
}
.card::before,.char-card::before,.treasure-card::before,.beast-card::before,
.wiki-card::before,.chapter-card::before,.anime-season::before,.music-card::before,
.faction-card::before,.forum-post::before,.qa-item::before,
.map-region::before,.feedback-form::before{
  content:"";position:absolute;top:0;left:-120%;width:60%;height:100%;
  background:linear-gradient(100deg,transparent,rgba(245,215,110,.10),transparent);
  transform:skewX(-20deg);transition:left .7s ease;pointer-events:none;z-index:1;
}
.card:hover::before,.char-card:hover::before,.treasure-card:hover::before,
.beast-card:hover::before,.wiki-card:hover::before,.chapter-card:hover::before,
.anime-season:hover::before,.music-card:hover::before,.faction-card:hover::before,
.forum-post:hover::before,.qa-item:hover::before,
.map-region:hover::before,.feedback-form:hover::before{left:130%;}

/* ---- 按钮按压反馈 ---- */
.btn,.filter-chip,.tab,.qa-opt,.btn-search,.btn-submit{
  -webkit-tap-highlight-color:transparent;
}
.btn:active,.btn-search:active,.btn-submit:active{transform:scale(.96);transition:transform .1s;}

/* ---- 链接下划线动效（正文内链接） ---- */
.container a:not(.btn):not(.char-card):not(.nav-links a):not(.footer-links a){
  background-image:linear-gradient(transparent calc(100% - 1px),var(--can) 1px);
  background-repeat:no-repeat;background-size:0% 100%;transition:background-size .3s ease;
  text-decoration:none;
}
.container a:not(.btn):not(.char-card):not(.nav-links a):not(.footer-links a):hover{
  background-size:100% 100%;
}

/* ---- 数字统计跳动（hero 数字入场） ---- */
@keyframes frx-count-pop{
  0%{transform:scale(1);}
  40%{transform:scale(1.18);}
  100%{transform:scale(1);}
}
.hero-stat-num{animation:frx-count-pop .6s .8s cubic-bezier(.34,1.56,.64,1) both;display:inline-block;}
.hs-item b{animation:frx-count-pop .6s .8s cubic-bezier(.34,1.56,.64,1) both;display:inline-block;}

/* ---- 噬金虫粒子 canvas 轻微漂浮增强（已有的 shijin 不动，仅提透明层级防遮挡） ---- */
#shijin-canvas{opacity:.9;}

/* ---- 模块标题：入场后横线生长 ---- */
@keyframes frx-line-grow{from{transform:scaleX(0);}to{transform:scaleX(1);}}
.divider{transform-origin:center;animation:frx-line-grow .6s .3s cubic-bezier(.22,.61,.36,1) both;}

/* ---- 回到顶部按钮：微呼吸提示 ---- */
@keyframes frx-float{
  0%,100%{transform:translateY(0);}
  50%{transform:translateY(-4px);}
}
.back-to-top.visible{animation:frx-float 2.6s ease-in-out infinite;}

/* ---- 白主题适配：流光透明度更低 ---- */
body.theme-white .card::before,body.theme-white .char-card::before,
body.theme-white .treasure-card::before,body.theme-white .beast-card::before,
body.theme-white .chapter-card::before,body.theme-white .music-card::before,
body.theme-white .faction-card::before,body.theme-white .forum-post::before,
body.theme-white .qa-item::before{
  background:linear-gradient(100deg,transparent,rgba(139,105,20,.06),transparent);
}

/* ---- 减少动态偏好：全部动效降级 ---- */
@media (prefers-reduced-motion: reduce){
  .hero-content,.hero + .section,.hero-subtitle,.hero-stats,.hero-stat-num,
  .hs-item b,.divider,.back-to-top.visible,.hero-title{animation:none!important;}
  .reveal{opacity:1!important;transform:none!important;transition:none!important;}
  .card::before,.char-card::before,.treasure-card::before,.beast-card::before,
  .wiki-card::before,.chapter-card::before,.anime-season::before,.music-card::before,
  .faction-card::before,.forum-post::before,.qa-item::before,
  .map-region::before,.feedback-form::before{display:none!important;}
}

/* ===== wiki 增强：人物多篇章立绘画廊 ===== */
.char-gallery{
  display:flex;gap:0.6rem;flex-wrap:wrap;
}
.char-gallery img{
  width:88px;height:88px;object-fit:cover;object-position:center top;
  border-radius:4px;border:1px solid var(--line);
  cursor:zoom-in;transition:transform .25s cubic-bezier(.22,.61,.36,1),box-shadow .25s,border-color .25s;
  background:var(--bg-panel);
}
.char-gallery img:hover{
  transform:scale(2.2);z-index:99;position:relative;
  border-color:var(--can);box-shadow:0 12px 40px rgba(0,0,0,.6);
}
body.theme-white .char-gallery img:hover{box-shadow:0 12px 40px rgba(0,0,0,.25);}
@media(max-width:768px){
  .char-gallery img{width:66px;height:66px;}
  .char-gallery img:hover{transform:scale(1.8);}
}

/* ===== wiki 增强：分卷剧情地图 ===== */
.plot-line{
  display:flex;flex-direction:column;gap:1rem;
}
.plot-vol{
  background:var(--bg-card);border:1px solid var(--line-soft);
  border-left:3px solid var(--can);border-radius:2px;
  padding:1rem 1.2rem;transition:border-color .3s,transform .25s;
}
.plot-vol:hover{border-left-color:var(--shi);transform:translateX(3px);}
.plot-vol-head{
  display:flex;align-items:baseline;gap:0.8rem;flex-wrap:wrap;
  margin-bottom:0.7rem;padding-bottom:0.5rem;
  border-bottom:1px dashed var(--line-soft);
}
.plot-vol-name{
  font-family:var(--serif);font-size:1.05rem;font-weight:700;color:var(--can);
}
.plot-vol-realm{
  font-family:var(--sans);font-size:0.75rem;color:var(--shi);
  background:rgba(168,255,96,0.07);border:1px solid rgba(168,255,96,0.18);
  padding:0.1rem 0.5rem;border-radius:2px;
}
.plot-locs{display:flex;flex-direction:column;gap:0.5rem;}
.plot-loc{
  display:flex;align-items:center;gap:0.45rem;flex-wrap:wrap;
}
.plot-loc-name{
  font-family:var(--serif);font-size:0.85rem;color:var(--can3);
  flex-shrink:0;min-width:4.5em;
}
.plot-loc-name::after{content:"→";margin-left:0.5rem;color:var(--text-weak);}
.plot-ev{
  font-family:var(--sans);font-size:0.78rem;color:var(--text-sub);
  background:var(--bg-panel);border:1px solid var(--line-soft);
  padding:0.15rem 0.55rem;border-radius:2px;
  transition:border-color .2s,color .2s;
}
.plot-ev:hover{border-color:var(--can);color:var(--can);}
body.theme-white .plot-vol-realm{background:rgba(74,140,63,0.06);}
body.theme-white .plot-ev{background:rgba(0,0,0,0.015);}
@media(max-width:768px){
  .plot-loc-name{min-width:100%;}
  .plot-loc-name::after{display:none;}
}

/* ===== wiki 立绘：列表卡片缩略图 ===== */
.item-card{overflow:hidden;display:flex;flex-direction:column;}
.item-thumb{
  position:relative;width:100%;aspect-ratio:16/10;
  overflow:hidden;background:var(--bg-panel);
  border-bottom:1px solid var(--line-soft);
}
.item-thumb img{
  width:100%;height:100%;object-fit:cover;object-position:center 20%;
  display:block;transition:transform .5s cubic-bezier(.22,.61,.36,1),filter .4s;
}
.item-card:hover .item-thumb img{transform:scale(1.07);}
.item-thumb::after{
  content:"";position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(to bottom,rgba(6,8,12,0) 55%,rgba(6,8,12,.55) 100%);
}
body.theme-white .item-thumb::after{
  background:linear-gradient(to bottom,rgba(255,255,255,0) 60%,rgba(255,255,255,.45) 100%);
}
.item-card .card-body{flex:1;}
@media(max-width:768px){
  .item-thumb{aspect-ratio:16/11;}
}

/* ===== wiki 地图全图画廊 ===== */
.map-gallery{
  display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:1.2rem;
}
.map-fig{
  margin:0;background:var(--bg-card);border:1px solid var(--line-soft);
  border-radius:2px;overflow:hidden;transition:border-color .3s,box-shadow .3s;
}
.map-fig:hover{border-color:var(--can);box-shadow:0 8px 32px rgba(0,0,0,.45);}
body.theme-white .map-fig:hover{box-shadow:0 8px 32px rgba(0,0,0,.15);}
.map-fig img{
  width:100%;height:220px;object-fit:cover;display:block;
  cursor:zoom-in;transition:transform .4s cubic-bezier(.22,.61,.36,1);
}
.map-fig:hover img{transform:scale(1.05);}
.map-fig figcaption{
  font-family:var(--serif);font-size:0.88rem;color:var(--can);
  text-align:center;padding:0.6rem 0.8rem;
  border-top:1px solid var(--line-soft);
  background:var(--bg-panel);
}
@media(max-width:768px){
  .map-gallery{grid-template-columns:1fr;}
  .map-fig img{height:180px;}
}