Kötü Adam Simülatörü
<style>
.censy-villain-board {
position: relative;
margin: 10px auto;
width: 100%;
max-width: 380px;
background: transparent;
border: 1px solid rgba(255, 0, 0, 0.15);
box-shadow: inset 0 0 30px rgba(138, 3, 3, 0.1);
padding: 20px;
font-family: 'Noto Serif SC', 'Cinzel', serif;
color: #fff;
overflow: hidden;
backdrop-filter: blur(2px);
}
/* 顶部流光线 */
.censy-villain-board::before {
content: '';
position: absolute;
top: 0; left: -100%;
width: 50%; height: 2px;
background: linear-gradient(90deg, transparent, #ff003c, transparent);
animation: censy-villain-flow 3s infinite linear;
}
@keyframes censy-villain-flow {
100% { left: 100%; }
}
/* 错落布局：头部 */
.cvb-header {
display: flex;
justify-content: space-between;
align-items: flex-end;
margin-bottom: 20px;
}
.cvb-time-zone {
text-align: left;
position: relative;
}
.cvb-time {
display: block;
font-size: 28px;
font-weight: 900;
color: #ff003c;
text-shadow: 0 0 15px rgba(255, 0, 60, 0.6);
letter-spacing: 2px;
line-height: 1;
}
.cvb-day {
font-size: 10px;
color: #666;
letter-spacing: 1px;
}
.cvb-env-zone {
text-align: right;
border-right: 2px solid #8a0303;
padding-right: 10px;
}
.cvb-loc {
display: block;
font-size: 12px;
color: #ddd;
font-weight: bold;
margin-bottom: 2px;
}
.cvb-weather {
display: block;
font-size: 10px;
color: #888;
}
/* 恶性分割线 */
.cvb-divider {
height: 1px;
background: radial-gradient(circle, rgba(255,0,60,0.5) 0%, transparent 90%);
margin: 15px 0 20px 0;
position: relative;
}
.cvb-divider::after {
content: '☠';
position: absolute;
top: 50%; left: 50%;
transform: translate(-50%, -50%);
color: #ff003c;
font-size: 12px;
background: #000;
padding: 0 5px;
text-shadow: 0 0 8px #ff003c;
}
/* 错落布局：主体 */
.cvb-body {
display: grid;
grid-template-columns: auto 1fr;
gap: 20px;
align-items: center;
}
.cvb-fate-zone {
display: flex;
flex-direction: column;
gap: 8px;
padding-left: 10px;
border-left: 1px dashed rgba(255, 0, 60, 0.3);
}
.cvb-fate-item {
display: flex;
align-items: center;
font-size: 11px;
}
.cvb-label-yi {
color: #000;
background: #ff003c;
padding: 1px 4px;
margin-right: 8px;
font-weight: bold;
font-size: 10px;
}
.cvb-label-ji {
color: #888;
border: 1px solid #888;
padding: 0 3px;
margin-right: 8px;
font-size: 10px;
}
.cvb-value {
color: #ccc;
}
.cvb-quote-zone {
text-align: right;
font-size: 12px;
color: #999;
font-style: italic;
line-height: 1.6;
padding-left: 10px;
}
/* 水印 */
.cvb-watermark {
position: absolute;
bottom: 3px;
right: 8px;
font-size: 8px;
color: rgba(255, 255, 255, 0.1);
font-family: monospace;
pointer-events: none;
}
</style>
<div class="censy-villain-board">
<div class="cvb-header">
<div class="cvb-time-zone">
<span class="cvb-time">AI Dolgusu: Zaman</span>
<span class="cvb-day">AI Dolgusu: Gün</span>
</div>
<div class="cvb-env-zone">
<span class="cvb-loc">AI Dolgusu: Konum</span>
<span class="cvb-weather">AI Dolgusu: Hava Durumu</span>
</div>
</div>
<div class="cvb-divider">
</div>
<div class="cvb-body">
<div class="cvb-fate-zone">
<div class="cvb-fate-item">
<span class="cvb-label-yi">Uygun</span>
<span class="cvb-value">AI Dolgusu: Yapılması Uygun Şeyler</span>
</div>
<div class="cvb-fate-item">
<span class="cvb-label-ji">Sakıncalı</span>
<span class="cvb-value">AI Dolgusu: Kaçınılması Gereken Şeyler</span>
</div>
</div>
<div class="cvb-quote-zone">
"AI Dolgusu: Bağlama uygun cümle"
</div>
</div>
</div>
Lütfen içeriğinizi aşağıya girin; sizin için buna uygun özel bir açılış mesajı oluşturacağım.Sohbete devam etmek için giriş yapın