98 lines
2.8 KiB
HTML
98 lines
2.8 KiB
HTML
<link rel="stylesheet" href="book-page.css" />
|
||
|
||
<main>
|
||
<!-- Initial Narrative Context -->
|
||
<div class="section-box">
|
||
<p>
|
||
Few truly know what lurks behind the quiet of this enigmatic place, lost
|
||
in the depths of the forest. The locals never cross its threshold—even
|
||
during celebrations—and the youngsters show great respect to those who
|
||
dare enter just the first chamber. Moss and lichens cover the wall of the
|
||
now forgotten Badger Temple… and its secret should be forgotten as well.
|
||
</p>
|
||
</div>
|
||
|
||
<!-- Main At-a-Glance Section -->
|
||
<div class="section-box">
|
||
<h2>BADGER TEMPLE AT A GLANCE</h2>
|
||
<p style="font-style: italic">Keywords: curse, trial, seal.</p>
|
||
|
||
<dl>
|
||
<dt>Terrain:</dt>
|
||
<dd>
|
||
stone, vines, water. Common elements:
|
||
<span class="element-list">L</span>,
|
||
<span class="element-list">D</span>, <span class="element-list">E</span>
|
||
</dd>
|
||
</dl>
|
||
|
||
<dl>
|
||
<dt>Travel roll:</dt>
|
||
<dd>
|
||
d8. Rare elements: <span class="element-list">A</span>,
|
||
<span class="element-list">F</span>
|
||
</dd>
|
||
</dl>
|
||
|
||
<h3 style="margin-top: 20px; margin-bottom: 10px">Key Features</h3>
|
||
|
||
<div class="data-grid" style="display: flex; gap: 40px; margin-top: 15px">
|
||
<!-- Dangers -->
|
||
<div style="flex: 1">
|
||
<h4>Dangers</h4>
|
||
<ul>
|
||
<li>A huge sentient plant guarding the path.</li>
|
||
<li>A magical mist that fools the senses.</li>
|
||
<li>A barrier created by the statues that flank the entrance.</li>
|
||
</ul>
|
||
</div>
|
||
|
||
<!-- Discoveries -->
|
||
<div style="flex: 1">
|
||
<h4>Discoveries</h4>
|
||
<ul>
|
||
<li>A spirit protector of the forest.</li>
|
||
<li>A plant with miraculous properties.</li>
|
||
<li>A shrine hiding a prodigious blessing.</li>
|
||
</ul>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- Themes -->
|
||
<dl style="grid-template-columns: 1fr 2fr; margin-top: 20px">
|
||
<dt>Themes:</dt>
|
||
<dd>
|
||
Facing one’s fears, gaining self-awareness and self-confidence,
|
||
understanding the past to build the future.
|
||
</dd>
|
||
</dl>
|
||
</div>
|
||
|
||
<!-- Structured Title/Section Block -->
|
||
<div class="section-box">
|
||
<h3>Structural Context</h3>
|
||
<p style="font-weight: bold; margin-bottom: 10px">
|
||
THE ANCIENT SHRINE / Badger Temple
|
||
</p>
|
||
<div
|
||
style="
|
||
display: flex;
|
||
justify-content: space-around;
|
||
text-align: center;
|
||
padding: 15px 0;
|
||
border-top: 2px solid #ccc;
|
||
border-bottom: 2px solid #ccc;
|
||
"
|
||
>
|
||
<div><strong>THE ANCIENT SHRINE</strong></div>
|
||
<div style="font-size: 1.2em">/</div>
|
||
<div><strong>Badger Temple</strong></div>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- Metadata / Footer Information -->
|
||
<div class="section-box meta-info">
|
||
<h4>Additional Data</h4>
|
||
</div>
|
||
</main>
|