@charset "utf-8";

* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    outline: none;
    -webkit-tap-highlight-color: transparent;
    scrollbar-width: thin;
    letter-spacing: 0.1rem;
}

::-webkit-scrollbar {
	width:8px;
	height:8px
}
::-webkit-scrollbar-thumb {
    border-radius:8px;
    border: 2px solid transparent;
    background-clip: padding-box;
	background-color:var(--colorC);
    background-image: none;
    transition: background-color 0.2s;
}
::-webkit-scrollbar-thumb:hover{
    background-color: var(--theme-60);
}
::-webkit-scrollbar-track {
	box-shadow: none;
	background: transparent;
}
::-webkit-scrollbar-track-piece {
	display:none;
}
::-moz-selection {
	color:#fff;
	background:var(--theme-60)
}
::selection {
	color:#fff;
	background:var(--theme-60)
}
* {
    scrollbar-width: thin;
    scrollbar-color: var(--colorC) transparent;
}
html {
    /* 形状 */
    --radius: 0.75rem;
    --radius-lg: 1.25rem;
    --radius-xl: 1.5rem;
    --radius-pill: 999px;
    /* 节奏 */
    --margin: 1.25rem;
    --gap: 0.6rem;
	--bottom: 3rem;
    /* 玻璃与模糊 */
    --blur: blur(18px) saturate(160%);
    /* 分层阴影 */
    --box-shadow: 0 1px 2px rgb(23 43 77 / 4%), 0 12px 32px -10px rgb(23 43 77 / 10%);
    --box-shadow-hover: 0 2px 4px rgb(23 43 77 / 5%), 0 22px 48px -14px rgb(23 43 77 / 22%);
    /* 文字阴影收敛 */
    --text-shadow: none;
    --title-shadow: 0 2px 18px rgb(10 20 40 / 35%);
    /* 强调色辅助 */
    --color-red: #f0566a;
    --color-white: #fff;
    /* 玻璃表面 */
    --surface: rgb(255 255 255 / 66%);
    --surface-strong: rgb(255 255 255 / 82%);
    --surface-border: rgb(255 255 255 / 55%);
    /* 文字色阶：墨青 */
    --main: #3a4157;
    --colorG: rgb(58 65 87 / 82%);
    --colorF: rgb(58 65 87 / 70%);
    --colorE: rgb(58 65 87 / 56%);
    --colorD: rgb(58 65 87 / 42%);
    --colorC: rgb(58 65 87 / 30%);
    --colorB: rgb(58 65 87 / 16%);
    --colorA: rgb(58 65 87 / 7%);
    /* 表面色 */
    --background-color: rgb(255 255 255 / 66%);
    --background: rgb(255 255 255 / 66%);
    --border: 1px solid rgb(255 255 255 / 60%);
    /* 背景：清晨薄雾 */
    --under-background:
        radial-gradient(1100px 720px at 88% -8%, rgb(255 205 220 / 40%), transparent 60%),
        radial-gradient(900px 640px at -6% 18%, rgb(199 220 255 / 42%), transparent 58%),
        radial-gradient(880px 620px at 55% 112%, rgb(255 233 190 / 34%), transparent 62%),
        linear-gradient(180deg, #fafbfd 0%, #f1f3f9 100%);
    /* 动效 */
    --ease-spring: cubic-bezier(0.34, 1.56, 0.64, 1);
    --ease-out: cubic-bezier(0.22, 0.61, 0.36, 1);
}
button {
    border:unset;
}
.Paint_Sunset {
    --main: #e8ecf5;
    --colorG: rgb(232 236 245 / 85%);
    --colorF: rgb(232 236 245 / 70%);
    --colorE: rgb(232 236 245 / 56%);
    --colorD: rgb(232 236 245 / 44%);
    --colorC: rgb(232 236 245 / 30%);
    --colorB: rgb(232 236 245 / 18%);
    --colorA: rgb(232 236 245 / 8%);
    --border: 1px solid rgb(255 255 255 / 9%);
    --under-background: radial-gradient(ellipse at 20% 20%, rgba(99, 102, 241, 0.18) 0%, transparent 45%), radial-gradient(ellipse at 80% 75%, rgba(168, 85, 247, 0.14) 0%, transparent 45%), radial-gradient(ellipse at 50% 50%, rgba(59, 130, 246, 0.08) 0%, transparent 60%), linear-gradient(180deg, #070a1e 0%, #0d1230 45%, #090c20 100%);
    --background-color: rgb(13 16 38 / 60%);
    --background: rgb(13 16 38 / 60%);
    --surface: rgb(18 22 48 / 50%);
    --surface-strong: rgb(22 27 55 / 72%);
    --surface-border: rgb(255 255 255 / 10%);
    --color-white: #fff;
    --box-shadow: 0 1px 2px rgb(0 0 0 / 40%), 0 16px 38px -12px rgb(0 0 0 / 55%);
    --box-shadow-hover: 0 2px 4px rgb(0 0 0 / 40%), 0 22px 50px -14px rgb(0 0 0 / 60%);
}
.Paint_Sunset .OwO-body{
    background: var(--under-background)!important;
}
.Paint_Sunset .OwO-item,
.Paint_Sunset .OwO-bar  {
    background: var(--background)!important;
}
.silencemode {
	--main: #d4d4d4;
    --colorG: rgb(212 212 212 / 85%);
    --colorF: rgb(212 212 212 / 70%);
    --colorE: rgb(212 212 212 / 56%);
    --colorD: rgb(212 212 212 / 44%);
    --colorC: rgb(212 212 212 / 30%);
    --colorB: rgb(212 212 212 / 18%);
    --colorA: rgb(212 212 212 / 8%);
    --border: 1px solid rgb(255 255 255 / 8%);
    --under-background: linear-gradient(230deg, #2f122b 0%, #1c0729 50%, #202639 100%);
    --background-color: rgb(30 30 30 / 70%);
    --background: rgb(30 30 30 / 70%);
    --surface: rgb(35 35 35 / 55%);
    --surface-strong: rgb(40 40 40 / 75%);
    --surface-border: rgb(255 255 255 / 8%);
    --color-white: #e0e0e0;
	--box-shadow: none!important;
	--box-shadow-hover: none !important;
}
/* 静夜模式头图灰度处理，避免暖色 */
.Paint_Sunset .cat_title_mengban span {
    display: none;
}
.Paint_Sunset .pjax_loading {
    background: var(--background);
}
.Paint_Sunset .avatar,
.Paint_Sunset .owo_image,
.Paint_Sunset .line-numbers img:not(.avatar):not(.owo_image):not(.OwO-item-owo),
.Paint_Sunset #cat_comment img:not(.avatar):not(.owo_image):not(.OwO-item-owo),
.Paint_Sunset .cat_post_album_out img{
    filter: blur(0) brightness(0.9);
}
#silence_model_ANNIU,
#light_model_ANNIU {
    display: none;
}
img{
    object-fit: cover;
    transition: filter 0.4s ease-in-out;
}

body {
    overflow-x:hidden;
    overflow-y:auto;
    line-height: 1.7;
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
    background: var(--under-background);
    background-attachment: fixed;
    color: var(--main);
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", sans-serif;
    word-break: break-word;
}
h1, h2, h3, h4, .cat_title_h1, .cat_title_h2 {
    color: var(--main);
    font-weight: 700;
    letter-spacing: -0.01em;
}
a {
    text-decoration: none;
    color: var(--main);
    transition: color 0.2s;
}
a:hover {
    color: var(--theme);
}
:focus-visible {
    outline: 2px solid var(--theme-60);
    outline-offset: 2px;
    border-radius: 6px;
}
li {
    list-style: none;
}
input, textarea, select{
    list-style: none;
    border-radius: var(--radius)!important;
    border: 1px solid var(--colorB);
    padding: 0.55rem 0.75rem;
    height: auto;
    background:var(--surface);
    color: var(--main);
    box-shadow: 0 1px 2px rgb(23 43 77 / 4%);
    transition: border-color 0.2s, box-shadow 0.2s;
}
input:focus,
textarea:focus,
select:focus {
    outline: none;
    border-color: var(--theme-40);
    box-shadow: 0 0 0 3px var(--theme-10);
}
.tabs_content section {
    display:none;
}
.tabs_content section:first-child {
    display:block;
}
#cat_index_topvideo {
    min-height: 100%;
    height: 100%;
    width: 100%;
    object-fit: cover;
    border-radius: var(--radius);
}
.aplayer {
    box-shadow: none;
    display: block;
    border-radius: var(--radius-lg);
    background: unset;
    font-family: 'catfont';
    margin: 0 0 0.5rem 0;
}
.aplayer-pic {
    border-radius: var(--radius);
    height: 75px!important;
    width: 75px!important;
    margin: 7.5px;
}
.aplayer-title {
    color: var(--main);
}
.aplayer-list {
    margin: 1rem 0;
}
.aplayer-lrc:before,.aplayer-lrc:after {
    display: none!important;
}
.aplayer-list-cur {
    background-color: var(--theme)!important;
}
.aplayer-list ol li.aplayer-list-light,
.aplayer-list ol li:hover {
    background: var(--theme-10)!important;
}
.aplayer-list-index,
.aplayer-list-title{
    font-size: 1rem;
    float: left;
    color: var(--main);
}
.main {
	opacity:1;
    position: inherit;
    margin: 1.5vh 5.6rem;
    transition: opacity 0.2s;
}
.user_logined_avatar {
    height: 1.5rem;
    width: 1.5rem;
    border-radius: var(--radius);
}
.user_webinfo {
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-gap: calc(2*var(--margin));
    padding: 1.1rem 1.5rem;
    font-size: 0.75rem;
    line-height: 2rem;
    -webkit-column-break-inside: avoid;
    position: relative;
    background: var(--surface);
    backdrop-filter: var(--blur);
    -webkit-backdrop-filter: var(--blur);
    margin: var(--margin) 4rem 0;
    color: var(--main);
    box-shadow: var(--box-shadow);
    border: 1px solid var(--surface-border);
    border-radius: var(--radius-xl);
    transition: box-shadow 0.25s var(--ease-out);
}
.user_webinfo .foot_one_line {
    display: block;
    word-break: keep-all;
}
.user_webinfo .foot_left .foot_left_icon a {
    font-size: 0.875rem;
}
.user_webinfo .foot_left {
    text-align: right;
}
.user_webinfo .foot_left a img{
    width:auto;
    height: 0.875rem;
    margin: 0 0.4rem 0 0;
}
.user_webinfo .foot_left a i{
    font-size:1rem;
    padding: 0 0.1rem 0 0;
}
.user_webinfo .foot_right i{
    font-size: 0.875rem;
    margin: 0 0.0625rem;
    color: var(--theme);
}
.user_webinfo span img{
    vertical-align: middle;
    width: 0.75rem;
    height: 0.75rem;
    margin: 0 0.15rem;
}
.cat_index_start{
    display: flex;
    gap: var(--margin);
    flex: auto;
    flex-wrap: wrap;
}
.cat_index_start section {
    width:100%;
}
#cat_article_start {
    -webkit-animation: fadeInUp 0.5s .2s ease both;
    -moz-animation: fadeInUp 0.5s .2s ease both;
    animation: fadeInUp 0.5s .2s ease both;
    animation-delay: 1s;
}
.cat_indexcard_grid {
	display: grid;
	grid-template-columns: repeat(6, minmax(0, 1fr));
	grid-template-rows: minmax(0, 24vh) minmax(0, 0.7fr) minmax(0, 0.5fr);
	grid-column-gap: var(--margin);
	grid-row-gap: var(--margin);
	margin-bottom: var(--margin);
}
.card1 { grid-area: 1 / 1 / 4 / 3; }
/* 日记卡：图片弹性填满剩余空间，与网格区域严格对齐 */
.card1 > .friends_block {
    display: flex;
    flex-direction: column;
}
.card1 .box_out {
    flex: 1 1 auto;
    min-height: 12rem;
    display: flex;
    flex-direction: column;
}
.card1 .box_out > a {
    flex: 1 1 auto;
    display: block;
    overflow: hidden;
    border-radius: var(--radius);
}
.card1 .box_out > a img {
    height: 100%;
    width: 100%;
}
/* main_thin 模式：卡片类名直接挂在 friends_block 上（friends_block.card3 等） */
.friends_block.card1,
.friends_block.card2,
.friends_block.card3,
.friends_block.card4 {
    display: flex;
    flex-direction: column;
}
.friends_block.card1:not(:has(.box_out img)),
.friends_block.card2:not(:has(.box_out img)),
.friends_block.card3:not(:has(.box_out img)),
.friends_block.card4:not(:has(.box_out img)) {
    justify-content: center;
}
/* 卡片弹性填充：封面图补满卡片剩余空间，消除统一比例后的底部留白
   文章页信息卡（书/影/游，含 .cat_conertitle_img）、归档书/影卡（含 .cat_covertitle_desc）除外：
   保留 block + float 实现"图左文右"（仅 flex_second/flex_third 列表模式） */
