🎭 角色简介
Character Dossier
—
PROFILE | 角色概览
Name | 姓名:
张书砚
Alias / Code Name | 别称 / 代号:
张局
Age | 年龄:
36
Gender | 性别:
男
Occupation | …
💬 开场白
这里是993/好多鱼/小碗
欢迎来到银塔实业！银塔实业目前打算出三张卡，后期会出“野狗”团队的系列卡❤️（林海清已发，程西衍已发，衍生卡柳林已发）
🔴🔴只是很普通的卡，不要抱有太大的期望张书砚🔫
点击卡片背面有判词
完全更新结束，感谢所有老师的喜欢和支持！右滑第一个是张局长的自白书
每个开场白都有音乐，老婆们注意音量❤️有条件的可以听一下，都是我严格挑选的❤️开头的播放器保留了，状态栏里还有一个，按个人喜欢用
🟥注意！！开场白一user有精神疾病，此开场白是user自杀未遂，不能接受的自行往后翻阅即可，开场白一走的是互相救赎和治愈，能接受的老婆打开开场白一世界书，自行填充身份，自行填充得病原因
“世界上有那么多橘子，总有一个是甜的”开场白二：甜蜜大学恋爱日常❤️
“世界上美好的东西不太多，立秋傍晚从河对岸吹来的风，和二十来岁笑起来要人命的你。”
（打开世界书二）开场白三：办公室恋情，身为秘书的你，对于刚签订婚约的他，该如何抉择？
“你我都是这规则里的困兽”开场白四：吵架pa（情人？）
“她说她想结婚，于是我们大吵一架”开场白五：久别重逢
“如果再见不能红着眼，是否还能红着脸？”开场白六：真骨科真囚禁
“你可以恨我，但我不允许你再次离开我”
（打开骨科世界书）开场白七：人鬼情未了（暗黑系：亲爱的，你是真的复活了，还是他胃穿孔晕倒前的幻想？这只是我的想法，和开场白情感基调没什么关系）
“我在梦中向神明祈祷，祈祷再次见到你，祈祷让你回来”
（打开人鬼情未了世界书）开场白八：番茄小说考公人爽文
“别走考公楼梯了，我带你上局长电梯”开场白九：张局长养了只小猫
“愚人节快乐”开场白十：出轨？！
“他把笼子打开放你自由，却忘了你想要的只是他进来”开场白十一：奇幻少女的高中穿越！
“关于我穿越到我爱人高中玩乐队的那年夏天”
（开世界书，关世界书哦）开场白十二：敌对关系
“常在河边走，哪有不湿鞋”
（没有单独世界书）开场白十三：关于我前女友来查我这件事
“你来是查我，还是有旧账想翻？”开场白十四：结婚了又如何呢
“你是你，他是谁不重要”开场白十五：关于我前任给我发婚礼邀请函，但我还爱她这件事
“我不喜欢标准答案”“`html
<!DOCTYPE html>
<html lang="zh">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>银塔实业</title>
<link href="https://fonts.googleapis.com/css2?family=Ma+Shan+Zheng&family=Noto+Serif+SC:wght@500;700&display=swap" rel="stylesheet">
<style>
body {
font-family: 'Noto Serif SC', serif；
display: flex;
justify-content: center;
align-items: center;
margin: 0;
overflow: hidden;
background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="100" height="100" viewBox="0 0 100 100"><path d="M20,20 L80,80 M80,20 L20,80" stroke="%23222" stroke-width="0.5"/></svg>');
}.scene {
width: 320px;
height: 580px;
perspective: 1200px;
margin: 20px;
}.card {
width: 100%;
height: 100%;
position: relative;
transition: transform 1s cubic-bezier(0.645, 0.045, 0.355, 1);
transform-style: preserve-3d;
box-shadow: 0 0 40px rgba(180, 0, 0, 0.4), 0 0 20px rgba(255, 215, 0, 0.3);
}.card.flipped {
transform: rotateY(180deg);
}.card-face {
position: absolute;
width: 100%;
height: 100%;
backface-visibility: hidden;
border-radius: 15px;
display: flex;
flex-direction: column;
box-sizing: border-box;
padding: 25px;
overflow: hidden;
}.front, .back {
background: linear-gradient(135deg, #111111, #1f1f1f);
color: #ddd;
border: 1px solid #444;
}/* 豪华外框 */
.card-face::before {
content: '';
position: absolute;
top: 5px;
left: 5px;
right: 5px;
bottom: 5px;
border: 1px solid rgba(255, 215, 0, 0.5);
border-radius: 10px;
pointer-events: none;
z-index: 2;
box-shadow: inset 0 0 15px rgba(255, 215, 0, 0.2);
}/* 华丽的背景纹理 */
.card-face::after {
content: '';
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
background-image:
url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="40" height="40" viewBox="0 0 40 40"><path d="M20,20 m-18,0 a18,18 0 1,0 36,0 a18,18 0 1,0 -36,0" stroke="%23333" fill="none" stroke-width="0.5"/></svg>'),
url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="100" height="100" viewBox="0 0 100 100"><path d="M0,0 L100,100 M100,0 L0,100" stroke="%23222" stroke-width="0.3"/></svg>');
opacity: 0.3;
pointer-events: none;
z-index: 1;
}.back {
transform: rotateY(180deg);
}/* 奢华角落装饰 */
.corner {
position: absolute;
width: 50px;
height: 50px;
z-index: 3;
}.top-left {
top: 0;
left: 0;
border-top: 3px solid #b8860b;
border-left: 3px solid #b8860b;
border-top-left-radius: 10px;
box-shadow: 0 0 15px rgba(255, 215, 0, 0.3);
}.top-right {
top: 0;
right: 0;
border-top: 3px solid #b8860b;
border-right: 3px solid #b8860b;
border-top-right-radius: 10px;
box-shadow: 0 0 15px rgba(255, 215, 0, 0.3);
}.bottom-left {
bottom: 0;
left: 0;
border-bottom: 3px solid #b8860b;
border-left: 3px solid #b8860b;
border-bottom-left-radius: 10px;
box-shadow: 0 0 15px rgba(255, 215, 0, 0.3);
}.bottom-right {
bottom: 0;
right: 0;
border-bottom: 3px solid #b8860b;
border-right: 3px solid #b8860b;
border-bottom-right-radius: 10px;
box-shadow: 0 0 15px rgba(255, 215, 0, 0.3);
}/* 奢华装饰元素 */
.luxury-ornament {
position: absolute;
width: 80px;
height: 20px;
background: linear-gradient(90deg, transparent, rgba(218, 165, 32, 0.3), transparent);
z-index: 2;
}.ornament-top {
top: 15px;
left: 50%;
transform: translateX(-50%);
}.ornament-bottom {
bottom: 15px;
left: 50%;
transform: translateX(-50%);
}.title {
font-family: 'Ma Shan Zheng', cursive;
font-size: 34px;
text-align: center;
margin: 30px 0 40px;
color: #fff;
text-shadow: 0 0 15px #ff0000, 0 0 10px #b8860b, 0 0 5px #fff;
position: relative;
z-index: 5;
}.title::after {
content: '';
position: absolute;
left: 50%;
transform: translateX(-50%);
bottom: -15px;
width: 220px;
height: 3px;
background: linear-gradient(90deg, transparent, #daa520, #b8860b, #daa520, transparent);
box-shadow: 0 0 10px #b8860b;
}.content {
font-size: 20px;
line-height: 2;
margin: 30px 0;
position: relative;
z-index: 5;
display: flex;
flex-direction: column;
gap: 25px;
}.content p {
display: flex;
align-items: center;
justify-content: space-between;
margin: 0;
padding: 12px 20px;
background: linear-gradient(90deg, rgba(0, 0, 0, 0.6), rgba(50, 50, 50, 0.3));
border-left: 3px solid #b8860b;
border-right: 1px solid #b8860b;
border-radius: 5px;
box-shadow: 0 5px 15px rgba(0, 0, 0, 0.5), inset 0 0 5px rgba(218, 165, 32, 0.5);
transition: all 0.3s ease;
}.content p:hover {
transform: translateX(5px);
background: linear-gradient(90deg, rgba(30, 0, 0, 0.6), rgba(50, 50, 50, 0.3));
box-shadow: 0 5px 15px rgba(0, 0, 0, 0.5), inset 0 0 10px rgba(218, 165, 32, 0.7);
}.logo {
text-align: center;
margin-top: auto;
font-size: 16px;
color: #b8860b;
font-style: italic;
position: relative;
z-index: 5;
padding-top: 20px;
text-shadow: 0 0 5px rgba(218, 165, 32, 0.5);
}/* 华丽背景装饰 */
.background-elements {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
pointer-events: none;
opacity: 0.15;
z-index: 1;
}.weapon {
position: absolute;
font-size: 30px;
opacity: 0.4;
text-shadow: 0 0 10px rgba(255, 0, 0, 0.7), 0 0 5px rgba(218, 165, 32, 0.5);
}/* 血迹效果 */
.blood-stains {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
pointer-events: none;
z-index: 2;
}.blood-stain {
position: absolute;
background-color: #8a0303;
border-radius: 50%;
filter: blur(8px);
opacity: 0.3;
}/* 背面内容样式 */
.back-content {
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
height: 100%;
position: relative;
z-index: 5;
padding: 20px;
}.name {
font-family: 'Ma Shan Zheng', cursive;
font-size: 42px;
font-weight: bold;
margin-bottom: 40px;
text-shadow: 0 0 15px rgba(255, 0, 0, 0.7), 0 0 10px rgba(218, 165, 32, 0.5);
position: relative;
color: #fff;
}.name::after {
content: '';
position: absolute;
left: 50%;
transform: translateX(-50%);
bottom: -15px;
width: 150px;
height: 2px;
background: linear-gradient(90deg, transparent, #b8860b, transparent);
box-shadow: 0 0 10px rgba(218, 165, 32, 0.7);
}.quote {
font-size: 26px;
line-height: 1.8;
text-align: center;
font-style: italic;
margin: 30px 0;
color: #eee;
text-shadow: 0 0 8px rgba(255, 0, 0, 0.6), 0 0 5px rgba(218, 165, 32, 0.4);
}.instruction {
position: absolute;
bottom: 15px;
left: 0;
right: 0;
text-align: center;
color: #b8860b;
font-size: 12px;
z-index: 5;
text-shadow: 0 0 5px rgba(0, 0, 0, 0.5);
}/* 装饰图案 */
.luxury-pattern {
position: absolute;
width: 100%;
height: 100%;
top: 0;
left: 0;
background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20"><circle cx="10" cy="10" r="1" fill="%23b8860b" opacity="0.3"/></svg>');
opacity: 0.1;
z-index: 1;
}/* 奢华花纹 */
.flourish {
position: absolute;
width: 40px;
height: 40px;
background-size: contain;
background-repeat: no-repeat;
opacity: 0.5;
z-index: 2;
}.flourish-1 {
top: 60px;
left: 20px;
background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100"><path d="M50,0 C50,50 0,50 0,50 C0,50 50,50 50,100 C50,50 100,50 100,50 C100,50 50,50 50,0" stroke="%23b8860b" fill="none" stroke-width="3"/></svg>');
transform: rotate(45deg);
}.flourish-2 {
bottom: 60px;
right: 20px;
background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100"><path d="M50,0 C50,50 0,50 0,50 C0,50 50,50 50,100 C50,50 100,50 100,50 C100,50 50,50 50,0" stroke="%23b8860b" fill="none" stroke-width="3"/></svg>');
transform: rotate(-135deg);
}/* 加入滴血效果 */
.drip {
position: absolute;
background: linear-gradient(180deg, #8a0303, #570202);
width: 8px;
border-radius: 4px 4px 0 0;
z-index: 3;
opacity: 0.7;
animation: drip 4s infinite;
box-shadow: 0 0 5px rgba(0, 0, 0, 0.5);
}@keyframes drip {
0% {
height: 0;
transform: translateY(0);
opacity: 0.7;
}
80% {
height: 40px;
transform: translateY(40px);
opacity: 0.7;
}
100% {
height: 0;
transform: translateY(80px);
opacity: 0;
}
}/* 闪光效果 */
.shine {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: linear-gradient(45deg,
transparent 0%,
rgba(255, 255, 255, 0.03) 45%,
rgba(255, 255, 255, 0.05) 50%,
rgba(255, 255, 255, 0.03) 55%,
transparent 100%);
background-size: 200% 200%;
animation: shine 3s infinite;
pointer-events: none;
z-index: 4;
}@keyframes shine {
0% { background-position: -200% 0; }
100% { background-position: 200% 0; }
}/* 金色粒子效果 */
.gold-particles {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
overflow: hidden;
z-index: 3;
}.particle {
position: absolute;
background-color: #daa520;
border-radius: 50%;
width: 2px;
height: 2px;
opacity: 0;
animation: float 5s infinite ease-in-out;
}@keyframes float {
0% {
opacity: 0;
transform: translateY(0) rotate(0deg);
}
10% {
opacity: 0.8;
}
90% {
opacity: 0.4;
}
100% {
opacity: 0;
transform: translateY(-100px) rotate(360deg);
}
}
</style>
</head>
<body>
<div class="scene">
<div class="card">
<!– 正面 –>
<div class="card-face front">
<div class="corner top-left"></div>
<div class="corner top-right"></div>
<div class="corner bottom-left"></div>
<div class="corner bottom-right"></div>
<div class="luxury-ornament ornament-top"></div>
<div class="luxury-ornament ornament-bottom"></div>
<div class="flourish flourish-1"></div>
<div class="flourish flourish-2"></div>
<div class="luxury-pattern"></div><div class="background-elements" id="frontElements"></div>
<div class="gold-particles" id="goldParticles"></div>
<div class="shine"></div><h1 class="title">欢迎来到银塔实业</h1>
<div class="content">
<p><span>银塔总裁</span> <span>程西衍 📕</span></p>
<p><span>总裁秘书</span> <span>林海清 🔪</span></p>
<p><span>警局局长</span> <span>张书砚 🔫</span></p>
</div><div class="logo">© 银塔实业 – 掌控端城的暗影</div>
<div class="instruction">点击卡片翻转</div>
</div><!– 背面 –>
<div class="card-face back">
<div class="corner top-left"></div>
<div class="corner top-right"></div>
<div class="corner bottom-left"></div>
<div class="corner bottom-right"></div>
<div class="luxury-ornament ornament-top"></div>
<div class="luxury-ornament ornament-bottom"></div>
<div class="flourish flourish-1"></div>
<div class="flourish flourish-2"></div>
<div class="luxury-pattern"></div><div class="blood-stains" id="bloodStains"></div>
<div class="gold-particles" id="goldParticlesBack"></div>
<div class="shine"></div><div class="back-content">
<h2 class="name">张书砚</h2>
<div class="quote">书墨难书贪腐事，<br>砚池尽染浊污流</div>
</div><div class="instruction">点击卡片返回</div>
</div>
</div>
</div><script>
document.addEventListener('DOMContentLoaded', function() {
// 创建前面的背景元素
const frontElements = document.getElementById('frontElements');
const weapons = ['🔫', '🔪', '💰', '🩸', '💎', '🗡️', '⚔️', '🔒'];for (let i = 0; i < 15; i++) {
const weapon = document.createElement('div');
weapon.className = 'weapon';
weapon.textContent = weapons[Math.floor(Math.random() * weapons.length)];
weapon.style.left = `${Math.random() * 90}%`;
weapon.style.top = `${Math.random() * 90}%`;
weapon.style.transform = `rotate(${Math.random() * 360}deg)`;
frontElements.appendChild(weapon);
}// 创建血迹效果
const bloodStains = document.getElementById('bloodStains');
for (let i = 0; i < 15; i++) {
const stain = document.createElement('div');
stain.className = 'blood-stain';
const size = Math.random() * 100 + 30;
stain.style.width = `${size}px`;
stain.style.height = `${size}px`;
stain.style.left = `${Math.random() * 100}%`;
stain.style.top = `${Math.random() * 100}%`;
stain.style.opacity = Math.random() * 0.3 + 0.1;
bloodStains.appendChild(stain);
}// 创建滴血效果
const back = document.querySelector('.back');
for (let i = 0; i < 5; i++) {
const drip = document.createElement('div');
drip.className = 'drip';
drip.style.left = `${Math.random() * 300 + 10}px`;
drip.style.top = '10px';
drip.style.animationDelay = `${Math.random() * 3}s`;
back.appendChild(drip);
}// 创建金色粒子效果 – 正面
const goldParticles = document.getElementById('goldParticles');
for (let i = 0; i < 30; i++) {
createParticle(goldParticles, i);
}// 创建金色粒子效果 – 背面
const goldParticlesBack = document.getElementById('goldParticlesBack');
for (let i = 0; i < 30; i++) {
createParticle(goldParticlesBack, i);
}function createParticle(container, index) {
const particle = document.createElement('div');
particle.className = 'particle';
particle.style.left = `${Math.random() * 100}%`;
particle.style.top = `${Math.random() * 100}%`;
particle.style.animationDelay = `${Math.random() * 5}s`;
particle.style.animationDuration = `${5 + Math.random() * 5}s`;
container.appendChild(particle);
}// 翻转卡片功能
const card = document.querySelector('.card');
card.addEventListener('click', function() {
card.classList.toggle('flipped');
});
});
</script>
</body>
</html>
“`