@font-face{
    font-family:'CuteFont';src:url('https://loxestar.cn/cute.woff2') format('woff2');
    font-display: swap;
    font-weight: normal;
    font-style: normal;
}
*{
    margin:0;padding:0;box-sizing:border-box;
    scroll-behavior: smooth;
}
body{
    font-family:'CuteFont',sans-serif;
    background-size:cover;
    background-position:center center;
    background-repeat:no-repeat;
    background-attachment:fixed;
    color:var(--text-primary);
    min-height:100vh;
    background-color:var(--bg-primary);
    overflow-x: hidden;
    transition: background-color 0.5s ease, color 0.5s ease;
}
#navbar{
    position:fixed;
    top:0;left:0;
    width:100%;height:50px;
    backdrop-filter:blur(0px);
    -webkit-backdrop-filter:blur(0px);
    background-color: rgba(0,0,0,0) !important; /* 修改1：导航栏背景永久透明 不受主题影响 */
    transition:all 0.4s cubic-bezier(0.4,0,0.2,1);
    z-index:9999;
    display:flex;align-items:center;
    padding:0 20px;
    opacity:1;
    transform:translateY(0);
}
#navbar.hidden{
    opacity:0;
    transform:translateY(-100%);
    pointer-events:none;
}
#navbar.scrolled{
    backdrop-filter:blur(15px);
    -webkit-backdrop-filter:blur(15px);
    background-color: rgba(255,255,255,0.5) !important; /* 修改2：滚动后导航栏背景永久白色半透 不受主题影响 */
    box-shadow:0 2px 10px rgba(0,0,0,0.08);
    animation:navbarSlideDown 0.3s ease-out;
}
@keyframes navbarSlideDown{
    0%{transform:translateY(-100%);}
    100%{transform:translateY(0);}
}
#navbar.scrolled .nav-left span,
#navbar.scrolled .nav-link,
#navbar.scrolled .search-btn-nav{
    color: #ffffff !important;
    text-shadow:none!important;
}
.nav-content{
    display:flex;justify-content:space-between;align-items:center;
    width:100%;
}
.nav-left span{
    font-size:1.2em;font-weight:normal;color: #ffffff !important;
    text-shadow:1px 1px 2px rgba(0,0,0,0.5);
    transition:all 0.3s cubic-bezier(0.4,0,0.2,1);
}
.nav-right{
    display:flex;align-items:center;gap:15px;
}
.nav-links{
    display:flex;gap:20px;margin-right:10px;
    transition:all 0.3s cubic-bezier(0.4,0,0.2,1);
}
.nav-link{
    text-decoration:none;color: #ffffff !important;
    font-size:1em;font-weight:normal;
    transition:all 0.3s cubic-bezier(0.4,0,0.2,1);
    position:relative;
    text-shadow:1px 1px 2px rgba(0,0,0,0.5);
    white-space:nowrap;
}
.nav-link:hover{
    transform:translateY(-2px);
}
.nav-link:hover::after{width:100%;}
.nav-link::after{
    content:'';position:absolute;bottom:-5px;left:0;
    width:0;height:2px;background-color: #ffffff !important;
    transition:width 0.3s cubic-bezier(0.4,0,0.2,1);
}
#navbar.scrolled .nav-link::after{background-color: #ffffff !important;}

