:root{
  --bBgc: #222;
  --bFgc: #ddd;
  --bFga: #ccc;
  --bBdc: #ddd;
  --bTBgc: #222;
  /*--fFont: -apple-system, BlinkMacSystemFont, "Helvetica Neue", "PingFang TC", "Microsoft JhengHei", "Source Han Sans SC", "Noto Sans CJK TC", "WenQuanYi Micro Hei", "MiSans L3", "Segoe UI", 霞鹜文楷,sans-serif;
   */
  --fFont: "noto serif tc","noto serif sc","Noto Serif CJK TC","Noto Serif CJK SC",serif,sans-serif;
  --fFont: "霞鹜文楷 TC",霞鹜文楷,"noto serif tc","noto serif sc","Noto Serif CJK TC","Noto Serif CJK SC",serif,sans-serif;

  /*--fFont: sans-serif;*/
  --fFont-2: simsun,sans-serif;
  /*--fFont-2: 汉仪正圆,simsun;*/

  --lFgc: black;
  --lBgc: rgb(245, 239, 218);
  --lBgc2: rgb(222, 217, 197);
  --lFga: #333;
  --lBdc: #333;
  --lTBgc: #222;

  --scrollbar-thumb: #3a3d48;
}

::-webkit-scrollbar { width: 6px; height: 6px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb { background: var(--scrollbar-thumb); border-radius: 3px; }

body {background: var(--bBgc); color: var(--bFgc);font-size:1.8em;margin:0;font-family: var(--fFont);/*'汉仪正圆-45简','汉仪正圆',"DFKai-SB","TypeLand KhangXi Dict",霞鹜文楷,Simsun,"Chekiang Shu Ke Sung",华文中宋, Simsun/*, serif;*/}
article {font-weight:300;margin: 0 0.5em 3em 0.5em;box-sizing:border-box;}
article a {color:var(--bFgc);}
p {text-indent:2em;font-size:24.4px;text-align: justify;margin-block-start: 0.6em;margin-block-end: 0.6em;}
.p > p {margin-block-start:0.1em;margin-block-end:0.1em;}
h3 {border-bottom: 1px solid var(--bBdc);padding:0.7em 0;margin-top: 0.5em;font-weight: 300;}
.page { display: flex;justify-content: space-around;padding: 0.8em 0;border-top: 1px solid var(--bBdc);}
.hd a,
.page a {color: var(--bFgc);text-decoration: none;font-weight:300;}
hr {border:0;border-bottom: 1px solid var(--bBdc);margin: 0.8em 2em;}
hr.dl {border-top: 1px solid var(--bBdc);height: 5px;}
.hd,
.flag {display:flex;flex-direction: column;}
.flag.scr,
.hd{position: fixed;width:100%;text-align:center;font-size: 14px;/*padding: 5px 0;*/font-family: var(--fFont-2)/*,serif*/;/*background: var(--bTBgc);border-bottom: 1px solid #888;*/box-shadow: 0 0px 10px #bbb;opacity: 0.8;color: white;
left: 0;opacity:1;backdrop-filter: blur(10px);
z-index: 98;
}
.hd {top: 0;background:none;}
.hd:is(.light *) {background:none;/*var(--lTBgc);*/backdrop-filter: blur(10px);opacity: 1;}

body:is(.light *) {background: var(--lBgc);color: var(--lFgc);}
h3:is(.light *) {border-bottom: 1px solid var(--lBdc);}
.page:is(.light *) {border-top-color:var(--lFgc)}
.page a:is(.light *) {color: var(--lFgc);}
.hd:is(.light *)  {color: var(--lFgc);}
.hd a:is(.light *) {color:var(--lFgc);}
.flag.scr a:is(.light *) {color: var(--lFgc);}
article a:is(.light *) {color:var(--lFgc);}

.ht {font-size: 20px;
  display: flex;
  align-items: center;
  text-align: center;
}
.ht::before,
.ht::after {
  content: '';
  flex: 1;
  border-bottom: 1px solid #ccc;
}
.ht::before { margin-right: 10px; }
.ht::after { margin-left: 10px; flex-grow: 20;}

.ht a {text-decoration: none;}

.hd .bt {padding: 5px 0;line-height:1;text-shadow:1px 1px 3px var(--bBgc);}
.hd .bt:is(.light *) {text-shadow:1px 1px 3px var(--lBgc);}

.hide {display:none}
.hd.hid {transform:translateY(calc(-100% + 2px));}
.flag.hid {transform:translateY(100%);}
.flag.hid .bar {transform: translateY(-28px);}

.flag.scr {bottom: 0;border-top: none;/*opacity: 0.9;*/padding:0;}
.flag.scr .page {padding: 5px 0;border:0;line-height:1;height:16px;}
.mmenu {display: none;}
.flag.scr .mmenu {display: inline-block;}
#parent-menu {-webkit-transform: translateX(-100%);-moz-transform: translateX(-100%);-ms-transform: translateX(-100%);transform: translateX(-100%);/*background: #242424;*/position: fixed;top: 0;left: 0;right: 30%;color: #fff;font-size: 20px;max-width: 500px;max-height: 100%;height: 100%;-webkit-overflow-scrolling: touch;z-index: 98;}
#parent-menu {opacity: 1;backdrop-filter: blur(40px);}
#parent-menu #info { padding: 2px 20px;box-sizing:border-box;font-weight:bold;}
#parent-menu #menu {
overflow-y: scroll;
height: calc(100% - 25px);
}
.prog {transition: 0.4s;}
.hd,
.flag,
#parent-menu {-webkit-transition: -webkit-transform 0.4s;-moz-transition: -moz-transform 0.4s;transition: transform 0.4s;}
#parent-menu ul {list-style:none;margin:0;padding: 0;}
#parent-menu li {line-height:1;border-top: 1px solid #414141;border-bottom: 1px solid #292929;/*background: #323232;*/padding: 0 1em;height: 24px;overflow: hidden;}
#parent-menu li:first-child {border-top: 0;}
/*#parent-menu li:first-child a {color: white;font-weight:bold;}*/
#parent-menu li:last-child {border-bottom: 0;}
#parent-menu a {text-decoration: none;color: #FFF;font-family: var(--fFont-2);}
#parent-menu a:visited{/*color:#aaa;*/}
#parent-menu a {display: block;line-height: 24px;/*padding: 8px 23px;*/font-size: 13px;color: #fff;/*font-weight: bold;*/text-overflow: ellipsis;overflow: hidden;white-space: nowrap;}
#parent-menu h6 {background: #3b3b3b;color: #919191;line-height: 24px;margin:0;font-size:13px;}
#parent-menu li:is(.light *) {border-bottom:0}
#parent-menu a:is(.light *) {color: var(--lFgc);}

