* { margin: 0; padding: 0; box-sizing: border-box; }
body {
  background:
    radial-gradient(ellipse at 50% 0%, rgba(90,20,0,0.35) 0%, transparent 55%),
    #060202;
  color: #e8c9a8;
  font-family: Georgia, 'Times New Roman', serif;
  line-height: 1.7;
  min-height: 100vh;
  padding: 48px 20px 80px;
}
.wrap { max-width: 720px; margin: 0 auto; }
.brand {
  display: inline-block; font-size: 13px; letter-spacing: 3px; text-transform: uppercase;
  color: #ff8844; text-decoration: none; margin-bottom: 28px;
  border-bottom: 1px solid rgba(255,136,68,0.3); padding-bottom: 2px;
}
.brand:hover { color: #ffbb77; }
h1 {
  font-size: clamp(30px, 6vw, 46px); color: #ffaa33; letter-spacing: 3px; margin-bottom: 8px;
  text-shadow: 0 0 20px #ff4400, 0 0 45px rgba(255,34,0,0.5);
}
.updated { font-size: 13px; color: #8a6a55; margin-bottom: 36px; letter-spacing: 1px; }
h2 {
  font-size: 20px; color: #ff9944; margin: 34px 0 10px; letter-spacing: 1px;
  padding-left: 14px; border-left: 3px solid #ff4400;
}
p, li { font-size: 16px; color: #d8bba0; margin-bottom: 12px; }
ul { padding-left: 26px; }
li::marker { color: #ff6622; }
strong { color: #ffcc88; }
a { color: #ff9955; }
.note {
  margin-top: 40px; padding: 18px 20px; font-size: 14px; color: #b89a80;
  background: rgba(60,15,0,0.35); border: 1px solid rgba(255,102,34,0.25); border-radius: 8px;
}
footer {
  margin-top: 48px; padding-top: 22px; border-top: 1px solid rgba(255,102,34,0.2);
  font-size: 13px; color: #8a6a55;
}
footer a { margin-right: 16px; text-decoration: none; }
footer a:hover { color: #ffcc88; }
@media (max-width: 600px) { body { padding: 32px 16px 60px; } p, li { font-size: 15px; } }