.card2 .friends_block,
.card3 .friends_block,
.card4 .friends_block,
.flex_first > .friends_block:not(:has(> .cat_conertitle_img)),
.flex_second > .friends_block:not(:has(> .cat_conertitle_img)):not(:has(> .cat_covertitle_desc)),
.flex_third > .friends_block:not(:has(> .cat_conertitle_img)):not(:has(> .cat_covertitle_desc)) {
    display: flex;
    flex-direction: column;
}
/* 无封面卡（音乐/纯文字）：内容垂直居中 */
.card2 .friends_block:not(:has(.box_out img)),
.card3 .friends_block:not(:has(.box_out img)),
.card4 .friends_block:not(:has(.box_out img)),
.flex_first > .friends_block:not(:has(.box_out img)),
.flex_second > .friends_block:not(:has(.box_out img)),
.flex_third > .friends_block:not(:has(.box_out img)) {
    justify-content: center;
}
.card2 .box_out,
.card3 .box_out,
.card4 .box_out,
.flex_first > .friends_block > .box_out,
.flex_second > .friends_block > .box_out,
.flex_third > .friends_block > .box_out {
    flex: 1 1 auto;
    min-height: 0;
    display: flex;
    flex-direction: column;
}
.card2 .box_out > a,
.card3 .box_out > a,
.card4 .box_out > a,
.flex_first > .friends_block .box_out > a,
.flex_second > .friends_block .box_out > a,
.flex_third > .friends_block .box_out > a {
    flex: 1 1 auto;
    display: flex;
    flex-direction: column;
    min-height: 0;
    overflow: hidden;
    border-radius: var(--radius);
}
.card2 .box_out > a img,
.card3 .box_out > a img,
.card4 .box_out > a img,
.flex_first > .friends_block .box_out > a img,
.flex_second > .friends_block .box_out > a img,
.flex_third > .friends_block .box_out > a img {
    flex: 1 1 auto;
    min-height: 0;
    width: 100%;
}
.card2 .box_out a .cat_album_out,
.card3 .box_out a .cat_album_out,
.card4 .box_out a .cat_album_out,
.flex_first > .friends_block .box_out a .cat_album_out,
.flex_second > .friends_block .box_out a .cat_album_out,
.flex_third > .friends_block .box_out a .cat_album_out {
    flex: 1 1 auto;
    min-height: 0;
}
.card2 { grid-area: 1 / 3 / 2 / 5; }
.card3 { grid-area: 2 / 3 / 4 / 4; }
.card4 { grid-area: 2 / 4 / 4 / 5; }
.card5 { grid-area: 1 / 5 / 4 / 7; }
.card1,.card5{
    display: flex;
}
.card5 .box_img{
    height: auto;
}
.card5 .news_title {
    margin: 1rem 0 -1rem;
    text-align: center;
    font-size: 1.05rem;
    font-weight: 600;
    color: var(--main);
    letter-spacing: 0.05em;
}
.main_thin{
    width:1250px;
    margin:auto;
}
.main_fat {
    margin: 1.5vh 5.6rem!important;
}
.main_thin .cat_indexcard_grid {
	grid-template-columns: minmax(0, 1.6fr) 0 minmax(0, 1fr) minmax(0, 1fr);
    grid-template-rows: minmax(0, 14.5rem) 0 minmax(0, 1fr) 0 minmax(0, 21rem);
}
.main_thin .card1 { grid-area: 1 / 1 / 4 / 3; }
.main_thin .card2 { grid-area: 1 / 3 / 2 / 5; }
.main_thin .card3 { grid-area: 2 / 3 / 4 / 4; }
.main_thin .card4 { grid-area: 2 / 4 / 4 / 5; }
.main_thin .card5 { grid-area: 4 / 1 / 6 / 5; }

/* 友链布局 */
.friends_block {
    position: relative;
    padding: 1.1rem 1.2rem;
    color: var(--main);
    box-shadow: var(--box-shadow);
    background: var(--surface);
    border: 1px solid var(--surface-border);
    border-radius: var(--radius-lg);
    backdrop-filter: var(--blur);
    -webkit-backdrop-filter: var(--blur);
    -webkit-column-break-inside: avoid;
    transition: transform 0.3s var(--ease-out), box-shadow 0.3s var(--ease-out);
}
.friends_block:hover {
	-webkit-transform: translateY(-4px);
	transform: translateY(-4px);
	box-shadow: var(--box-shadow-hover);
}
.flex_first {
    display: flex;
    gap: var(--margin);
    flex: auto;
    flex-wrap: wrap;
}
.flex_block_add {
    flex: 1 1 auto;
    width: 20.5rem;
}
.flex_zhuanti_box_out {
    display: flex;
    flex-flow: row wrap;
    gap: var(--gap);
}
.flex_zhuanti_box {
    position: relative;
    flex: 0 0 auto;
    display: flex;
}
.friends_title {
    margin-top: 1rem;
    counter-reset: chapter;
    font-size: 1rem;
    word-break: break-word;
    text-indent: 1em;
    line-height: 1.75rem;
    color: var(--main);
}
.friends_title li {
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    line-height: 2.1rem;
    font-size: 0.92rem;
}
.friends_title li a {
    color: var(--colorG);
    transition: color 0.2s;
}
.friends_title li:hover a,
.friends_title li a:hover {
    color: var(--theme);
}

