[The LoNex Principal] Titus Flavius Domitianus (ไททัส ฟลาวิอุส โดมิติอานุส)
<style type="text/css">
@import url('https://fonts.googleapis.com/css2?family=Cinzel+Decorative:wght@400;900&family=Prata&family=Noto+Sans+Thai:wght@100;300;400;700&family=Syncopate:wght@400;700&display=swap');
:root {
--dom-gold: #c5a059;
--dom-dark: #080808;
--dom-accent: #333333;
--fenjite-shimmer: linear-gradient(135deg, #1a1a1a 0%, #000000 50%, #1a1a1a 100%);
--text-shadow: 0 0 10px rgba(197, 160, 89, 0.3);
}
/* --- The Obsidian Bastion --- */
.ds-wrapper {
max-width: 980px;
margin: 50px auto;
background: var(--dom-dark);
color: #d1d1d1;
font-family: 'Noto Sans Thai', sans-serif;
position: relative;
overflow: hidden;
border: 1px solid #222;
box-shadow: 0 60px 100px rgba(0,0,0,0.9);
}
/* --- Parallax Hero Section (Layered Images) --- */
.ds-hero {
height: 700px;
position: relative;
display: flex;
align-items: center;
background: #000;
}
/* ภาพพื้นหลังหลัก (City of Rome) */
.hero-bg {
position: absolute;
width: 100%; height: 100%;
background: url('https://i.imgur.com/K8Li6Jw.png') center/cover;
opacity: 0.4;
filter: sepia(0.5) contrast(1.2);
}
/* ภาพ Portrait ซ้อนทับแบบโปร่งแสง */
.hero-portrait {
position: absolute;
right: 0; bottom: 0;
width: 60%; height: 90%;
background: url('https://i.imgur.com/FJIL1ib.png') no-repeat right bottom/contain;
z-index: 2;
mask-image: linear-gradient(to left, black 60%, transparent);
}
.hero-statue {
position: absolute;
left: 5%; top: 10%;
width: 300px; height: 400px;
background: url('https://i.imgur.com/VdIoDWU.png') no-repeat center/contain;
opacity: 0.3;
z-index: 1;
filter: brightness(0.8) contrast(1.5);
}
/* --- Title Box (Non-Center) --- */
.ds-title-block {
position: relative;
z-index: 5;
padding-left: 80px;
border-left: 5px solid var(--dom-gold);
}
.ds-main-name {
font-family: 'Syncopate', sans-serif;
text-transform: uppercase;
font-weight: 700;
font-size: 55px;
line-height: 0.9;
color: #fff;
letter-spacing: -2px;
}
.ds-main-name span {
display: block;
color: var(--dom-gold);
font-family: 'Cinzel Decorative', cursive;
font-size: 24px;
letter-spacing: 12px;
margin-top: 10px;
}
/* --- Information Ribbons --- */
.ds-ribbon-container {
display: flex;
background: var(--fenjite-shimmer);
border-top: 1px solid #333;
border-bottom: 1px solid #333;
}
.ribbon-item {
flex: 1;
padding: 25px;
text-align: center;
border-right: 1px solid #222;
}
.ribbon-label {
font-family: 'Syncopate', sans-serif;
font-size: 9px;
color: var(--dom-gold);
display: block;
margin-bottom: 5px;
}
/* --- Main Body Layout (Magazine Style) --- */
.ds-body {
padding: 80px;
background-image: radial-gradient(circle at 100% 0%, #111 0%, transparent 50%);
display: flex;
flex-direction: column;
gap: 80px;
}
.section-header {
display: flex;
align-items: center;
gap: 20px;
margin-bottom: 40px;
}
.header-line {
flex: 1;
height: 1px;
background: linear-gradient(to right, var(--dom-gold), transparent);
}
.header-text {
font-family: 'Cinzel Decorative', cursive;
font-size: 28px;
color: var(--dom-gold);
}
/* Personality Overlay Box */
.personality-box {
position: relative;
padding: 50px;
background: rgba(255,255,255,0.02);
border: 1px solid #222;
line-height: 2.2;
}
.personality-box::before {
content: 'THE SADISM';
position: absolute;
top: -30px; right: 20px;
font-family: 'Syncopate', sans-serif;
font-size: 40px;
color: rgba(255,255,255,0.03);
font-weight: 900;
}
/* Biography Image Inset - FIXED */
.bio-wrapper {
display: grid;
grid-template-columns: 1fr 1.2fr;
gap: 50px;
align-items: start;
}
.bio-image {
height: 550px; /* เพิ่มความสูงเล็กน้อย */
background: url('https://i.imgur.com/FWtT0UG.png') no-repeat;
background-size: cover;
background-position: top center; /* ล็อคให้แสดงส่วนหัวภาพเสมอ */
border: 1px solid var(--dom-gold);
position: sticky;
top: 40px;
box-shadow: 0 10px 30px rgba(0,0,0,0.5);
}
/* Abilities List (Hexagon/Modern style) */
.ability-grid {
display: grid;
grid-template-columns: repeat(2, 1fr);
gap: 30px;
}
.ability-card {
padding: 30px;
background: #000;
border: 1px solid #1a1a1a;
transition: 0.4s;
}
.ability-card:hover {
border-color: var(--dom-gold);
background: #080808;
transform: translateY(-5px);
}
.ability-num {
font-family: 'Syncopate', sans-serif;
color: var(--dom-gold);
font-size: 12px;
margin-bottom: 10px;
display: block;
}
.ability-card h4 {
font-family: 'Prata', serif;
font-size: 18px;
color: #fff;
margin-bottom: 15px;
}
/* --- Footer --- */
.ds-footer {
padding: 80px;
background: #000;
text-align: center;
position: relative;
}
.footer-bg-img {
position: absolute;
top: 0; left: 0; width: 100%; height: 100%;
background: url('https://i.imgur.com/j6WsXZq.png') center/cover;
opacity: 0.1;
mix-blend-mode: overlay;
}
.ds-footer-text {
position: relative;
z-index: 2;
font-family: 'Syncopate', sans-serif;
letter-spacing: 5px;
color: var(--dom-gold);
}
</style>
<div class="ds-wrapper">
<div class="ds-hero">
<div class="hero-bg"></div>
<div class="hero-statue"></div>
<div class="hero-portrait"></div>
<div class="ds-title-block">
<div class="ds-main-name">
TITUS<br>FLAVIUS
<span>DOMITIANUS</span>
</div>
<font face="Prata" size="4" color="#fff" style="letter-spacing: 3px; margin-top: 20px; display: block;">
Dominic Stone (D.S.)
</font>
</div>
</div>
<div class="ds-ribbon-container">
<div class="ribbon-item">
<span class="ribbon-label"><font size="2">STATUE</font></span>
<font size="3">GOD</font>
</div>
<div class="ribbon-item">
<span class="ribbon-label"><font size="2">BIRTH</font></span>
<font size="3">24 OCT 51</font>
</div>
<div class="ribbon-item">
<span class="ribbon-label"><font size="2">LEGACY</font></span>
<font size="3">MINERVA</font>
</div>
<div class="ribbon-item">
<span class="ribbon-label"><font size="2">AFFILIATION</font></span>
<font size="3" color="#c5a059">LONEX</font>
</div>
</div>
<div class="ds-body">
<div class="section-container">
<div class="section-header">
<div class="header-text">PERSONALITY</div>
<div class="header-line"></div>
</div>
<div class="personality-box">
<font size="4">
โดมิเซียน เป็นบุคคลที่มีบุคลิกภาพที่ซับซ้อนและมีสองด้านอย่างชัดเจน เริ่มจากการเป็นผู้บริหารที่มีความสามารถและมีความรับผิดชอบทางการคลัง นำมาซึ่งเสถียรภาพยาวนานให้กับจักรวรรดิโรมันในยุคแรกของการปกครอง แต่ในท้ายที่สุดกลับกลายเป็น <b>ทรราชผู้หวาดระแวงและโหดเหี้ยม</b> ความหวาดระแวงอันฝังลึกนี้เป็นกุญแจสำคัญที่ทำให้เขาต้องแยกตัว โดยมีสัญลักษณ์เด่นคือการใช้ <b>หินเฟนไจต์สะท้อนแสง</b> ในวังเพื่อตรวจจับผู้ลอบสังหาร ทำให้เขาสร้างระบบการเฝ้าระวังที่สมบูรณ์แบบเพื่อความอยู่รอดหลังความตาย
</font>
</div>
</div>
<div class="section-container">
<div class="section-header">
<div class="header-line" style="background: linear-gradient(to left, var(--dom-gold), transparent);"></div>
<div class="header-text">BIOGRAPHY</div>
</div>
<div class="bio-wrapper">
<div class="bio-image"></div>
<div class="bio-text">
<font size="3">
จักรพรรดิไททัส ฟลาวิอุส โดมิติอานุส (Titus Flavius Domitianus) ผู้ปกครองจักรวรรดิโรมันตั้งแต่ปี ค.ศ. 81 ถึง 96 รัชสมัย 15 ปีของพระองค์แบ่งออกเป็นสองช่วง ช่วงแรกแสดงให้เห็นถึงความสามารถในการบริหารจัดการที่มีประสิทธิภาพ ความรับผิดชอบทางการคลัง และความพยายามในการรักษาระเบียบและความยุติธรรม ความมีเสถียรภาพที่ยาวนานถึง 18 ปี เป็นสิ่งที่หาได้ยากในประวัติศาสตร์โรมัน <br><br>
โดมิเซียนทรงประกาศพระองค์เป็นผู้พิทักษ์ของ <b>เทพีมิเนอร์วา (Minerva)</b> และอุปถัมภ์ <b>เทพอะพอลโล (Apollo)</b> อย่างเปิดเผย ทรงจัดตั้ง Capitoline Games และสถาปนาวิหารเพื่อเชิดชูเทพแห่งแสงสว่าง พระองค์มีความสัมพันธ์อันใกล้ชิดและลึกซึ้ง (กุ๊กกิ๊ก) กับเทพอะพอลโลในช่วงเวลาหนึ่ง ซึ่งเป็นเสมือน "ยุคทอง" ที่เต็มไปด้วยความฝันในความสมบูรณ์แบบ <br><br>
อย่างไรก็ตาม ในช่วงหลัง รัชสมัยของพระองค์ถูกครอบงำด้วยความเป็นทรราชและความหวาดระแวงอย่างรุนแรง พระองค์เริ่มทำการสังหารหมู่สมาชิกวุฒิสภาเพื่อการควบคุมอำนาจอย่างเบ็ดเสร็จ สิ่งที่โดดเด่นที่สุดคือ <b>ความหวาดระแวงที่ฝังลึก</b> พระองค์สั่งบุผนังทางเดินด้วยหินเฟนไจต์ที่เป็นกระจกสะท้อนเงา เพื่อเฝ้าระวังการทรยศจากทุกคน แม้แต่เทพเจ้าเอง
</font>
</div>
</div>
</div>
<div class="section-container">
<div class="section-header">
<div class="header-text">THE DARK DEITY & LONEX</div>
<div class="header-line"></div>
</div>
<div class="personality-box" style="border-left: 3px solid var(--dom-gold);">
<font size="3">
โดมิเซียนบรรลุสถานะเป็นเทพชั้นรองผ่านอำนาจมืด แม้จะถูกลงโทษด้วยการทำลายความทรงจำ (Damnatio Memoriae) แต่ความน่าสะพรึงกลัวที่ทิ้งไว้นั้นคงอยู่ การปฏิเสธแสงสว่างของอะพอลโลและการโอบรับความมืด ได้เปลี่ยนเส้นทางสู่ความเป็นเทพ และเป็นรากฐานของอาณาจักรใต้พิภพ <b>LoNex</b> ในปัจจุบัน <br><br>
<b>LoNex</b> คือการแสดงออกถึงความทะเยอทะยานในการบริหารจัดการและการควบคุมทางการคลังในโลกยุคใหม่ D.S. เลือกควบคุมตลาดมืดในโลกใต้ดิน ซึ่งเป็นแหล่งพลังงานที่ไม่สามารถถูกสั่นคลอนได้ เป็นสัญลักษณ์ของความหวาดระแวงและความทะเยอทะยานที่ถูกซ่อนไว้และได้รับการจัดระเบียบอย่างสมบูรณ์แบบ
</font>
</div>
</div>
<div class="section-container">
<div class="section-header">
<div class="header-text">ABILITIES</div>
<div class="header-line"></div>
</div>
<div class="ability-grid">
<div class="ability-card">
<span class="ability-num">01 / ADMINISTRATION</span>
<h4>การบริหารจัดการที่มีประสิทธิภาพ</h4>
<font size="2">สร้างเสถียรภาพและความยุติธรรมในจักรวรรดิ</font>
</div>
<div class="ability-card">
<span class="ability-num">02 / FISCAL RESPONSIBILITY</span>
<h4>ความรับผิดชอบทางการคลัง</h4>
<font size="2">บริหารจัดการเงินทุนและทรัพยากรได้อย่างดีเยี่ยม</font>
</div>
<div class="ability-card">
<span class="ability-num">03 / AUTOCRACY</span>
<h4>ความเป็นอัตตาธิปไตย</h4>
<font size="2">การปกครองที่เด็ดขาดและควบคุมอำนาจเบ็ดเสร็จ</font>
</div>
<div class="ability-card">
<span class="ability-num">04 / SURVIVAL PARANOIA</span>
<h4>ความมั่นคงและการเอาตัวรอด</h4>
<font size="2">กลไกป้องกันตนเองขั้นสูงสุดจากการหวาดระแวง</font>
</div>
<div class="ability-card">
<span class="ability-num">05 / SURVEILLANCE SYSTEM</span>
<h4>ระบบเฝ้าระวังที่สมบูรณ์แบบ</h4>
<font size="2">การพัฒนาระบบที่ทำให้รอดพ้นจากการทรยศ</font>
</div>
<div class="ability-card">
<span class="ability-num">06 / SOLO OPERATION</span>
<h4>การหลีกเลี่ยงความร่วมมือ</h4>
<font size="2">ความสามารถในการฉายเดี่ยวเพื่อลดความเสี่ยง</font>
</div>
<div class="ability-card">
<span class="ability-num">07 / BLACK MARKET CONTROL</span>
<h4>การควบคุมตลาดมืด</h4>
<font size="2">ควบคุมแหล่งพลังงานที่สั่นคลอนไม่ได้ของ LoNex</font>
</div>
<div class="ability-card">
<span class="ability-num">08 / DARK INFLUENCE</span>
<h4>การรักษาอำนาจในความมืด</h4>
<font size="2">คงสถานะเทพผ่านความสะพรึงกลัวในจิตใจมนุษย์</font>
</div>
</div>
<div class="ability-card" style="margin-top: 30px; width: 100%;">
<span class="ability-num">09 / UNDERGROUND NETWORK</span>
<h4>การบริหารเครือข่ายใต้ดินขนาดมหึมา</h4>
<font size="2">จัดการเครือข่าย LoNex ให้เป็นแหล่งต้นทุนขององค์กรที่มีอำนาจเหนือแก๊งมาเฟียทั่วโลก</font>
</div>
</div>
</div>
<div class="ds-footer">
<div class="footer-bg-img"></div>
<div class="ds-footer-text">
<font size="4">DAMNATIO MEMORIAE</font><br>
<font size="2" style="opacity: 0.5;">REBIRTH THROUGH THE SHADOWS OF LONEX</font>
</div>
</div>
</div>
หน้า:
[1]