body {
  background-color: #211e20;
  color: #e9efec;
  font-family: monospace;
}

/* Intro paragraph on homepage */
.identity {
  color: #211e20;
  font-size: 1.1em;
  max-width: 600px;
  margin: 20px auto;
  text-align: center;
}

/* Main content panel */
main {
  background-color: #e9efec;
  color: #211e20;
  padding: 24px;
  width: fit-content;
  margin: 0 auto;

  /* raised workstation panel */
  border-radius: 8px;
  border: 1px solid #cfd4d1;
  box-shadow:
    0 3px 6px rgba(0,0,0,0.35),   /* outer lift */
    inset 0 0 0 1px #ffffff0d;    /* subtle inner highlight */
}

main::before {
  content: "";
  display: block;
  height: 8px;

  /* subtle warm CRT bezel tone */
  background-color: #d4d0b8; /* warm, olive‑beige, workstation plastic */

  border-radius: 6px 6px 0 0;
  margin: -24px -24px 16px -24px;
  box-shadow: inset 0 -1px 0 rgba(0,0,0,0.08);

}

main {
  position: relative; /* required for corner overlay positioning */
}

main::after {
  content: "";
  position: absolute;
  top: -8px;
  left: -8px;
  right: -8px;
  height: 10px;

  /* stronger warm tint on the top corners */
  background: linear-gradient(
    to right,
    #cfc8a2 0%,
    #d4d0b8 12%,
    transparent 32%,
    transparent 68%,
    #d4d0b8 88%,
    #cfc8a2 100%
  );

  /* subtle molded-plastic inner shadow */
  box-shadow:
    inset 0 -2px 3px rgba(0,0,0,0.12),
    inset 0 -1px 1px rgba(0,0,0,0.15);

  border-radius: 10px 10px 0 0;
  pointer-events: none;
  opacity: 0.9;
}


/* Header divider */
header {
  border-bottom: 1px solid #555568;
  padding-bottom: 10px;
  margin-bottom: 20px;
}

/* ----------------------------------------
   3.5 FOOTER (early-2000s workstation style)
---------------------------------------- */
footer {
  margin-top: 16px;
  padding: 6px 0;
  width: 100%;
  text-align: center;

  /* sandy-olive workstation plastic */
  background: linear-gradient(to bottom, #d8d3b8, #cfcab0);
  border-radius: 4px;
  border: 1px solid #bfb99c;

  /* soft lift */
  box-shadow:
    0 1px 2px rgba(0,0,0,0.25),
    inset 0 0 0 1px rgba(255,255,255,0.05);
}

footer small {
  color: #211e20;
  opacity: 0.75;
  font-size: 0.85em;
}


footer::after {
  content: "";
  display: inline-block;
  width: 6px;
  height: 6px;
  margin-left: 8px;
  border-radius: 50%;
 background-color: #d8a45a; 
 box-shadow: 0 0 3px rgba(216,164,90,0.4);
  opacity: 0.6;
}

footer:hover::after {
  opacity: 1;
  background-color: #e8b86c; /* slight glow */
}



/* Navigation column */
nav {
  background-color: #262426;
  border-right: 1px solid #555568;
  padding: 20px 10px;
  height: 100vh;
}

/* Navigation buttons */
nav p {
  margin-bottom: 24px;
  padding: 12px;
  border: 1px solid #555568;
  background-color: #2a2729; /* slightly lighter, more plastic-like */
  border-radius: 6px; /* smoother, early-2000s */
  text-align: center;

  /* raised workstation-style shadow */
  box-shadow:
    0 2px 4px rgba(0,0,0,0.45),
    inset 0 0 0 1px rgba(255,255,255,0.05);

  transition: transform 0.05s ease, box-shadow 0.1s ease;
}


nav p:hover {
  background-color: #343233; /* subtle shift */
  border-color: #a0a08b;

  /* pressed-but-not-inset feel */
  box-shadow:
    0 1px 2px rgba(0,0,0,0.35),
    inset 0 0 0 1px rgba(255,255,255,0.08);

  transform: translateY(1px);
}


/* Navigation icons */
nav p img {
  display: block;
  margin: 0 auto 6px;
  opacity: 0.9;
  filter: contrast(1.05);
}

nav p:hover img {
  opacity: 1;
  filter: brightness(1.1) contrast(1.1);
}

/* Table column fix so nav doesn't collapse */
td[width="150"] {
  width: 150px;
  vertical-align: top;
  border-right: 1px solid #555568;
}

/* GLOBAL LINK STYLE (fallback) */
a {
  color: #8f9486;
  text-decoration: none;
}

a:hover {
  color: #555568;
  text-decoration: underline;
}

/* NAVIGATION LINK STYLE (dark background) */
nav a {
  color: #e9efec;
}

nav a:hover {
  color: #a0a08b;
}

/* MAIN CONTENT LINK STYLE (light background) */
main a {
  color: #211e20;
}

main a:hover {
  color: #555568;
  text-decoration: underline;
}


td[valign="top"]:not([width="150"]) {
  position: relative;
  overflow: hidden;
}


td[valign="top"]:not([width="150"]) {
  position: relative;
  overflow: hidden;
}