.friends_link_desc {
    text-align: center;
    margin: 1rem 2rem 0;
    position: relative;
    word-break: break-all;
    line-height: 1.75rem;
    overflow: hidden;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 5;
}
.linkicon {
    right: 0.25rem;
    position: absolute;
    bottom: 0;
    color: var(--colorE);
    font-size: 1.2rem;
}
.unlinkicon {
    right: 0;
    position: absolute;
    bottom: 0;
    color: var(--colorE);
    font-size: 1.3rem;
}
.cat_index_guidang .box_img{
    height: auto;
    aspect-ratio: 16 / 9;
}
.cat_index_guidang .friends_title {
    margin-top: 0.5rem;
    width: calc(50vw - 5rem);
}
/* zhuanti */
.friends_zhuanti_title {
    font-size: 1.5rem;
    padding: 0.5rem 0 1rem;
    text-shadow: var(--text-shadow);
    cursor: pointer;
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-bottom: 1px dashed var(--theme-30);
    margin-bottom: 1rem;
}
.friends_zhuanti_title_more {
    text-shadow: var(--text-shadow);
    color: var(--colorE);
}
/* circle */
.friends_post_title {
    font-size: 1.05rem;
    font-weight: 600;
    letter-spacing: 0.02em;
    text-align: center;
    padding: 0.5rem 0 0.5rem 1rem;
    display: block;
    color: var(--main);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    text-shadow: var(--text-shadow);
}
/* 卡片元信息与列表图标：统一强调色 */
.friends_title li > i,
.cat_covertitle > i,
.cat_covertitle_desc > i,
.friends_post_post > i,
.cat_index_tags a i {
    color: var(--theme);
}
/* 元信息文字层级：比标题弱一档 */
.cat_covertitle,
.cat_covertitle_desc {
    color: var(--colorF);
}
.friends_post_post {
    word-break: break-word;
    overflow: hidden;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 4;
    font-size: 0.9rem;
    line-height: 1.75rem;
    color: var(--colorF);
    padding: 0 1rem;
    height: 7rem;
}
.friends_post_point {
    position: absolute;
    right: 1.5rem;
    top: 1.5rem;
    font-size: 2rem;
    color: var(--theme);
    text-shadow: var(--text-shadow);
    padding: 0 1rem;
    text-align: center;
    border-radius: var(--radius);
    backdrop-filter: var(--blur);
}
.cat_postlist_category a {
    position: relative;
    font-size: 0.9rem;
    color: var(--colorF);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.friends_musicpost{
    text-indent: 0;
    height: auto;
    white-space: nowrap;
    width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
}
.box_avatar {
    position: relative;
    display: flex;
    align-items: flex-end;
}
.box_avatar_left {
    float: left;
    position: relative;
    padding: 0 0.5rem;
}
.box_avatar_left img {
    max-width: 100%;
    transition: opacity .3s;
    vertical-align: middle;
    border-radius: 20%;
    margin-right: 0.5rem;
    box-shadow: var(--box-shadow);
    -o-object-fit: cover;
    object-fit: cover;
}
.box_avatar_right {
    max-width: 70%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.box_avatar_right a {
    font-size: 1.2rem;
    text-shadow: var(--text-shadow);
    margin: 0.25rem 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.box_out {
    position: relative;
    vertical-align: middle;
}
.cat_diary_peitu .box_out {
    height: 100%;
}
.box_img {
    display: block;
    position: relative;
    background-position: 50% 50%;
    background-size: cover;
    overflow: hidden;
    border-radius: var(--radius);
    width:100%;
    height: auto;
    aspect-ratio: 16 / 9;
    object-fit: cover;
}

/* album */
.grid_14{
    display: grid;
    grid-template-columns: repeat(auto-fill,minmax(14rem,1fr));
    grid-gap: var(--margin);
}
.section_first{
    display: grid;
    grid-template-columns: repeat(auto-fill,minmax(18rem,1fr));
    grid-gap: var(--margin);
}
.cat_grid{
    display: grid;
    grid-template-columns: repeat(auto-fill,minmax(24rem,1fr));
    grid-gap: var(--margin);
}
/* anime */
.section_anime{
    display: grid;
    grid-template-columns: repeat(auto-fill,minmax(30rem,1fr));
    grid-gap: var(--margin);
}
.animetitle {
    font-size: 1.2rem;
    margin: 0.4rem 0;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
    display: block;
}
.animetags{
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
}
.no_tags {
    display: inline-block;
    vertical-align: middle;
    color: var(--colorF);
    font-size: 0.75rem;
    line-height: 1.4rem;
    background: var(--colorA);
    border-radius: var(--radius-pill);
    padding: 0 0.6rem;
    margin: 0.2rem;
}
.animeinfo,
.cat_indexcard_tags a{
    border-radius: var(--radius-pill);
    background: var(--theme-10);
    border: 1px solid var(--theme-10);
    padding: 0 0.6rem;
    vertical-align: top;
    font-size: 0.75rem;
    word-break: keep-all;
    display: inline-block;
    line-height: 1.4rem;
    vertical-align: baseline;
    font-weight: unset;
    color: var(--colorF);
    vertical-align: middle;
    transition: background 0.2s, color 0.2s, border-color 0.2s;
}
.animeinfo:hover,
.cat_indexcard_tags a:hover {
    background: var(--theme-30);
    color: #fff;
    border-color: transparent;
}
.cat_indexcard_tags {
    margin: 0.3rem 0;
    display: block;
    color: var(--routine);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.cat_indexcard_tags a{
    margin: 0.2rem;
}
.cat_indexcard_time {
    position: absolute;
    color: #fff;
    left: auto;
    right: auto;
    top: auto;
    bottom: auto;
    z-index: 1;
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    border-radius: var(--radius-pill);
    padding: 0.1rem 0.65rem;
    line-height: 1.7rem;
    font-size: 0.82rem;
    letter-spacing: 0.02em;
}
.cat_indexcard_time_1 {
    left: 0.5rem;
    top: 0.5rem;
    font-size: 1.2rem;
    line-height: 1.2rem;
    padding: 0.45rem;
    border-radius: 50%;
    display: flex;
}
.cat_indexcard_time_1 i{
    font-size: 1.2rem;
    line-height: 1.2rem;
}
.cat_indexcard_time_2 {
    right: 0.5rem;
    top: 0.5rem;
}
.cat_indexcard_time_3 {
    right: 0.5rem;
    bottom: 0.5rem;
}
.cat_indexcard_time_4 {
    left: 0.5rem;
    bottom: 0.5rem;
    border-radius: var(--radius-lg);
    padding: 0.5rem 0.75rem;
    text-align: left;
}
.cat_indexcard_time_5 {
    right: 0.5rem;
    bottom: var(--bottom);
}
.cat_indexcard_time_6 {
    left: 0.5rem;
    bottom: var(--bottom);
}
.cat_indexcard_time_1line,.cat_indexcard_time_2line {
    overflow: hidden;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    max-width: 75%;
    word-break: break-all;
}
.cat_indexcard_time_info{
    max-width: 75%;
}
.cat_indexcard_time_info span{
    height: 1.5rem;
    text-indent: 0;
    line-height: 1.5rem;
    overflow: hidden;
    display: block;
}
.index_image1{
    height: auto;
    width:100%;
    aspect-ratio: 16 / 9;
}
.index_image2{
    height: auto;
}
.animeword {
    text-indent: 2em;
    padding: 0 0.2rem;
    vertical-align: top;
    font-size: 1rem;
    margin: 0.5rem;
    text-overflow: ellipsis;
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 5;
    -webkit-box-orient: vertical;
}
.anime_right{
    min-height: 10rem;
}
.flex_second .friends_post_title{
    text-align: left;
}
.flex_second .friends_block .box_out img {
    height: auto;
    aspect-ratio: 16 / 9;
}
.flex_third .friends_block .box_out img {
    height: auto;
    aspect-ratio: 16 / 9;
}
.flex_big .flex_big_tags{
    display: none;
}
.cat_index_tags {
    display: flex;
    flex-wrap: wrap;
    gap: var(--gap);
    justify-content: space-between;
}
.cat_index_tags li {
    display: inline-block;
    padding: 0.5rem;
    text-align: center;
    text-shadow: var(--text-shadow);
}
.cat_index_tags li:last-child {
    margin-right: auto;
}
.cat_index_tags a i {
    font-size: smaller;
    color: var(--colorG);
}

.cat_index_recentcomment_list {
    display: grid;
    grid-template-columns: repeat(auto-fill,minmax(300px,1fr));
    gap: var(--margin);
}
.cat_index_recentcomment_list .user {
    display: flex;
    margin-bottom: 0.5rem;
    position: relative;
}
.cat_index_recentcomment_list .user .info {
    max-width: 50%;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}
.cat_index_recentcomment_list .user .avatar,
.cat_index_visitorblock .user .avatar{
    width: 3rem;
    height: 3rem;
    border-radius: 50%;
    margin-right: 0.75rem;
    box-shadow: var(--box-shadow);
    -o-object-fit: cover;
    object-fit: cover;
}
.cat_index_recentcomment_list .author {
    color: var(--main);
    text-shadow: var(--text-shadow);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.cat_index_recentcomment_list .date {
    font-size: 1rem;
    right: 0.5rem;
    position: absolute;
    font-weight: 400;
    color: var(--colorF);
}
.cat_index_visitorblock .reply,
.cat_index_recentcomment_list .reply {
    font-size: 1rem;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    color: var(--main);
    max-height: 3.8rem;
    position: relative;
    background: var(--colorA);
    border-radius: 1.1rem 1.1rem 1.1rem 0.3rem;
    padding: 0.5rem 1rem;
    word-break: break-word;
    line-height: 1.5rem;
}
/* 主页归档 */
.cat_index_guidang .friends_post_post{
	height: 15rem;
    overflow-y: auto;
}
.cat_index_guidang .cat_guidang_year {
    display: inline-block;
    cursor: pointer;
    font-size: 1.1rem;
    line-height: 2.5rem;
    margin: 0.5rem;
    font-weight: 600;
    padding: 0.25rem 0.85rem;
    border-radius: var(--radius-pill);
    transition: color 0.2s, background 0.2s;
    color: var(--colorG);
    background: var(--colorA);
    border: 1px solid transparent;
}
.cat_index_guidang .cat_guidang_year:hover,
.cat_index_guidang .cat_guidang_mon:hover{
    color: var(--theme);
    background: var(--theme-10);
}
.cat_index_guidang .cat_guidang_mon {
    cursor: pointer;
    font-size: 1.05rem;
    display: none;
    padding: 0.35rem 0.8rem;
    border-radius: var(--radius-pill);
    margin: 0.5rem;
    color: var(--colorG);
    background: var(--colorA);
    border: 1px solid transparent;
    transition: color 0.2s, background 0.2s;
}
.cat_index_guidang .cat_guidang_day {
    display: none;
    font-size: 1rem;
    line-height: 2.25rem;
}

/* 统计页卡片，主页卡片 */
.cat_index_infocards {
    display: flex;
    column-gap: var(--margin);
    flex: auto;
    flex-wrap: wrap;
    color: var(--main);
}
/* 统计页数据总览：玻璃数据卡网格 */
.cat_echarts_infocards {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: var(--margin);
    color: var(--main);
}
@media (max-width:1200px) {
    .cat_echarts_infocards {
        grid-template-columns: repeat(3, 1fr);
    }
}
@media (max-width:750px) {
    .cat_echarts_infocards {
        grid-template-columns: repeat(2, 1fr);
        gap: var(--gap);
    }
}
/* 统计页数据卡 */
.flex_block_add_card {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    gap: 0.6rem;
    padding: 1.4rem 1rem 1.2rem;
    cursor: default;
}
.cat_stat_icon {
    width: 3.4rem;
    height: 3.4rem;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.7rem;
    color: var(--theme);
    background: var(--theme-10);
    border: 1px solid var(--theme-30);
    border-radius: var(--radius-lg);
    transition: transform 0.3s var(--ease-out), background 0.3s;
}
.flex_block_add_card:hover .cat_stat_icon {
    transform: scale(1.08);
    background: var(--theme-30);
}
.cat_stat_num {
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 1.45rem;
    font-weight: 700;
    line-height: 1.2;
    color: var(--main);
    font-variant-numeric: tabular-nums;
}
.cat_stat_label {
    font-size: 0.82rem;
    letter-spacing: 0.08em;
    color: var(--colorF);
}
/* 主页卡片 */
.cat_index_infocards li {
    height: 10rem;
    padding: 0;
    flex: 1 1 auto;
    width: 14rem;
    position: relative;
    box-shadow: var(--box-shadow);
    background: var(--surface);
    border: 1px solid var(--surface-border);
    backdrop-filter: var(--blur);
    -webkit-backdrop-filter: var(--blur);
    margin-bottom: var(--margin);
    border-radius: var(--radius-lg);
    overflow: hidden;
    transition: transform 0.3s var(--ease-out), box-shadow 0.3s var(--ease-out);
}
.cat_index_infocards li:hover {
    transform: translateY(-4px);
    box-shadow: var(--box-shadow-hover);
}

/* 公告栏 */
.cat_notice_bar {
    display: flex;
    align-items: center;
    gap: 0.85rem;
    background: linear-gradient(90deg, var(--theme-10), transparent 65%), var(--surface);
    border-color: var(--theme-10);
}
.cat_notice_bar .cat_notice_icon {
    flex: none;
    font-size: 1.25rem;
    color: var(--theme);
    background: var(--theme-10);
    border-radius: 50%;
    width: 2.4rem;
    height: 2.4rem;
    line-height: 2.4rem;
    text-align: center;
}
.cat_notice_bar .swiper {
    flex: 1 1 auto;
    min-width: 0;
}
.cat_notice_bar .swiper-slide span {
    color: var(--colorE) !important;
}
/* 留言板访客 */
.cat_index_visitors {
    display: grid;
    grid-gap: var(--margin);
    grid-template-columns: repeat(auto-fill,minmax(15rem,1fr));
    color: var(--main);
    margin-bottom: var(--margin);
}
/* 留言板：活跃读者榜 */
.gb-rank {
    position: relative;
    margin-bottom: var(--margin);
    padding: 1.5rem;
    color: var(--main);
    background: var(--surface);
    border: 1px solid var(--surface-border);
    border-radius: var(--radius-xl);
    backdrop-filter: var(--blur);
    -webkit-backdrop-filter: var(--blur);
    box-shadow: var(--box-shadow);
}
.gb-rank-head {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 1rem;
    margin-bottom: 1.25rem;
}
.gb-rank-title {
    font-size: 1.15rem;
    font-weight: 600;
}
.gb-rank-title i {
    margin-right: 0.45rem;
    font-size: 1.3rem;
    color: var(--theme);
    vertical-align: -0.15rem;
}
.gb-rank-sub {
    flex: none;
    font-size: 0.82rem;
    color: var(--colorE);
}
/* 领奖台：第1名居中最高，2、3名向上靠拢成阶梯 */
.gb-podium {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    align-items: end;
    gap: var(--margin);
    margin-bottom: 1.5rem;
}
.gb-podium-item {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding-bottom: 1rem;
    text-align: center;
    background: var(--surface-strong);
    border: 1px solid var(--surface-border);
    border-radius: var(--radius-lg);
}
.gb-podium-item.is-rank-1 { grid-column: 2; grid-row: 1; transform: translateY(-1.1rem); box-shadow: var(--box-shadow-hover); }
.gb-podium-item.is-rank-2 { grid-column: 1; grid-row: 1; transform: translateY(-0.2rem); }
.gb-podium-item.is-rank-3 { grid-column: 3; grid-row: 1; transform: translateY(-0.2rem); }
.gb-podium-cover {
    position: relative;
    width: 100%;
    border-radius: var(--radius-lg) var(--radius-lg) 0 0;
    overflow: hidden;
}
.gb-podium-cover img {
    display: block;
    width: 100%;
    height: 10.5rem;
    object-fit: cover;
    background: var(--colorA);
    transition: transform 0.4s var(--ease-out);
}
.gb-podium-item:hover .gb-podium-cover img {
    transform: scale(1.05);
}
.gb-podium-medal {
    position: absolute;
    top: 0.7rem;
    left: 0.7rem;
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    padding: 0.2rem 0.65rem;
    font-size: 0.85rem;
    font-weight: 700;
    color: #fff;
    border-radius: var(--radius-pill);
    box-shadow: 0 4px 12px rgb(0 0 0 / 18%);
}
.gb-podium-medal i {
    font-size: 0.95rem;
}
.is-rank-1 .gb-podium-medal { background: linear-gradient(135deg, #ffd76a, #f0a93c); }
.is-rank-2 .gb-podium-medal { background: linear-gradient(135deg, #d7dde8, #9aa7ba); }
.is-rank-3 .gb-podium-medal { background: linear-gradient(135deg, #e3a87a, #b06d3c); }
.gb-podium-avatar {
    width: 4.2rem;
    height: 4.2rem;
    margin-top: -2.1rem;
    background: var(--surface-strong);
    border: 3px solid var(--surface-strong);
    border-radius: 50%;
    box-shadow: var(--box-shadow);
    object-fit: cover;
    z-index: 1;
}
.gb-podium-item.is-rank-1 .gb-podium-avatar {
    width: 4.8rem;
    height: 4.8rem;
    margin-top: -2.4rem;
    border-color: #ffd76a;
}
.gb-podium-name {
    max-width: 88%;
    margin-top: 0.55rem;
    font-size: 1rem;
    font-weight: 600;
    color: var(--main);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    transition: color 0.2s;
}
a.gb-podium-name:hover {
    color: var(--theme);
}
.gb-podium-tags {
    width: 100%;
    max-width: 100%;
    margin-top: 0.35rem;
    padding: 0 0.5rem;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.gb-podium-count {
    margin-top: 0.4rem;
    font-size: 0.78rem;
    color: var(--colorE);
}
.gb-podium-count i {
    margin-right: 0.2rem;
    color: var(--theme-60);
}
/* 第 4 名起：行式榜单 */
.gb-rank-list {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.35rem var(--margin);
    padding: 0.5rem;
    list-style: none;
    background: var(--colorA);
    border-radius: var(--radius-lg);
}
.gb-rank-row {
    display: flex;
    align-items: center;
    gap: 0.7rem;
    min-width: 0;
    padding: 0.55rem 0.75rem;
    border-radius: var(--radius);
    transition: background 0.2s;
}
.gb-rank-row:hover {
    background: var(--surface);
}
.gb-rank-no {
    flex: none;
    width: 1.6rem;
    height: 1.6rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 0.78rem;
    font-weight: 700;
    color: var(--colorE);
    background: var(--surface);
    border-radius: var(--radius-pill);
    font-variant-numeric: tabular-nums;
}
/* 总榜 4-10 名（列表前 7 行）用主题色强调 */
.gb-rank-row:nth-child(-n+7) .gb-rank-no {
    color: var(--theme);
    background: var(--theme-10);
}
.gb-rank-avatar {
    flex: none;
    width: 2.3rem;
    height: 2.3rem;
    border-radius: 50%;
    object-fit: cover;
    background: var(--colorA);
}
.gb-rank-name {
    flex: 0 1 auto;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 0.92rem;
    color: var(--main);
    transition: color 0.2s;
}
a.gb-rank-name:hover {
    color: var(--theme);
}
.gb-rank-tags {
    flex: 1 1 auto;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.gb-rank-cnt {
    flex: none;
    font-size: 0.8rem;
    color: var(--colorE);
    font-variant-numeric: tabular-nums;
}
.gb-rank-cnt i {
    margin-right: 0.25rem;
    color: var(--theme-60);
}
.gb-rank-list.is-collapsed .gb-rank-row:nth-child(n+11) {
    display: none;
}
.gb-rank-toggle {
    display: block;
    width: 100%;
    margin-top: 0.9rem;
    padding: 0.6rem;
    font-size: 0.88rem;
    color: var(--colorF);
    background: var(--colorA);
    border: 1px dashed var(--colorC);
    border-radius: var(--radius);
    cursor: pointer;
    transition: color 0.2s, background 0.2s, border-color 0.2s;
}
.gb-rank-toggle:hover {
    color: var(--theme);
    background: var(--theme-10);
    border-color: var(--theme-30);
}
.gb-rank-toggle:active {
    transform: scale(0.99);
}
@media (max-width: 900px) {
    .gb-rank-list {
        grid-template-columns: 1fr;
    }
}
@media (max-width: 750px) {
    .gb-rank {
        padding: 1rem;
    }
    .gb-rank-head {
        flex-direction: column;
        align-items: flex-start;
        gap: 0.2rem;
    }
    .gb-podium {
        grid-template-columns: 1fr;
        gap: 2.6rem;
        margin-bottom: 1rem;
    }
    .gb-podium-item.is-rank-1,
    .gb-podium-item.is-rank-2,
    .gb-podium-item.is-rank-3 {
        grid-column: 1;
        grid-row: auto;
        transform: none;
    }
    .gb-podium-item.is-rank-1 .gb-podium-cover img,
    .gb-podium-cover img {
        height: 10rem;
    }
    .gb-rank-tags {
        display: none;
    }
}
.cat_links_unlink_moreusers{
    color: var(--colorE);
    font-size: 0.9rem;
    margin: 1.5rem;
    text-align: center;
    cursor: pointer;
}
.cat_left_line {
    position: absolute;
    top: -2rem;
    left: -1.5rem;
    width: 0.2rem;
    height: 100%;
    background: var(--theme-30);
}
.cat_left_circle {
    position: absolute;
    left: -1.875rem;
    width: 1rem;
    height: 1rem;
    border-radius: 50%;
    border: solid 0.2rem var(--theme-60);
    background: var(--background);
    margin-top: 1.25rem;
}
.lv_0 {
    background: rgb(189 189 189 / 30%);
    border: 1px solid rgb(189 189 189 / 30%);
}
.lv_1,.lv_2,.lv_3 {
    background: rgb(168 211 255 / 30%);
    border: 1px solid rgb(168 211 255 / 30%);
}
.lv_4,.lv_5,.lv_6 {
    background: rgb(255 206 133 / 30%);
    border: 1px solid rgb(255 206 133 / 30%);
}
.lv_7,.lv_8,.lv_9 {
    background: rgb(246 68 68 / 30%);
    border: 1px solid rgb(246 68 68 / 30%);
}
.lv_10 {
    background: linear-gradient(to left,#ff4500,orange,gold,#90ee90,cyan,#1e90ff,#9370db,hotpink,#ff4500);
    background-size: 110vw;
    color: #fff;
    animation: rainbowan 60s linear infinite;
    -webkit-animation: rainbowan 60s linear infinite;
    -moz-animation: rainbowan 60s linear infinite;
}
.lv_cat {
    background: var(--theme-30);
    background-image: -webkit-linear-gradient(45deg,var(--theme-30) 25%,transparent 0,transparent 50%,var(--theme-30) 0,var(--theme-30) 75%,transparent 0,transparent);
}
.lv_friend {
    background:var(--theme-30);
    border: 1px solid var(--theme-30);
}
.lv_guest {
    background: rgb(189 189 189 / 30%);
    border: 1px solid rgb(189 189 189 / 30%);
}


/* title.php的css */
.cat_title_header {
    margin: 1.5vh auto;
}
.cat_title_header .cat_title_block{    
    border-radius: var(--radius-xl);
    margin-bottom: var(--margin);
    box-shadow: var(--box-shadow);
    -webkit-column-break-inside: avoid;
    width: 100%;
    height: calc(100vh - 1.5rem);
    position: relative;
    overflow: hidden;
    transition: color 0.2s;
    -webkit-animation: fadeInDownBig 0.5s .2s ease both;
    -moz-animation: fadeInDownBig 0.5s .2s ease both;
    animation: fadeInDownBig 0.5s .2s ease both;
}
.cat_title_header .swiper {
    min-height: 100%;
    height: 100%;
}
.cat_title_header .swiper-wrapper {
    height: 100%;
}
.cat_title_title2 {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);
    text-align: center;
    opacity: 1;
    transition: all .5s;
}
.cat_title_title2:hover{
    opacity: 0;
}
.cat_title_title2 .cat_title_avatar{
    object-fit: cover;
    animation: fadeInUp 0.5s .2s ease both;
    -webkit-animation: fadeInUp 0.5s .2s ease both;
    -moz-animation: fadeInUp 0.5s .2s ease both;
    animation-delay: 1s;
	
}
.cat_title_title2 .cat_title_avatar img{
    border-radius: 50%;
    width: 10rem;
    height: 10rem;
    margin-bottom: 2rem;
	box-shadow: 1px 1px 5px 3px #4b4b4b80;
}
.cat_title_title2 .cat_title_h1{
    animation: fadeInUp 0.5s .2s ease both;
    -webkit-animation: fadeInUp 0.5s .2s ease both;
    -moz-animation: fadeInUp 0.5s .2s ease both;
    animation-delay: 1.3s;
    letter-spacing: 0.3rem;
    margin-bottom: 1rem;
}
.cat_title_title2 .cat_title_info{
    animation: fadeInUp 0.5s .2s ease both;
    -webkit-animation: fadeInUp 0.5s .2s ease both;
    -moz-animation: fadeInUp 0.5s .2s ease both;
    animation-delay: 1.6s;
}
.cat_title_time {
    position: absolute;
    bottom: 1rem;
    right: 1rem;
    font-size: 1.5rem;
    text-shadow: var(--title-shadow);
    user-select: none;
    color: var(--color-white);
    filter: drop-shadow(4px 4px 4px var(--colorG));
}
.cat_title_time .item {
    transform: skew(-7deg) scale(1,0.9);
    text-align: right;
    padding: 0.25rem;
    animation:fadeInRight 1s .2s ease both;
    -webkit-animation:fadeInRight 1s .2s ease both;
    -moz-animation:fadeInRight 1s .2s ease both;
}
.cat_title_time .item:nth-child(1) {
    animation-delay: 1.3s;
}
.cat_title_time .item:nth-child(2) {
    animation-delay: 1.2s;
}
.cat_title_time .item:nth-child(3) {
    animation-delay: 1.1s;
}
.cat_title_time .item:nth-child(4) {
    animation-delay: 1.0s;
}
.cat_title_time .item:nth-child(5) {
    animation-delay: 0.9s;
}

.cat_title_time .item p {
    font-size:small;
    display: inline-block;
}
.cat_title_h1 {
    font-size: 2rem;
    line-height: 3rem;
    font-weight: 900;
    text-shadow: var(--title-shadow);
    transform: skew(-7deg) scale(1,0.9);
    color: var(--color-white);
    filter: drop-shadow(0 4px 12px rgb(10 20 40 / 35%));
    letter-spacing: 0.05em;
}
.cat_title_mengban span{
    border: 1px solid rgb(255 255 255 / 45%);
}
.cat_title_info {
    font-size: 1.2rem;
    padding-top: 1rem;
    line-height: 1.75rem;
    text-shadow: var(--title-shadow);
    transform: skew(-7deg) scale(1,0.9);
    color: var(--color-white);
    filter: drop-shadow(0 4px 12px rgb(10 20 40 / 35%));
}
.cat_title_block .cat_post_prevandnext .anniu i,
.cat_title_arrow_down i,
.cat_title_arrow_openmenu i,
.cat_title_arrow_post_up i,
.cat_title_arrow_post_down i,
.cat_title_arrow_map_up i,
.cat_title_arrow_map_down i{
    color:var(--color-white);
    filter: drop-shadow(4px 4px 4px var(--colorG));
}
.cat_title_arrow_down i{
    position: absolute;
    -webkit-animation: scroll_down 1.5s infinite;
    -moz-animation: scroll_down 1.5s infinite;
    animation: scroll_down 1.5s infinite;
}
.cat_title_arrow_down,
.cat_title_arrow_post_up,
.cat_title_arrow_post_down {
    position: absolute;
    bottom: 0;
    left: 50%;
    margin: 0;
    transform: translate(-50%, -20%);
}
.cat_title_arrow_down{
    bottom: 1.5rem;
}
.cat_title_arrow_map_up,
.cat_title_arrow_map_down{
    position: relative;
    bottom: 3rem;
    left: 50%;
    transform: translate(-50%, -20%);
}
.cat_title_arrow_openmenu {
    position: absolute;
    top: 0;
    left: 0;
    display: none;
}
.cat_style_thin_infohide {
    display:none;
}
.cat_title_title2 .cat_style_thin_infohide .cat_title_info {
    animation-delay: 0.5s;
}
.cat_title_info a {
    color: var(--color-white);
    margin: 0 0.5rem;
    display: inline;
}
.cat_title_footer {
    width: 100%;
    height: 3.2rem;
    position: fixed;
    background: var(--background);
    z-index: 4;
    box-shadow: var(--box-shadow);
    font-size: 1.2rem;
    border-top: var(--border);
    left: 50%;
    transform: translate(-50%, 0);
    display: none;
    backdrop-filter: blur(0.375rem);
    background: var(--surface);
}
.cat_title_footer_title {
    text-align: center;
    line-height: 3.2rem;
    width: calc(100% - 6rem);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    float: right;
    cursor: default;
    color: var(--main);
    text-shadow: var(--text-shadow);
    margin: 0 3rem;
}
.cat_title_footer_logo {
    display: none;
    position: fixed;
    left: 4rem;
    padding: 0.25rem;
    border-radius: var(--radius);
    top: 0.3rem;
    bottom: 0.3rem;
    color: var(--main);
    font-size: 1.3rem;
}
.cat_title_footer_mengban {
    position: fixed;
    display: none;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    z-index: 8;
    margin: auto;
    text-align: center;
    background-color: rgb(15 23 42 / 35%);
    backdrop-filter: blur(6px);
    transition: opacity .3s;
}
.cat_littlecard_title{
    color: var(--theme);
    font-size: 1.35rem;
    line-height: 2.5rem;
    cursor: default;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    position: relative;
    padding-bottom: 0.5rem;
}
.cat_littlecard_title::after {
    content: "";
    position: absolute;
    bottom: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 2.2rem;
    height: 3px;
    border-radius: 3px;
    background: linear-gradient(90deg, var(--theme), var(--theme-40));
}
.cat_title_arrow_left {
    margin-left:0.5rem;
    position: absolute;
    top: 50%;
    left: 0;
    transform: translate(0, -50%);
}
.cat_title_arrow_right {
    margin-right:0.5rem;
    position: absolute;
    top: 50%;
    left:auto;
    right: 0;
    transform: translate(0, -50%);
}
.cat_category_menu,
.cat_search_menu,
.cat_admin_menu,
.cat_music_menu,
#post_menu{
    display: none;
    position: fixed;
    background: var(--surface);
    box-shadow: var(--box-shadow);
    border: 1px solid var(--surface-border);
    border-radius: var(--radius-lg);
    padding: 1rem;
    top: 1.5vh;
    right: 5rem;
    overflow-x: hidden;
    overflow-y: auto;
    max-height: 80vh;
    z-index: 9;
    backdrop-filter: var(--blur);
    -webkit-backdrop-filter: var(--blur);
}
#post_menu {
    min-width:12.5rem;
}
.cat_admin_menu{
    top: auto;
    bottom: 1.5vh;
}
.cat_music_menu{
    left: 5rem;
    right: auto;
    top: auto;
    bottom: 1.5vh;
    width: 600px;
    max-width: calc(100vw - 10.5rem);
    padding-bottom: 0;
}
.cat_category_menu{
    min-width: 15rem;
    width: 16rem;
}
.cat_category_menu > li{
    list-style: none;
    display: block;
    color: var(--main);
    padding: 0;
    margin: 0.15rem 0;
}
.cat_category_menu > li > a {
    line-height: 1.4;
    display: flex;
    gap: 0.65rem;
    align-items: center;
    padding: 0.5rem 0.7rem;
    border-radius: 0.7rem;
    transition: background 0.2s, transform 0.2s;
}
.cat_category_menu > li > a:hover {
    background: var(--theme-10);
    transform: translateX(2px);
}
.cat_category_menu > li > a:hover .cat_icon_badge {
    background: var(--theme);
    color: #fff;
}
.cat_category_menu .cat_icon_badge {
    flex-shrink: 0;
    width: 1.9rem;
    height: 1.9rem;
    border-radius: 0.55rem;
    background: var(--theme-10);
    color: var(--theme);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1rem;
    transition: background 0.2s, color 0.2s;
}
.cat_category_menu .cat_icon_badge i {
    font-size: 1rem;
    vertical-align: middle;
}
.cat_category_menu .cat_cat_name {
    flex: 1;
    min-width: 0;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    font-size: 0.95rem;
}
.cat_category_menu .cat_cat_count {
    flex-shrink: 0;
    min-width: 1.4rem;
    height: 1.3rem;
    padding: 0 0.4rem;
    border-radius: 0.65rem;
    background: var(--colorB);
    color: var(--colorA);
    font-size: 0.72rem;
    line-height: 1.3rem;
    text-align: center;
    font-weight: 600;
}
.cat_category_menu > li > a:hover .cat_cat_count {
    background: var(--theme);
    color: #fff;
}
.cat_category_menu .cat_cat_toggle {
    flex-shrink: 0;
    color: var(--theme-60);
    font-size: 1.2rem;
    transition: transform 0.25s;
}
.cat_category_menu li.cat_cat_open > a .cat_cat_toggle {
    transform: rotate(90deg);
}
.cat_category_menu li ul {
    max-height: 0;
    overflow: hidden;
    margin: 0 0 0 1.55rem;
    padding: 0;
    border-left: 2px dashed var(--theme-20);
    transition: max-height 0.3s ease, margin 0.3s ease;
}
.cat_category_menu li.cat_cat_open > ul {
    max-height: 600px;
    margin: 0.3rem 0 0.35rem 1.55rem;
    padding-left: 0.75rem;
}
.cat_category_menu li ul li {
    list-style: none;
}
.cat_category_menu li ul li a {
    line-height: 1.4;
    display: flex;
    gap: 0.5rem;
    align-items: center;
    padding: 0.35rem 0.55rem;
    border-radius: 0.55rem;
    font-size: 0.9rem;
    transition: background 0.2s, color 0.2s;
}
.cat_category_menu li ul li a:hover {
    background: var(--theme-10);
    color: var(--theme);
}
.cat_category_menu li.cat_cat_active > a {
    color: var(--theme);
    font-weight: 600;
}
.cat_search_menu{
    width: 21rem;
    max-width: calc(100vw - 6rem);
}
.cat_search_menu li{
    list-style: none;
    display: block;
    color: var(--main);
    padding: 0;
}
.cat_search_menu li a {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.5rem 0.75rem;
    border-radius: 0.55rem;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    transition: background 0.2s, color 0.2s;
}
.cat_search_menu li a:hover {
    background: var(--theme-10);
    color: var(--theme);
}
.cat_search_menu li a:before {
    content: "\ecef";
    font-family: 'remixicon';
    color: var(--theme-60);
    font-size: 1.05rem;
    flex-shrink: 0;
}
.cat_search_menu li a:after {
    content: "\ea6c";
    font-family: 'remixicon';
    color: var(--theme-40);
    font-size: 1rem;
    margin-left: auto;
    flex-shrink: 0;
    transition: transform 0.2s, color 0.2s;
}
.cat_search_menu li a:hover:after {
    color: var(--theme);
    transform: translateX(3px);
}
.cat_search_menu #search {
    display: flex;
    align-items: center;
    gap: 0.4rem;
    margin: 1rem 0;
    background: var(--surface-strong);
    border: 1.5px solid var(--theme-20);
    border-radius: 0.9rem;
    padding: 0.3rem 0.3rem 0.3rem 0.85rem;
    transition: border-color 0.2s, box-shadow 0.2s;
}
.cat_search_menu #search:focus-within {
    border-color: var(--theme-60);
    box-shadow: 0 0 0 3px var(--theme-10);
}
.cat_search_menu .cat_search_icon {
    color: var(--theme-40);
    font-size: 1.15rem;
    flex-shrink: 0;
}
.cat_search_menu #search:focus-within .cat_search_icon {
    color: var(--theme);
}
.cat_search_menu #s {
    flex: 1;
    min-width: 0;
    padding: 0.45rem 0;
    margin: 0;
    width: auto;
    border: none;
    background: transparent;
    outline: none;
    font-size: 0.95rem;
}
.cat_search_menu .submit {
    color: #fff;
    font-size: 1.1rem;
    background: var(--theme);
    border: none;
    cursor: pointer;
    border-radius: 0.7rem;
    width: 2.3rem;
    height: 2.3rem;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    transition: background 0.2s, transform 0.2s;
}
.cat_search_menu .submit:hover {
    background: var(--theme-60);
    transform: translateX(2px);
}
.cat_search_menu .cat_history_box {
    margin-top: 0.5rem;
}
.cat_search_menu .cat_history_box ul {
    margin: 0.4rem 0 0;
    padding: 0;
}
.cat_album_out {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    overflow: hidden;
    border-radius: var(--radius);
}
.cat_album_out img {
    height: auto;
    aspect-ratio: 4 / 9;
    border-radius:0;
    box-shadow: -5px 0px 20px var(--main);
}
.cat_album_out_4parts {
    grid-template-columns: repeat(2, 1fr);
    grid-template-rows: repeat(2, 1fr);
}
.cat_album_out_4parts img {
    height: 10.5rem;
    aspect-ratio: unset;
}
.cat_album_title_out{
    display: grid;
    grid-template-columns: repeat(8, 1fr);
    overflow: hidden;
    border-radius: var(--radius);
    height: 100%;
}
.cat_album_title_out img{
    min-height: 100%;
    height: 100%;
    width: 125%;
    left: -1rem;
    object-fit: cover;
    border-radius: 0;
    transform: skew(-7deg);
}
/* 分页 */
.cat_pagination {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    padding-top: 15px;
}
.cat_pagination li {
    margin-left: 5px;
    text-shadow: var(--text-shadow);
}
.cat_pagination li.active a {
    background: var(--theme);
    color: #fff;
    font-weight: 600;
    box-shadow: 0 4px 14px -4px var(--theme-60);
}
.cat_pagination li a {
    display: flex;
    align-items: center;
    height: 2rem;
    color: var(--main);
    padding: 0 0.75rem;
    background: var(--surface);
    box-shadow: var(--box-shadow);
    border: 1px solid var(--surface-border);
    border-radius: var(--radius-pill);
    transition: background .35s,color .35s, transform 0.2s var(--ease-out);
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}
.cat_pagination li a:hover{
    background: var(--theme-10);
    color: var(--theme);
    transform: translateY(-2px);
}
.cat_pagination li.active a:hover{
    background: var(--theme-80)!important;
    transform: none;
}
.cat_keyword {
    color: var(--theme);
    display: inline;
    text-shadow: 1px 1px 8px var(--theme);
}
.cat_404_title {
    font-size: 10rem;
    color: var(--theme);
    background: var(--background);
    border-radius: var(--radius);
    padding: 0 2rem;
    z-index: 5;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}
.cat_index_diary{
    text-indent: 2em;
    color: var(--main);
    margin: 1rem;
    line-height: 2rem;
    letter-spacing: 0.02em;
    display: -webkit-box;
    overflow: hidden;
    text-overflow: ellipsis;
    -webkit-line-clamp: 6;
    -webkit-box-orient: vertical;
}
.OwO {
    position: initial;
}
.OwO .OwO-logo,
.cat_comment_button {
    border-radius: 5px!important;
    background-color: unset;
    user-select: none;
    border: none;
    color: var(--main)!important;
    font-size: 1.2rem;
    cursor: pointer;
    line-height: 1.5rem;
    padding: 0.1rem;
}
.OwO .OwO-logo i,
.cat_comment_button i{
    margin: 0 0.5rem;
}
.cat_comment_button i:hover{
    display: inline-block;
    -webkit-animation: a 5s infinite ease-in-out;
    animation: a 5s infinite ease-in-out;
}
.OwO.OwO-up .OwO-body {
    left:0;
    width: 100%;
    bottom: 3rem;
    border-radius: var(--radius);
    padding: 10px 10px 0;
    display: none;
    border: none;
    background: var(--background);
}
.OwO .OwO-body .OwO-bar {
    background: var(--background);
}
.OwO .OwO-body .OwO-items .OwO-item {
    background: unset;
}
.OwO_2 .OwO-body .OwO-items .OwO-item{
    max-width: 17.5%;
    min-width: 8rem;
}
.owo_image {
    max-height: 1.5rem;
    vertical-align: sub;
    padding: 0 0.2rem;
    transition: max-height 0.5s ease-in-out;
}
.owo_image_2 {
    max-height: none;
    max-width: 100%;
    margin: auto;
    display: block;
}
.owo_image:hover {
    max-height: 6.25rem;
}
.owo_image_2:hover {
    max-height: none;
}
.OwO-packages li {
    color: var(--colorF);
}
cat_article_bili iframe {
    width: 100%;
    margin: 2rem auto;
    aspect-ratio: 16 / 9;
    height: auto;
    max-width: 888.88px;
    display: block;
    border-radius: var(--radius);
}
#cat_comment cat_article_bili iframe {
    margin: 0 auto;
}
.cat_archive_hide_one {
    display: none;
}
.cat_conertitle_img {
    float: left; 
    margin: 0 1rem 0 0;
}
.cat_conertitle_img .box_img{
    height: 12.5rem;
    width: auto;
}
.cat_covertitle {
    min-width: 150px;
    height: 2rem;
    color: var(--main);
    text-indent: 0;
    line-height: 1.75rem;
    overflow: hidden;
    padding: 0 1rem;
    font-size: 0.9rem;
}
.cat_covertitle_desc {
    color: var(--main);
    text-indent: 0;
    line-height: 1.75rem;
    padding: 0 1rem;
    font-size: 0.9rem;
    color: var(--main);
    overflow: hidden;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
    height: auto;
}
.cat_diary_start{
    display: grid;
    grid-template-columns: 40% calc(60% - var(--margin));
    grid-gap: var(--margin);
}
.cat_diary_start .friends_block{
    position: sticky;
    top: var(--margin);
    height: calc(100vh - 7rem);
    padding: 0;
}
.cat_tourmap {
    width: 100%;
    height: 100%;
    background: var(--background);
    border-radius: var(--radius);
}
#tourmap,#tourmap_post,
#tourmap_dark,#tourmap_post_dark{
    border-radius: var(--radius);
    width: 100%;
    height: 100%;
    cursor: grab!important;
}
.cat_title_map_add {
    position: sticky;
    top: var(--margin);
    padding: 0;
    z-index: 5;
}
.amap-ctrl-overlay-layer,.amap-logo,.amap-copyright {
    display: none!important;
}
.PWAhidden {
    display: none;
}
.onlinetime {
    position: absolute;
    bottom: -0.25rem;
    border-radius: 50%;
    width: 0.75rem;
    height: 0.75rem;
    right: -0.3rem;
    border: 0.2rem solid var(--background-color);
}
.onlinetime_recent {
    position: relative;
    top: 2.5rem;
    border-radius: 50%;
    width: 0.75rem;
    height: 0.75rem;
    right: 1.05rem;
    border: 0.2rem solid var(--background-color);
}
/*userpage start*/
.cat_userpage_userinfo {
    top: auto;
    bottom: 0;
    left: 0;
    right: 0;
    font-size: 1rem;
    line-height: 2rem;
    position: absolute;
    color: var(--color-white);
    z-index: 1;
    text-shadow: 2px 2px 10px var(--colorG);
    padding: 2rem;
}
.cat_userpage_replytitle {
    background: var(--background);
    border-radius: var(--radius);
    padding: 1rem var(--margin);
    font-size: 1.2rem;
    text-align: center;
    color: var(--main);
    border: var(--border);
}
.user_loginout {
    background: var(--color-red);
    margin-top: var(--margin);
    cursor: pointer;
    color: var(--color-white);
}
.cat_userpage_replyli {
    background: var(--background);
    border: var(--border);
    border-radius: var(--radius);
    padding: var(--margin);
    margin-top: var(--margin);
    position: relative;
}
.cat_userpage_name {
    color: var(--main);
    text-shadow: var(--text-shadow);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    margin: 0 0 0.3rem 0;
}
.cat_userpage_text {
    margin: 0.5rem 0;
    padding: 0.5rem;
    color: var(--main);
    word-break: break-all;
    line-height: 2rem;
    border-radius: var(--radius);
    background: var(--theme-10);
    width: 100%;
}
.cat_userpage_time time{
    display: flex;
    font-size: 0.5rem;
    color: var(--colorE);
    margin-left: 0.5rem;
}
.cat_userpage_avatar {
    display: block;
    width: 3rem;
    height: 3rem;
    border-radius: 50%;
    box-shadow: var(--box-shadow);
    -o-object-fit: cover;
    object-fit: cover;
}
/*userpage end*/

.unlink_top {
    margin-top:var(--margin);
    display: none;
}
[class^="ri-"], [class*=" ri-"] {
    vertical-align: middle;
}
.anniu [class^="ri-"], [class*=" ri-"] {
    vertical-align: bottom;
    width: 2rem;
    text-align: center;
}


.cat_title_logoimage {
    position: absolute;
    font-size: 10rem;
    right: 1rem;
    bottom: 0;
    opacity: 0.1;
}

.cat_tanchuang_out {
    display: none;
    position: fixed;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    z-index: 10;
    margin: auto;
    text-align: center;
    background-color: rgba(0,0,0,.4);
    transition: opacity .3s;
}
.cat_tanchuang {
    background: var(--surface-strong);
    backdrop-filter: var(--blur);
    -webkit-backdrop-filter: var(--blur);
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    padding: 1.25rem 1.5rem;
    box-shadow: 0 24px 60px -16px rgb(15 23 42 / 30%);
    border: 1px solid var(--surface-border);
    border-radius: var(--radius-lg);
    display: inline;
    width: 300px;
    max-width: 90%;
}
.cat_tanchuang .title{
    font-size: 1.2rem;
    font-weight: bold;
    margin-bottom: 0.5rem;
    color: var(--main);
}
.cat_tanchuang button,
.cat_tanchuang #user_login_botton{
    display: inline-block;
    margin: 0.5rem;
    border-radius: var(--radius-pill);
    padding: 0.5rem 1rem;
    border: none;
    background: var(--theme);
    color: #fff;
    font-size: 0.875rem;
    cursor: pointer;
    transition: background 0.2s, transform 0.15s var(--ease-out);
}
.cat_tanchuang button:hover,
.cat_tanchuang #user_login_botton:hover {
    background: var(--theme-80);
}
.cat_tanchuang button:active,
.cat_tanchuang #user_login_botton:active {
    transform: scale(0.95);
}
.cat_tanchuang input{
    padding: 0.25rem 1rem;
    line-height: 1.5rem;
    margin: 0.5rem;
}
.cat_tanchuang .changeicon_user,
.cat_tanchuang .changeicon_admin{
    font-size: 1.5rem;
    color: var(--theme-60);
    position: absolute;
    top: 1rem;
    cursor: pointer;
}

/* 图标 echarts */
.echarts_normal {
  position: relative;
  height: 15.5rem;
  overflow: hidden;
}
/* 统计页：cat_index_start 是 flex-wrap 容器，强制各区块独占一行，防止分节标题与卡片并排串位 */
.cat_stat_page > * {
    flex: 0 0 100%;
    min-width: 0;
}
/* 统计页分节标题 */
.cat_stat_sec {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin: 0;
    font-size: 1.15rem;
    font-weight: 600;
    color: var(--main);
}
.cat_stat_sec i {
    font-size: 1.3rem;
    color: var(--theme);
}
.cat_stat_sec::after {
    content: "";
    flex: 1 1 auto;
    height: 1px;
    background: linear-gradient(90deg, var(--theme-30), transparent 80%);
}
/* 统计页访客卡 */
.cat_stat_visitor {
    padding: 0.9rem 1rem;
}
.cat_stat_visitor_row {
    display: flex;
    align-items: center;
}
.cat_stat_visitor_info {
    flex: 1 1 auto;
    min-width: 0;
    margin: 0 0.9rem;
    list-style: none;
}
.cat_stat_rank {
    display: inline-block;
    min-width: 1.4rem;
    margin-right: 0.45rem;
    font-size: 0.78rem;
    font-weight: 700;
    line-height: 1.4rem;
    text-align: center;
    color: var(--theme);
    background: var(--theme-10);
    border-radius: var(--radius-pill);
    vertical-align: 0.1rem;
}
.echarts_avatar {
    vertical-align: middle;
    border-radius: 50%;
    box-shadow: var(--box-shadow);
    width: 3rem;
    height: 3rem;
}
.echarts_name {
    max-width: 9rem;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.echarts_tags .animeinfo{
    font-size: 0.75rem;
    padding: 0.15rem 0;
    line-height: 1.3;
}
.echarts_num{
    color: var(--colorE);
    font-size: 0.75rem;
}
.cat_guidang_years {
    overflow-x: auto;
    white-space: nowrap;
    width: 100%;
}
.cat_life_card_github{
    position: relative;
    padding: 1rem;
    color: var(--main);
    box-shadow: var(--box-shadow);
    background: var(--background);
    border: var(--border);
    border-radius: var(--radius);
    width: calc((100% - var(--gap)) / 2);
    aspect-ratio: 1.68;
}
.cat_life_card_github .title{
    text-shadow: var(--text-shadow);
    font-weight: bold;
    display: inline-block;
    white-space: nowrap;
    width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
}
.cat_life_card_github .cat_indexcard_time_2line{
    max-width: calc(100% - 2rem);
    color: var(--main);
    bottom: 1rem;
    position: absolute;
    left: auto;
}
.cat_free_a a{
    margin:0!important;
    color:var(--main)!important;
}
.cat_free_a a:before{
    width: 0!important;
}
.cat_free_a a:after{
    content:""!important;
}
.cat_echarts_china_map {
    width:100%;
}

.cat_post_correlation{
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    -webkit-column-gap: var(--margin);
}
.cat_welove{
    text-align: center;
}
.cat_welove i{
    color: #f56c6c;
    position: relative;
    font-size: 2rem;
    animation: heartbeat 1.33s ease-in-out infinite;
    display: inline-block;
    bottom: 2rem;
}
.cat_welove img{
    margin: 1rem 0.5rem 0.5rem;
}
.cat_welove .cat_welove_info{
    display: inline-block;
    width: calc(50% - 2rem);
}
.cat_welove_name{
    -webkit-line-clamp: 1;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-box-orient: vertical;
}
.cat_index_correlation p{
    line-height: 1.75rem;
    text-align: center;
    font-size: 1rem;
}
.chouqian{
    cursor: pointer;
    display: inline-block;
    margin-top: 0.4rem;
    padding: 0.1rem 0.8rem;
    border: 1px dashed var(--theme-40);
    border-radius: var(--radius-pill);
    color: var(--theme);
    font-size: 0.85rem;
    transition: color 0.2s, background 0.2s, transform 0.2s var(--ease-out);
}
.chouqian:hover{
    color: var(--theme);
    background: var(--theme-10);
    transform: translateY(-1px);
}
.chouqianed {
    display: none;    
    color: var(--theme);
    font-size: 1.5rem;
    font-weight: bold;
}
.swiper-wrapper {
    height: auto;
}
.swiper-pagination-bullets.swiper-pagination-horizontal {
	bottom:unset;
	left:unset;
	width:auto;
	right:10px;
	top:10px;
}
.swiper-pagination-bullet-active{
    background: var(--theme);
}
.swiper {
    --swiper-navigation-size:0;
    width: 100%;
    border-radius: var(--radius);
    z-index: -1;
}
.swiper img:not[owo_image]{
    min-height: 100%;
    height: 100%;
    width: 100%;
    object-fit: cover;
}

.index_status{
    text-align: center;
    margin: 1rem 1rem 0.5rem;
    text-shadow: none;
    font-size: 0.9rem;
    color: var(--colorF);
    letter-spacing: 0.02em;
}

.cat_reply_media{
    color: var(--theme-80);
    font-size: 0.8rem;
    border: 1px solid var(--theme);
    border-radius: var(--radius);
    padding: 0.1rem;
}
.zhuanti_title_img {
    display: none;
}





.muyu {
        width: 100%;
  position: absolute;
  margin: auto 0;
  display: flex;
  bottom: 0;
  top: 0;
  justify-content: center;
  align-items: center;
  flex-direction: column;
}
.muyu > img {
  user-select: none;
  transition: all 0.3s;
}
.muyu .gongde {
  position: relative;
  color: #fff;
  height: 10px;
}
.muyu .gongde-item {
  position: absolute;
  left: -50vw;
  width: 100vw;
  font-size: 18px;
  font-weight: 600;
  text-align: center;
  transform: translateY(0px);
  animation: move 2s;
}
@keyframes move {
  0% {
    transform: translateY(0px);
    opacity: 1;
  }
  100% {
    transform: translateY(-100px);
    opacity: 0;
  }
}
.muyu .clickDown {
  transform: scale(0.9);
}

/* 首页瀑布卡内的图片：悬浮轻微放大 */
.friends_block .box_img img,
.friends_block img.box_img {
    transition: transform 0.6s var(--ease-out);
}
.friends_block:hover .box_img img,
.friends_block:hover img.box_img {
    transform: scale(1.03);
}

/* 侧边弹出菜单细节 */
.cat_search_menu,
.cat_category_menu,
.cat_admin_menu,
.cat_music_menu,
#post_menu {
    background: var(--surface-strong);
    border-radius: var(--radius-xl);
    box-shadow: var(--box-shadow-hover);
    animation: rd-pop 0.28s var(--ease-spring);
}
#post_menu .post_menu_item {
    border-radius: 0.7rem;
    transition: background 0.2s, color 0.2s, padding 0.2s;
}
#post_menu .post_menu_item:hover {
    background: var(--theme-10);
    color: var(--theme);
    padding-left: 0.75rem;
}
.cat_search_menu #s {
    border: none;
    width: auto;
}
.cat_search_menu li {
    border-bottom: none;
}

