Moneka โพสต์ 2025-9-1 23:33:51

สมุดบันทึกโง่ ๆ ของ มอนอกอบอซอ

แก้ไขครั้งสุดท้ายโดย Moneka เมื่อ 2025-10-18 03:11 <br /><br />


<!-- วางทั้งหมดนี้ในกล่องข้อความโพสต์ได้เลย -->
<link href="https://fonts.googleapis.com/css2?family=Mali:wght@300;400;600;700&amp;family=Sriracha&amp;display=swap" rel="stylesheet">

<style>
/* ===== SCOPE: ใช้เฉพาะใน .sv-wrap ===== */
.sv-wrap{
    max-width: 980px; margin:0 auto; background:#f5efe9;
    border-radius:16px; overflow:hidden; box-shadow:0 6px 18px rgba(0,0,0,.08);
    font-family:'Mali','Sarabun',system-ui,-apple-system,sans-serif; color:#231f20; line-height:1.7;
}
.sv-wrap *{ box-sizing:border-box; }

/* Palette สี (แก้ได้ตามใจ) */
.sv-wrap{
    --c1:#250e2c;
    --c2:#837ab6;
    --c3:#9d85b6;
    --c4:#ce8db3;
    --c5:#f6a5c0;
    --c6:#f7c2ca;
    --paper:#f3ebe6;
}

/* ===== HERO / ช่องรูปใหญ่ ===== */
.sv-hero{
    position:relative; width:100%; aspect-ratio: 16/6; background:#ddd;
    display:flex; align-items:center; justify-content:center;
    overflow:hidden;
}
.sv-hero img{ width:100%; height:100%; object-fit:cover; display:block; }
.sv-hero::after{
    /* ไล่สีซอฟท์ทับภาพให้ฟีลแบบตัวอย่าง */
    content:""; position:absolute; inset:0;
    background: radial-gradient(120% 140% at 20% 90%, var(--c1) 0%, rgba(37,14,44,.75) 22%, transparent 55%),
                linear-gradient(90deg, var(--c1) 0%, var(--c2) 35%, var(--c5) 80%, var(--c6) 100%);
    mix-blend-mode:multiply; opacity:.55; pointer-events:none;
}
.sv-title{
    position:absolute; inset:0; display:flex; align-items:center; justify-content:center;
    font-family:'Sriracha','Mali',cursive; font-size:48px; color:#fff; text-shadow:0 2px 8px rgba(0,0,0,.35);
    letter-spacing:.02em;
}

/* ===== แถบ GRADIENT ===== */
.sv-grad-wrap{ padding:18px; background:var(--paper); }
.sv-grad-bar{
    height:70px; border-radius:12px;
    background: linear-gradient(90deg, var(--c1) 0%, var(--c2) 24%, var(--c3) 42%, var(--c4) 60%, var(--c5) 78%, var(--c6) 100%);
    position:relative; display:flex; align-items:center; justify-content:center;
    color:#fff; font-weight:800; letter-spacing:.8em; text-transform:uppercase;
}

/* ===== แถวกล่องสี ===== */
.sv-swatches{
    display:grid; grid-template-columns: repeat(6, 1fr); gap:16px;
    padding:22px; background:#fff;
}
.sv-swatch{
    border-radius:12px; height:120px; position:relative; overflow:hidden;
    display:flex; align-items:flex-end; justify-content:flex-start;
}
.sv-swatch small{
    display:inline-block; background:rgba(0,0,0,.5); color:#fff; padding:6px 10px;
    border-top-right-radius:10px; font-weight:800; font-size:13px;
}

/* ===== ฟุตเตอร์เครดิต ===== */
.sv-footer{
    padding:22px 26px 26px; background:var(--paper); text-align:center;
}
.sv-credit{
    margin-top:8px; font-weight:800; letter-spacing:.18em; text-transform:lowercase;
}

/* ===== Responsive ===== */
@media (max-width: 900px){
    .sv-swatches{ grid-template-columns: repeat(3, 1fr); }
    .sv-title{ font-size:40px; }
}
@media (max-width: 520px){
    .sv-swatches{ grid-template-columns: repeat(2, 1fr); }
    .sv-title{ font-size:34px; }
    .sv-grad-bar{ letter-spacing:.4em; }
}
</style>

<div class="sv-wrap">
<!-- ช่องภาพใหญ่: เปลี่ยน src ตามต้องการ -->
<div class="sv-hero">
    <img src="https://img2.pic.in.th/pic/reface-2022-03-02-09-21-31-_1_.gif" alt="Salmverse Banner">
    <div class="sv-title">MONEKA<br></div>
</div>

<!-- แถบ GRADIENT -->
<div class="sv-grad-wrap">
    <div class="sv-grad-bar"><font size="4">สมุดบันทึกโง่ๆ ของ มอนอกอบอซอ&nbsp;</font><font size="4"><br></font></div>
</div>

<!-- แถบกล่องสี 6 ช่อง -->
<div class="sv-swatches">
    <div class="sv-swatch" style="background:var(--c1)"><small>#250e2c</small></div>
    <div class="sv-swatch" style="background:var(--c2)"><small>#837ab6</small></div>
    <div class="sv-swatch" style="background:var(--c3)"><small>#9d85b6</small></div>
    <div class="sv-swatch" style="background:var(--c4)"><small>#ce8db3</small></div>
    <div class="sv-swatch" style="background:var(--c5)"><small>#f6a5c0</small></div>
    <div class="sv-swatch" style="background:var(--c6)"><small>#f7c2ca</small></div>
</div>

<!-- เครดิตด้านล่าง -->
<div class="sv-footer">
    <div class="sv-credit"><font size="3">เป็นสมุดบันทึกทุกอย่างในสายตาแบบ มนก บซ แน่นอนว่า บ่งบอกรสนิยมสุด ๆ</font></div>
</div>
</div>




<style type="text/css">
img{
-webkit-transition: 1.0s;
-moz-transition: 1.0s;}
img:hover{
-webkit-animation-name: shake;
-webkit-animation-duration: 2s;
-webkit-animation-iteration-count: infinite;
-webkit-animation-timing-function: ease-in-out;
filter: none;;}
@-moz-keyframes shake /* Firefox*/
{
{ -ms-transform:: translate(-1px, -2px) rotate(-1deg); }
20% { -moz-transform: translate(-3px, 0px) rotate(1deg); }
30% { -moz-transform:translate(0px, 2px) rotate(0deg); }
40% { -moz-transform:translate(1px, -1px) rotate(1deg); }
50% { -moz-transform:translate(-1px, 2px) rotate(-1deg); }
60% { -moz-transform:translate(-3px, 1px) rotate(0deg); }
70% { -moz-transform:translate(2px, 1px) rotate(-1deg); }
80% { -moz-transform:translate(-1px, -1px) rotate(1deg); }
90% { -moz-transform: translate(2px, 2px) rotate(0deg); }
100% { -moz-transform:translate(1px, -2px) rotate(-1deg); }
}
@-ms-keyframes shake /* IE9*/
{
10% { -ms-transform:: translate(-1px, -2px) rotate(-1deg); }
20% { -ms-transform: translate(-3px, 0px) rotate(1deg); }
30% { -ms-transform: translate(0px, 2px) rotate(0deg); }
40% { -ms-transform: translate(1px, -1px) rotate(1deg); }
50% { -ms-transform: translate(-1px, 2px) rotate(-1deg); }
60% { -ms-transform: translate(-3px, 1px) rotate(0deg); }
70% { -ms-transform: translate(2px, 1px) rotate(-1deg); }
80% { -ms-transform: translate(-1px, -1px) rotate(1deg); }
90% { -ms-transform: translate(2px, 2px) rotate(0deg); }
100% { -ms-transform: translate(1px, -2px) rotate(-1deg); }
}
@-webkit-keyframes shake /* Safari and Chrome */
{
0% { -webkit-transform: translate(2px, 1px) rotate(0deg); }
10% { -webkit-transform: translate(-1px, -2px) rotate(-1deg); }
20% { -webkit-transform: translate(-3px, 0px) rotate(1deg); }
30% { -webkit-transform: translate(0px, 2px) rotate(0deg); }
40% { -webkit-transform: translate(1px, -1px) rotate(1deg); }
50% { -webkit-transform: translate(-1px, 2px) rotate(-1deg); }
60% { -webkit-transform: translate(-3px, 1px) rotate(0deg); }
70% { -webkit-transform: translate(2px, 1px) rotate(-1deg); }
80% { -webkit-transform: translate(-1px, -1px) rotate(1deg); }
90% { -webkit-transform: translate(2px, 2px) rotate(0deg); }
100% { -webkit-transform: translate(1px, -2px) rotate(-1deg); }
}</style>

Moneka โพสต์ 2025-9-2 00:07:16

แก้ไขครั้งสุดท้ายโดย Moneka เมื่อ 2025-9-9 03:10 <br /><br /><!-- วางทั้งหมดนี้ในกล่องข้อความโพสต์ได้เลย -->
<link href="https://fonts.googleapis.com/css2?family=Mali:wght@300;400;600;700&amp;family=Sriracha&amp;display=swap" rel="stylesheet">

<style>
/* ===== SCOPE เฉพาะใน .sd-wrap ===== */
.sd-wrap{
    max-width:980px; margin:0 auto; background:#fff; border-radius:12px; padding:24px;
    box-shadow:0 4px 12px rgba(0,0,0,.08);
    font-family:'Mali','Sarabun',system-ui,-apple-system,sans-serif; color:#2b2b2b; line-height:1.7;
}
.sd-wrap *{ box-sizing:border-box; }

/* พาเลทสี */
.sd-wrap{
    --c1:#262e4c; /* Cosmic Night */
    --c2:#45538a; /* Lunar Shadow */
    --c3:#724972; /* Galaxy Mauve */
    --c4:#b199db; /* Lilac */
    --c5:#e9ccd3; /* Pale Nebula */
}