.search-container-nav{position:relative;z-index: 10000;}
.search-btn-nav{
    background:transparent;border:none;cursor:pointer;
    color: #ffffff !important;
    width:40px;height:40px;border-radius:50%;
    transition:all 0.4s cubic-bezier(0.4,0,0.2,1);
    display:flex;align-items:center;justify-content:center;
    z-index:3;position:relative;
}
.search-btn-nav:hover{
    background-color: rgba(0,0,0,0.05);
    transform:scale(1.1);
}
.search-btn-nav:hover svg{animation:searchIconPulse 0.5s ease;}
.dark .search-btn-nav:hover{background-color: rgba(255,255,255,0.05);}
.search-box{
    position:absolute;top:50%;right:0;
    transform:translateY(-50%);width:0;height:36px;
    background:transparent;border-radius:20px;
    display:flex;align-items:center;padding:0 15px;
    opacity:0;visibility:hidden;
    transition:all 0.3s cubic-bezier(0.4,0,0.2,1);
    z-index:2;
    border: 1px solid transparent;
}
.search-expanded .search-box{
    width:280px;opacity:1;visibility:visible;
    background:var(--bg-secondary);border-radius:20px;
    box-shadow:0 2px 8px rgba(0,0,0,0.1);
    border-color: var(--border-color);
    animation:searchExpand 0.3s cubic-bezier(0.34,1.56,0.64,1);
}
@keyframes searchExpand{0%{width:0;opacity:0;}100%{width:280px;opacity:1;}}
#search-input{
    width:100%;border:none;background:transparent;outline:none;
    font-family:'CuteFont',sans-serif;font-size:0.9em;
    color:var(--text-primary)!important;padding:10px 0 10px 0;
    opacity:0;transition:opacity 0.2s cubic-bezier(0.4,0,0.2,1) 0.1s;
}
.search-expanded #search-input{opacity:1;animation:textFadeIn 0.3s ease 0.1s both;}
@keyframes textFadeIn{0%{opacity:0;transform:translateX(-10px);}100%{opacity:1;transform:translateX(0);}}
#search-input::placeholder{color:var(--text-secondary);opacity:1;}
.search-results{
    position:absolute;top:100%;left:0;width:100%;background:var(--bg-secondary);
    backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);
    border-radius:10px;box-shadow:0 5px 20px rgba(0,0,0,0.15);
    max-height:0;overflow-y:auto;opacity:0;transform:translateY(-10px);
    transition:all 0.3s cubic-bezier(0.4,0,0.2,1);z-index:9999;
    min-width:280px;max-width:400px;margin-top:5px;
}
.search-results.active{max-height:300px;opacity:1;transform:translateY(0);animation:searchResultsSlide 0.3s cubic-bezier(0.34,1.56,0.64,1);}
@keyframes searchResultsSlide{0%{opacity:0;transform:translateY(-20px);}100%{opacity:1;transform:translateY(0);}}
.search-result-item{
    display:block;padding:12px 15px;text-decoration:none;color:var(--text-primary);
    border-bottom:1px solid var(--border-color);transition:all 0.2s cubic-bezier(0.4,0,0.2,1);
    cursor:pointer;opacity:0;animation:searchItemFadeIn 0.3s ease calc(var(--item-index, 0) * 0.05s + 0.1s) forwards;
}
@keyframes searchItemFadeIn{0%{opacity:0;transform:translateY(5px);}100%{opacity:1;transform:translateY(0);}}
.search-result-item:last-child{border-bottom: none;}
.search-result-item:hover{background-color: var(--bg-primary);transform:translateX(5px);box-shadow:0 3px 8px rgba(0,0,0,0.1);}
.search-result-item h4{margin:0 0 5px 0;font-size:1em;font-weight:normal;color:var(--text-primary);}
.search-result-subtitle{margin:0 0 5px 0;font-size:0.9em;color:var(--text-secondary);}
.search-result-desc{
    margin:0;font-size:0.85em;color:var(--text-tertiary);line-height:1.4;
    display: -webkit-box;-webkit-line-clamp: 2;-webkit-box-orient: vertical;overflow: hidden;
}
.search-result-type{display:inline-block;font-size:0.7em;padding:2px 6px;border-radius:3px;background:#f0f0f0;color:#666;margin-left:5px;animation:typePulse 2s infinite;}
.dark .search-result-type{background:#333;color:#ccc;}
.view-all-btn{
    display:block;width:100%;padding:10px 15px;text-align:center;background:rgba(76,73,72,0.05);
    color:var(--nav-text-scrolled);text-decoration:none;border-top:1px solid var(--border-color);
    font-size:0.9em;transition:all 0.2s cubic-bezier(0.4,0,0.2,1);cursor:pointer;
}
.dark .view-all-btn{background:rgba(200,200,200,0.05);}
.view-all-btn:hover{background:rgba(76,73,72,0.1);transform:scale(1.02);}
.dark .view-all-btn:hover{background:rgba(200,200,200,0.1);}
mark{background-color:var(--highlight-bg);padding:0 2px;border-radius:2px;animation:markHighlight 0.5s ease;}
@keyframes markHighlight{0%{background-color:transparent;}100%{background-color:var(--highlight-bg);}}
@keyframes searchIconPulse{0%{transform:scale(1);}50%{transform:scale(1.2);}100%{transform:scale(1);}}
main{padding-top:70px;}
.home-section{
    min-height:100vh;text-align:center;padding:40px 20px;margin-bottom:30px;
    display:flex;flex-direction:column;justify-content:center;align-items:center;
}
.title-container{display:inline-block;}
/* ✅ 重中之重：.title-container 内部主标题 永久纯白色，永不随主题变色！ */
.main-title{
    font-size:3em;margin-bottom:15px;display:flex;justify-content:center;gap:10px;
    color: #ffffff !important; /* 强制纯白 脱离主题变量 */
    text-shadow:2px 2px 4px rgba(0,0,0,0.5);overflow:hidden;
}
.title-word{
    display:inline-block;opacity:0;transform:translateX(-50px);
    animation:titleSlideIn 0.8s cubic-bezier(0.34,1.56,0.64,1) forwards;
}
.title-word:nth-child(1){animation-delay:0.1s;}
.title-word:nth-child(2){animation-delay:0.2s;}
.title-word:nth-child(3){animation-delay:0.5s;}
@keyframes titleSlideIn{0%{opacity:0;transform:translateX(-50px) scale(0.8);}70%{opacity:1;transform:translateX(10px) scale(1.05);}100%{opacity:1;transform:translateX(0) scale(1);}}
/* ✅ 重中之重：.title-container 内部副标题 永久纯白色，永不随主题变色！ */
.subtitle{
    font-size:1.4em;color: #ffffff !important; /* 强制纯白 脱离主题变量 */
    font-weight:normal;margin-top:15px;opacity:0;
    animation:fadeIn 0.5s cubic-bezier(0.4,0,0.2,1) 1s forwards;
    text-shadow:1px 1px 2px rgba(0,0,0,0.5);transform:translateY(20px);
}
@keyframes fadeIn{0%{opacity:0;transform:translateY(20px);}100%{opacity:1;transform:translateY(0);}}
.content-container{max-width:1200px;margin:0 auto;padding:30px 20px;min-height:100vh;}
.content-row{
    display:flex;gap:20px;margin-bottom:20px;width:100%;box-sizing:border-box;flex-wrap:nowrap;
    opacity:0;transform:translateY(20px);transition:opacity 0.6s cubic-bezier(0.4,0,0.2,1),transform 0.6s cubic-bezier(0.4,0,0.2,1);
}
.content-row.visible{opacity:1;transform:translateY(0);animation:contentRowFadeIn 0.6s cubic-bezier(0.4,0,0.2,1);}
@keyframes contentRowFadeIn{0%{opacity:0;transform:translateY(30px);}100%{opacity:1;transform:translateY(0);}}
.main-item{
    flex:2 0 calc((100% - 20px) * 2 / 3);box-sizing:border-box;overflow:hidden;position:relative;
    display:block;background:var(--bg-secondary);border-radius:12px;padding:25px;
    transition:all 0.3s cubic-bezier(0.4,0,0.2,1);text-decoration:none;color:inherit;
    min-height:240px;height:100%;opacity:0;animation:itemFadeIn 0.5s ease calc(var(--item-index, 0) * 0.1s) forwards;
}
@keyframes itemFadeIn{0%{opacity:0;transform:translateY(20px);}100%{opacity:1;transform:translateY(0);}}
.main-item:hover{transform:translateY(-3px) scale(1.02);box-shadow:0 8px 20px rgba(0,0,0,0.12);background:var(--bg-primary);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);}
.side-item{
    flex:1 0 calc((100% - 20px) * 1 / 3);box-sizing:border-box;overflow:hidden;position:relative;
    display:block;background:var(--bg-tertiary);border-radius:12px;padding:25px;
    transition:all 0.3s cubic-bezier(0.4,0,0.2,1);color:inherit;min-height:240px;height:100%;
    opacity:0;animation:itemFadeIn 0.5s ease calc(var(--item-index, 0) * 0.1s + 0.2s) forwards;
}
.side-item:hover{transform:translateY(-3px) scale(1.02);box-shadow:0 8px 20px rgba(0,0,0,0.1);background:var(--bg-secondary);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);}
.image-container{flex:0 0 33.33%;display:flex;align-items:center;justify-content:center;position:relative;overflow:hidden;border-radius:8px;background-color:#f5f5f5;min-height:100%;height:100%;}
.dark .image-container{background-color:#222;}
.item-title{font-size:1.5em;color:var(--text-primary);font-weight:normal;margin:0;flex-shrink:0;}
.item-subtitle{font-size:1.1em;color:var(--text-secondary);font-weight:normal;margin:0;font-style:italic;}
.item-desc{font-size:0.95em;line-height:1.6;color:var(--text-secondary);margin-top:12px;flex-grow:1;display:flex;align-items:center;}
.side-title{width:calc(100% - 60px);height:27px;max-width:calc(100% - 60px);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;margin:0 30px 10px 30px;display:block;clear:both;box-sizing:border-box;line-height:27px;font-size:1.3em;color:var(--text-primary);font-weight:normal;}
.side-content{width:calc(100% - 60px);box-sizing:border-box;overflow:hidden;display:block;margin:0 30px;font-size:0.9em;line-height:1.6;color:var(--text-secondary);flex-grow:1;}
.side-content strong{color:var(--text-primary);font-weight:normal;}
.container-item{transition:all 0.3s ease;box-sizing:border-box;max-width:100%;overflow:hidden;}
.container-button{max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.link-list{width:100%;box-sizing:border-box;padding:0;margin:0;overflow:hidden;}
.link-list li{list-style:none;width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;margin-bottom:5px;}
.link-list li a{max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;display:inline-block;color:var(--text-primary);text-decoration:none;transition:all 0.3s ease;padding:8px 12px;border:2px solid var(--link-border);border-radius:8px;text-align:center;}
.link-list li a:hover{color:var(--link-hover-color);background-color:var(--link-hover-bg);border-color:var(--link-border-hover);text-decoration:none;transform:translateY(-2px);}
p{max-width:100%;box-sizing:border-box;overflow-wrap:break-word;word-wrap:break-word;word-break:break-all;margin:0;}
strong{max-width:100%;overflow:hidden;}
img{max-width:100%;max-height:100%;object-fit:contain;display:block;}
::-webkit-scrollbar{width:6px;height:6px;}
::-webkit-scrollbar-track{background:var(--scrollbar-track);border-radius:3px;}
::-webkit-scrollbar-thumb{background:var(--scrollbar-thumb);border-radius:3px;}
::-webkit-scrollbar-thumb:hover{background:var(--scrollbar-thumb-hover);}
::-moz-scrollbar{width:6px;height:6px;}
::-moz-scrollbar-track{background:var(--scrollbar-track);border-radius:3px;}
::-moz-scrollbar-thumb{background:var(--scrollbar-thumb);border-radius:3px;}
::-moz-scrollbar-thumb:hover{background:var(--scrollbar-thumb-hover);}
@media screen and (max-width:992px){.content-row{flex-direction:column;}.main-item,.side-item{flex:none;width:100%;min-height: auto;}}
@media screen and (max-width:767px){
    .content-row{flex-wrap:wrap;}.main-item,.side-item{flex:1 0 100%;margin-bottom: 20px;}
    .main-title{font-size:2em;flex-direction:column;gap:8px;}.subtitle{font-size:1em;}
    .nav-links{gap:15px;margin-right:10px;}.nav-left span{font-size:1em;}.nav-link{font-size:0.9em;}
    .search-expanded .nav-links{transform:translateX(-160px);}.search-expanded .search-box{width:200px;}
    .search-results{position:fixed;top:50px;left:50%;transform:translateX(-50%);width:90vw;max-width:90vw;}
}
@media screen and (min-width:768px){.content-row{flex-wrap:nowrap;}}
@media screen and (max-width:480px){
    .main-title{font-size:1.6em;}.subtitle{font-size:0.9em;}.nav-content{padding:0 10px;}
    .nav-links{gap:10px;margin-right:8px;}.nav-link{font-size:0.85em;}
    .search-expanded .nav-links{transform:translateX(-130px);}.search-expanded .search-box{width:160px;}
    #navbar{height:45px;}
}
@media (max-width: 768px) {
    .content-row, .content-row-reverse {flex-direction: column !important;}
    .main-item, .side-item {width: 100% !important;max-width: 100% !important;margin-bottom: 20px !important;min-height: auto !important;}
    .container-row-horizontal {flex-direction: column !important;gap:10px !important;}
    .container-item-horizontal {width:100% !important;max-width:100% !important;margin-bottom:10px !important;}
    .container-item {padding:12px !important;margin-bottom:15px !important;}
    .container-button {min-height:44px !important;padding:12px !important;}
    .side-title {font-size:1.2em !important;margin-bottom:15px !important;width:calc(100% - 20px) !important;margin-left:10px !important;margin-right:10px !important;}
    .search-box {width:90vw !important;max-width:400px !important;}
    .nav-content {padding:10px 15px !important;flex-wrap: wrap;}
    .nav-right {flex-wrap: wrap;justify-content: flex-end;}
    .side-content {width:calc(100% - 20px) !important;margin-left:10px !important;margin-right:10px !important;}
}
@media (max-width: 480px) {
    .title-word {display: block;margin-bottom:5px;}
    .main-title {font-size:1.8em !important;line-height:1.3;}
    .subtitle {font-size:1em !important;}
    .container-item {padding:10px !important;}
}
.container-item {word-break: break-word;hyphens: auto;line-height:1.5;padding:8px !important;margin-bottom:8px !important;box-sizing: border-box !important;}
.container-item img {max-width:100%;height:auto;border-radius:6px;}
.container-button {padding:6px 12px !important;border-radius:6px !important;min-height:36px !important;line-height:1.3 !important;text-decoration:none !important;transition:all 0.3s ease !important;display:flex !important;align-items:center !important;justify-content:center !important;box-sizing:border-box !important;color:var(--text-primary);}
.container-button:hover {opacity:0.9 !important;transform:translateY(-1px) !important;box-shadow:0 2px 8px rgba(0,0,0,0.1) !important;}
.no-results {padding:20px;text-align:center;color:var(--text-secondary);font-size:0.9em;}
.search-results.active .search-result-item {animation: slideIn 0.3s ease forwards;animation-delay: calc(var(--item-index, 0) * 0.05s);}
@keyframes slideIn {from {opacity:0;transform: translateY(-5px);}to {opacity:1;transform: translateY(0);}}
html.dark .container-item[style*="color: #333333"],html.dark .container-item[style*="color:#333"],html.dark .container-item span,html.dark .container-item p {color: #F0F0F0 !important;}
.container-item * {transition: color 0.3s ease, background-color 0.3s ease, border-color 0.3s ease;}
.container-item-horizontal {border-width:1px !important;}
.items-container {opacity:0;animation: itemsContainerFadeIn 0.5s ease 0.2s forwards;}
@keyframes itemsContainerFadeIn {0% { opacity:0; }100% { opacity:1; }}
.item-row {transition:all 0.3s cubic-bezier(0.4,0,0.2,1), backdrop-filter 0.3s cubic-bezier(0.4,0,0.2,1) !important;opacity:0;transform:translateY(20px);animation:itemFadeIn 0.5s ease calc(var(--item-index) * 0.1s) forwards;backdrop-filter:blur(0px);-webkit-backdrop-filter:blur(0px);}
.item-row:hover {transform:translateY(-2px) scale(1.02) !important;backdrop-filter:blur(10px) !important;-webkit-backdrop-filter:blur(10px) !important;box-shadow:0 8px 20px rgba(0,0,0,0.15) !important;}
.highlighted {animation:highlightPulse 2s ease;border:2px solid #ff69b4 !important;transform:scale(1.02);box-shadow:0 0 15px rgba(255,105,180,0.3) !important;}
@keyframes highlightPulse {0% { box-shadow:0 0 0 0 rgba(255,105,180,0.7); }70% { box-shadow:0 0 0 10px rgba(255,105,180,0); }100% { box-shadow:0 0 0 0 rgba(255,105,180,0); }}