/* OwO 表情面板 */
.OwO.OwO-up .OwO-body {
    border-radius: var(--radius-lg);
    box-shadow: var(--box-shadow-hover);
    background: var(--surface-strong);
    backdrop-filter: var(--blur);
    -webkit-backdrop-filter: var(--blur);
}

/* 深色模式：玻璃表面边框统一 */
.Paint_Sunset header,
.Paint_Sunset footer,
.Paint_Sunset article,
.Paint_Sunset .friends_block,
.Paint_Sunset .user_webinfo,
.Paint_Sunset .cat_search_menu,
.Paint_Sunset .cat_category_menu,
.Paint_Sunset .cat_admin_menu,
.Paint_Sunset .cat_music_menu,
.Paint_Sunset #post_menu,
.Paint_Sunset .cat_tanchuang,
.Paint_Sunset #cat_comment > ol > li {
    border-color: var(--surface-border);
}
.Paint_Sunset .cat_title_mengban {
    background: linear-gradient(180deg, rgb(0 0 0 / 30%) 0%, rgb(0 0 0 / 12%) 40%, rgb(0 0 0 / 62%) 100%);
}
.Paint_Sunset input,
.Paint_Sunset textarea,
.Paint_Sunset select {
    background: var(--colorA);
}

/* 阅读进度条（由 redesign.js 驱动） */
#rd-progress {
    position: fixed;
    top: 0;
    left: 0;
    height: 3px;
    width: 0;
    z-index: 99;
    background: linear-gradient(90deg, var(--theme), var(--theme-80));
    border-radius: 0 3px 3px 0;
    box-shadow: 0 0 12px var(--theme-60);
    opacity: 0;
    transition: opacity 0.3s;
    pointer-events: none;
}
#rd-progress.rd-visible {
    opacity: 1;
}