.sd-title{
    text-align:center; font-size:36px; margin:0 0 8px;
    font-family:'Sriracha','Mali',cursive; letter-spacing:.02em;
}
.sd-sub{ text-align:center; color:#777; margin:-2px 0 26px; font-size:15px; }

.sd-top{ display:grid; grid-template-columns:1fr 1fr; gap:18px; align-items:stretch; margin-bottom:24px; }
.sd-img{ width:100%; height:100%; border-radius:12px; object-fit:cover; display:block; }

.sd-color-list{ display:grid; grid-template-columns:1fr; gap:12px; }
.sd-chip{
    display:flex; align-items:center; gap:12px; padding:10px; border-radius:12px;
    background:#f7f7f9; border:1px solid #ececf0;
}
.sd-chip-swatch{ width:56px; height:56px; border-radius:10px; flex:0 0 56px; }
.sd-chip > div{ min-width:0; }            /* ให้ข้อความด้านขวาห่อบรรทัดได้ */
.sd-chip-code{ font-weight:700; font-size:15px; }
.sd-chip-name{ font-size:13px; color:#6a6a6a; word-break:break-word; }

.sd-samples{ display:flex; gap:22px; justify-content:center; margin:10px 0 26px; flex-wrap:wrap; }
.sd-sample{ font-weight:700; font-size:22px; }

/* ===== บล็อกหัวข้อ + กล่องเนื้อหา (ยืดสูงตามข้อความ) ===== */
.sd-section{ margin-bottom:18px; }
.sd-section-head{
    border-radius:12px 12px 0 0; padding:12px 16px; color:#fff; font-weight:800; line-height:1.6;
    word-break:break-word;
}
.sd-section-body{
    border:1px solid #ececf0; border-top:0; background:#fafbff;
    border-radius:0 0 12px 12px; padding:16px;
}

/* ฟุตเตอร์ */
.sd-footer{ display:grid; grid-template-columns:repeat(4,1fr); gap:12px; }
.sd-foot-box{
    border-radius:12px; padding:18px; color:#fff; text-align:center; font-weight:800;
    font-family:'Mali','Sarabun',sans-serif;
}
.sd-foot-note{ display:block; font-weight:600; opacity:.9; font-size:12px; margin-top:6px; }

/* มือถือ */
@media (max-width:768px){
    .sd-top{ grid-template-columns:1fr; }
    .sd-footer{ grid-template-columns:1fr 1fr; }
}
@media (max-width:480px){
    .sd-footer{ grid-template-columns:1fr; }
}
</style>

<div class="sd-wrap">
<h2 class="sd-title"><font size="6">สมุดโง่ ๆ ของ มณีกานต์ บุปผชาติ หน้าที่ 1</font></h2>
<div class="sd-sub"><font size="3">ปีศาจตัวนี้คือตัวอะไรกันวะ ไม่รู้เลย หน้าตาคุ้น ๆ เหมือนที่เคยอ่านเจอในโดจิน 18+</font></div>

<section class="sd-top">
    <!-- เปลี่ยน URL รูปได้ตามต้องการ -->
    <img class="sd-img" src="https://img5.pic.in.th/file/secure-sv1/ZTwNGGDr_400x400.jpg" alt="Galaxy">
    <div class="sd-color-list">
      <div class="sd-chip">
      <div class="sd-chip-swatch" style="background:var(--c1)"></div>
      <div>
          <div class="sd-chip-code">ชื่ออสรุกาย</div>
          <div class="sd-chip-name">GOBLIN หรือ ก็อบลิน</div>
      </div>
      </div>
      <div class="sd-chip">
      <div class="sd-chip-swatch" style="background:var(--c2)"></div>
      <div>
          <div class="sd-chip-code">สังกัด</div>
          <div class="sd-chip-name">ไม่มี</div>
      </div>
      </div>
      <div class="sd-chip">
      <div class="sd-chip-swatch" style="background:var(--c3)"></div>
      <div>
          <div class="sd-chip-code">การพิชิตครั้งกร</div>
          <div class="sd-chip-name">
            หุบเขาโซโนมา
            <a href="https://percyjackson.mooorp.com/forum.php?mod=redirect&amp;goto=findpost&amp;ptid=503&amp;pid=8235" style="font-size:12px;">[กุญแจนำทาง]</a>
          </div>
      </div>
      </div>
      <div class="sd-chip">
      <div class="sd-chip-swatch" style="background:var(--c4)"></div>
      <div>
          <div class="sd-chip-code">#คำเตือน</div>
          <div class="sd-chip-name">หากมีสายเลือดเทพีแห่งความรักอย่างวีนัส หรือ อะโฟร์ไดท์ ห้ามเลี้ยงเด็ดขาด แม่ไม่ปลื้ม!!</div>
      </div>
      </div>
      <div class="sd-chip">
      <div class="sd-chip-swatch" style="background:var(--c5)"></div>
      <div>
          <div class="sd-chip-code">#เพิ่มเติม</div>
          <div class="sd-chip-name">ได้รับตื่นรู้ +1</div>
      </div>
      </div>
    </div>
</section>

<div class="sd-samples">
    <span class="sd-sample" style="color:var(--c1)">ตัว</span>
    <span class="sd-sample" style="color:var(--c2)">อะ</span>
    <span class="sd-sample" style="color:var(--c3)">ไร</span>
    <span class="sd-sample" style="color:var(--c4)">วะ</span>
    <span class="sd-sample" style="color:var(--c5)">เนี่ย</span>
</div>

<!-- หัวข้อ + เนื้อหา (ยืดตามข้อความอัตโนมัติ) -->
<div class="sd-section">
    <div class="sd-section-head" style="background:linear-gradient(90deg,var(--c1),var(--c4))"><font size="4">
      เนื้อหา ประวัติอสุรกาย
    </font></div>
    <div class="sd-section-body">
      <p><font size="3">เป็นสัตว์ร้ายขนาดเล็ก รูปร่างน่าประหลาด ปรากฏในนิทานพื้นบ้าน ของวัฒนธรรมยุโรปหลายแห่ง เชื่อกันว่าก็อบลินอาศัยอยู่ในถ้ำแต่จะเข้าไปอาศัยอยู่ในบ้านเรือน โดยเชื่อกันว่าพวกมันจะทุบหม้อและกระทะ แย่งชุดนอนจากร่างของคนที่นอนหลับ เคลื่อนย้ายเฟอร์นิเจอร์ในเวลากลางคืน และหลบหนีหลังจากเคาะกำแพงและประตู เชื่อกันว่าพวกมันช่วยพ่อแม่ในการอบรมสั่งสอนลูกๆ โดยการให้รางวัลแก่ลูกด้วยของขวัญเมื่อลูกทำดี และลงโทษเมื่อลูกไม่เชื่อฟัง คำว่าก็อบลินมาจากภาษากรีก kobalos "คนโกง"</font></p>
    </div>
</div>

<div class="sd-section">
    <div class="sd-section-head" style="background:linear-gradient(90deg,var(--c2),var(--c5))"><font size="4">
      เนื้อหา ประสบการณ์ของคุณ
    </font></div>
    <div class="sd-section-body">
      <p><font size="3">เอาตรง ๆ สำหรับประสบการณ์ของ มนก ต่อก๊อบลิน มนก มักจะเห็นในอนิเมะหลายเรื่อง โดยเฉพาะในอนิเมะต่างโลก แต่พอรู้ว่าตัวเองเป็นเดมิก็อดพึ่งเคยเห็นก๊อบลินตัวเป็น ๆ นี้แหละ ทำไมมันน่าเกลียดกว่าในอนิเมะเยอะจังเลยล่ะ มนก ไม่ชอบมันเลย มันเห็นนะ มันก็พุ่งเข้าใส่ มนก เลย แล้วมันก็โจมตี ๆ มนก ก็หลบ ๆ แล้วก็ต้องสู้กลับ เอาตรง ๆ โล่งใจมาก ๆ ที่เจ้าก๊อบลินอันนี้มันเป็นก๊อบลินโง่ ๆ ตัวหนึ่ง .....โง่ประสาอะไรล่ะ!! นั้นมันเวล 20 เลยนะ จะบ้าตาย ทำไม มนก ต้องมาเจออะไรขนาดนั้นด้วย ตอนนั้น มนก เวล 17 เองมั้ง!! อ๊าคคคคค แทบจะบ้าตาย มันโจมตีเรารัว ๆ เลยนะ โชคดีที่รอดมาได้ ฮืออ ถ้าไม่รอดมาไม่รู้จะมีโอกาศไปเจอสามีคนแรกไหม อ้อ ยังไม่มี ฮือออ รู้งี้ไม่ออกมาเดินเล่นดีกว่า น่ากลัวเกินไปแล้ว มนก กลัวมาก!!!</font></p>
    </div>
</div>

<div class="sd-footer">
    <div class="sd-foot-box" style="background:var(--c1)"><font size="2">Cosmic Night
      </font><span class="sd-foot-note"><font size="2">RGB 38 46 76</font></span>
    </div>
    <div class="sd-foot-box" style="background:var(--c2)"><font size="2">Lunar Shadow
      </font><span class="sd-foot-note"><font size="2">RGB 69 83 138</font></span>
    </div>
    <div class="sd-foot-box" style="background:var(--c3)"><font size="2">Galaxy Mauve
      </font><span class="sd-foot-note"><font size="2">RGB 114 73 114</font></span>
    </div>
    <div class="sd-foot-box" style="background:var(--c5); color:#2b2b2b;"><font size="2">Pale Nebula
      </font><span class="sd-foot-note"><font size="2">RGB 233 204 211</font></span>
    </div>
</div>
</div>







Moneka โพสต์ 2025-9-9 02:51:21

แก้ไขครั้งสุดท้ายโดย Moneka เมื่อ 2025-9-9 03:11 <br /><br /><!-- วางทั้งหมดนี้ในกล่องข้อความโพสต์ได้เลย -->
<link href="https://fonts.googleapis.com/css2?family=Mali:wght@300;400;600;700&amp;family=Sriracha&amp;display=swap" rel="stylesheet">

<style>
/* ===== SCOPE เฉพาะใน .sd-wrap ===== */
.sd-wrap{
    max-width:980px; margin:0 auto; background:#fff; border-radius:12px; padding:24px;
    box-shadow:0 4px 12px rgba(0,0,0,.08);
    font-family:'Mali','Sarabun',system-ui,-apple-system,sans-serif; color:#2b2b2b; line-height:1.7;
}
.sd-wrap *{ box-sizing:border-box; }

/* พาเลทสี */
.sd-wrap{
    --c1:#262e4c; /* Cosmic Night */
    --c2:#45538a; /* Lunar Shadow */
    --c3:#724972; /* Galaxy Mauve */
    --c4:#b199db; /* Lilac */
    --c5:#e9ccd3; /* Pale Nebula */
}

.sd-title{
    text-align:center; font-size:36px; margin:0 0 8px;
    font-family:'Sriracha','Mali',cursive; letter-spacing:.02em;
}
.sd-sub{ text-align:center; color:#777; margin:-2px 0 26px; font-size:15px; }

.sd-top{ display:grid; grid-template-columns:1fr 1fr; gap:18px; align-items:stretch; margin-bottom:24px; }
.sd-img{ width:100%; height:100%; border-radius:12px; object-fit:cover; display:block; }

.sd-color-list{ display:grid; grid-template-columns:1fr; gap:12px; }
.sd-chip{
    display:flex; align-items:center; gap:12px; padding:10px; border-radius:12px;
    background:#f7f7f9; border:1px solid #ececf0;
}
.sd-chip-swatch{ width:56px; height:56px; border-radius:10px; flex:0 0 56px; }
.sd-chip > div{ min-width:0; }            /* ให้ข้อความด้านขวาห่อบรรทัดได้ */
.sd-chip-code{ font-weight:700; font-size:15px; }
.sd-chip-name{ font-size:13px; color:#6a6a6a; word-break:break-word; }

.sd-samples{ display:flex; gap:22px; justify-content:center; margin:10px 0 26px; flex-wrap:wrap; }
.sd-sample{ font-weight:700; font-size:22px; }

/* ===== บล็อกหัวข้อ + กล่องเนื้อหา (ยืดสูงตามข้อความ) ===== */
.sd-section{ margin-bottom:18px; }
.sd-section-head{
    border-radius:12px 12px 0 0; padding:12px 16px; color:#fff; font-weight:800; line-height:1.6;
    word-break:break-word;
}
.sd-section-body{
    border:1px solid #ececf0; border-top:0; background:#fafbff;
    border-radius:0 0 12px 12px; padding:16px;
}

/* ฟุตเตอร์ */
.sd-footer{ display:grid; grid-template-columns:repeat(4,1fr); gap:12px; }
.sd-foot-box{
    border-radius:12px; padding:18px; color:#fff; text-align:center; font-weight:800;
    font-family:'Mali','Sarabun',sans-serif;
}
.sd-foot-note{ display:block; font-weight:600; opacity:.9; font-size:12px; margin-top:6px; }

/* มือถือ */
@media (max-width:768px){
    .sd-top{ grid-template-columns:1fr; }
    .sd-footer{ grid-template-columns:1fr 1fr; }
}
@media (max-width:480px){
    .sd-footer{ grid-template-columns:1fr; }
}
</style>

<div class="sd-wrap">
<h2 class="sd-title"><font size="6">สมุดโง่ ๆ ของ มณีกานต์ บุปผชาติ หน้าที่ 2</font></h2>
<div class="sd-sub"><font size="3">ก็คือทำไมฮาร์ปี้ที่นี้มันไม่เห็นเหมือนในวันพีชเลยยยยย ฮืออออ มนก รับไม่ได้ (นี้ฮาร์ปี้ต้องแบบนี้!!) #แปะภาพ</font></div>

<section class="sd-top">
    <!-- เปลี่ยน URL รูปได้ตามต้องการ -->
    <img class="sd-img" src="https://img2.pic.in.th/pic/61raf8ttq8pKgLU3J1jzVcWsduzPKvJM5o4c6UpbzajZxjIWG0ap8qm2RUxY6GuIqJLGrIHF19F5IhTKXJ82UQ.md.webp" alt="Galaxy">
    <div class="sd-color-list">
      <div class="sd-chip">
      <div class="sd-chip-swatch" style="background:var(--c1)"></div>
      <div>
          <div class="sd-chip-code">ชื่ออสรุกาย</div>
          <div class="sd-chip-name">HARPIE หรือ ฮาร์ปี้</div>
      </div>
      </div>
      <div class="sd-chip">
      <div class="sd-chip-swatch" style="background:var(--c2)"></div>
      <div>
          <div class="sd-chip-code">สังกัด</div>
          <div class="sd-chip-name">เทพซุส</div>
      </div>
      </div>
      <div class="sd-chip">
      <div class="sd-chip-swatch" style="background:var(--c3)"></div>
      <div>
          <div class="sd-chip-code">การพิชิตครั้งแรก</div>
          <div class="sd-chip-name">
            หุบเขาโซโนมา&nbsp;<a href="https://percyjackson.mooorp.com/forum.php?mod=redirect&amp;goto=findpost&amp;ptid=503&amp;pid=8375" style="font-size: 12px;">[กุญแจนำทาง]</a></div>
      </div>
      </div>
      <div class="sd-chip">
      <div class="sd-chip-swatch" style="background:var(--c4)"></div>
      <div>
          <div class="sd-chip-code">#คำเตือน</div>
          <div class="sd-chip-name">มนกอยากได้ฮาร์ปี้สวย ๆ หุ่นดี ๆ แบบไในวันพีช!! ทำไมถึงได้มาเป็นตัวที่น่ากลัวขนาดนี้ได้กันเล่าาาา แง้ ๆ ๆ&nbsp;</div>
      </div>
      </div>
      <div class="sd-chip">
      <div class="sd-chip-swatch" style="background:var(--c5)"></div>
      <div>
          <div class="sd-chip-code">#เพิ่มเติม</div>
          <div class="sd-chip-name">ได้รับตื่นรู้ +1</div>
      </div>
      </div>
    </div>
</section>

<div class="sd-samples">
    <span class="sd-sample" style="color:var(--c1)">ต้อง</span>
    <span class="sd-sample" style="color:var(--c2)">สวย</span>
    <span class="sd-sample" style="color:var(--c3)">แบบ</span>
    <span class="sd-sample" style="color:var(--c4)">นี้</span>
    <span class="sd-sample" style="color:var(--c5)">สิ!!</span>
</div>

<!-- หัวข้อ + เนื้อหา (ยืดตามข้อความอัตโนมัติ) -->
<div class="sd-section">
    <div class="sd-section-head" style="background:linear-gradient(90deg,var(--c1),var(--c4))"><font size="4">
      เนื้อหา ประวัติอสุรกาย
    </font></div>
    <div class="sd-section-body">
      <p><font size="3">ในเทพปกรณัมกรีกโบราณ ฮาร์ปี้ เป็นสิ่งมีชีวิตที่มีรูปร่างหน้าตาคล้ายผู้หญิงครึ่งนกครึ่งมนุษย์ บางครั้งรู้จักกันในชื่อ "สุนัขล่าเนื้อแห่งซุส" ฮาร์ปีปรากฏในเรื่องราวต่างๆ มากมาย พวกมันมักเกี่ยวข้องกับลมพายุ และด้วยเหตุนี้จึงมักถูกเรียกว่า "วิญญาณแห่งลม" ต่อมา พวกมันยังเกี่ยวข้องกับคนตาย และบางครั้งถูกมองว่าเป็นผู้รับใช้ของฮาเดส ในเทพปกรณัมกรีก ฮาร์ปี้จะคอยควบคุมเรือด้วยลมพายุ คอยเฝ้ายมโลก และบางครั้งก็คอยทรมานผู้คนตามคำสั่งของเทพเจ้าอย่างซุส บทบาทของฮาร์ปีจะแตกต่างกันไปตามการตีความตำนานเทพเจ้ากรีกของนักเขียนแต่ละคน</font></p>
    </div>
</div>

<div class="sd-section">
    <div class="sd-section-head" style="background:linear-gradient(90deg,var(--c2),var(--c5))"><font size="4">
      เนื้อหา ประสบการณ์ของคุณ
    </font></div>
    <div class="sd-section-body">
      <p><font size="3">ทำไมต้องมาเจออะไรแบบนี้ด้วยเนี้ย คือเราจะบอกว่าครั้งแรกที่โมนีก้าเจอมัน เจอมันเป็นฝูงงงง 20 ตัว ไอ้บ้าาาา ใครเขาไปล่อฮาร์ปี้เป็นฝูงมาอยู่ในหุบเขาโซโนมากันวะเนี้ย ใครก็ได้ช่วยด้วย โชคดีฝีเท้า มนก เรามันตีนไวเลยหนีออกมาได้ แต่ก็เป็นแผลตรงแขนนิดหน่อย แต่ตอนนี้สบายดีแล้วล่ะ แล้วคราวนี้เมื่อกี่วันที่แล้วนี้แหละ สัก 3-4 วันที่แล้วคุณหมาป่าเวล็อกซ์เลยมาบอกว่าเนี้ย ฮาร์ปี้ฝูงนั้นหายไปแล้วนะโดนไล่ไปแล้ว เราเลยดีใจ ไปวิ่งที่หุบเขาโซโนมากับซูกิที่เป็นบัดดี้ ผลปรากฎ เจอฮาร์ปี้สองตัว โอ้ยยย จะบ้า เลยจัดการได้แหละ เย่ แต่แบบ...โหดร้ายกับคนเป็นประจำเดือนไปหน่อยนะ ฮืออออ ปวดท้องไม่พอ ยังจะต้องมาจัดการฮาร์ปี้อีก บ้าบอ!</font></p>
    </div>
</div>

<div class="sd-footer">
    <div class="sd-foot-box" style="background:var(--c1)"><font size="2">Cosmic Night
      </font><span class="sd-foot-note"><font size="2">RGB 38 46 76</font></span>
    </div>
    <div class="sd-foot-box" style="background:var(--c2)"><font size="2">Lunar Shadow
      </font><span class="sd-foot-note"><font size="2">RGB 69 83 138</font></span>
    </div>
    <div class="sd-foot-box" style="background:var(--c3)"><font size="2">Galaxy Mauve
      </font><span class="sd-foot-note"><font size="2">RGB 114 73 114</font></span>
    </div>
    <div class="sd-foot-box" style="background:var(--c5); color:#2b2b2b;"><font size="2">Pale Nebula
      </font><span class="sd-foot-note"><font size="2">RGB 233 204 211</font></span>
    </div>
</div>
</div>








Moneka โพสต์ 2025-9-9 03:07:59

แก้ไขครั้งสุดท้ายโดย Moneka เมื่อ 2025-9-9 03:11 <br /><br /><!-- วางทั้งหมดนี้ในกล่องข้อความโพสต์ได้เลย -->
<link href="https://fonts.googleapis.com/css2?family=Mali:wght@300;400;600;700&amp;family=Sriracha&amp;display=swap" rel="stylesheet">

<style>
/* ===== SCOPE เฉพาะใน .sd-wrap ===== */
.sd-wrap{
    max-width:980px; margin:0 auto; background:#fff; border-radius:12px; padding:24px;
    box-shadow:0 4px 12px rgba(0,0,0,.08);
    font-family:'Mali','Sarabun',system-ui,-apple-system,sans-serif; color:#2b2b2b; line-height:1.7;
}
.sd-wrap *{ box-sizing:border-box; }

/* พาเลทสี */
.sd-wrap{
    --c1:#262e4c; /* Cosmic Night */
    --c2:#45538a; /* Lunar Shadow */
    --c3:#724972; /* Galaxy Mauve */
    --c4:#b199db; /* Lilac */
    --c5:#e9ccd3; /* Pale Nebula */
}

.sd-title{
    text-align:center; font-size:36px; margin:0 0 8px;
    font-family:'Sriracha','Mali',cursive; letter-spacing:.02em;
}
.sd-sub{ text-align:center; color:#777; margin:-2px 0 26px; font-size:15px; }

.sd-top{ display:grid; grid-template-columns:1fr 1fr; gap:18px; align-items:stretch; margin-bottom:24px; }
.sd-img{ width:100%; height:100%; border-radius:12px; object-fit:cover; display:block; }

.sd-color-list{ display:grid; grid-template-columns:1fr; gap:12px; }
.sd-chip{
    display:flex; align-items:center; gap:12px; padding:10px; border-radius:12px;
    background:#f7f7f9; border:1px solid #ececf0;
}
.sd-chip-swatch{ width:56px; height:56px; border-radius:10px; flex:0 0 56px; }
.sd-chip > div{ min-width:0; }            /* ให้ข้อความด้านขวาห่อบรรทัดได้ */
.sd-chip-code{ font-weight:700; font-size:15px; }
.sd-chip-name{ font-size:13px; color:#6a6a6a; word-break:break-word; }

.sd-samples{ display:flex; gap:22px; justify-content:center; margin:10px 0 26px; flex-wrap:wrap; }
.sd-sample{ font-weight:700; font-size:22px; }

/* ===== บล็อกหัวข้อ + กล่องเนื้อหา (ยืดสูงตามข้อความ) ===== */
.sd-section{ margin-bottom:18px; }
.sd-section-head{
    border-radius:12px 12px 0 0; padding:12px 16px; color:#fff; font-weight:800; line-height:1.6;
    word-break:break-word;
}
.sd-section-body{
    border:1px solid #ececf0; border-top:0; background:#fafbff;
    border-radius:0 0 12px 12px; padding:16px;
}

/* ฟุตเตอร์ */
.sd-footer{ display:grid; grid-template-columns:repeat(4,1fr); gap:12px; }
.sd-foot-box{
    border-radius:12px; padding:18px; color:#fff; text-align:center; font-weight:800;
    font-family:'Mali','Sarabun',sans-serif;
}
.sd-foot-note{ display:block; font-weight:600; opacity:.9; font-size:12px; margin-top:6px; }

/* มือถือ */
@media (max-width:768px){
    .sd-top{ grid-template-columns:1fr; }
    .sd-footer{ grid-template-columns:1fr 1fr; }
}
@media (max-width:480px){
    .sd-footer{ grid-template-columns:1fr; }
}
</style>

<div class="sd-wrap">
<h2 class="sd-title"><font size="6">สมุดโง่ ๆ ของ มณีกานต์ บุปผชาติ หน้าที่ 3</font></h2>
<div class="sd-sub"><font size="3">ก็แร๊วครือ....ผมไม่รู้จักมิโนทอร์อันอื่นนอกจาก--- ใครรู้จักก็คือ 555 เฮ้ยยย เรามันสายแฟปะวะะะ</font></div>

<section class="sd-top">
    <!-- เปลี่ยน URL รูปได้ตามต้องการ -->
    <img class="sd-img" src="https://img5.pic.in.th/file/secure-sv1/8c32124458cca749ec7b6ab59a326506545f4129r1-720-815v2_hq.md.jpg" alt="Galaxy">
    <div class="sd-color-list">
      <div class="sd-chip">
      <div class="sd-chip-swatch" style="background:var(--c1)"></div>
      <div>
          <div class="sd-chip-code">ชื่ออสรุกาย</div>
          <div class="sd-chip-name">MINOTAUR หรือ มิโนทอร์</div>
      </div>
      </div>
      <div class="sd-chip">
      <div class="sd-chip-swatch" style="background:var(--c2)"></div>
      <div>
          <div class="sd-chip-code">สังกัด</div>
          <div class="sd-chip-name">ไม่มี</div>
      </div>
      </div>
      <div class="sd-chip">
      <div class="sd-chip-swatch" style="background:var(--c3)"></div>
      <div>
          <div class="sd-chip-code">การพิชิตครั้งแรก</div>
          <div class="sd-chip-name">
            ก่อนถึงอุโมงค์คัลลีคอตต์&nbsp;<a href="https://percyjackson.mooorp.com/forum.php?mod=redirect&amp;goto=findpost&amp;ptid=1169&amp;pid=8455" style="font-size: 12px;">[กุญแจนำทาง]</a></div>
      </div>
      </div>
      <div class="sd-chip">
      <div class="sd-chip-swatch" style="background:var(--c4)"></div>
      <div>
          <div class="sd-chip-code">#คำเตือน</div>
          <div class="sd-chip-name">มนกรู้จักมิโนทอร์แค่ตัวนี้อ่ะ ....เอาเรื่องอื่นก็รู้จัก&nbsp;Blue Dragon อ่ะ ไม่แน่ใจว่ารู้จักกันไหม แต่วัยรุ่นเมกามันก็ต้องมอนสเตอร์ไฮด์สิวะ !!! แบบนี้แหละ&nbsp;</div>
      </div>
      </div>
      <div class="sd-chip">
      <div class="sd-chip-swatch" style="background:var(--c5)"></div>
      <div>
          <div class="sd-chip-code">#เพิ่มเติม</div>
          <div class="sd-chip-name">ได้รับตื่นรู้ +1</div>
      </div>
      </div>
    </div>
</section>

<div class="sd-samples">
    <span class="sd-sample" style="color:var(--c1)">คิด</span>
    <span class="sd-sample" style="color:var(--c2)">ไม่</span>
    <span class="sd-sample" style="color:var(--c3)">ออก</span>
    <span class="sd-sample" style="color:var(--c4)">จริง</span>
    <span class="sd-sample" style="color:var(--c5)">จัง</span>
</div>

<!-- หัวข้อ + เนื้อหา (ยืดตามข้อความอัตโนมัติ) -->
<div class="sd-section">
    <div class="sd-section-head" style="background:linear-gradient(90deg,var(--c1),var(--c4))"><font size="4">
      เนื้อหา ประวัติอสุรกาย
    </font></div>
    <div class="sd-section-body">
      <p><font size="3">เป็นสัตว์ประหลาดที่มีร่างกายเป็นมนุษย์และมีหัวเป็นวัว หรือบางคนเชื่อว่ามีร่างกายเป็นวัวและมีหัวเป็นมนุษย์ กล่าวกันว่าเป็นลูกหลานของพาซิฟาเอกับวัวที่ถูกส่งมาจากทะเลมายังไมนอส ซึ่งพาซิฟาเอขังมันไว้ในเขาวงกตของชาวโนสเซียน และให้อาหารแก่มันด้วยร่างของเด็กสาวและชายหนุ่ม ซึ่งชาวเอเธนส์จำเป็นต้องส่งไปยังไมนอสเป็นบรรณาการในบางช่วงเวลา สัตว์ประหลาดตัวนี้ถูกธีซีอุสสังหาร มักถูกวาดโดยศิลปินโบราณที่อยู่คนเดียวในเขาวงกต หรือต่อสู้กับธีซีอุส สิ่งมีชีวิตนี้อาศัยอยู่ในเขาวงกตอันคดเคี้ยวของเขาวงกต ซึ่งมันถูกสังเวยหญิงสาวและเด็กสาวเป็นประจำเพื่อสนองความหิวโหยของมัน ในที่สุดสัตว์ร้ายก็ถูกวีรบุรุษธีซีอุสสังหาร</font></p>
    </div>
</div>

<div class="sd-section">
    <div class="sd-section-head" style="background:linear-gradient(90deg,var(--c2),var(--c5))"><font size="4">
      เนื้อหา ประสบการณ์ของคุณ
    </font></div>
    <div class="sd-section-body">
      <p><font size="3">คือเอาตรง ๆ มอนสเตอร์ตัวแรกที่ไล่ มนก ก็คือมิโนทอร์นี้แหละ แล้วมันก็มาเจอ มนก อีกครั้ง รอบนี้มันทำร้ายซูกิบัดดี้ของ มนก มนกจะไม่ทนแล้วล่ะ แต่ลืมตามาอีกทีมันก็ตายซะแล้ว หรือว่าบุคลิกอื่นจะออกมาอีกแล้วนะ ก็คงจะอย่างงั้นแหละ แล้วโมนีก้าก็ไปช่วยซูกิ!! แค่นั้นแหละ อีกอย่างที่ มนก เอาภาพของแมนนี่ ทอร์ มาเพราะชอบเรื่องมอนสเตอร์ไฮด์น่ะ เนี้ย ครั้งแรกก็คิดภาพของแมนนี่เลยล่ะ ร้อนแรงงงงงง นางมีแฟนเป็นไซคลอปสาวด้วยนะ 5555</font></p>
    </div>
</div>

<div class="sd-footer">
    <div class="sd-foot-box" style="background:var(--c1)"><font size="2">Cosmic Night
      </font><span class="sd-foot-note"><font size="2">RGB 38 46 76</font></span>
    </div>
    <div class="sd-foot-box" style="background:var(--c2)"><font size="2">Lunar Shadow
      </font><span class="sd-foot-note"><font size="2">RGB 69 83 138</font></span>
    </div>
    <div class="sd-foot-box" style="background:var(--c3)"><font size="2">Galaxy Mauve
      </font><span class="sd-foot-note"><font size="2">RGB 114 73 114</font></span>
    </div>
    <div class="sd-foot-box" style="background:var(--c5); color:#2b2b2b;"><font size="2">Pale Nebula
      </font><span class="sd-foot-note"><font size="2">RGB 233 204 211</font></span>
    </div>
</div>
</div>








Moneka โพสต์ 2025-9-23 05:13:37

แก้ไขครั้งสุดท้ายโดย Moneka เมื่อ 2025-10-17 13:59 <br /><br /><!-- วางทั้งหมดนี้ในกล่องข้อความโพสต์ได้เลย -->
<link href="https://fonts.googleapis.com/css2?family=Mali:wght@300;400;600;700&amp;family=Sriracha&amp;display=swap" rel="stylesheet">

<style>
/* ===== SCOPE เฉพาะใน .sd-wrap ===== */
.sd-wrap{
    max-width:980px; margin:0 auto; background:#fff; border-radius:12px; padding:24px;
    box-shadow:0 4px 12px rgba(0,0,0,.08);
    font-family:'Mali','Sarabun',system-ui,-apple-system,sans-serif; color:#2b2b2b; line-height:1.7;
}
.sd-wrap *{ box-sizing:border-box; }

/* พาเลทสี */
.sd-wrap{
    --c1:#262e4c; /* Cosmic Night */
    --c2:#45538a; /* Lunar Shadow */
    --c3:#724972; /* Galaxy Mauve */
    --c4:#b199db; /* Lilac */
    --c5:#e9ccd3; /* Pale Nebula */
}

.sd-title{
    text-align:center; font-size:36px; margin:0 0 8px;
    font-family:'Sriracha','Mali',cursive; letter-spacing:.02em;
}
.sd-sub{ text-align:center; color:#777; margin:-2px 0 26px; font-size:15px; }

.sd-top{ display:grid; grid-template-columns:1fr 1fr; gap:18px; align-items:stretch; margin-bottom:24px; }
.sd-img{ width:100%; height:100%; border-radius:12px; object-fit:cover; display:block; }

.sd-color-list{ display:grid; grid-template-columns:1fr; gap:12px; }
.sd-chip{
    display:flex; align-items:center; gap:12px; padding:10px; border-radius:12px;
    background:#f7f7f9; border:1px solid #ececf0;
}
.sd-chip-swatch{ width:56px; height:56px; border-radius:10px; flex:0 0 56px; }
.sd-chip > div{ min-width:0; }            /* ให้ข้อความด้านขวาห่อบรรทัดได้ */
.sd-chip-code{ font-weight:700; font-size:15px; }
.sd-chip-name{ font-size:13px; color:#6a6a6a; word-break:break-word; }

.sd-samples{ display:flex; gap:22px; justify-content:center; margin:10px 0 26px; flex-wrap:wrap; }
.sd-sample{ font-weight:700; font-size:22px; }

/* ===== บล็อกหัวข้อ + กล่องเนื้อหา (ยืดสูงตามข้อความ) ===== */
.sd-section{ margin-bottom:18px; }
.sd-section-head{
    border-radius:12px 12px 0 0; padding:12px 16px; color:#fff; font-weight:800; line-height:1.6;
    word-break:break-word;
}
.sd-section-body{
    border:1px solid #ececf0; border-top:0; background:#fafbff;
    border-radius:0 0 12px 12px; padding:16px;
}

/* ฟุตเตอร์ */
.sd-footer{ display:grid; grid-template-columns:repeat(4,1fr); gap:12px; }
.sd-foot-box{
    border-radius:12px; padding:18px; color:#fff; text-align:center; font-weight:800;
    font-family:'Mali','Sarabun',sans-serif;
}
.sd-foot-note{ display:block; font-weight:600; opacity:.9; font-size:12px; margin-top:6px; }

/* มือถือ */
@media (max-width:768px){
    .sd-top{ grid-template-columns:1fr; }
    .sd-footer{ grid-template-columns:1fr 1fr; }
}
@media (max-width:480px){
    .sd-footer{ grid-template-columns:1fr; }
}
</style>

<div class="sd-wrap">
<h2 class="sd-title"><font size="6">สมุดโง่ ๆ ของ มณีกานต์ บุปผชาติ หน้าที่ 4</font></h2>
<div class="sd-sub"><font size="3">คือ 5555555555 ขอโทษนะ แต่รู้จักแต่โทรลล์อันนี้อ่ะ 55555 ไม่ได้กวนตีน อันนี้จริงจัง</font></div>

<section class="sd-top">
    <!-- เปลี่ยน URL รูปได้ตามต้องการ -->
    <img class="sd-img" src="https://img5.pic.in.th/file/secure-sv1/troll-1.png" alt="Galaxy">
    <div class="sd-color-list">
      <div class="sd-chip">
      <div class="sd-chip-swatch" style="background:var(--c1)"></div>
      <div>
          <div class="sd-chip-code">ชื่ออสรุกาย</div>
          <div class="sd-chip-name">TROLL หรือ โทรลล์</div>
      </div>
      </div>
      <div class="sd-chip">
      <div class="sd-chip-swatch" style="background:var(--c2)"></div>
      <div>
          <div class="sd-chip-code">สังกัด</div>
          <div class="sd-chip-name">ไม่มี</div>
      </div>
      </div>
      <div class="sd-chip">
      <div class="sd-chip-swatch" style="background:var(--c3)"></div>
      <div>
          <div class="sd-chip-code">การพิชิตครั้งแรก</div>
          <div class="sd-chip-name">
            อุโมงค์คัลลีคอตต์&nbsp;<a href="https://percyjackson.mooorp.com/forum.php?mod=redirect&amp;goto=findpost&amp;ptid=436&amp;pid=8566" style="font-size: 12px;">[กุญแจนำทาง]</a></div>
      </div>
      </div>
      <div class="sd-chip">
      <div class="sd-chip-swatch" style="background:var(--c4)"></div>
      <div>
          <div class="sd-chip-code">#คำเตือน</div>
          <div class="sd-chip-name">คุณคิดว่า มนก รู้จักโทรลล์ครั้งแรกเพราะอะไร? แฮรี่สิวะ มันต้องจากลูกไอ้เจมส์อยู่แล้ว นี้ถ้ามีไม้กายสิทธิ์จะเอายัดจมูกมันอยู่ 555 แต่ไม่ได้ไง ไม่มีแม่งเอ้ยยย จะสอดกราดิอุสก็โหดร้ายเกินไป</div>
      </div>
      </div>
      <div class="sd-chip">
      <div class="sd-chip-swatch" style="background:var(--c5)"></div>
      <div>
          <div class="sd-chip-code">#เพิ่มเติม</div>
          <div class="sd-chip-name">ได้รับตื่นรู้ +1</div>
      </div>
      </div>
    </div>
</section>

<div class="sd-samples">
    <span class="sd-sample" style="color:var(--c1)">มัน</span>
    <span class="sd-sample" style="color:var(--c2)">ไม่</span>
    <span class="sd-sample" style="color:var(--c3)">น่า</span>
    <span class="sd-sample" style="color:var(--c4)">โง่</span>
    <span class="sd-sample" style="color:var(--c5)">อ่ะ</span>
</div>

<!-- หัวข้อ + เนื้อหา (ยืดตามข้อความอัตโนมัติ) -->
<div class="sd-section">
    <div class="sd-section-head" style="background:linear-gradient(90deg,var(--c1),var(--c4))"><font size="4">
      เนื้อหา ประวัติอสุรกาย
    </font></div>
    <div class="sd-section-body">
      <p><font size="3">โทรลล์เป็นอสุรกายในตำนานนอร์สและโฟล์คลอร์ของสแกนดิเนเวีย มีรูปร่างและขนาดที่หลากหลาย แต่โดยทั่วไปมักถูกอธิบายว่าเป็นสิ่งมีชีวิตขนาดยักษ์ มีพละกำลังมหาศาล และมีผิวหนังเหมือนหิน&nbsp;โทรลล์มักถูกบรรยายว่าเป็นสิ่งมีชีวิตที่มีหน้าตาอัปลักษณ์ มีจมูกขนาดใหญ่และรูปร่างไม่สมส่วน ในตำนานดั้งเดิม โทรลล์มีลักษณะคล้ายกับยักษ์หรือสิ่งมีชีวิตในภูเขา พวกมันอาศัยอยู่ตามถ้ำ ภูเขา หรือป่าลึก ชอบความสันโดษและมีความฉลาดน้อยกว่ามนุษย์&nbsp;ในบางตำนาน โทรลล์มีจุดอ่อนที่น่าสนใจคือพวกมันจะกลายเป็นหินเมื่อถูกแสงอาทิตย์ เช่นเดียวกับโทรลล์ในนิทาน "The Hobbit" ของเจ.อาร์.อาร์. โทลคีน ซึ่งเป็นตัวอย่างที่โดดเด่น</font></p><p><font size="3"><br></font></p><p><font size="3">โทรลล์มักถูกมองว่าเป็นศัตรูของมนุษย์ในนิทานพื้นบ้านของสแกนดิเนเวีย พวกมันชอบลักพาตัวมนุษย์ โดยเฉพาะเด็กและหญิงสาว และมักสร้างความเสียหายให้กับทรัพย์สินและปศุสัตว์<b>&nbsp;</b>อย่างไรก็ตาม ในบางเรื่องเล่าก็มีโทรลล์ที่มีนิสัยเป็นมิตรหรือไม่เป็นอันตราย พวกมันอาจให้ความช่วยเหลือมนุษย์ หรือแลกเปลี่ยนสิ่งของกันได้ ซึ่งแสดงให้เห็นถึงความซับซ้อนของตัวละครโทรลล์ที่ไม่ได้มีแค่ด้านร้ายเพียงอย่างเดียว</font></p>
    </div>
</div>

<div class="sd-section">
    <div class="sd-section-head" style="background:linear-gradient(90deg,var(--c2),var(--c5))"><font size="4">
      เนื้อหา ประสบการณ์ของคุณ
    </font></div>
    <div class="sd-section-body">
      <p><font size="3">นั่งเฝ้ายามอยู่ดี ๆ เจือกเจอโทรลล์มากวนตีนซะงั้น เหอะ ๆ คิดว่า มนก จะยอมหรอ ก็จัดการโทรลล์ไปเลยสิค้าบบบ ของกล้วย ๆ ขนาดนี้ (กล้วย?) ก็ลำบากพอสมควรอยู่ เอาความจริงทำไมโทรลล์ตัวจริงมันน่ากลัวกว่าในหนังลูกไอ้เจมส์อีกอ่ะ แม่งเอ้ยย ถ้ามีไม้กายสิทธิ์นะ ฉันยัดจมูกมันไปแล้ววววว ใครก็ได้ มนกไม่อยากเจอมันอีก มันน่าเกลียดง่ะ แง้ววว</font></p>
    </div>
</div>

<div class="sd-footer">
    <div class="sd-foot-box" style="background:var(--c1)"><font size="2">Cosmic Night
      </font><span class="sd-foot-note"><font size="2">RGB 38 46 76</font></span>
    </div>
    <div class="sd-foot-box" style="background:var(--c2)"><font size="2">Lunar Shadow
      </font><span class="sd-foot-note"><font size="2">RGB 69 83 138</font></span>
    </div>
    <div class="sd-foot-box" style="background:var(--c3)"><font size="2">Galaxy Mauve
      </font><span class="sd-foot-note"><font size="2">RGB 114 73 114</font></span>
    </div>
    <div class="sd-foot-box" style="background:var(--c5); color:#2b2b2b;"><font size="2">Pale Nebula
      </font><span class="sd-foot-note"><font size="2">RGB 233 204 211</font></span>
    </div>
</div>
</div>








Moneka โพสต์ 4 วันที่แล้ว

แก้ไขครั้งสุดท้ายโดย Moneka เมื่อ 2025-10-17 13:59 <br /><br /><!-- วางทั้งหมดนี้ในกล่องข้อความโพสต์ได้เลย -->
<link href="https://fonts.googleapis.com/css2?family=Mali:wght@300;400;600;700&amp;family=Sriracha&amp;display=swap" rel="stylesheet">

<style>
/* ===== SCOPE เฉพาะใน .sd-wrap ===== */
.sd-wrap{
    max-width:980px; margin:0 auto; background:#fff; border-radius:12px; padding:24px;
    box-shadow:0 4px 12px rgba(0,0,0,.08);
    font-family:'Mali','Sarabun',system-ui,-apple-system,sans-serif; color:#2b2b2b; line-height:1.7;
}
.sd-wrap *{ box-sizing:border-box; }

/* พาเลทสี */
.sd-wrap{
    --c1:#262e4c; /* Cosmic Night */
    --c2:#45538a; /* Lunar Shadow */
    --c3:#724972; /* Galaxy Mauve */
    --c4:#b199db; /* Lilac */
    --c5:#e9ccd3; /* Pale Nebula */
}

.sd-title{
    text-align:center; font-size:36px; margin:0 0 8px;
    font-family:'Sriracha','Mali',cursive; letter-spacing:.02em;
}
.sd-sub{ text-align:center; color:#777; margin:-2px 0 26px; font-size:15px; }

.sd-top{ display:grid; grid-template-columns:1fr 1fr; gap:18px; align-items:stretch; margin-bottom:24px; }
.sd-img{ width:100%; height:100%; border-radius:12px; object-fit:cover; display:block; }

.sd-color-list{ display:grid; grid-template-columns:1fr; gap:12px; }
.sd-chip{
    display:flex; align-items:center; gap:12px; padding:10px; border-radius:12px;
    background:#f7f7f9; border:1px solid #ececf0;
}
.sd-chip-swatch{ width:56px; height:56px; border-radius:10px; flex:0 0 56px; }
.sd-chip > div{ min-width:0; }            /* ให้ข้อความด้านขวาห่อบรรทัดได้ */
.sd-chip-code{ font-weight:700; font-size:15px; }
.sd-chip-name{ font-size:13px; color:#6a6a6a; word-break:break-word; }

.sd-samples{ display:flex; gap:22px; justify-content:center; margin:10px 0 26px; flex-wrap:wrap; }
.sd-sample{ font-weight:700; font-size:22px; }

/* ===== บล็อกหัวข้อ + กล่องเนื้อหา (ยืดสูงตามข้อความ) ===== */
.sd-section{ margin-bottom:18px; }
.sd-section-head{
    border-radius:12px 12px 0 0; padding:12px 16px; color:#fff; font-weight:800; line-height:1.6;
    word-break:break-word;
}
.sd-section-body{
    border:1px solid #ececf0; border-top:0; background:#fafbff;
    border-radius:0 0 12px 12px; padding:16px;
}

/* ฟุตเตอร์ */
.sd-footer{ display:grid; grid-template-columns:repeat(4,1fr); gap:12px; }
.sd-foot-box{
    border-radius:12px; padding:18px; color:#fff; text-align:center; font-weight:800;
    font-family:'Mali','Sarabun',sans-serif;
}
.sd-foot-note{ display:block; font-weight:600; opacity:.9; font-size:12px; margin-top:6px; }

/* มือถือ */
@media (max-width:768px){
    .sd-top{ grid-template-columns:1fr; }
    .sd-footer{ grid-template-columns:1fr 1fr; }
}
@media (max-width:480px){
    .sd-footer{ grid-template-columns:1fr; }
}
</style>

<div class="sd-wrap">
<h2 class="sd-title"><font size="6">สมุดโง่ ๆ ของ มณีกานต์ บุปผชาติ หน้าที่ 5</font></h2>
<div class="sd-sub"><font size="3">ชูปาคาบาาาาาาาาาาา รู้จักแค่คาบาร่าอ่ะ ไม่รู้จักอันนี้ตัวไรว๊าาาา</font></div>

<section class="sd-top">
    <!-- เปลี่ยน URL รูปได้ตามต้องการ -->
    <img class="sd-img" src="https://i.imgur.com/yaDl0AB.png" alt="Galaxy">
    <div class="sd-color-list">
      <div class="sd-chip">
      <div class="sd-chip-swatch" style="background:var(--c1)"></div>
      <div>
          <div class="sd-chip-code">ชื่ออสรุกาย</div>
          <div class="sd-chip-name">ชูปาคาบรา หรือ Chupacabra</div>
      </div>
      </div>
      <div class="sd-chip">
      <div class="sd-chip-swatch" style="background:var(--c2)"></div>
      <div>
          <div class="sd-chip-code">สังกัด</div>
          <div class="sd-chip-name">ซาตาน</div>
      </div>
      </div>
      <div class="sd-chip">
      <div class="sd-chip-swatch" style="background:var(--c3)"></div>
      <div>
          <div class="sd-chip-code">การพิชิตครั้งแรก</div>
          <div class="sd-chip-name">
            เมืองฟีนิกซ์&nbsp;<a href="https://percyjackson.mooorp.com/forum.php?mod=redirect&amp;goto=findpost&amp;ptid=1127&amp;pid=8738" style="font-size: 12px;">[กุญแจนำทาง]</a></div>
      </div>
      </div>
      <div class="sd-chip">
      <div class="sd-chip-swatch" style="background:var(--c4)"></div>
      <div>
          <div class="sd-chip-code">#คำเตือน</div>
          <div class="sd-chip-name">มันน่าแปลกใจที่เจอมันอยู่นะ รอบหน้าท่าทางจะเจอฟินิกว์ เจอจริงคืออึ้งนะบอกเลย 555+</div>
      </div>
      </div>
      <div class="sd-chip">
      <div class="sd-chip-swatch" style="background:var(--c5)"></div>
      <div>
          <div class="sd-chip-code">#เพิ่มเติม</div>
          <div class="sd-chip-name">ได้รับตื่นรู้ +1</div>
      </div>
      </div>
    </div>
</section>

<div class="sd-samples">
    <span class="sd-sample" style="color:var(--c1)">มัน</span>
    <span class="sd-sample" style="color:var(--c2)">น่า</span>
    <span class="sd-sample" style="color:var(--c3)">เกลียด</span>
    <span class="sd-sample" style="color:var(--c4)">มาก</span>
    <span class="sd-sample" style="color:var(--c5)">นะ</span>
</div>

<!-- หัวข้อ + เนื้อหา (ยืดตามข้อความอัตโนมัติ) -->
<div class="sd-section">
    <div class="sd-section-head" style="background:linear-gradient(90deg,var(--c1),var(--c4))"><font size="4">
      เนื้อหา ประวัติอสุรกาย
    </font></div>
    <div class="sd-section-body"><p><font size="3">&nbsp;ชูปาคาบรา (Chupacabra) เป็นสิ่งมีชีวิตลึกลับตามตำนานในละตินอเมริกาและบางส่วนของทวีปอเมริกาเหนือ&nbsp;</font><span style="font-size: medium;">มาจากภาษาสเปน: Chupa แปลว่า "ดูด" และ Cabra แปลว่า "แพะ" จึงหมายถึง "ตัวดูดเลือดแพะ"</span><span style="font-size: medium;">ชูปาคาบราเป็น คริปทิด (Cryptid) หรือสิ่งมีชีวิตตามตำนาน ที่เกิดขึ้นจากเหตุการณ์ปศุสัตว์ตายอย่างลึกลับ โดยมีรากฐานมาจากความหวาดกลัว และได้รับการอธิบายทางวิทยาศาสตร์ว่าเป็นสัตว์เลี้ยงลูกด้วยนมที่มีอาการป่วยรุนแรงในภายหลัง</span></p><p><span style="font-size: medium;"><br></span></p><p><font size="3">รายงานการพบเห็นในช่วงแรก (ในปวยร์โตรีโก) มักอธิบายว่า ชูปาคาบราเป็นสิ่งมีชีวิตที่ยืนสองขา (คล้ายมนุษย์หรือจิงโจ้) มีรูปร่างคล้ายสัตว์เลื้อยคลาน มีผิวสีเทา มีหนามหรือสันนูนอยู่ด้านหลัง และมีดวงตาสีแดงขนาดใหญ่ (บางทฤษฎีเชื่อว่าได้รับอิทธิพลจากภาพยนตร์ไซไฟเรื่อง Species ที่ออกฉายในปี 1995)</font></p>
    </div>
</div>

<div class="sd-section">
    <div class="sd-section-head" style="background:linear-gradient(90deg,var(--c2),var(--c5))"><font size="4">
      เนื้อหา ประสบการณ์ของคุณ
    </font></div>
    <div class="sd-section-body">
      <p><font size="3">โนคอมเม้นท์ว่ะ มนก รู้สึกว่าอย่างน้อยมันก็ไม่เละ แต่มนก ไม่ได้ชอบมันเอาเสียเลย แม่งโคตรน่ากลัวเลยง่ะ T_T ไม่ชอบเลยจริง ๆ แง้ ๆ ไม่อยากเจอตัวอะไรแบบนี้อีกแล้ว</font></p>
    </div>
</div>

<div class="sd-footer">
    <div class="sd-foot-box" style="background:var(--c1)"><font size="2">Cosmic Night
      </font><span class="sd-foot-note"><font size="2">RGB 38 46 76</font></span>
    </div>
    <div class="sd-foot-box" style="background:var(--c2)"><font size="2">Lunar Shadow
      </font><span class="sd-foot-note"><font size="2">RGB 69 83 138</font></span>
    </div>
    <div class="sd-foot-box" style="background:var(--c3)"><font size="2">Galaxy Mauve
      </font><span class="sd-foot-note"><font size="2">RGB 114 73 114</font></span>
    </div>
    <div class="sd-foot-box" style="background:var(--c5); color:#2b2b2b;"><font size="2">Pale Nebula
      </font><span class="sd-foot-note"><font size="2">RGB 233 204 211</font></span>
    </div>
</div>
</div>








Moneka โพสต์ 3 วันที่แล้ว

<!-- วางทั้งหมดนี้ในกล่องข้อความโพสต์ได้เลย -->
<link href="https://fonts.googleapis.com/css2?family=Mali:wght@300;400;600;700&amp;family=Sriracha&amp;display=swap" rel="stylesheet">

<style>
/* ===== SCOPE เฉพาะใน .sd-wrap ===== */
.sd-wrap{
    max-width:980px; margin:0 auto; background:#fff; border-radius:12px; padding:24px;
    box-shadow:0 4px 12px rgba(0,0,0,.08);
    font-family:'Mali','Sarabun',system-ui,-apple-system,sans-serif; color:#2b2b2b; line-height:1.7;
}
.sd-wrap *{ box-sizing:border-box; }

/* พาเลทสี */
.sd-wrap{
    --c1:#262e4c; /* Cosmic Night */
    --c2:#45538a; /* Lunar Shadow */
    --c3:#724972; /* Galaxy Mauve */
    --c4:#b199db; /* Lilac */
    --c5:#e9ccd3; /* Pale Nebula */
}

.sd-title{
    text-align:center; font-size:36px; margin:0 0 8px;
    font-family:'Sriracha','Mali',cursive; letter-spacing:.02em;
}
.sd-sub{ text-align:center; color:#777; margin:-2px 0 26px; font-size:15px; }

.sd-top{ display:grid; grid-template-columns:1fr 1fr; gap:18px; align-items:stretch; margin-bottom:24px; }
.sd-img{ width:100%; height:100%; border-radius:12px; object-fit:cover; display:block; }

.sd-color-list{ display:grid; grid-template-columns:1fr; gap:12px; }
.sd-chip{
    display:flex; align-items:center; gap:12px; padding:10px; border-radius:12px;
    background:#f7f7f9; border:1px solid #ececf0;
}
.sd-chip-swatch{ width:56px; height:56px; border-radius:10px; flex:0 0 56px; }
.sd-chip > div{ min-width:0; }            /* ให้ข้อความด้านขวาห่อบรรทัดได้ */
.sd-chip-code{ font-weight:700; font-size:15px; }
.sd-chip-name{ font-size:13px; color:#6a6a6a; word-break:break-word; }

.sd-samples{ display:flex; gap:22px; justify-content:center; margin:10px 0 26px; flex-wrap:wrap; }
.sd-sample{ font-weight:700; font-size:22px; }

/* ===== บล็อกหัวข้อ + กล่องเนื้อหา (ยืดสูงตามข้อความ) ===== */
.sd-section{ margin-bottom:18px; }
.sd-section-head{
    border-radius:12px 12px 0 0; padding:12px 16px; color:#fff; font-weight:800; line-height:1.6;
    word-break:break-word;
}
.sd-section-body{
    border:1px solid #ececf0; border-top:0; background:#fafbff;
    border-radius:0 0 12px 12px; padding:16px;
}

/* ฟุตเตอร์ */
.sd-footer{ display:grid; grid-template-columns:repeat(4,1fr); gap:12px; }
.sd-foot-box{
    border-radius:12px; padding:18px; color:#fff; text-align:center; font-weight:800;
    font-family:'Mali','Sarabun',sans-serif;
}
.sd-foot-note{ display:block; font-weight:600; opacity:.9; font-size:12px; margin-top:6px; }

/* มือถือ */
@media (max-width:768px){
    .sd-top{ grid-template-columns:1fr; }
    .sd-footer{ grid-template-columns:1fr 1fr; }
}
@media (max-width:480px){
    .sd-footer{ grid-template-columns:1fr; }
}
</style>

<div class="sd-wrap">
<h2 class="sd-title"><font size="6">สมุดโง่ ๆ ของ มณีกานต์ บุปผชาติ หน้าที่ 6</font></h2>
<div class="sd-sub"><font size="3">เจอตัวเดียว ไม่ เจอเป็นฝูง ใช่ ไอ้เหี้ยยยยยยยย นี้มันหนังไซไฟ ไอโรบอทยังน่ารักกว่ามันเลย</font></div>

<section class="sd-top">
    <!-- เปลี่ยน URL รูปได้ตามต้องการ -->
    <img class="sd-img" src="https://i.imgur.com/CeHm0v9.png" alt="Galaxy">
    <div class="sd-color-list">
      <div class="sd-chip">
      <div class="sd-chip-swatch" style="background:var(--c1)"></div>
      <div>
          <div class="sd-chip-code">ชื่ออสรุกาย</div>
          <div class="sd-chip-name">เดธแมชชีน หรือ Deathmachine</div>
      </div>
      </div>
      <div class="sd-chip">
      <div class="sd-chip-swatch" style="background:var(--c2)"></div>
      <div>
          <div class="sd-chip-code">สังกัด</div>
          <div class="sd-chip-name">เฮเฟตัส/วัลแคน</div>
      </div>
      </div>
      <div class="sd-chip">
      <div class="sd-chip-swatch" style="background:var(--c3)"></div>
      <div>
          <div class="sd-chip-code">การพิชิตครั้งแรก</div>
          <div class="sd-chip-name">
            ท่าอากาศยานนานาชาติแวนคูเวอร์&nbsp;<a href="https://percyjackson.mooorp.com/forum.php?mod=redirect&amp;goto=findpost&amp;ptid=1210&amp;pid=8860" style="font-size: 12px;">[กุญแจนำทาง]</a></div>
      </div>
      </div>
      <div class="sd-chip">
      <div class="sd-chip-swatch" style="background:var(--c4)"></div>
      <div>
          <div class="sd-chip-code">#คำเตือน</div>
          <div class="sd-chip-name">มาตัวเดียวไม่ว่า คุณพี่มาเป็นฝูง กูจะบ้าาาา</div>
      </div>
      </div>
      <div class="sd-chip">
      <div class="sd-chip-swatch" style="background:var(--c5)"></div>
      <div>
          <div class="sd-chip-code">#เพิ่มเติม</div>
          <div class="sd-chip-name">ได้รับตื่นรู้ +1</div>
      </div>
      </div>
    </div>
</section>

<div class="sd-samples">
    <span class="sd-sample" style="color:var(--c1)">มา</span>
    <span class="sd-sample" style="color:var(--c2)">เป็น</span>
    <span class="sd-sample" style="color:var(--c3)">ฝูง</span>
    <span class="sd-sample" style="color:var(--c4)">เลย</span>
    <span class="sd-sample" style="color:var(--c5)">นะ</span>
</div>

<!-- หัวข้อ + เนื้อหา (ยืดตามข้อความอัตโนมัติ) -->
<div class="sd-section">
    <div class="sd-section-head" style="background:linear-gradient(90deg,var(--c1),var(--c4))"><font size="4">
      เนื้อหา ประวัติอสุรกาย
    </font></div>
    <div class="sd-section-body"><p><font size="3">เดธแมชชีน คืออสุรกายจักรกลสังหารที่เฮเฟตัสสร้างขึ้นในปี 2024 ด้วยความผิดพลาดในการถูกโยนทิ้ง ทำให้มันเปิดใช้งานและตั้งโปรแกรมตัวเองให้ ล่าและทำลายล้างเดมิก็อต ทุกชนิดเป็นภารกิจหลัก มีบุคลิก ไร้ความปราณี ดุร้าย และขับเคลื่อนด้วยความโกรธแค้นจากการถูกทอดทิ้ง จุดอ่อนที่สำคัญของมันคือ เซลล์พลังงาน, ระบบระบายความร้อน, ชิปประมวลผล AI ที่สามารถแฮ็กได้, เซนเซอร์ที่ถูกรบกวนได้, และจุดเชื่อมต่อของเกราะ ซึ่งสามารถใช้ร่วมกับการยั่วยุความโกรธหรือความประมาทของมันเป็นช่องทางโจมตี</font></p>
    </div>
</div>

<div class="sd-section">
    <div class="sd-section-head" style="background:linear-gradient(90deg,var(--c2),var(--c5))"><font size="4">
      เนื้อหา ประสบการณ์ของคุณ
    </font></div>
    <div class="sd-section-body">
      <p><font size="3">เอาตรง ๆ ตอนเจอมันคืออึ้ง ตอนนั้นเพลงในหนังคือดังขึ้นในหัวอ่ะ โคตรเห้ 555555 ฉันอยากจะบ้าตาย เอาเป็นว่าทางที่ดีถ้าจะไปเจอมันก็ดูดี ๆ แล้วกัน พกสเตตัส POW ไปสัก 500 แล้วจะสบาย (??????)</font></p>
    </div>
</div>

<div class="sd-footer">
    <div class="sd-foot-box" style="background:var(--c1)"><font size="2">Cosmic Night
      </font><span class="sd-foot-note"><font size="2">RGB 38 46 76</font></span>
    </div>
    <div class="sd-foot-box" style="background:var(--c2)"><font size="2">Lunar Shadow
      </font><span class="sd-foot-note"><font size="2">RGB 69 83 138</font></span>
    </div>
    <div class="sd-foot-box" style="background:var(--c3)"><font size="2">Galaxy Mauve
      </font><span class="sd-foot-note"><font size="2">RGB 114 73 114</font></span>
    </div>
    <div class="sd-foot-box" style="background:var(--c5); color:#2b2b2b;"><font size="2">Pale Nebula
      </font><span class="sd-foot-note"><font size="2">RGB 233 204 211</font></span>
    </div>
</div>
</div>








Moneka โพสต์ 3 วันที่แล้ว

<!-- วางทั้งหมดนี้ในกล่องข้อความโพสต์ได้เลย -->
<link href="https://fonts.googleapis.com/css2?family=Mali:wght@300;400;600;700&amp;family=Sriracha&amp;display=swap" rel="stylesheet">

<style>
/* ===== SCOPE เฉพาะใน .sd-wrap ===== */
.sd-wrap{
    max-width:980px; margin:0 auto; background:#fff; border-radius:12px; padding:24px;
    box-shadow:0 4px 12px rgba(0,0,0,.08);
    font-family:'Mali','Sarabun',system-ui,-apple-system,sans-serif; color:#2b2b2b; line-height:1.7;
}
.sd-wrap *{ box-sizing:border-box; }

/* พาเลทสี */
.sd-wrap{
    --c1:#262e4c; /* Cosmic Night */
    --c2:#45538a; /* Lunar Shadow */
    --c3:#724972; /* Galaxy Mauve */
    --c4:#b199db; /* Lilac */
    --c5:#e9ccd3; /* Pale Nebula */
}

.sd-title{
    text-align:center; font-size:36px; margin:0 0 8px;
    font-family:'Sriracha','Mali',cursive; letter-spacing:.02em;
}
.sd-sub{ text-align:center; color:#777; margin:-2px 0 26px; font-size:15px; }

.sd-top{ display:grid; grid-template-columns:1fr 1fr; gap:18px; align-items:stretch; margin-bottom:24px; }
.sd-img{ width:100%; height:100%; border-radius:12px; object-fit:cover; display:block; }

.sd-color-list{ display:grid; grid-template-columns:1fr; gap:12px; }
.sd-chip{
    display:flex; align-items:center; gap:12px; padding:10px; border-radius:12px;
    background:#f7f7f9; border:1px solid #ececf0;
}
.sd-chip-swatch{ width:56px; height:56px; border-radius:10px; flex:0 0 56px; }
.sd-chip > div{ min-width:0; }            /* ให้ข้อความด้านขวาห่อบรรทัดได้ */
.sd-chip-code{ font-weight:700; font-size:15px; }
.sd-chip-name{ font-size:13px; color:#6a6a6a; word-break:break-word; }

.sd-samples{ display:flex; gap:22px; justify-content:center; margin:10px 0 26px; flex-wrap:wrap; }
.sd-sample{ font-weight:700; font-size:22px; }

/* ===== บล็อกหัวข้อ + กล่องเนื้อหา (ยืดสูงตามข้อความ) ===== */
.sd-section{ margin-bottom:18px; }
.sd-section-head{
    border-radius:12px 12px 0 0; padding:12px 16px; color:#fff; font-weight:800; line-height:1.6;
    word-break:break-word;
}
.sd-section-body{
    border:1px solid #ececf0; border-top:0; background:#fafbff;
    border-radius:0 0 12px 12px; padding:16px;
}

/* ฟุตเตอร์ */
.sd-footer{ display:grid; grid-template-columns:repeat(4,1fr); gap:12px; }
.sd-foot-box{
    border-radius:12px; padding:18px; color:#fff; text-align:center; font-weight:800;
    font-family:'Mali','Sarabun',sans-serif;
}
.sd-foot-note{ display:block; font-weight:600; opacity:.9; font-size:12px; margin-top:6px; }

/* มือถือ */
@media (max-width:768px){
    .sd-top{ grid-template-columns:1fr; }
    .sd-footer{ grid-template-columns:1fr 1fr; }
}
@media (max-width:480px){
    .sd-footer{ grid-template-columns:1fr; }
}
</style>

<div class="sd-wrap">
<h2 class="sd-title"><font size="6">สมุดโง่ ๆ ของ มณีกานต์ บุปผชาติ หน้าที่ 7</font></h2>
<div class="sd-sub"><font size="3">บางครั้งผมก็คิดว่า ผมเกือบตายแล้วจริง ๆ คือเลือดแดง ตุยเย่ กุจะบ้าาาา</font></div>

<section class="sd-top">
    <!-- เปลี่ยน URL รูปได้ตามต้องการ -->
    <img class="sd-img" src="https://i.imgur.com/ftAY6EO.png" alt="Galaxy">
    <div class="sd-color-list">
      <div class="sd-chip">
      <div class="sd-chip-swatch" style="background:var(--c1)"></div>
      <div>
          <div class="sd-chip-code">ชื่ออสรุกาย</div>
          <div class="sd-chip-name">บุตรแห่งคิโอเน่ หรือ Children of Khione</div>
      </div>
      </div>
      <div class="sd-chip">
      <div class="sd-chip-swatch" style="background:var(--c2)"></div>
      <div>
          <div class="sd-chip-code">สังกัด</div>
          <div class="sd-chip-name">คิโอเน่</div>
      </div>
      </div>
      <div class="sd-chip">
      <div class="sd-chip-swatch" style="background:var(--c3)"></div>
      <div>
          <div class="sd-chip-code">การพิชิตครั้งแรก</div>
          <div class="sd-chip-name">
            นูนาวุต แคนาดา&nbsp;<a href="https://percyjackson.mooorp.com/forum.php?mod=redirect&amp;goto=findpost&amp;ptid=1210&amp;pid=8880" style="font-size: 12px;">[กุญแจนำทาง]</a></div>
      </div>
      </div>
      <div class="sd-chip">
      <div class="sd-chip-swatch" style="background:var(--c4)"></div>
      <div>
          <div class="sd-chip-code">#คำเตือน</div>
          <div class="sd-chip-name">มาตัวเดียว ❌&nbsp; มา 10 ตัว&nbsp;⭕</div>
      </div>
      </div>
      <div class="sd-chip">
      <div class="sd-chip-swatch" style="background:var(--c5)"></div>
      <div>
          <div class="sd-chip-code">#เพิ่มเติม</div>
          <div class="sd-chip-name">ได้รับตื่นรู้ +1</div>
      </div>
      </div>
    </div>
</section>

<div class="sd-samples">
    <span class="sd-sample" style="color:var(--c1)">มา</span>
    <span class="sd-sample" style="color:var(--c2)">เป็น</span>
    <span class="sd-sample" style="color:var(--c3)">กลุ่ม</span>
    <span class="sd-sample" style="color:var(--c4)">เลย</span>
    <span class="sd-sample" style="color:var(--c5)">นะ</span>
</div>

<!-- หัวข้อ + เนื้อหา (ยืดตามข้อความอัตโนมัติ) -->
<div class="sd-section">
    <div class="sd-section-head" style="background:linear-gradient(90deg,var(--c1),var(--c4))"><font size="4">
      เนื้อหา ประวัติอสุรกาย
    </font></div>
    <div class="sd-section-body"><p><font size="3">บุตรแห่งคิโอเน่ คืออสุรกายตำนานกรีกที่ถือกำเนิดจากการ ปรากฏร่าง (Manifestation) จากหยาดน้ำแข็งและเจตจำนงอันเย็นชาของ เทพีคิโอเน่ เทพีแห่งหิมะและลมหนาว พวกมันมีผิวหนังเป็นผลึกน้ำแข็งที่ทนทาน ร่างกายปล่อยไอเย็น และอาศัยในถ้ำหรือทุ่งน้ำแข็งบริเวณ ขั้วโลกเหนือและใต้ รวมถึงพื้นที่หิมะปกคลุมของแคนาดาและเทือกเขาเอเวอเรสต์ พวกมันมีบุคลิก เย็นชา ไร้ความปราณี และภักดีต่อเทพีคิโอเน่อย่างแน่นอน โดยจะโหดร้ายในการล่าเหยื่อ และแสดงความไม่พอใจอย่างรุนแรงหากมีผู้บุกรุกอาณาเขตน้ำแข็ง จุดอ่อนที่สำคัญคือ ไฟและความร้อน โดยเฉพาะไฟจากเทพเจ้าหรือเวทมนตร์ไฟ การสังหารพวกมันจะได้รับสินสงครามเป็น ผลึกน้ำแข็ง, เกล็ดแข็งคิโอเน่ และแก่นวิญญาณแห่งเหมันต์ (มีโอกาสได้รับเพิ่มเป็นสองเท่าหากมีค่า LUK 120+)</font></p>
    </div>
</div>

<div class="sd-section">
    <div class="sd-section-head" style="background:linear-gradient(90deg,var(--c2),var(--c5))"><font size="4">
      เนื้อหา ประสบการณ์ของคุณ
    </font></div>
    <div class="sd-section-body">
      <p><font size="3">เห็นตอนแรกเหมือนตัวเองอยู่ใน GOT อ่ะ แม่งเหมือนมาก ผมนี้แบบว่า&nbsp;Winter is coming ทันทีเลยอ่ะตอนที่เห็น แล้วคือเกือบตายเพราะมันด้วยนะ เลสเตอร์ขอโทษที่ซนค่ะ 555 ไม่นึกว่ามันจะสู้ยากขนาดนั้นเหมือนกัน ตอนนั้นอย่างซ่า หลังจากนั้นได้รู้ว่าม่อนที่นี่แม่งโหดมาก เม้งงงงง</font></p>
    </div>
</div>

<div class="sd-footer">
    <div class="sd-foot-box" style="background:var(--c1)"><font size="2">Cosmic Night
      </font><span class="sd-foot-note"><font size="2">RGB 38 46 76</font></span>
    </div>
    <div class="sd-foot-box" style="background:var(--c2)"><font size="2">Lunar Shadow
      </font><span class="sd-foot-note"><font size="2">RGB 69 83 138</font></span>
    </div>
    <div class="sd-foot-box" style="background:var(--c3)"><font size="2">Galaxy Mauve
      </font><span class="sd-foot-note"><font size="2">RGB 114 73 114</font></span>
    </div>
    <div class="sd-foot-box" style="background:var(--c5); color:#2b2b2b;"><font size="2">Pale Nebula
      </font><span class="sd-foot-note"><font size="2">RGB 233 204 211</font></span>
    </div>
</div>
</div>








Moneka โพสต์ เมื่อวานซืน 03:11

<!-- วางทั้งหมดนี้ในกล่องข้อความโพสต์ได้เลย -->
<link href="https://fonts.googleapis.com/css2?family=Mali:wght@300;400;600;700&amp;family=Sriracha&amp;display=swap" rel="stylesheet">

<style>
/* ===== SCOPE เฉพาะใน .sd-wrap ===== */
.sd-wrap{
    max-width:980px; margin:0 auto; background:#fff; border-radius:12px; padding:24px;
    box-shadow:0 4px 12px rgba(0,0,0,.08);
    font-family:'Mali','Sarabun',system-ui,-apple-system,sans-serif; color:#2b2b2b; line-height:1.7;
}
.sd-wrap *{ box-sizing:border-box; }

/* พาเลทสี */
.sd-wrap{
    --c1:#262e4c; /* Cosmic Night */
    --c2:#45538a; /* Lunar Shadow */
    --c3:#724972; /* Galaxy Mauve */
    --c4:#b199db; /* Lilac */
    --c5:#e9ccd3; /* Pale Nebula */
}

.sd-title{
    text-align:center; font-size:36px; margin:0 0 8px;
    font-family:'Sriracha','Mali',cursive; letter-spacing:.02em;
}
.sd-sub{ text-align:center; color:#777; margin:-2px 0 26px; font-size:15px; }

.sd-top{ display:grid; grid-template-columns:1fr 1fr; gap:18px; align-items:stretch; margin-bottom:24px; }
.sd-img{ width:100%; height:100%; border-radius:12px; object-fit:cover; display:block; }

.sd-color-list{ display:grid; grid-template-columns:1fr; gap:12px; }
.sd-chip{
    display:flex; align-items:center; gap:12px; padding:10px; border-radius:12px;
    background:#f7f7f9; border:1px solid #ececf0;
}
.sd-chip-swatch{ width:56px; height:56px; border-radius:10px; flex:0 0 56px; }
.sd-chip > div{ min-width:0; }            /* ให้ข้อความด้านขวาห่อบรรทัดได้ */
.sd-chip-code{ font-weight:700; font-size:15px; }
.sd-chip-name{ font-size:13px; color:#6a6a6a; word-break:break-word; }

.sd-samples{ display:flex; gap:22px; justify-content:center; margin:10px 0 26px; flex-wrap:wrap; }
.sd-sample{ font-weight:700; font-size:22px; }

/* ===== บล็อกหัวข้อ + กล่องเนื้อหา (ยืดสูงตามข้อความ) ===== */
.sd-section{ margin-bottom:18px; }
.sd-section-head{
    border-radius:12px 12px 0 0; padding:12px 16px; color:#fff; font-weight:800; line-height:1.6;
    word-break:break-word;
}
.sd-section-body{
    border:1px solid #ececf0; border-top:0; background:#fafbff;
    border-radius:0 0 12px 12px; padding:16px;
}

/* ฟุตเตอร์ */
.sd-footer{ display:grid; grid-template-columns:repeat(4,1fr); gap:12px; }
.sd-foot-box{
    border-radius:12px; padding:18px; color:#fff; text-align:center; font-weight:800;
    font-family:'Mali','Sarabun',sans-serif;
}
.sd-foot-note{ display:block; font-weight:600; opacity:.9; font-size:12px; margin-top:6px; }

/* มือถือ */
@media (max-width:768px){
    .sd-top{ grid-template-columns:1fr; }
    .sd-footer{ grid-template-columns:1fr 1fr; }
}
@media (max-width:480px){
    .sd-footer{ grid-template-columns:1fr; }
}
</style>

<div class="sd-wrap">
<h2 class="sd-title"><font size="6">สมุดโง่ ๆ ของ มณีกานต์ บุปผชาติ หน้าที่ 8</font></h2>
<div class="sd-sub"><font size="3">ตอนที่มันมาเจอผม ไม่ใช่ตัวเมียอ่ะ เป็นตัวผู้ แซ่ดว่ะ ขอเจอตัวเมียก็ไม่ได้ แซ่ด</font></div>

<section class="sd-top">
    <!-- เปลี่ยน URL รูปได้ตามต้องการ -->
    <img class="sd-img" src="https://i.imgur.com/nxa2vuE.png" alt="Galaxy">
    <div class="sd-color-list">
      <div class="sd-chip">
      <div class="sd-chip-swatch" style="background:var(--c1)"></div>
      <div>
          <div class="sd-chip-code">ชื่ออสรุกาย</div>
          <div class="sd-chip-name">เซนทอร์ หรือ Centaur</div>
      </div>
      </div>
      <div class="sd-chip">
      <div class="sd-chip-swatch" style="background:var(--c2)"></div>
      <div>
          <div class="sd-chip-code">สังกัด</div>
          <div class="sd-chip-name">เขาบอกว่าแล้วแต่เผ่า</div>
      </div>
      </div>
      <div class="sd-chip">
      <div class="sd-chip-swatch" style="background:var(--c3)"></div>
      <div>
          <div class="sd-chip-code">การพิชิตครั้งแรก</div>
          <div class="sd-chip-name">
            เมืองแกรนด์แพรรี แคนาดา&nbsp;<a href="https://percyjackson.mooorp.com/forum.php?mod=redirect&amp;goto=findpost&amp;ptid=1210&amp;pid=8972" style="font-size: 12px;">[กุญแจนำทาง]</a></div>
      </div>
      </div>
      <div class="sd-chip">
      <div class="sd-chip-swatch" style="background:var(--c4)"></div>
      <div>
          <div class="sd-chip-code">#คำเตือน</div>
          <div class="sd-chip-name">เอาตรง ๆ ไม่รู้จะเตือนอะไร 555</div>
      </div>
      </div>
      <div class="sd-chip">
      <div class="sd-chip-swatch" style="background:var(--c5)"></div>
      <div>
          <div class="sd-chip-code">#เพิ่มเติม</div>
          <div class="sd-chip-name">ได้รับตื่นรู้ +1</div>
      </div>
      </div>
    </div>
</section>

<div class="sd-samples">
    <span class="sd-sample" style="color:var(--c1)">โน</span>
    <span class="sd-sample" style="color:var(--c2)">คอม</span>
    <span class="sd-sample" style="color:var(--c3)">เม้นท์</span>
    <span class="sd-sample" style="color:var(--c4)">ได้</span>
    <span class="sd-sample" style="color:var(--c5)">ไหม</span>
</div>

<!-- หัวข้อ + เนื้อหา (ยืดตามข้อความอัตโนมัติ) -->
<div class="sd-section">
    <div class="sd-section-head" style="background:linear-gradient(90deg,var(--c1),var(--c4))"><font size="4">
      เนื้อหา ประวัติอสุรกาย
    </font></div>
    <div class="sd-section-body"><p><font size="3">เซนทอร์ (Centaur) คือสิ่งมีชีวิตในตำนานกรีกที่มีร่างกายท่อนบนเป็นมนุษย์และท่อนล่างเป็นม้า โดยมีต้นกำเนิดจากหลายตำนาน เช่น บุตรของอิคซีออนกับเมฆที่ซุสสร้างขึ้น หรือบุตรของอพอลโลกับนางนิมฟ์ พวกเขามีบุคลิก ซับซ้อนและสองด้าน คือมีทั้งความ ป่าเถื่อน ดุร้าย ชอบความรุนแรง แต่บางตนก็มี สติปัญญา เมตตา และรอบรู้ด้านการแพทย์, ดนตรี, และการล่าสัตว์ (เช่น ไครอน อาจารย์วีรบุรุษ) เซนทอร์มีความสามารถเด่นด้าน ความเร็วและความคล่องตัวสูง, ความทนทาน, และเชี่ยวชาญการต่อสู้ทั้งระยะประชิด (หอก/ดาบ) และระยะไกล (ธนู) ปัจจุบันพบได้ในฝั่งตะวันตกของอเมริกาเหนือ, พื้นที่ส่วนใหญ่ของอเมริกาใต้, แอฟริกา, และยุโรปแผ่นดินใหญ่ จุดอ่อนที่สำคัญคือ จุดบอดทางด้านข้างและด้านหลัง เนื่องจากรูปร่างของพวกเขา สินสงครามที่ได้คือ ธนูเซนทอร์, หัวใจแห่งเซนทอร์, และกีบเซนทอร์</font></p>
    </div>
</div>

<div class="sd-section">
    <div class="sd-section-head" style="background:linear-gradient(90deg,var(--c2),var(--c5))"><font size="4">
      เนื้อหา ประสบการณ์ของคุณ
    </font></div>
    <div class="sd-section-body">
      <p><font size="3">เอาตรง ๆ มันเบสิกจนคิดอะไรไม่ออก เอาเป็นว่า อย่าเจอกันอีกเลยนะ 555+</font></p>
    </div>
</div>

<div class="sd-footer">
    <div class="sd-foot-box" style="background:var(--c1)"><font size="2">Cosmic Night
      </font><span class="sd-foot-note"><font size="2">RGB 38 46 76</font></span>
    </div>
    <div class="sd-foot-box" style="background:var(--c2)"><font size="2">Lunar Shadow
      </font><span class="sd-foot-note"><font size="2">RGB 69 83 138</font></span>
    </div>
    <div class="sd-foot-box" style="background:var(--c3)"><font size="2">Galaxy Mauve
      </font><span class="sd-foot-note"><font size="2">RGB 114 73 114</font></span>
    </div>
    <div class="sd-foot-box" style="background:var(--c5); color:#2b2b2b;"><font size="2">Pale Nebula
      </font><span class="sd-foot-note"><font size="2">RGB 233 204 211</font></span>
    </div>
</div>
</div>








Moneka โพสต์ เมื่อวานซืน 06:16

<!-- วางทั้งหมดนี้ในกล่องข้อความโพสต์ได้เลย -->
<link href="https://fonts.googleapis.com/css2?family=Mali:wght@300;400;600;700&amp;family=Sriracha&amp;display=swap" rel="stylesheet">

<style>
/* ===== SCOPE เฉพาะใน .sd-wrap ===== */
.sd-wrap{
    max-width:980px; margin:0 auto; background:#fff; border-radius:12px; padding:24px;
    box-shadow:0 4px 12px rgba(0,0,0,.08);
    font-family:'Mali','Sarabun',system-ui,-apple-system,sans-serif; color:#2b2b2b; line-height:1.7;
}
.sd-wrap *{ box-sizing:border-box; }

/* พาเลทสี */
.sd-wrap{
    --c1:#262e4c; /* Cosmic Night */
    --c2:#45538a; /* Lunar Shadow */
    --c3:#724972; /* Galaxy Mauve */
    --c4:#b199db; /* Lilac */
    --c5:#e9ccd3; /* Pale Nebula */
}

.sd-title{
    text-align:center; font-size:36px; margin:0 0 8px;
    font-family:'Sriracha','Mali',cursive; letter-spacing:.02em;
}
.sd-sub{ text-align:center; color:#777; margin:-2px 0 26px; font-size:15px; }

.sd-top{ display:grid; grid-template-columns:1fr 1fr; gap:18px; align-items:stretch; margin-bottom:24px; }
.sd-img{ width:100%; height:100%; border-radius:12px; object-fit:cover; display:block; }

.sd-color-list{ display:grid; grid-template-columns:1fr; gap:12px; }
.sd-chip{
    display:flex; align-items:center; gap:12px; padding:10px; border-radius:12px;
    background:#f7f7f9; border:1px solid #ececf0;
}
.sd-chip-swatch{ width:56px; height:56px; border-radius:10px; flex:0 0 56px; }
.sd-chip > div{ min-width:0; }            /* ให้ข้อความด้านขวาห่อบรรทัดได้ */
.sd-chip-code{ font-weight:700; font-size:15px; }
.sd-chip-name{ font-size:13px; color:#6a6a6a; word-break:break-word; }

.sd-samples{ display:flex; gap:22px; justify-content:center; margin:10px 0 26px; flex-wrap:wrap; }
.sd-sample{ font-weight:700; font-size:22px; }

/* ===== บล็อกหัวข้อ + กล่องเนื้อหา (ยืดสูงตามข้อความ) ===== */
.sd-section{ margin-bottom:18px; }
.sd-section-head{
    border-radius:12px 12px 0 0; padding:12px 16px; color:#fff; font-weight:800; line-height:1.6;
    word-break:break-word;
}
.sd-section-body{
    border:1px solid #ececf0; border-top:0; background:#fafbff;
    border-radius:0 0 12px 12px; padding:16px;
}

/* ฟุตเตอร์ */
.sd-footer{ display:grid; grid-template-columns:repeat(4,1fr); gap:12px; }
.sd-foot-box{
    border-radius:12px; padding:18px; color:#fff; text-align:center; font-weight:800;
    font-family:'Mali','Sarabun',sans-serif;
}
.sd-foot-note{ display:block; font-weight:600; opacity:.9; font-size:12px; margin-top:6px; }

/* มือถือ */
@media (max-width:768px){
    .sd-top{ grid-template-columns:1fr; }
    .sd-footer{ grid-template-columns:1fr 1fr; }
}
@media (max-width:480px){
    .sd-footer{ grid-template-columns:1fr; }
}
</style>

<div class="sd-wrap">
<h2 class="sd-title"><font size="6">สมุดโง่ ๆ ของ มณีกานต์ บุปผชาติ หน้าที่ 9</font></h2>
<div class="sd-sub"><font size="3">ม้าก็วัว ...หรือควาย ไม่รู้แหละ สักอย่างมันนั้นแหละ แม่งเอ้ยยย</font></div>

<section class="sd-top">
    <!-- เปลี่ยน URL รูปได้ตามต้องการ -->
    <img class="sd-img" src="https://percyjackson.mooorp.com/data/attachment/forum/202403/22/225631w77jr3cgz3rev6r4.webp" alt="Galaxy">
    <div class="sd-color-list">
      <div class="sd-chip">
      <div class="sd-chip-swatch" style="background:var(--c1)"></div>
      <div>
          <div class="sd-chip-code">ชื่ออสรุกาย</div>
          <div class="sd-chip-name">วัวโคลคีส หรือ Colchis Bulls</div>
      </div>
      </div>
      <div class="sd-chip">
      <div class="sd-chip-swatch" style="background:var(--c2)"></div>
      <div>
          <div class="sd-chip-code">สังกัด</div>
          <div class="sd-chip-name">เฮเฟตัส/วัลแคน</div>
      </div>
      </div>
      <div class="sd-chip">
      <div class="sd-chip-swatch" style="background:var(--c3)"></div>
      <div>
          <div class="sd-chip-code">การพิชิตครั้งแรก</div>
          <div class="sd-chip-name">
            เมืองแกรนด์แพรรี แคนาดา&nbsp;<a href="https://percyjackson.mooorp.com/forum.php?mod=redirect&amp;goto=findpost&amp;ptid=1210&amp;pid=8972" style="font-size: 12px;">[กุญแจนำทาง]</a></div>
      </div>
      </div>
      <div class="sd-chip">
      <div class="sd-chip-swatch" style="background:var(--c4)"></div>
      <div>
          <div class="sd-chip-code">#คำเตือน</div>
          <div class="sd-chip-name">โนคอมเม้ท์ว่ะ จริง ๆ </div>
      </div>
      </div>
      <div class="sd-chip">
      <div class="sd-chip-swatch" style="background:var(--c5)"></div>
      <div>
          <div class="sd-chip-code">#เพิ่มเติม</div>
          <div class="sd-chip-name">ได้รับตื่นรู้ +1</div>
      </div>
      </div>
    </div>
</section>

<div class="sd-samples">
    <span class="sd-sample" style="color:var(--c1)">โน</span>
    <span class="sd-sample" style="color:var(--c2)">คอม</span>
    <span class="sd-sample" style="color:var(--c3)">เม้นท์</span>
    <span class="sd-sample" style="color:var(--c4)">จริง</span>
    <span class="sd-sample" style="color:var(--c5)">จ๊ะ</span>
</div>

<!-- หัวข้อ + เนื้อหา (ยืดตามข้อความอัตโนมัติ) -->
<div class="sd-section">
    <div class="sd-section-head" style="background:linear-gradient(90deg,var(--c1),var(--c4))"><font size="4">
      เนื้อหา ประวัติอสุรกาย
    </font></div>
    <div class="sd-section-body"><p><font size="3">วัวโคลคีส (Colchis Bulls) คืออสุรกายในตำนานกรีกที่โดดเด่นในเรื่องราวของเจสันและขนแกะทองคำ โดยเป็นวัวกระทิงขนาดมหึมาสองตัวที่มี กีบเท้าทำจากทองเหลือง และมี ลมหายใจเป็นเปลวเพลิงที่ร้อนแรง ถูกสร้างโดย เทพเฮเฟตัส (Hephaestus) มอบให้กษัตริย์เอเทสเพื่อปกป้องขนแกะทองคำ พวกมันมีบุคลิก ดุร้าย ก้าวร้าว ไร้ความปรานี และเป็นสัญลักษณ์ของพลังทำลายล้างที่ไม่อาจควบคุมได้ วัวเหล่านี้สามารถพบเจอได้ ทั่วโลกตามตัวเมืองหรือฟาร์มวัว สินสงคราม ประกอบด้วย ฟันเฟือง, แปลนเฮเฟตัส, ลมหายใจเพลิง, และทับทิมขนาดมหึมา ข้อควรระวัง คือผู้ที่ไม่มีพลังทนทานไฟจะต้องทำให้ทับทิมเย็นลงก่อนจึงจะสามารถเก็บได้</font></p>
    </div>
</div>

<div class="sd-section">
    <div class="sd-section-head" style="background:linear-gradient(90deg,var(--c2),var(--c5))"><font size="4">
      เนื้อหา ประสบการณ์ของคุณ
    </font></div>
    <div class="sd-section-body">
      <p><font size="3">ผม โนคอมเม้นท์....คือตอนเจอมันต้อง..เอ่อจัดการไง แล้วคุณพี่ลูกวัลแคนแม่งใส่ยับ วินเซนโซโจมตีรอบเดียวก็หมื่นกว่า ๆ เกือบสองหมื่นละคุณพี่ 5555</font></p>
    </div>
</div>

<div class="sd-footer">
    <div class="sd-foot-box" style="background:var(--c1)"><font size="2">Cosmic Night
      </font><span class="sd-foot-note"><font size="2">RGB 38 46 76</font></span>
    </div>
    <div class="sd-foot-box" style="background:var(--c2)"><font size="2">Lunar Shadow
      </font><span class="sd-foot-note"><font size="2">RGB 69 83 138</font></span>
    </div>
    <div class="sd-foot-box" style="background:var(--c3)"><font size="2">Galaxy Mauve
      </font><span class="sd-foot-note"><font size="2">RGB 114 73 114</font></span>
    </div>
    <div class="sd-foot-box" style="background:var(--c5); color:#2b2b2b;"><font size="2">Pale Nebula
      </font><span class="sd-foot-note"><font size="2">RGB 233 204 211</font></span>
    </div>
</div>
</div>








หน้า: [1]
ดูในรูปแบบกติ: สมุดบันทึกโง่ ๆ ของ มอนอกอบอซอ