:root {
  --navh: 0px;
  --bg:#f7f7f8;
  --card:#fff;
  --ink:#111827;
  --rule:#e5e7eb;
  --accent:#0f766e;
  --muted:#6b7280;
}

body { background: #555; font-family: Arial, system-ui, -apple-system, Segoe UI, Roboto, sans-serif; line-height: 1.6; margin: 20px; padding-top: 30px;}
html { scroll-behavior: smooth; scroll-padding-top: 20px;}

h1, h2, h3 { color: #000; margin-top: 1.5em; margin-bottom: 0.5em;}

h1{ background:#fff; width: 100%; margin:auto; font-size:1.8rem; text-align: center; margin-top: 0;}
h2{ background:#fff; font-size:1.4rem; text-align: center; margin-top: 0;}
h3 { background:#fff; font-size: 1.2em; text-align: center; margin-top: 0;}

.back {
  color: #fff;
  background: #374151;
  border: 1px solid #00bb00;
  padding: 4px 10px;
  border-radius: 6px;
  cursor: pointer;
  font-size: 11px;
  margin-bottom:3px;
}
.back:hover {
  background: #667794;
  border-color: #bb0000;
}

.back:active {
  background: #e5e7eb;
}

button {
  color: #fff;
  background: #374151;
  border: 1px solid #00bb00;
  padding: 4px 10px;
  border-radius: 6px;
  cursor: pointer;
  font-size: 11px;
  margin-bottom:3px;
}

button:hover {
  background: #667794;
  border-color: #bb0000;
}

button:active {
  background: #e5e7eb;
}

div.matrix { top: 4px; right: 190px; margin-left: auto; position: fixed; z-index: 100; display: flex; flex-direction: column; gap: 3px;}

div.heading {background:#fff; margin:auto; padding:5px; margin-bottom:10px; width:66%; border-radius:6px;}
.entry-container { background-color:#fff; color:#324236; padding:20px; margin-bottom:20px; border-radius:8px; box-shadow:0 2px 5px rgba(0,0,0,0.1);}

main { max-width:1200px; margin:20 auto; padding:20px; }

.note {font-style: italic; color: #000000; margin-left: 20px;}

.jump-to-menu{ top: 4px; right: 5px; float: right; position: fixed; z-index: 100; background-color: transparent; padding: 0px; border-radius: 12px; max-width: 185px; font-size: 0.9em;}

.jump-to-menu label{ display:block; margin-bottom:5px; font-weight:700; color:#0056b3;}

.jump-to-menu select{ width: 175px; padding: 5px; border: 1px solid #006600; border-radius: 3px; font-size: 0.9em; background-color: #F8FFF8; cursor: pointer; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}

.jump-to-menu select:focus{ outline: none; border-color: #007bff;}

.section { border-radius:6px; margin-bottom: 24px; }

ul.document-list { list-style: none; padding: 0; margin: 0;}
ul.document-list li { position: relative; padding-left: 1.5em; margin-bottom: 0.5em; }
ul.document-list li::before { content: '\00B7'; position: absolute; left: 0; color: #333; font-weight: bold;}
ul.document-list li ul.document-list { padding-left: 1.5em; }
ul.document-list li ul.document-list li::before { content: '\2022';}


@keyframes highlight-flash {
0%, 20%   { background-color: transparent; }
30%, 40%  { background-color: #FF5D40; }
50%, 60%  { background-color: transparent; }
70%, 80%  { background-color: #FF5D40; }
90%, 100% { background-color: transparent; }
}

.flash-highlight { animation: highlight-flash 3s ease-out 1; /* single animation run with 3 flashes inside */}

#myBtn { color: #fff; background: #374151; border: 1px solid #111; padding: 6px 14px; border-radius: 6px; cursor: pointer;}
#myBtn:hover {background: #4b5563;}
#myBtn.secondary { background: #e5e7eb; color: #111827; }