﻿/* ============================================================
   屿上灯 · Butterfly 主题复刻样式
   ============================================================ */
:root{
  --acc:#49b1f5; --acc2:#ff7242; --txt:#4c4948; --sub:#85858f;
  --bg:#f7f7f9; --card:#fff; --line:#eeeef2; --code:#f3f4f5;
  --shadow:0 3px 8px 6px rgba(7,17,27,.06); --radius:10px;
  --nav-h:60px;
}
html[data-theme="dark"]{
  --acc:#6ba6ff; --acc2:#ff8a5c; --txt:#c6c9ce; --sub:#8e9095;
  --bg:#18171c; --card:#242229; --line:#33313a; --code:#1d1c22;
  --shadow:0 3px 8px 6px rgba(0,0,0,.35);
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Hiragino Sans GB","Microsoft YaHei",sans-serif;color:var(--txt);background:var(--bg);font-size:16px;line-height:1.8;transition:background .3s,color .3s}
a{color:var(--acc);text-decoration:none;transition:.25s}
a:hover{color:var(--acc2)}
img{max-width:100%;vertical-align:middle}
button{font-family:inherit;cursor:pointer;border:none;background:none;color:inherit}
::selection{background:rgba(73,177,245,.25)}
::-webkit-scrollbar{width:9px;height:9px}::-webkit-scrollbar-thumb{background:#c3c7cd;border-radius:9px}html[data-theme=dark] ::-webkit-scrollbar-thumb{background:#3c3a44}

/* ---------- 阅读进度 ---------- */
#progress{position:fixed;top:0;left:0;height:3px;width:0;background:linear-gradient(90deg,var(--acc),var(--acc2));z-index:1001;transition:width .1s linear}

/* ---------- 导航 ---------- */
#nav{position:fixed;top:0;left:0;right:0;height:var(--nav-h);z-index:900;transition:.3s}
#nav .nav-inner{max-width:1300px;margin:0 auto;height:100%;display:flex;align-items:center;gap:18px;padding:0 22px}
#nav .site-title{color:#fff;font-weight:700;font-size:1.25em;letter-spacing:1px;text-shadow:0 1px 4px rgba(0,0,0,.35)}
#nav .menu{margin-left:auto;display:flex;gap:6px}
#nav .menu a{color:#fff;padding:6px 12px;border-radius:6px;font-size:.95em;text-shadow:0 1px 3px rgba(0,0,0,.3)}
#nav .menu a:hover{background:rgba(255,255,255,.18)}
#nav .nav-icons{display:flex;gap:4px;color:#fff}
#nav .nav-icons button{width:34px;height:34px;border-radius:50%;display:grid;place-items:center;color:inherit}
#nav .nav-icons button:hover{background:rgba(255,255,255,.2)}
#nav.solid{background:rgba(255,255,255,.92);backdrop-filter:blur(12px);box-shadow:0 2px 10px rgba(0,0,0,.08)}
#nav.solid .site-title,#nav.solid .menu a,#nav.solid .nav-icons{color:var(--txt);text-shadow:none}
html[data-theme="dark"] #nav.solid{background:rgba(24,23,28,.92)}
#menu-btn{display:none;color:#fff;width:36px;height:36px;place-items:center;border-radius:8px}
#nav.solid #menu-btn{color:var(--txt)}
#nav #search-m-btn{display:none!important}

/* ---------- 横幅（Butterfly：首页全屏 100vh，文章页 post-bg） ---------- */
#banner{position:relative;height:100vh;background:url("../img/banner.png") center/cover no-repeat fixed;display:flex;align-items:center;justify-content:center}
#banner::after{content:"";position:absolute;inset:0;background:rgba(8,12,20,.28)}
#banner.post-mode{height:62vh;min-height:340px;background-attachment:scroll}
.banner-title{position:relative;z-index:2;text-align:center;color:#fff;padding:0 20px}
.banner-title h1{font-size:3.2em;letter-spacing:6px;text-shadow:0 2px 14px rgba(0,0,0,.5);font-weight:600}
.banner-title .subtitle{margin-top:10px;font-size:1.05em;opacity:.92;text-shadow:0 1px 6px rgba(0,0,0,.5)}
#banner-sub{display:inline-block;min-width:1em;min-height:1.6em}
.typed-cursor{display:inline-block;margin-left:3px;font-weight:400;animation:blink 1s steps(1) infinite}
@keyframes blink{50%{opacity:0}}
.banner-icon{margin-top:14px;font-size:1.6em;animation:glow 3s ease-in-out infinite}
@keyframes glow{0%,100%{opacity:.55;transform:scale(.96)}50%{opacity:1;transform:scale(1.04)}}
.banner-title .post-head-meta{margin-top:16px;font-size:.92em;opacity:.92;text-shadow:0 1px 6px rgba(0,0,0,.5);display:flex;gap:18px;justify-content:center;flex-wrap:wrap}
.post-mode .banner-title h1{font-size:2.4em;letter-spacing:2px;line-height:1.5}
.scroll-down{position:absolute;bottom:22px;left:50%;transform:translateX(-50%);color:#fff;font-size:2em;line-height:1;z-index:2;animation:bob 1.8s infinite}
@keyframes bob{0%,100%{transform:translate(-50%,0)}50%{transform:translate(-50%,8px)}}

/* ---------- 布局（主页内容从头图下方开始；仅文章页正文卡片压头图，同 Butterfly） ---------- */
.layout{max-width:1200px;margin:0 auto;padding:26px 16px 40px;display:flex;gap:22px;align-items:flex-start;position:relative;z-index:3}
#main.overlap{padding-top:0}
#main.overlap #app{margin-top:-60px}
#app{flex:1;min-width:0}
#sidebar{width:290px;flex-shrink:0;position:sticky;top:76px}
.page-pad{padding-top:76px}

/* ---------- 文章卡片 ---------- */
.post-card{background:var(--card);border-radius:var(--radius);box-shadow:var(--shadow);overflow:hidden;margin-bottom:22px;transition:transform .25s,box-shadow .25s}
.post-card:hover{transform:translateY(-3px);box-shadow:0 6px 14px 6px rgba(7,17,27,.1)}
.post-card .cover{display:block;height:260px;overflow:hidden;position:relative}
.post-card .cover img{width:100%;height:100%;object-fit:cover;transition:transform .5s}
.post-card:hover .cover img{transform:scale(1.04)}
.post-card .cover .cat-badge{position:absolute;top:14px;right:14px;background:rgba(0,0,0,.45);color:#fff;font-size:.78em;padding:3px 10px;border-radius:20px;backdrop-filter:blur(4px)}
.post-card .pc-body{padding:22px 26px 26px}
.post-card h2{font-size:1.5em;text-align:center;line-height:1.45}
.post-card h2 a{color:var(--txt)}
.post-card h2 a:hover{color:var(--acc)}
.pc-meta{display:flex;justify-content:center;flex-wrap:wrap;gap:16px;margin:12px 0;font-size:.85em;color:var(--sub)}
.pc-meta .ic{margin-right:3px}
.pc-excerpt{color:var(--sub);font-size:.95em;margin:8px 0 18px;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.pc-more{display:block;width:150px;margin:0 auto;text-align:center;padding:8px 0;border:1.5px solid var(--acc);border-radius:40px;color:var(--acc);font-size:.9em}
.pc-more:hover{background:var(--acc);color:#fff}
.post-card.locked .cover{filter:blur(2px)}
.lock-flag{position:absolute;inset:0;display:grid;place-items:center;font-size:2.4em;text-shadow:0 2px 10px rgba(0,0,0,.5)}
.dead-card{background:var(--card);border-radius:var(--radius);box-shadow:var(--shadow);padding:56px 30px;text-align:center;margin-bottom:22px}
.dead-card .dead-ic{font-size:2.6em;margin-bottom:14px}
.dead-card p{color:var(--sub)}
.dead-card .dead-tip{margin-top:16px;font-size:.85em;opacity:.75}

/* ---------- 分页 ---------- */
#pagination{display:flex;justify-content:center;gap:8px;margin:30px 0 10px}
#pagination a,#pagination span{min-width:36px;height:36px;display:grid;place-items:center;border-radius:8px;background:var(--card);box-shadow:var(--shadow);color:var(--txt);font-size:.9em;padding:0 10px}
#pagination .cur{background:var(--acc);color:#fff}
#pagination a:hover{color:var(--acc)}

/* ---------- 侧栏 ---------- */
.side-card{background:var(--card);border-radius:var(--radius);box-shadow:var(--shadow);padding:20px 22px;margin-bottom:18px}
.side-title{font-weight:700;margin-bottom:12px;padding-bottom:8px;border-bottom:2px solid var(--line);position:relative}
.side-title::after{content:"";position:absolute;left:0;bottom:-2px;width:44px;height:2px;background:var(--acc)}
.author-card{text-align:center}
.author-card .avatar{width:110px;height:110px;border-radius:50%;border:4px solid rgba(73,177,245,.35);transition:transform .5s}
.author-card .avatar:hover{transform:rotate(360deg)}
.author-name{font-weight:700;font-size:1.15em;margin-top:8px}
.author-desc{color:var(--sub);font-size:.85em;margin:8px 0;line-height:1.9}
.author-stats{display:flex;justify-content:space-around;border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:10px 0;margin:10px 0}
.author-stats b{display:block;font-size:1.15em}
.author-stats span{font-size:.75em;color:var(--sub)}
.author-social{font-size:.82em;color:var(--sub);display:flex;justify-content:center;gap:6px;align-items:center;flex-wrap:wrap}
.author-social a{color:var(--sub);cursor:pointer}
.author-social a:hover{color:var(--acc)}
.author-social i{font-style:normal;color:var(--line)}
.side-list{list-style:none}
.side-list li{padding:6px 0;border-bottom:1px dashed var(--line);font-size:.9em;display:flex;justify-content:space-between;gap:8px}
.side-list li:last-child{border-bottom:none}
.side-list .cnt{color:var(--sub);font-size:.85em}
.tag-cloud a{display:inline-block;margin:4px 5px;padding:2px 12px;border-radius:6px;font-size:.85em;background:rgba(73,177,245,.09);color:var(--txt)}
.tag-cloud a:hover{background:var(--acc);color:#fff}
.side-info{list-style:none;font-size:.9em}
.side-info li{display:flex;justify-content:space-between;padding:5px 0}

/* ---------- 文章内页 ---------- */
.single{background:var(--card);border-radius:var(--radius);box-shadow:var(--shadow);padding:34px 40px 40px}
.single h1{font-size:1.9em;line-height:1.5;text-align:center;margin-bottom:6px}
.single .post-meta{display:flex;justify-content:center;flex-wrap:wrap;gap:16px;color:var(--sub);font-size:.85em;margin:10px 0 8px}
.post-content{margin-top:22px;font-size:1.02em}
.post-content h2,.post-content h3{margin:1.6em 0 .8em;font-size:1.3em}
.post-content h3{font-size:1.12em}
.post-content p{margin:.9em 0}
.post-content blockquote{border-left:4px solid var(--acc);background:rgba(73,177,245,.06);padding:12px 18px;border-radius:0 8px 8px 0;margin:1em 0;color:var(--sub)}
.post-content blockquote p{margin:.4em 0}
.post-content img{border-radius:8px;display:block;margin:1em auto;box-shadow:var(--shadow);cursor:zoom-in}
.post-content .img-note{text-align:center;color:var(--sub);font-size:.82em;margin:-4px 0 12px}
.post-content hr{border:none;border-top:1px dashed var(--line);margin:1.8em 0}
.post-content code{background:var(--code);padding:2px 7px;border-radius:5px;font-family:Consolas,Menlo,monospace;font-size:.88em;color:#c7683c}
html[data-theme=dark] .post-content code{color:#e8a06a}
.post-tags{margin-top:26px;display:flex;gap:8px;flex-wrap:wrap}
.post-tags a{font-size:.82em;padding:3px 12px;border-radius:6px;background:rgba(73,177,245,.1)}
.cc-note{margin-top:22px;background:var(--code);border-radius:8px;padding:14px 18px;font-size:.84em;color:var(--sub)}
.prevnext{display:flex;gap:16px;margin-top:22px}
.prevnext a{flex:1;background:var(--card);border-radius:var(--radius);box-shadow:var(--shadow);padding:14px 18px;font-size:.9em;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;color:var(--txt)}
.prevnext a b{display:block;color:var(--sub);font-weight:400;font-size:.8em;margin-bottom:3px}
.prevnext a:hover{color:var(--acc)}

/* ---------- 评论 ---------- */
#comments{background:var(--card);border-radius:var(--radius);box-shadow:var(--shadow);padding:26px 30px;margin-top:22px}
#comments h3{font-size:1.15em;margin-bottom:14px}
#comments h3 .cnt{color:var(--acc);font-size:.9em;margin-left:6px}
.cmt{display:flex;gap:12px;padding:14px 0;border-bottom:1px solid var(--line)}
.cmt:last-child{border-bottom:none}
.cmt .cmt-ava{width:42px;height:42px;border-radius:50%;flex-shrink:0;display:grid;place-items:center;color:#fff;font-weight:700;font-size:1em}
.cmt .cmt-body{flex:1;min-width:0}
.cmt .cmt-head{font-size:.85em;color:var(--sub)}
.cmt .cmt-head b{color:var(--txt);margin-right:8px}
.cmt .cmt-head .badge{background:rgba(73,177,245,.15);color:var(--acc);font-size:.78em;padding:1px 7px;border-radius:4px;margin-right:6px}
.cmt .cmt-text{margin-top:3px;white-space:pre-wrap;word-break:break-word}
.cmt .cmt-floor{float:right;color:var(--sub);font-size:.8em}
.cmt .cmt-reply{font-size:.8em;color:var(--acc);cursor:pointer;user-select:none}
.cmt .cmt-reply:hover{color:var(--acc2)}
.cmt.dead .cmt-text{color:var(--sub);font-style:italic}
.cmt.gone .cmt-ava,.cmt.gone .cmt-head b{filter:grayscale(1);opacity:.55}
.cmt-form{margin-top:18px;display:flex;flex-direction:column;gap:10px}
.cmt-form textarea{width:100%;min-height:84px;border:1.5px solid var(--line);background:var(--bg);color:var(--txt);border-radius:8px;padding:12px;font-family:inherit;resize:vertical}
.cmt-form textarea:focus{outline:none;border-color:var(--acc)}
.cmt-form .cf-row{display:flex;align-items:center;gap:12px}
.cmt-form .cf-tip{font-size:.8em;color:var(--sub)}
.cmt-form button{margin-left:auto;background:var(--acc);color:#fff;padding:8px 26px;border-radius:8px;transition:.2s}
.cmt-form button:hover{background:var(--acc2)}
.cmt-anim{animation:pop .5s}
@keyframes pop{0%{opacity:0;transform:translateY(8px)}100%{opacity:1;transform:none}}

/* ---------- 归档/分类/标签页 ---------- */
.list-page{background:var(--card);border-radius:var(--radius);box-shadow:var(--shadow);padding:28px 34px}
.list-page h1{font-size:1.5em;margin-bottom:16px}
.arc-year{font-size:1.25em;font-weight:700;margin:18px 0 8px;color:var(--acc)}
.arc-item{display:flex;gap:14px;padding:9px 0;border-bottom:1px dashed var(--line);align-items:baseline}
.arc-item time{color:var(--sub);font-size:.88em;flex-shrink:0;font-family:Consolas,monospace}
.cat-grid{display:flex;flex-wrap:wrap;gap:12px}
.cat-grid a{background:rgba(73,177,245,.09);padding:10px 18px;border-radius:8px;color:var(--txt)}
.cat-grid a b{color:var(--acc);margin-left:6px}

/* ---------- 关于/友链 ---------- */
.friend-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:14px}
.friend-card{display:flex;gap:12px;align-items:center;background:var(--bg);border-radius:10px;padding:14px;transition:.2s;border:1px solid transparent}
.friend-card:hover{transform:translateY(-3px);border-color:var(--acc)}
.friend-card .f-ava{width:52px;height:52px;border-radius:12px;display:grid;place-items:center;font-size:1.5em;flex-shrink:0}
.friend-card b{display:block}
.friend-card span{font-size:.8em;color:var(--sub);display:block;line-height:1.5}

/* ---------- 搜索弹窗 ---------- */
.modal{position:fixed;inset:0;background:rgba(10,14,22,.55);backdrop-filter:blur(4px);z-index:1000;display:grid;place-items:start center;padding-top:12vh}
.search-box{width:min(680px,92vw);display:flex;background:var(--card);border-radius:12px;padding:6px 6px 6px 18px;box-shadow:var(--shadow)}
.search-box input{flex:1;border:none;background:none;color:var(--txt);font-size:1.05em;padding:12px 0;outline:none}
.search-box .close{color:var(--sub);padding:0 12px;font-size:1.1em}
#search-results{width:min(680px,92vw);background:var(--card);border-radius:12px;margin-top:10px;max-height:52vh;overflow:auto;box-shadow:var(--shadow)}
#search-results .sr-item{padding:13px 20px;border-bottom:1px solid var(--line);cursor:pointer}
#search-results .sr-item:hover{background:rgba(73,177,245,.07)}
#search-results .sr-item b{color:var(--acc)}
#search-results .sr-item p{font-size:.84em;color:var(--sub);margin-top:2px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
#search-results .sr-ghost{padding:16px 20px;color:var(--sub);font-size:.85em;font-style:italic}

/* ---------- 悬浮按钮 ---------- */
#rightside{position:fixed;right:18px;bottom:24px;z-index:950;display:flex;flex-direction:column;gap:10px}
.rs-btn{width:44px;height:44px;border-radius:50%;background:var(--card);box-shadow:var(--shadow);display:grid;place-items:center;font-size:1.15em;transition:.2s}
.rs-btn:hover{transform:translateY(-3px);color:var(--acc)}
.rs-btn.hide{display:none}
#dangan-btn{position:relative}
#dangan-btn .dgd{position:absolute;top:-4px;right:-4px;background:var(--acc2);color:#fff;font-size:.62em;min-width:18px;height:18px;border-radius:9px;display:grid;place-items:center;padding:0 4px;font-style:normal}

/* ---------- Toast ---------- */
#toast{position:fixed;left:50%;bottom:12vh;transform:translateX(-50%);background:rgba(20,24,32,.92);color:#fff;padding:10px 22px;border-radius:10px;font-size:.92em;z-index:1200;backdrop-filter:blur(6px);max-width:80vw;text-align:center;animation:pop .3s}

/* ---------- 移动端抽屉 ---------- */
#drawer-mask{position:fixed;inset:0;background:rgba(0,0,0,.45);z-index:960;opacity:0;pointer-events:none;transition:.3s}
#drawer{position:fixed;top:0;left:0;bottom:0;width:280px;background:var(--card);z-index:970;transform:translateX(-105%);transition:transform .3s;padding:26px 22px;box-shadow:4px 0 24px rgba(0,0,0,.2)}
body.drawer-open #drawer{transform:none}
body.drawer-open #drawer-mask{opacity:1;pointer-events:auto}
.drawer-user{display:flex;gap:12px;align-items:center;padding-bottom:18px;border-bottom:1px solid var(--line)}
.drawer-user img{width:56px;height:56px;border-radius:50%}
.drawer-user b{display:block}
.drawer-user span{font-size:.8em;color:var(--sub)}
.drawer-menu{display:flex;flex-direction:column;margin-top:12px}
.drawer-menu a{color:var(--txt);padding:11px 8px;border-radius:8px}
.drawer-menu a:hover{background:rgba(73,177,245,.1);color:var(--acc)}
.drawer-foot{margin-top:18px;color:var(--sub);font-size:.8em}

/* ---------- 序幕 ---------- */
#intro{position:fixed;inset:0;background:#060709;z-index:2000;display:grid;place-items:center;transition:opacity 1.2s}
#intro.fade{opacity:0;pointer-events:none}
.intro-inner{max-width:620px;padding:30px;text-align:center;color:#b9bec8}
#intro-text{font-size:1.02em;line-height:2.3;letter-spacing:.5px;white-space:pre-wrap;min-height:280px}
#intro-text .warn{display:block;margin-top:26px;font-size:.8em;color:#6d7480;line-height:2}
#intro-actions{margin-top:34px}
#intro-start{border:1.5px solid #5a6472;color:#cfd4dc;padding:11px 52px;border-radius:40px;font-size:1em;letter-spacing:8px;transition:.3s}
#intro-start:hover{border-color:#e8c07a;color:#e8c07a}

/* ---------- 加密文章 ---------- */
.encrypt-box{background:var(--bg);border:1.5px dashed var(--line);border-radius:12px;text-align:center;padding:44px 24px;margin:10px 0}
.encrypt-box .lock-ic{font-size:2.4em;margin-bottom:8px}
.encrypt-box p{color:var(--sub);font-size:.9em;margin:4px 0 14px}
.encrypt-box .enc-hint{font-size:.84em;color:var(--acc);opacity:.9}
.encrypt-box input{display:block;margin:0 auto 12px;width:min(320px,80%);padding:11px 16px;border-radius:10px;border:1.5px solid var(--line);background:var(--card);color:var(--txt);text-align:center;font-size:1em;letter-spacing:3px}
.encrypt-box input:focus{outline:none;border-color:var(--acc)}
.encrypt-box button{background:var(--acc);color:#fff;padding:9px 40px;border-radius:10px;letter-spacing:4px}
.encrypt-box.err input{border-color:#e0604c;animation:shake .4s}
@keyframes shake{0%,100%{transform:none}25%{transform:translateX(-7px)}75%{transform:translateX(7px)}}

/* ---------- 章节横幅 ---------- */
.chap-banner{margin:0 0 22px;padding:18px 24px;background:var(--card);border-left:4px solid var(--acc);border-radius:var(--radius);box-shadow:var(--shadow);font-size:.92em;color:var(--sub)}
.chap-banner b{color:var(--txt);font-size:1.1em;display:block;margin-bottom:2px}

/* ---------- 截图组件（群聊） ---------- */
.shot{background:var(--code);border-radius:10px;padding:14px 16px;margin:1em 0;font-size:.9em;box-shadow:inset 0 0 0 1px var(--line)}
.shot .shot-head{text-align:center;color:var(--sub);font-size:.82em;padding-bottom:8px;border-bottom:1px solid var(--line);margin-bottom:10px}
.shot .row{display:flex;gap:10px;margin:10px 0;align-items:flex-start}
.shot .row.me{flex-direction:row-reverse}
.shot .ava{width:34px;height:34px;border-radius:6px;flex-shrink:0;display:grid;place-items:center;color:#fff;font-size:.8em;font-weight:700}
.shot .bub{background:var(--card);border-radius:4px 10px 10px 10px;padding:8px 12px;max-width:75%;line-height:1.7;word-break:break-word}
.shot .row.me .bub{background:#95c781;color:#17301a;border-radius:10px 4px 10px 10px}
html[data-theme=dark] .shot .row.me .bub{background:#3e6b3a;color:#dff0d8}
.shot .who{font-size:.78em;color:var(--sub);margin-bottom:2px}
.shot .time{display:block;text-align:center;color:var(--sub);font-size:.78em;margin:6px 0}
.shot-img{display:block;border-radius:8px;margin:6px 0;max-width:200px}

/* ---------- 纸质文件组件 ---------- */
.paper{background:linear-gradient(175deg,#efe9d8,#e6dfcb);color:#3d3a30;border-radius:6px;padding:26px 30px;margin:1em 0;box-shadow:0 4px 14px rgba(0,0,0,.18);font-size:.92em;position:relative}
html[data-theme=dark] .paper{background:linear-gradient(175deg,#d9d2bd,#cfc7b0);color:#33302a}
.paper h4{text-align:center;font-size:1.15em;letter-spacing:3px;margin-bottom:14px;font-family:serif}
.paper .p-row{display:flex;gap:8px;margin:6px 0;line-height:1.9}
.paper .p-row label{color:#7a7461;flex-shrink:0}
.paper .stamp{position:absolute;right:26px;bottom:20px;border:3px solid #b8433a;color:#b8433a;border-radius:6px;padding:4px 12px;transform:rotate(-8deg);font-weight:700;letter-spacing:3px;opacity:.8;font-family:serif}
.paper .sign{display:flex;justify-content:space-between;margin-top:18px}
.paper .hand{font-family:"Kaiti SC",KaiTi,cursive}
.paper.redact span.rd{background:#3d3a30;color:#3d3a30;border-radius:2px;transition:.3s;cursor:help}
.paper.redact:hover span.rd{background:transparent;color:#8a3a30}

/* ---------- 显影（文字谷） ---------- */
mark.xian{background:linear-gradient(transparent 55%,rgba(255,196,86,.85) 55%);color:inherit;padding:0 1px;border-radius:2px}
.decode-note{background:rgba(255,196,86,.14);border:1px solid rgba(214,158,46,.4);border-radius:10px;padding:12px 18px;margin:1em 0;font-size:.92em}
.decode-note b{color:#b57a14}
html[data-theme=dark] .decode-note b{color:#e8b45a}
.xian-btn{display:inline-block;border:1.5px solid rgba(214,158,46,.5);color:#b57a14;border-radius:20px;padding:3px 16px;font-size:.82em;margin:6px 0;transition:.2s}
.xian-btn:hover{background:rgba(255,196,86,.18)}
html[data-theme=dark] .xian-btn{color:#e8b45a}

/* ---------- 档案袋 ---------- */
.dangan{background:var(--card);border-radius:var(--radius);box-shadow:var(--shadow);overflow:hidden}
.dangan .dg-head{background:linear-gradient(120deg,#c8a86c,#b28c50);padding:22px 30px;color:#fff}
.dangan .dg-head h1{font-size:1.5em;letter-spacing:4px;display:flex;align-items:center;gap:10px}
.dangan .dg-head p{font-size:.85em;opacity:.9;margin-top:4px}
.dangan .dg-tabs{display:flex;background:var(--code);overflow-x:auto}
.dangan .dg-tabs button{padding:12px 20px;font-size:.95em;color:var(--sub);border-bottom:2.5px solid transparent;white-space:nowrap}
.dangan .dg-tabs button.on{color:var(--acc);border-color:var(--acc);background:var(--card)}
.dangan .dg-body{padding:24px 28px;min-height:300px}
.chain-block{margin-bottom:26px}
.chain-block h3{font-size:1.05em;margin-bottom:10px;display:flex;align-items:center;gap:8px}
.chain-block h3 .st{font-size:.75em;padding:2px 10px;border-radius:12px;background:rgba(73,177,245,.15);color:var(--acc)}
.chain-block h3 .st.ok{background:rgba(103,182,79,.18);color:#5e9e3e}
.ev-slot{display:flex;gap:10px;align-items:center;padding:10px 14px;border:1.5px dashed var(--line);border-radius:10px;margin-bottom:8px;background:var(--bg);cursor:default;transition:.2s}
.ev-slot.got{border-style:solid;border-color:rgba(103,182,79,.5);cursor:pointer}
.ev-slot.got:hover{background:rgba(103,182,79,.08)}
.ev-slot .ev-ic{width:38px;height:38px;border-radius:9px;display:grid;place-items:center;background:var(--code);flex-shrink:0;font-size:1.05em}
.ev-slot b{font-size:.95em}
.ev-slot small{display:block;color:var(--sub);font-size:.8em}
.ev-slot .req{margin-left:auto;font-size:.75em;color:var(--sub);flex-shrink:0}
.ev-slot.got .req{color:#5e9e3e}
.ev-slot.empty b{color:var(--sub)}
.ev-slot.empty .ev-ic{opacity:.4}
.dg-tip{font-size:.85em;color:var(--sub);background:var(--code);border-radius:10px;padding:12px 16px;margin-bottom:18px;line-height:1.9}
.tl-item{display:flex;gap:14px;padding:10px 0;border-left:2px solid var(--line);margin-left:8px;padding-left:20px;position:relative}
.tl-item::before{content:"";position:absolute;left:-6px;top:18px;width:10px;height:10px;border-radius:50%;background:var(--acc)}
.tl-item.ghost::before{background:#c3c7cd}
.tl-item time{font-family:Consolas,monospace;color:var(--acc);font-size:.88em;flex-shrink:0;width:96px}
.tl-item p{font-size:.92em;margin:0}
.chip-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:12px}
.chip{background:var(--bg);border:1px solid var(--line);border-radius:10px;padding:14px 16px;font-size:.9em;transition:.2s}
.chip.got{border-color:rgba(103,182,79,.45)}
.chip b{display:flex;gap:8px;align-items:center}
.chip p{color:var(--sub);font-size:.85em;margin-top:4px}
.chip.empty{opacity:.55;filter:grayscale(.8)}
.end-shelf{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.end-slot{border:1.5px dashed var(--line);border-radius:10px;padding:18px 12px;text-align:center;color:var(--sub);font-size:.9em;background:var(--bg)}
.end-slot.got{border-style:solid;border-color:rgba(214,158,46,.55);background:rgba(255,196,86,.1);color:var(--txt)}
.end-slot .en{font-size:1.2em;font-weight:700;display:block;margin-bottom:4px}
.end-slot .et{font-size:.78em;display:block}
.dg-foot{display:flex;gap:10px;padding:16px 28px;border-top:1px solid var(--line)}
.dg-foot button{border:1.5px solid var(--line);border-radius:8px;padding:8px 18px;font-size:.88em;color:var(--txt)}
.dg-foot button:hover{border-color:var(--acc);color:var(--acc)}
.dg-foot button.danger:hover{border-color:#e0604c;color:#e0604c}
.ev-pop{position:fixed;inset:0;z-index:1100;background:rgba(10,14,22,.6);display:grid;place-items:center;padding:20px}
.ev-pop .evp-card{background:var(--card);border-radius:14px;max-width:640px;width:100%;max-height:82vh;overflow:auto;padding:26px 30px;box-shadow:0 20px 60px rgba(0,0,0,.4)}
.evp-card h3{margin-bottom:6px;display:flex;gap:10px;align-items:center}
.evp-card .evp-src{font-size:.82em;color:var(--acc);margin-bottom:12px}
.evp-card .evp-body{font-size:.94em;line-height:1.9}
.evp-card .evp-close{float:right;color:var(--sub);font-size:1.2em}

/* ---------- 601室 ---------- */
.room-wrap{background:var(--card);border-radius:var(--radius);box-shadow:var(--shadow);padding:24px 28px}
.room-wrap h1{font-size:1.4em;text-align:center}
.room-wrap .room-sub{text-align:center;color:var(--sub);font-size:.88em;margin:4px 0 18px}
.room-stage{position:relative;border-radius:12px;overflow:hidden;box-shadow:var(--shadow)}
.room-stage{position:relative} .room-stage img{border-radius:8px}

.room-stage svg{display:block;width:100%;height:auto}
.hotspot{cursor:pointer}
.hotspot .hs-dot{transition:.2s;transform-origin:center;transform-box:fill-box}
.hotspot:hover .hs-dot{transform:scale(1.25)}
.hotspot.done .hs-dot{fill:#67b64f!important}
.hotspot.open .hs-dot{fill:var(--acc2)!important}
.room-dialog{margin-top:16px;background:var(--bg);border-radius:10px;padding:16px 20px;min-height:70px;font-size:.95em;line-height:1.9;box-shadow:inset 0 0 0 1px var(--line)}
.room-dialog b{color:var(--acc)}
.room-dialog .rd-actions{margin-top:10px;display:flex;gap:10px;flex-wrap:wrap}
.room-dialog .rd-actions button{border:1.5px solid var(--line);border-radius:8px;padding:7px 18px;font-size:.88em;color:var(--txt);transition:.2s}
.room-dialog .rd-actions button:hover:not(:disabled){border-color:var(--acc);color:var(--acc)}
.room-dialog .rd-actions button.hold{position:relative;overflow:hidden}
.room-dialog .rd-actions button.hold::after{content:"";position:absolute;left:0;top:0;bottom:0;width:0;background:rgba(73,177,245,.2);transition:none}
.room-dialog .rd-actions button.holding::after{width:100%}
.room-hint{text-align:center;color:var(--sub);font-size:.8em;margin-top:12px}

/* ---------- 留言板 ---------- */
.liuyan{background:var(--card);border-radius:var(--radius);box-shadow:var(--shadow);padding:28px 32px}
.liuyan h1{font-size:1.5em;margin-bottom:6px}
.liuyan .ly-sub{color:var(--sub);font-size:.9em;margin-bottom:18px}
.ly-form{display:flex;gap:10px;margin-bottom:8px}
.ly-form input{flex:1;border:1.5px solid var(--line);background:var(--bg);color:var(--txt);border-radius:10px;padding:12px 16px;font-size:.98em}
.ly-form input:focus{outline:none;border-color:var(--acc)}
.ly-form button{background:var(--acc);color:#fff;border-radius:10px;padding:0 28px;letter-spacing:2px}
.ly-list{margin-top:16px}
.ly-item{display:flex;gap:12px;padding:16px 0;border-bottom:1px dashed var(--line);animation:pop .5s}
.ly-item .ava{width:42px;height:42px;border-radius:50%;flex-shrink:0;display:grid;place-items:center;color:#fff;font-weight:700}
.ly-item .who{font-size:.85em;color:var(--sub)}
.ly-item .who b{color:var(--txt);margin-right:8px}
.ly-item .txt{white-space:pre-wrap;margin-top:2px;line-height:1.9}
.ly-item.reply{background:rgba(73,177,245,.05);border-radius:0 12px 12px 12px;margin-left:52px;border-bottom:none;padding:12px 16px}

/* ---------- 结局卷宗 ---------- */
#ending{position:fixed;inset:0;z-index:3000;background:#0a0c10;overflow:auto;display:grid;place-items:center;padding:30px 16px}
#ending .end-card{max-width:660px;width:100%;background:linear-gradient(175deg,#efe9d8,#e2d9c2);color:#3d3a30;border-radius:8px;padding:44px 46px;box-shadow:0 30px 90px rgba(0,0,0,.7);position:relative;animation:endin 1.4s}
@keyframes endin{0%{opacity:0;transform:translateY(30px) scale(.98)}100%{opacity:1;transform:none}}
#ending .end-tag{display:inline-block;border:2px solid #b8433a;color:#b8433a;font-weight:700;letter-spacing:4px;padding:3px 16px;border-radius:4px;transform:rotate(-3deg);font-size:.9em;font-family:serif}
#ending h1{font-size:2.1em;letter-spacing:8px;margin:16px 0 4px;font-family:serif}
#ending .end-sub{color:#8a8270;font-size:.88em;margin-bottom:22px}
#ending .end-body p{margin:1em 0;line-height:2.05;font-size:.97em}
#ending .end-body .end-quote{font-family:serif;font-weight:700;color:#6d5a34}
#ending .end-stamp{margin-top:26px;border-top:1px dashed #b9ad94;padding-top:18px;display:flex;justify-content:space-between;align-items:center;color:#8a8270;font-size:.85em}
#ending .end-acts{margin-top:26px;display:flex;gap:12px;justify-content:center}
#ending .end-acts button{border:1.5px solid #8a8270;color:#6d6455;padding:9px 26px;border-radius:30px;letter-spacing:3px;font-size:.9em}
#ending .end-acts button:hover{border-color:#b8433a;color:#b8433a}

/* ---------- 长按涟漪 & 工具 ---------- */
.fade-in{animation:fadein .5s}
@keyframes fadein{0%{opacity:0;transform:translateY(10px)}100%{opacity:1;transform:none}}
.hide{display:none!important}
.center{text-align:center}
.dim{color:var(--sub)}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}

/* ---------- 响应式 ---------- */
@media (max-width:900px){
  #sidebar{display:none}
  #banner{height:100vh;background-attachment:scroll}
  #banner.post-mode{height:46vh;min-height:300px}
  .banner-title h1{font-size:2.3em}
  .post-mode .banner-title h1{font-size:1.7em}
  #main.overlap #app{margin-top:-40px}
  #menu-btn{display:grid}
  #nav .menu{display:none}
  #search-btn{display:none!important}
  #nav #search-m-btn{display:grid!important}
  .single,.list-page,.liuyan,.room-wrap{padding:24px 20px}
  .prevnext{flex-direction:column}
  .end-shelf{grid-template-columns:1fr 1fr}
  .post-card .cover{height:200px}
  #drawer .drawer-menu a{font-size:1em}
}
@media (max-width:520px){
  .post-card .pc-body{padding:18px 18px 20px}
  .post-card h2{font-size:1.25em}
  .single h1{font-size:1.5em}
  .pc-meta{gap:10px}
  .end-shelf{grid-template-columns:1fr}
  .shot .bub{max-width:82%}
  .hotspot{width:36px!important;height:36px!important;font-size:1em!important}
  #ending .end-card{padding:32px 24px}
  #ending h1{font-size:1.6em;letter-spacing:5px}
}


/* ---------- 音乐播放器 v4（液态玻璃） ---------- */
#music-widget{position:fixed;left:14px;bottom:18px;z-index:950}
.mw-fab{position:relative;width:78px;height:54px;cursor:pointer;filter:drop-shadow(0 10px 20px rgba(0,0,0,.38))}
.mw-disc{position:absolute;left:0;bottom:4px;width:47px;height:47px;border-radius:50%;z-index:1;display:grid;place-items:center;transition:transform .55s cubic-bezier(.22,1.4,.36,1)}
.mw-vinyl{position:absolute;inset:0;border-radius:50%;
  background:conic-gradient(from 205deg,rgba(255,255,255,.14),rgba(255,255,255,0) 55deg,rgba(255,255,255,.08) 130deg,rgba(255,255,255,0) 210deg,rgba(255,255,255,.14) 300deg,rgba(255,255,255,0)),repeating-radial-gradient(circle at 50% 50%,#0f1015 0 2px,#1c1e26 2px 4px);
  box-shadow:0 3px 10px rgba(0,0,0,.5),inset 0 1px 1px rgba(255,255,255,.18);transition:box-shadow .4s}
.mw-vinyl::after{content:"";position:absolute;left:50%;top:50%;width:19px;height:19px;transform:translate(-50%,-50%);border-radius:50%;background:radial-gradient(circle at 35% 30%,#ecc36a 0 30%,#a87c2e 60%,#c8973f 100%);box-shadow:inset 0 0 0 2px rgba(0,0,0,.3),inset 0 1px 1px rgba(255,255,255,.5)}
.mw-note{position:relative;z-index:2;color:#241c0d;font-size:11.5px;font-weight:700;line-height:1}
#music-widget.playing .mw-disc{transform:translateX(33px)}
#music-widget.playing .mw-vinyl{animation:mwrot 7s linear infinite;box-shadow:0 3px 10px rgba(0,0,0,.5),0 0 0 3px rgba(200,151,63,.25),0 0 20px rgba(200,151,63,.3)}
@keyframes mwrot{to{transform:rotate(360deg)}}
.mw-sleeve{position:absolute;left:0;bottom:0;width:54px;height:54px;border-radius:13px;overflow:hidden;z-index:2;
  box-shadow:0 6px 18px rgba(0,0,0,.45),inset 0 1px 0 rgba(255,255,255,.35),inset 0 -1px 0 rgba(255,255,255,.08),0 0 0 1px rgba(255,255,255,.12);
  transition:transform .35s cubic-bezier(.22,1.4,.36,1)}
.mw-sleeve:hover{transform:translateY(-3px) scale(1.03)}
.mw-sleeve:active{transform:scale(.96)}
.mw-sleeve img{width:100%;height:100%;display:block}
.mw-sleeve::after{content:"";position:absolute;inset:0;background:linear-gradient(160deg,rgba(255,255,255,.28),rgba(255,255,255,0) 42%);pointer-events:none}
.mw-badge{position:absolute;right:5px;bottom:5px;width:17px;height:17px;border-radius:50%;background:rgba(8,10,14,.55);backdrop-filter:blur(4px);display:grid;place-items:center;transition:.3s;overflow:hidden;box-shadow:inset 0 1px 0 rgba(255,255,255,.2)}
.mw-badge .mw-eq{display:flex;align-items:flex-end;gap:2px;height:7px}
.mw-badge .mw-eq i{width:2.5px;height:30%;border-radius:1px;background:#8a8f98;transition:.3s}
#music-widget.playing .mw-badge .mw-eq i{background:#e8c07a;animation:eq .9s ease-in-out infinite}
#music-widget.playing .mw-badge .mw-eq i:nth-child(2){animation-duration:.7s;animation-delay:.12s}
#music-widget.playing .mw-badge .mw-eq i:nth-child(3){animation-duration:1.1s;animation-delay:.05s}
@keyframes eq{0%,100%{height:30%}50%{height:100%}}

/* 玻璃面板 */
.mw-panel{position:absolute;left:0;bottom:64px;width:262px;padding:12px 14px 11px;border-radius:20px;
  background:linear-gradient(135deg,rgba(255,255,255,.84),rgba(255,255,255,.62));
  backdrop-filter:blur(24px) saturate(1.6) brightness(1.18);-webkit-backdrop-filter:blur(24px) saturate(1.6) brightness(1.18);
  border:1px solid rgba(255,255,255,.45);
  box-shadow:0 24px 60px -12px rgba(0,0,0,.45),inset 0 1.5px 0 rgba(255,255,255,.65),inset 0 -1px 0 rgba(255,255,255,.2),inset 1px 0 0 rgba(255,255,255,.3);
  transform-origin:left bottom;animation:pop .32s;overflow:hidden;isolation:isolate}
.mw-panel.hide{display:none}
/* 流动的液态高光 */
.mw-panel::before{content:"";position:absolute;inset:-40%;z-index:-1;pointer-events:none;
  background:radial-gradient(45% 38% at 22% 14%,rgba(255,255,255,.5),rgba(255,255,255,0) 70%),
             radial-gradient(38% 30% at 84% 88%,rgba(180,214,255,.35),rgba(180,214,255,0) 70%);
  animation:mwflow 14s ease-in-out infinite alternate}
.mw-panel::after{content:"";position:absolute;inset:0;z-index:2;pointer-events:none;opacity:0;transition:opacity .4s;
  background:radial-gradient(190px circle at var(--mx,28%) var(--my,18%),rgba(255,255,255,.32),rgba(255,255,255,0) 62%)}
.mw-panel:hover::after{opacity:1}
@keyframes mwflow{0%{transform:translate(0,0) rotate(0deg)}50%{transform:translate(3%,-2%) rotate(2deg)}100%{transform:translate(-2%,3%) rotate(-2deg)}}
.mw-panel>*{position:relative;z-index:3}
.mw-tag{font-size:.6em;letter-spacing:3px;color:#39404e;font-family:Consolas,monospace;margin-bottom:12px;display:flex;align-items:center;gap:7px}
.mw-tag::before{content:"";width:5px;height:5px;border-radius:50%;background:var(--acc2);animation:blink 1.6s ease-in-out infinite;box-shadow:0 0 8px rgba(255,114,66,.7)}
.mw-head{display:flex;gap:10px;align-items:center;margin-bottom:10px}
.mw-cover{width:44px;height:44px;border-radius:11px;box-shadow:0 6px 14px rgba(0,0,0,.3),inset 0 1px 0 rgba(255,255,255,.4)}
.mw-info{min-width:0}
.mw-info b{display:flex;align-items:center;gap:7px;font-size:.9em;line-height:1.5;color:#15171d}
.mw-info>span{font-size:.72em;color:#3a4050;letter-spacing:.5px}
.mw-eq{display:inline-flex;align-items:flex-end;gap:2px;height:11px}
.mw-eq i{width:3px;border-radius:1.5px;background:var(--acc);height:30%;opacity:0;transition:opacity .3s}
#music-widget.playing .mw-info .mw-eq i{opacity:1;animation:eq .9s ease-in-out infinite}
#music-widget.playing .mw-info .mw-eq i:nth-child(2){animation-duration:.7s;animation-delay:.12s}
#music-widget.playing .mw-info .mw-eq i:nth-child(3){animation-duration:1.1s;animation-delay:.05s}
.mw-bar{position:relative;height:5px;border-radius:3px;background:rgba(120,130,150,.25);cursor:pointer;margin:3px 0 5px;overflow:visible;box-shadow:inset 0 1px 2px rgba(0,0,0,.12)}
.mw-bar:hover .mw-thumb{transform:translate(-50%,-50%) scale(1.3)}
.mw-played{position:absolute;left:0;top:0;bottom:0;width:0;border-radius:3px;background:linear-gradient(90deg,var(--acc),var(--acc2));box-shadow:0 0 10px rgba(73,177,245,.55)}
.mw-thumb{position:absolute;left:0;top:50%;width:10px;height:10px;border-radius:50%;background:rgba(255,255,255,.9);border:2px solid var(--acc);transform:translate(-50%,-50%);box-shadow:0 2px 8px rgba(0,0,0,.3);transition:transform .15s;opacity:0}
.mw-bar:hover .mw-thumb,.mw-bar:active .mw-thumb{opacity:1}
.mw-times{display:flex;justify-content:space-between;font-size:.66em;color:#3a4050;font-family:Consolas,monospace;letter-spacing:.5px}
.mw-ctrls{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;margin-top:9px}
.mw-ctrls>button{width:32px;height:32px;border-radius:11px;display:grid;place-items:center;color:#2e3340;background:rgba(255,255,255,.35);border:1px solid rgba(255,255,255,.4);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.55),0 2px 6px rgba(0,0,0,.08);
  backdrop-filter:blur(6px);transition:transform .25s cubic-bezier(.22,1.4,.36,1),background .2s,color .2s;justify-self:start}
.mw-ctrls>button:hover{color:var(--acc);transform:translateY(-2px)}
.mw-ctrls>button:active{transform:scale(.9)}
#mw-play{width:38px;height:38px;justify-self:center;border-radius:13px;color:#fff;
  background:linear-gradient(145deg,#5cc0ff,#2f86d8 60%,#2076c8);
  box-shadow:0 10px 24px -6px rgba(73,177,245,.6),inset 0 1.5px 0 rgba(255,255,255,.5),inset 0 -2px 4px rgba(0,0,0,.15);
  transition:transform .25s cubic-bezier(.22,1.4,.36,1),box-shadow .25s}
#mw-play:hover{transform:translateY(-2px) scale(1.04);box-shadow:0 14px 30px -6px rgba(73,177,245,.7),inset 0 1.5px 0 rgba(255,255,255,.5)}
#mw-play:active{transform:scale(.92)}
.mw-vol{grid-column:3;justify-self:end;display:flex;align-items:center;gap:7px;color:#39404e}
.mw-vol input{-webkit-appearance:none;appearance:none;width:50px;height:4px;border-radius:3px;outline:none;cursor:pointer;background:linear-gradient(90deg,var(--acc) 70%,rgba(120,130,150,.25) 70%);box-shadow:inset 0 1px 2px rgba(0,0,0,.12)}
.mw-vol input::-webkit-slider-thumb{-webkit-appearance:none;width:10px;height:10px;border-radius:50%;background:rgba(255,255,255,.95);border:2px solid var(--acc);cursor:pointer;box-shadow:0 1px 4px rgba(0,0,0,.25)}
.mw-vol input::-moz-range-thumb{width:10px;height:10px;border-radius:50%;background:#fff;border:2px solid var(--acc);cursor:pointer}
.mw-lyric{margin-top:9px;font-size:.74em;color:#23262e;background:rgba(255,255,255,.4);border:1px solid rgba(255,255,255,.4);border-radius:12px;padding:10px 14px;line-height:2;font-style:italic}
/* 深色模式：深色玻璃 */
html[data-theme="dark"] .mw-panel{background:linear-gradient(135deg,rgba(44,46,58,.62),rgba(30,32,42,.42));border-color:rgba(255,255,255,.14);box-shadow:0 24px 60px -12px rgba(0,0,0,.7),inset 0 1.5px 0 rgba(255,255,255,.16),inset 0 -1px 0 rgba(255,255,255,.05)}
html[data-theme="dark"] .mw-panel::before{opacity:.6}
html[data-theme="dark"] .mw-panel::after{background:radial-gradient(190px circle at var(--mx,28%) var(--my,18%),rgba(160,200,255,.16),rgba(160,200,255,0) 62%)}
html[data-theme="dark"] .mw-tag,html[data-theme="dark"] .mw-info b,html[data-theme="dark"] .mw-times,html[data-theme="dark"] .mw-info>span{color:var(--txt)}
html[data-theme="dark"] .mw-info>span{color:var(--sub)}
html[data-theme="dark"] .mw-ctrls>button{color:var(--txt);background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.1)}
html[data-theme="dark"] .mw-lyric{background:rgba(255,255,255,.07);border-color:rgba(255,255,255,.1);color:var(--sub)}
@media (max-width:900px){ .mw-panel{width:min(262px,80vw)} }

/* ---------- 结局卷宗：文字随音乐逐段淡入 ---------- */
#ending{animation:endbg 1.1s ease both}
@keyframes endbg{from{opacity:0}to{opacity:1}}
.fade-seq{opacity:0;animation:pgfade .9s ease both}
@keyframes pgfade{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
.end-card .end-body p{margin:1em 0;line-height:2.05;font-size:.97em}

/* ---------- 结局插图 ---------- */
.end-img{width:100%;height:190px;object-fit:cover;border-radius:12px;margin:2px 0 6px;box-shadow:0 8px 22px rgba(0,0,0,.35)}

/* ---------- 关于页 ---------- */
.about-head{display:flex;gap:18px;align-items:center;padding:6px 0 18px;border-bottom:1px solid var(--line);margin-bottom:8px;position:relative}
.about-avatar{width:84px;height:84px;border-radius:50%;border:3px solid rgba(73,177,245,.3);box-shadow:var(--shadow)}
.about-id b{font-size:1.25em;display:block}
.about-id span{display:block;font-size:.85em;color:var(--sub);line-height:1.8}
.about-badge{position:absolute;right:0;top:10px;border:2px solid var(--acc);color:var(--acc);font-size:.72em;padding:2px 10px;border-radius:4px;transform:rotate(4deg);letter-spacing:2px}
.about-list{list-style:none;margin:.6em 0}
.about-list li{display:flex;gap:14px;padding:8px 0;border-bottom:1px dashed var(--line);align-items:baseline}
.about-list time{font-family:Consolas,monospace;color:var(--acc);font-size:.88em;flex-shrink:0;width:88px}
.about-list span{font-size:.95em}

/* ---------- 页脚（Butterfly 风格） ---------- */
#footer{margin-top:38px;padding:6px 16px 34px;text-align:center;color:var(--sub);font-size:.86em;line-height:2.15}
#footer p{margin:2px 0}
#footer a{color:var(--sub)}
#footer a:hover{color:var(--acc)}
.foot-icon{font-size:1.1em;opacity:.75;margin-bottom:4px;user-select:none}
.foot-sep{margin:0 9px;opacity:.45}