body.nav-view #parent-menu {-webkit-transform: translateX(0);-moz-transform: translateX(0);-ms-transform: translateX(0);transform: translateX(0);-webkit-box-shadow: 0px 0px 20px rgba(0, 0, 0, 0.65);-moz-box-shadow: 0px 0px 20px rgba(0, 0, 0, 0.65);box-shadow: 0px 0px 20px rgba(0, 0, 0, 0.65);}

/*
.hid{ display: none;}
*/
.bar {width: 100%;border:0;}
.prog {background-color:orange;height:2px;width: 0;}
.hd .prog {height:0px;
border-right: 4px solid #fff;
border-top:1px solid #999999;border-bottom:1px solid #888888;background-color: #999;}

#appearance-switcher {float:right;margin-right: 10px;}

.home p {font-size: 0.75em;text-indent:0;}
.home .block img {height:88px;float:left;margin:10px 10px 0px 0;}
.home .block img.l {width:50%;max-width:160px;height:auto;}
.home hr {margin-left:0;margin-right:0}


.block{font-size: 0.8em;margin:2em 0.5em 2em 1em;padding:3px 0.5em;background-color: #444;border-left: 3px solid #888;}
.block p {color: #d8d8d8; margin: 8px 0;text-indent:1em;}
.block hr {display:none;}
.block:is(.light *) {background-color:#EBE5D1;}
.block p:is(.light *) {color:black;}

.home p small.t {font-size: 14px;}
p img {max-width:100%;}

p.img,p.pd {text-indent:0; font-size: 0.8em;font-style: italic;text-align: center;}
p.img {margin-bottom:0.4em;padding:0 2em;}
p.pd {margin-top: 0.4em;}
p.tags {text-indent:0}
p.tags span {display: inline-block; margin: 0 4px;}
/*
p > span {display:block; margin: 5px; 0;}
p > span:first-child {display:inline;}
p > span:last-child {display:inline-block;}
*/
.flag.scr a.dis {color: #555;}
.flag.scr a.dis:is(.light *) {color:#888;}

.home.flex {
  /*
  display: flex;
  flex-wrap: wrap;
  */
  display:grid;
  grid-template-columns: repeat(auto-fill, minmax(345px, 1fr));/*1fr 1fr;*/
}
.home.flex > div {
  padding: 10px;
  gap:10px;
  display: flex;
  box-sizing: border-box;
}
.home.flex > div > div.bookimg {
  /*text-align:center;height:200px;display: grid;place-items: center;*/
  width:80px;height:110px;overflow:hidden;flex-shrink:0;position: relative;
}
.home.flex > div > div.bookimg img {
  max-height: 200px;
  width: 100%;height:100%
}

.home.flex > div > div.bookimg:after {
  box-sizing: inherit;
  content: "连载";
  display: block;
  position: absolute;
  top: 5px;
  left: -18px;
  width: 60px;
  height: 12px;
  line-height: 12px;
  font-size:10px;
  text-align: center;
  background-color: #1e9fff;
  color: #fff;
  transform: rotate(-45deg);
  user-select: none;
  box-shadow: rgb(0 0 0 / .67) 1px 1px 8px 5px;
}

.home.flex > div > div.bookimg.done:after {
  content: "完结";
  background-color: #ff5722
}
.home.flex > div > div.p{
  font-size: 18px;
  flex: 1;
  display: flex;
  flex-direction: column;
  min-width: 0;
}
.home.flex > div > div.p a{
  display:-webkit-box;font-weight: 600;
  margin-bottom: 5px;
  -webkit-box-orient: vertical;
  line-height: 1.1;
  text-decoration:none;
  /*-webkit-line-clamp: 1;
  overflow:hidden;
  */
}
.home.flex > div > div.p small{
  display: -webkit-box;
  font-size: 14px;
  line-height:1.1;
  /*text-overflow: ellipsis;overflow: hidden;white-space: nowrap;*/
  -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
.home.flex > div > div.p .ainfo {
  flex:1;-webkit-line-clamp: 2;
}

.block.ss{font-size: 18px; margin:0;}
.block.ss em {color: #f00;}

@media screen and (min-width:800px){
  /*
  .hd .prog {border-color:#fff;background-color:#fff}
  */
  article {padding: 1em 2em 2em;background: #353535;margin: 0 auto;color: #eaeaea;max-width: 850px;font-weight:300;}
  p {font-size: 26px}
  /*h3 {font-weight:300;}*/
  article:is(.light *) {background: var(--lBgc);color:var(--lFgc);}
  body {margin: auto;background: #1a1a1a;}
  body:is(.light *) {background: var(--lBgc2);}
  .flag .page {width: 700px; margin: 0 auto;padding:0.8em 2em;}
  .flag .page a:is(.light *) {/*color:#ccc;*/}
  /*.hd a:is(.light *) {color:var(--bFgc);}*/
  .home .block img.l {width:160px;}
  .home.flex {
    /*grid-template-columns: 1fr 1fr 1fr;*/
  }
  .flag.scr a,.hd {font-weight: bold;}
}
/*
@media screen and (min-width:1200px){
  article {max-width: 1200px;}
}
*/
