/* ===== Global ===== */
body {
  margin: 0;
  font-family: "Trebuchet MS", Verdana, sans-serif;
  color: #f2e8dc;

  /* Floral pattern using layered gradients */
  background:
    radial-gradient(circle at 20% 30%, rgba(180,70,90,0.25) 0 18px, transparent 19px),
    radial-gradient(circle at 22% 32%, rgba(120,40,50,0.35) 0 10px, transparent 11px),
    radial-gradient(circle at 70% 60%, rgba(200,140,60,0.25) 0 16px, transparent 17px),
    radial-gradient(circle at 72% 62%, rgba(120,80,20,0.35) 0 9px, transparent 10px),
    radial-gradient(circle at 50% 80%, rgba(170,60,60,0.25) 0 14px, transparent 15px),
    #1b1412;
  background-size: 200px 200px;
}

/* ===== Wrapper ===== */
#wrapper {
  max-width: 900px;
  margin: 20px auto;
  background-color: #2a1b18;
  border: 3px solid #6b3a2c;
  box-shadow: 0 0 16px rgba(0,0,0,0.8);
}

/* ===== Header ===== */
#header {
  background: linear-gradient(to right, #5b1f1f, #8a2e2e, #5b1f1f);
  padding: 16px;
  text-align: center;
  color: #f7e6d3;
}

#header h1 {
  margin: 0;
  font-family: "Georgia", serif;
  letter-spacing: 3px;
}

.tagline {
  font-size: 0.85em;
  color: #f2c6b3;
}

/* ===== Navigation ===== */
#nav {
  background: linear-gradient(to bottom, #3a1a17, #1f0f0c);
  padding: 8px;
  text-align: center;
}

#nav a {
  display: inline-block;
  margin: 3px;
  padding: 6px 12px;
  background: linear-gradient(to bottom, #7a3a2a, #4a1f17);
  color: #f6e4c9;
  font-weight: bold;
  border: 1px solid #c58a4a;
  border-radius: 6px;
}

#nav a:hover {
  background: linear-gradient(to bottom, #b33a3a, #6a1f1f);
  color: #fff4d6;
}

/* ===== Content ===== */
#content {
  padding: 14px;
}

/* ===== Boxes ===== */
.box {
  margin-bottom: 14px;
  border: 2px solid #6a3a2a;
  background: linear-gradient(to bottom, #3a1f1b, #2a1412);
}

.box h2 {
  margin: 0;
  padding: 7px;
  background: linear-gradient(to right, #8a2a2a, #c44a4a, #8a2a2a);
  color: #fff0e6;
  font-family: "Georgia", serif;
  letter-spacing: 1px;
}

.box p {
  padding: 7px 10px;
}

/* ===== Images ===== */
.img-left {
  float: left;
  margin: 6px 12px 6px 6px;
  border: 2px solid #c58a4a;
}

.clear {
  clear: both;
}

/* ===== Scrollbox ===== */
.scrollbox {
  margin: 10px;
  padding: 8px;
  height: 120px;
  overflow: auto;
  background-color: #1f120f;
  border: 1px dashed #8a5a2a;
}

/* ===== Links ===== */
a {
  color: #f26a6a;
}

a:hover {
  color: #ffd27a;
}

/* ===== Tables ===== */
table {
  width: 100%;
  border-collapse: collapse;
}

th {
  background-color: #6a4a1f;
  border: 1px solid #c59a5f;
  padding: 5px;
  color: #fff4d6;
}

td {
  background-color: #2a1612;
  border: 1px solid #5a3a2a;
  padding: 5px;
}

/* ===== Blockquote ===== */
blockquote {
  margin: 10px;
  padding: 8px;
  background-color: #3a1a1a;
  border-left: 4px solid #c44a4a;
  font-style: italic;
  color: #f2c6c6;
}

/* ===== Link Dump ===== */
.link-dump a {
  display: inline-block;
  margin: 4px;
  padding: 4px 7px;
  background-color: #5a2a1a;
  border-radius: 4px;
  border: 1px solid #8a5a2a;
}

/* ===== Footer ===== */
#footer {
  background-color: #1a0e0c;
  text-align: center;
  padding: 10px;
  font-size: 0.85em;
  color: #d6c2b2;
  border-top: 2px solid #6a3a2a;
}