/* 进场动画 · Reveal（由 redesign.js 驱动） */
html.rd-js .rd-reveal {
    opacity: 0;
    transform: translateY(22px);
    transition:
        opacity 0.7s var(--ease-out),
        transform 0.7s var(--ease-out);
    transition-delay: var(--rd-delay, 0ms);
    will-change: opacity, transform;
}
html.rd-js .rd-reveal.rd-in {
    opacity: 1;
    transform: none;
}
/* 首屏 Hero 沿用主题自带动画，不参与 reveal */
html.rd-js .cat_title_header .cat_title_block.rd-reveal {
    opacity: 1;
    transform: none;
    transition: none;
}

@keyframes rd-float {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(-3px); }
}
@keyframes rd-pop {
    from { opacity: 0; transform: translateY(8px) scale(0.98); }
    to { opacity: 1; transform: none; }
}

/* 动效可达性 · Reduced Motion */
@media (prefers-reduced-motion: reduce) {
    *,
    *::before,
    *::after {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
    }
    html.rd-js .rd-reveal {
        opacity: 1;
        transform: none;
    }
}






html.Paint_Sunset{
    --background-color: #942e3f;
    --main-color: 232 243 255;
    --under-background: linear-gradient(to bottom,#dd5858 0%,#a1258c 87%);
    --background-white-num: 32 53 104;
    --background: rgb(148 46 63 / 80%);
    --box-shadow: unset;
}

.Paint_Sunset .sunset_mode{position:fixed;z-index:-1;inset:0}
.Paint_Sunset .sunset_mode *{position:absolute}
.Paint_Sunset .sunset_mode *:before,.Paint_Sunset .sunset_mode *:after{content:"";position:absolute}
@keyframes fade {
  0% { opacity: 0.3; }
  50% { opacity: 1; }
  100% { opacity: 0.3; }
}
.Paint_Sunset .sunset_mode .sun,
.Paint_Sunset .sunset_mode .main-sun-reflexion{
  animation: fade 3s infinite;
}
.Paint_Sunset .sunset_mode .top{width:100vw;background:#e74d5c;background:-webkit-gradient(left top,left bottom,color-stop(0%,#e74d5c),color-stop(100%,#f3774d));background:linear-gradient(to bottom,#e74d5c 0%,#f3774d 100%);filter:progid:DXImageTransform.Microsoft.gradient( startColorstr="#e74d5c",endColorstr="#f3774d",GradientType=0 );height:50vh;top:0;left:0;z-index:1}
.Paint_Sunset .sunset_mode .bottom{width:100vw;background-color:#7e0e68;height:51vh;bottom:0;z-index:2;overflow:hidden}
.Paint_Sunset .sunset_mode .stars{top:0;left:0;right:0;margin:auto;height:100%;z-index:-1}
.Paint_Sunset .sunset_mode .stars > *{border-radius:50px;background-color:#fca054;-webkit-animation:twinkle 5s infinite;animation:twinkle 5s infinite;transition-timing-function:ease-in-out}
.Paint_Sunset .sunset_mode .stars .star:nth-of-type(1){top:240px;left:21vw;width:1px;height:1px;-webkit-animation-delay:4s;animation-delay:4s}
.Paint_Sunset .sunset_mode .stars .star:nth-of-type(2){top:214px;left:84vw;width:2px;height:2px;-webkit-animation-delay:4s;animation-delay:4s}
.Paint_Sunset .sunset_mode .stars .star:nth-of-type(3){top:368px;left:74vw;width:1px;height:1px;-webkit-animation-delay:5s;animation-delay:5s}
.Paint_Sunset .sunset_mode .stars .star:nth-of-type(4){top:21px;left:40vw;width:5px;height:5px;-webkit-animation-delay:1s;animation-delay:1s}
.Paint_Sunset .sunset_mode .stars .star:nth-of-type(5){top:215px;left:2vw;width:2px;height:2px;-webkit-animation-delay:4s;animation-delay:4s}
.Paint_Sunset .sunset_mode .stars .star:nth-of-type(6){top:271px;left:22vw;width:3px;height:3px;-webkit-animation-delay:2s;animation-delay:2s}
.Paint_Sunset .sunset_mode .stars .star:nth-of-type(7){top:116px;left:73vw;width:5px;height:5px;-webkit-animation-delay:3s;animation-delay:3s}
.Paint_Sunset .sunset_mode .stars .star:nth-of-type(8){top:23px;left:32vw;width:5px;height:5px;-webkit-animation-delay:2s;animation-delay:2s}
.Paint_Sunset .sunset_mode .stars .star:nth-of-type(9){top:383px;left:6vw;width:4px;height:4px;-webkit-animation-delay:2s;animation-delay:2s}
.Paint_Sunset .sunset_mode .stars .star:nth-of-type(10){top:400px;left:93vw;width:5px;height:5px;-webkit-animation-delay:1s;animation-delay:1s}
.Paint_Sunset .sunset_mode .stars .star:nth-of-type(11){top:376px;left:1vw;width:2px;height:2px;-webkit-animation-delay:1s;animation-delay:1s}
.Paint_Sunset .sunset_mode .stars .star:nth-of-type(12){top:80px;left:62vw;width:3px;height:3px;-webkit-animation-delay:5s;animation-delay:5s}
.Paint_Sunset .sunset_mode .stars .star:nth-of-type(13){top:203px;left:27vw;width:6px;height:6px;-webkit-animation-delay:3s;animation-delay:3s}
.Paint_Sunset .sunset_mode .stars .star:nth-of-type(14){top:2px;left:68vw;width:2px;height:2px;-webkit-animation-delay:3s;animation-delay:3s}
.Paint_Sunset .sunset_mode .stars .star:nth-of-type(15){top:314px;left:40vw;width:3px;height:3px;-webkit-animation-delay:4s;animation-delay:4s}
.Paint_Sunset .sunset_mode .stars .star:nth-of-type(16){top:85px;left:6vw;width:3px;height:3px;-webkit-animation-delay:3s;animation-delay:3s}
.Paint_Sunset .sunset_mode .stars .star:nth-of-type(17){top:258px;left:8vw;width:5px;height:5px;-webkit-animation-delay:3s;animation-delay:3s}
.Paint_Sunset .sunset_mode .stars .star:nth-of-type(18){top:292px;left:71vw;width:5px;height:5px;-webkit-animation-delay:4s;animation-delay:4s}
.Paint_Sunset .sunset_mode .stars .star:nth-of-type(19){top:236px;left:40vw;width:1px;height:1px;-webkit-animation-delay:5s;animation-delay:5s}
.Paint_Sunset .sunset_mode .stars .star:nth-of-type(20){top:220px;left:100vw;width:6px;height:6px;-webkit-animation-delay:2s;animation-delay:2s}
.Paint_Sunset .sunset_mode .stars .star:nth-of-type(21){top:353px;left:94vw;width:1px;height:1px;-webkit-animation-delay:5s;animation-delay:5s}
.Paint_Sunset .sunset_mode .stars .star:nth-of-type(22){top:180px;left:5vw;width:5px;height:5px;-webkit-animation-delay:2s;animation-delay:2s}
.Paint_Sunset .sunset_mode .stars .star:nth-of-type(23){top:55px;left:82vw;width:6px;height:6px;-webkit-animation-delay:5s;animation-delay:5s}
.Paint_Sunset .sunset_mode .stars .star:nth-of-type(24){top:13px;left:34vw;width:5px;height:5px;-webkit-animation-delay:1s;animation-delay:1s}
.Paint_Sunset .sunset_mode .stars .star:nth-of-type(25){top:311px;left:34vw;width:5px;height:5px;-webkit-animation-delay:2s;animation-delay:2s}
.Paint_Sunset .sunset_mode .stars .star:nth-of-type(26){top:216px;left:12vw;width:3px;height:3px;-webkit-animation-delay:3s;animation-delay:3s}
.Paint_Sunset .sunset_mode .stars .star:nth-of-type(27){top:40px;left:97vw;width:3px;height:3px;-webkit-animation-delay:4s;animation-delay:4s}
.Paint_Sunset .sunset_mode .stars .star:nth-of-type(28){top:223px;left:2vw;width:5px;height:5px;-webkit-animation-delay:1s;animation-delay:1s}
.Paint_Sunset .sunset_mode .stars .star:nth-of-type(29){top:367px;left:77vw;width:3px;height:3px;-webkit-animation-delay:2s;animation-delay:2s}
.Paint_Sunset .sunset_mode .stars .star:nth-of-type(30){top:354px;left:72vw;width:3px;height:3px;-webkit-animation-delay:3s;animation-delay:3s}
.Paint_Sunset .sunset_mode .stars .star:nth-of-type(31){top:354px;left:50vw;width:5px;height:5px;-webkit-animation-delay:5s;animation-delay:5s}
.Paint_Sunset .sunset_mode .stars .star:nth-of-type(32){top:382px;left:95vw;width:3px;height:3px;-webkit-animation-delay:2s;animation-delay:2s}
.Paint_Sunset .sunset_mode .stars .star:nth-of-type(33){top:347px;left:15vw;width:6px;height:6px;-webkit-animation-delay:1s;animation-delay:1s}
.Paint_Sunset .sunset_mode .stars .star:nth-of-type(34){top:86px;left:36vw;width:2px;height:2px;-webkit-animation-delay:2s;animation-delay:2s}
.Paint_Sunset .sunset_mode .stars .star:nth-of-type(35){top:39px;left:98vw;width:6px;height:6px;-webkit-animation-delay:4s;animation-delay:4s}
.Paint_Sunset .sunset_mode .stars .star:nth-of-type(36){top:269px;left:20vw;width:6px;height:6px;-webkit-animation-delay:3s;animation-delay:3s}
.Paint_Sunset .sunset_mode .stars .star:nth-of-type(37){top:343px;left:35vw;width:1px;height:1px;-webkit-animation-delay:5s;animation-delay:5s}
.Paint_Sunset .sunset_mode .stars .star:nth-of-type(38){top:209px;left:52vw;width:6px;height:6px;-webkit-animation-delay:4s;animation-delay:4s}
.Paint_Sunset .sunset_mode .stars .star:nth-of-type(39){top:249px;left:33vw;width:2px;height:2px;-webkit-animation-delay:1s;animation-delay:1s}
.Paint_Sunset .sunset_mode .stars .star:nth-of-type(40){top:96px;left:48vw;width:3px;height:3px;-webkit-animation-delay:2s;animation-delay:2s}
@-webkit-keyframes twinkle{0%{opacity:1}
50%{opacity:0.3}
100%{opacity:1}
}@keyframes twinkle{0%{opacity:1}
50%{opacity:0.3}
100%{opacity:1}
}.Paint_Sunset .sunset_mode .shooting-star{background-color:#ffb058;background:linear-gradient(to right,#ffb058 0%,transparent 100%);width:100px;height:10px;border-radius:200px;right:15%;top:15%;-webkit-animation:shooting-star 8s infinite;animation:shooting-star 8s infinite}
@-webkit-keyframes shooting-star{0%{transform:translate(0,0) rotate(-30deg) scale(0.8);opacity:1}
25%{transform:translate(-50px,50px) rotate(-30deg) scale(0.8);opacity:0}
100%{transform:translate(0,0) rotate(-30deg) scale(0.8);opacity:0}
}@keyframes shooting-star{0%{transform:translate(0,0) rotate(-30deg) scale(0.8);opacity:1}
25%{transform:translate(-50px,50px) rotate(-30deg) scale(0.8);opacity:0}
100%{transform:translate(0,0) rotate(-30deg) scale(0.8);opacity:0}
}.Paint_Sunset .sunset_mode .sun{width:220px;height:220px;left:0;right:0;margin:auto;bottom:-70px;background-color:#ffb058;border-radius:50%}
.Paint_Sunset .sunset_mode .sun-glow-1{background-color:rgba(255,176,88,0.3);height:300px;width:300px;border-radius:50%;top:-40px;left:-40px;z-index:2}
.Paint_Sunset .sunset_mode .sun-glow-2{background-color:rgba(255,176,88,0.2);height:380px;width:380px;border-radius:50%;top:-80px;left:-80px;z-index:1}
.Paint_Sunset .sunset_mode .sun-glow-3{background-color:rgba(255,176,88,0.1);height:460px;width:460px;border-radius:50%;top:-120px;left:-120px;z-index:-1}
.Paint_Sunset .sunset_mode .pyramid{-webkit-clip-path:polygon(50% 0,0% 100%,100% 100%);clip-path:polygon(50% 0,0% 100%,100% 100%);background:#e74d5c;background:linear-gradient(to bottom,#e54c5b 0%,#f3784d 100%)}
.Paint_Sunset .sunset_mode .pyramids{width:100%;height:100%;bottom:-1%;z-index:2;opacity:0.7}
.Paint_Sunset .sunset_mode .pyramid:nth-of-type(1){bottom:0;height:160px;width:350px;left:-5%}
.Paint_Sunset .sunset_mode .pyramid:nth-of-type(2){bottom:0;height:125px;width:210px;left:17%}
.Paint_Sunset .sunset_mode .pyramid:nth-of-type(3){bottom:0;height:130px;width:350px;right:-5%}
.Paint_Sunset .sunset_mode .pyramid:nth-of-type(4){bottom:0;height:95px;width:210px;right:16%}
.Paint_Sunset .sunset_mode .clouds{width:100%;height:100%;-webkit-animation:clouds 180s infinite linear;animation:clouds 180s infinite linear}
.Paint_Sunset .sunset_mode .clouds *,.Paint_Sunset .sunset_mode .clouds *:after,.Paint_Sunset .sunset_mode .clouds *:before{border-radius:50px}
.Paint_Sunset .sunset_mode .cloud{background-color:rgba(255,255,255,0.3);width:75px;height:15px;border-radius:50px;z-index:99}
.Paint_Sunset .sunset_mode .cloud:nth-of-type(1){top:25%;left:10%}
.Paint_Sunset .sunset_mode .cloud:nth-of-type(1):after{background-color:rgba(255,255,255,0.3);top:150%;left:10%;width:40%;height:100%}
.Paint_Sunset .sunset_mode .cloud:nth-of-type(2){top:8%;left:50%;background-color:rgba(255,255,255,0.2)}
.Paint_Sunset .sunset_mode .cloud:nth-of-type(2):after{background-color:rgba(255,255,255,0.2);top:0%;left:-40%;width:25%;height:100%}
.Paint_Sunset .sunset_mode .cloud:nth-of-type(2):before{background-color:rgba(255,255,255,0.2);top:175%;left:-15%;width:75%;height:100%}
.Paint_Sunset .sunset_mode .cloud:nth-of-type(3){right:10%;top:40%;width:50px;background-color:rgba(255,255,255,0.3)}
.Paint_Sunset .sunset_mode .cloud:nth-of-type(3):after{background-color:rgba(255,255,255,0.3);top:0%;right:-50%;width:30%;height:100%}
@-webkit-keyframes clouds{0%{transform:translatex(0%)}
100%{transform:translateX(100%)}
}@keyframes clouds{0%{transform:translatex(0%)}
100%{transform:translateX(100%)}
}.Paint_Sunset .sunset_mode .bottom{background:linear-gradient(to top,#7e0e68 0%,#7e0e68 15%,#951f66 15%,#951f66 29%,#a52c60 29%,#a52c60 43%,#ba3b5e 43%,#ba3b5e 57%,#cf4c5e 57%,#cf4c5e 71%,#dd5556 71%,#dd5556 85%,#e75d54 85%,#e75d54 100%)}
.Paint_Sunset .sunset_mode .main-sun-reflexion{top:0;left:0;right:0;margin:auto;height:100%;z-index:2}
.Paint_Sunset .sunset_mode .main-sun-reflexion > *{border-radius:50px;height:5%;top:0;left:0;right:0;margin:auto}
.Paint_Sunset .sunset_mode .main-sun-reflexion .reflexion-shape:nth-of-type(1){background-color:#fca054;width:35%}
.Paint_Sunset .sunset_mode .main-sun-reflexion .reflexion-shape:nth-of-type(2){background-color:#fca054;width:10%;top:5%}
.Paint_Sunset .sunset_mode .main-sun-reflexion .reflexion-shape:nth-of-type(3){background-color:#e75d54;width:30%;top:5%;left:30%}
.Paint_Sunset .sunset_mode .main-sun-reflexion .reflexion-shape:nth-of-type(4){background-color:#e75d54;width:10%;top:5%;left:-13%}
.Paint_Sunset .sunset_mode .main-sun-reflexion .reflexion-shape:nth-of-type(5){background-color:#fca054;width:40%;top:10%}
.Paint_Sunset .sunset_mode .main-sun-reflexion .reflexion-shape:nth-of-type(6){background-color:#fca054;width:15%;top:15%}
.Paint_Sunset .sunset_mode .main-sun-reflexion .reflexion-shape:nth-of-type(7){background-color:#dd5556;width:5%;top:15%;z-index:2}
.Paint_Sunset .sunset_mode .main-sun-reflexion .reflexion-shape:nth-of-type(8){background-color:#dd5556;width:10%;top:15%;left:-20%}
.Paint_Sunset .sunset_mode .main-sun-reflexion .reflexion-shape:nth-of-type(9){background-color:#dd5556;width:10%;top:15%;left:20%}
.Paint_Sunset .sunset_mode .main-sun-reflexion .reflexion-shape:nth-of-type(10){background-color:#fca054;width:20%;top:20%}
.Paint_Sunset .sunset_mode .main-sun-reflexion .reflexion-shape:nth-of-type(11){background-color:#fca054;width:7%;top:20%;left:30%}
.Paint_Sunset .sunset_mode .main-sun-reflexion .reflexion-shape:nth-of-type(12){background-color:#fca054;width:7%;top:24%}
.Paint_Sunset .sunset_mode .main-sun-reflexion .reflexion-shape:nth-of-type(13){background-color:#dd5556;width:7%;top:25%;height:4%;left:-10%}
.Paint_Sunset .sunset_mode .main-sun-reflexion .reflexion-shape:nth-of-type(14){background-color:#dd5556;width:7%;top:25%;height:4%;left:10%}
.Paint_Sunset .sunset_mode .main-sun-reflexion .reflexion-shape:nth-of-type(15){background-color:#fca054;width:9%;top:29%}
.Paint_Sunset .sunset_mode .main-sun-reflexion .reflexion-shape:nth-of-type(16){background-color:#fca054;width:7%;top:34%}
.Paint_Sunset .sunset_mode .main-sun-reflexion .reflexion-shape:nth-of-type(17){background-color:#cf4c5e;width:7%;top:34%;left:-9%}
.Paint_Sunset .sunset_mode .main-sun-reflexion .reflexion-shape:nth-of-type(18){background-color:#cf4c5e;width:7%;top:34%;left:9%}
.Paint_Sunset .sunset_mode .main-sun-reflexion .reflexion-shape:nth-of-type(19){background-color:#fca054;width:7%;top:39%}
.Paint_Sunset .sunset_mode .main-sun-reflexion .reflexion-shape:nth-of-type(20){background-color:#fca054;width:3%;top:39%;left:12%}
.Paint_Sunset .sunset_mode .small-sun-reflexions{top:0;left:0;right:0;margin:auto;height:100%;z-index:1}
.Paint_Sunset .sunset_mode .small-sun-reflexions > *{border-radius:50px;width:25px;height:15px;background-color:rgba(252,160,84,0.5);-webkit-animation:waves 4s infinite;animation:waves 4s infinite;transition-timing-function:ease-in-out}
.Paint_Sunset .sunset_mode .small-sun-reflexions .reflexion:nth-of-type(1){top:5%;left:15%}
.Paint_Sunset .sunset_mode .small-sun-reflexions .reflexion:nth-of-type(2){top:12%;left:-1%}
.Paint_Sunset .sunset_mode .small-sun-reflexions .reflexion:nth-of-type(3){top:20%;left:25%}
.Paint_Sunset .sunset_mode .small-sun-reflexions .reflexion:nth-of-type(4){top:25%;left:12%}
.Paint_Sunset .sunset_mode .small-sun-reflexions .reflexion:nth-of-type(5){top:30%;left:35%}
.Paint_Sunset .sunset_mode .small-sun-reflexions .reflexion:nth-of-type(6){top:45%;left:31%;background-color:rgba(252,160,84,0.4)}
.Paint_Sunset .sunset_mode .small-sun-reflexions .reflexion:nth-of-type(7){top:50%;left:10%;background-color:rgba(252,160,84,0.4)}
.Paint_Sunset .sunset_mode .small-sun-reflexions .reflexion:nth-of-type(8){top:55%;left:46%;background-color:rgba(252,160,84,0.3)}
.Paint_Sunset .sunset_mode .small-sun-reflexions .reflexion:nth-of-type(9){top:65%;left:38%;background-color:rgba(252,160,84,0.3)}
.Paint_Sunset .sunset_mode .small-sun-reflexions .reflexion:nth-of-type(10){top:70%;left:19%;background-color:rgba(252,160,84,0.2)}
.Paint_Sunset .sunset_mode .small-sun-reflexions .reflexion:nth-of-type(11){top:75%;left:6%;background-color:rgba(252,160,84,0.2)}
.Paint_Sunset .sunset_mode .small-sun-reflexions .reflexion:nth-of-type(12){top:85%;left:28%;background-color:rgba(252,160,84,0.1)}
.Paint_Sunset .sunset_mode .small-sun-reflexions .reflexion:nth-of-type(13){top:90%;left:40%;background-color:rgba(252,160,84,0.1)}
.Paint_Sunset .sunset_mode .small-sun-reflexions .reflexion:nth-of-type(14){top:5%;right:15%}
.Paint_Sunset .sunset_mode .small-sun-reflexions .reflexion:nth-of-type(15){top:10%;right:7%}
.Paint_Sunset .sunset_mode .small-sun-reflexions .reflexion:nth-of-type(16){top:20%;right:25%}
.Paint_Sunset .sunset_mode .small-sun-reflexions .reflexion:nth-of-type(17){top:30%;right:35%}
.Paint_Sunset .sunset_mode .small-sun-reflexions .reflexion:nth-of-type(18){top:30%;right:10%;background-color:rgba(252,160,84,0.4)}
.Paint_Sunset .sunset_mode .small-sun-reflexions .reflexion:nth-of-type(19){top:40%;right:20%;background-color:rgba(252,160,84,0.4)}
.Paint_Sunset .sunset_mode .small-sun-reflexions .reflexion:nth-of-type(20){top:45%;right:31%;background-color:rgba(252,160,84,0.3)}
.Paint_Sunset .sunset_mode .small-sun-reflexions .reflexion:nth-of-type(21){top:50%;right:10%;background-color:rgba(252,160,84,0.3)}
.Paint_Sunset .sunset_mode .small-sun-reflexions .reflexion:nth-of-type(22){top:65%;right:38%;background-color:rgba(252,160,84,0.2)}
.Paint_Sunset .sunset_mode .small-sun-reflexions .reflexion:nth-of-type(23){top:70%;right:19%;background-color:rgba(252,160,84,0.2)}
.Paint_Sunset .sunset_mode .small-sun-reflexions .reflexion:nth-of-type(24){top:80%;right:3%;background-color:rgba(252,160,84,0.1)}
.Paint_Sunset .sunset_mode .small-sun-reflexions .reflexion:nth-of-type(25){top:90%;right:40%;background-color:rgba(252,160,84,0.1)}
.Paint_Sunset .sunset_mode .small-sun-reflexions .reflexion:nth-of-type(26){top:93%;right:19%;background-color:rgba(252,160,84,0.2)}
@-webkit-keyframes waves{0%{transform:translate(0,0)}
50%{transform:translate(-2px,1px)}
100%{transform:translate(0,0)}
}@keyframes waves{0%{transform:translate(0,0)}
50%{transform:translate(-2px,1px)}
100%{transform:translate(0,0)}
}@-webkit-keyframes boat{0%{transform:translate(0,0) scale(0.8)}
50%{transform:translate(-2px,1px) scale(0.8)}
100%{transform:translate(0,0) scale(0.8)}
}@keyframes boat{0%{transform:translate(0,0) scale(0.8)}
50%{transform:translate(-2px,1px) scale(0.8)}
100%{transform:translate(0,0) scale(0.8)}
}.Paint_Sunset .sunset_mode .boat{height:150px;width:120px;z-index:3}
.Paint_Sunset .sunset_mode .boat:after{background-image:linear-gradient(to bottom,#6d1e5a 0%,transparent 100%);bottom:-149px;width:95%;height:150px;left:-10%;-webkit-clip-path:polygon(25% 0%,100% 0%,75% 100%,0% 100%);clip-path:polygon(25% 0%,100% 0%,75% 100%,0% 100%)}
.Paint_Sunset .sunset_mode .boat .boat-bottom{bottom:0;left:0;-webkit-clip-path:polygon(0 70%,100% 70%,85% 100%,15% 100%);clip-path:polygon(0 70%,100% 70%,85% 100%,15% 100%);background-color:#7c276a;width:100%;height:100px}
.Paint_Sunset .sunset_mode .boat .boat-bottom:before{left:0;bottom:0;height:100%;width:50%;background-color:#853073}
.Paint_Sunset .sunset_mode .boat .boat-bottom:after{background-color:#7c276a;width:50%;height:10px;left:0;bottom:10px}
.Paint_Sunset .sunset_mode .boat .boat-bottom .squares{width:100%;height:8px;bottom:20px;left:2px}
.Paint_Sunset .sunset_mode .boat .boat-bottom .square{background-color:#ffad54;width:5px;height:5px;bottom:0px}
.Paint_Sunset .sunset_mode .boat .boat-bottom .square:nth-of-type(1){left:10px}
.Paint_Sunset .sunset_mode .boat .boat-bottom .square:nth-of-type(2){left:40px}
.Paint_Sunset .sunset_mode .boat .boat-bottom .square:nth-of-type(3){left:70px}
.Paint_Sunset .sunset_mode .boat .boat-bottom .square:nth-of-type(4){left:100px}
.Paint_Sunset .sunset_mode .boat .boat-behind{width:40px;height:10px;background-color:#621352;bottom:30px;left:40px}
.Paint_Sunset .sunset_mode .boat .boat-behind:after{width:50%;height:100%;left:0;background-color:#711b5f}
.Paint_Sunset .sunset_mode .boat .boat-top-left{background-color:#f4845a;-webkit-clip-path:polygon(0% 100%,50% 0%,50% 100%);clip-path:polygon(0% 100%,50% 0%,50% 100%);width:95%;height:75%;bottom:37px}
.Paint_Sunset .sunset_mode .boat .boat-top-right{right:0%;bottom:37px;width:95%;height:60%;background-color:#e87255;z-index:33;-webkit-clip-path:polygon(0% 100%,50% 0%,50% 100%);clip-path:polygon(0% 100%,50% 0%,50% 100%);transform:scaleX(-1)}
.Paint_Sunset .sunset_mode .boat:nth-of-type(1){left:15%;top:10%;-webkit-animation:boat 4s infinite ease;animation:boat 4s infinite ease}
.Paint_Sunset .sunset_mode .boat:nth-of-type(2){right:15%;bottom:29%;-webkit-animation:waves 4s infinite ease;animation:waves 4s infinite ease}
.Paint_Sunset .sunset_mode .boat:nth-of-type(2):after{transform:scaleX(-1);left:13%;height:100px;bottom:-99px}