body { font-family: sans-serif; margin: 1rem 1.5rem 4rem; }
body.dark { background: #333; color: #eee; }
body.light { background: #f4f4f4; color: #111; }
h1, h2, h3 { margin-bottom: .4rem; }
p { line-height: 1.5; }
.box { padding: 1rem; margin-bottom: 1rem; border-radius: 4px; }
body.dark .box { background: #2b2b2b; border: 1px solid #555; }
body.light .box { background: #fff; border: 1px solid #ddd; }
input, select, textarea { padding: .5rem; border-radius: 0; }
body.dark input, body.dark textarea, body.dark select { background: #666; color: #eee; border: 1px solid #aaa; }
body.dark input::placeholder, body.dark textarea::placeholder { color: #bababa; opacity: 1; }
body.light input, body.light textarea, body.light select { background: #fff; color: #000; border: 1px solid #ccc; }
button { padding: .5rem .8rem; border-radius: 0; }
body.dark button, body.light button { background: transparent; color: #4fdad6; border: 1px solid #777; }

/* Primary/secondary button scheme */
.btn, .cta, .tool-btn, button.primary { background:#cfc; color:#000 !important; border:1px solid #9c9; font-weight:700; text-decoration:none; border-radius:4px; padding:.4rem .75rem; display:inline-block; }
.btn:visited, .cta:visited, .tool-btn:visited { color:#000 !important; }
a.btn:not(.alt), a.cta:not(.alt), a.tool-btn:not(.alt),
a.btn:not(.alt):visited, a.cta:not(.alt):visited, a.tool-btn:not(.alt):visited { color:#000 !important; }
button[style*="background:#cfc"],
button[style*="background: #cfc"],
button[style*="background:#7fff7a"],
button[style*="background: #7fff7a"] { color:#000 !important; }
.btn.alt, .cta.alt, .tool-btn.alt, button.secondary { background:#2b2b2b; color:#4fdad6 !important; border:1px solid #777; }
.btn.alt:visited, .cta.alt:visited, .tool-btn.alt:visited { color:#76efe9 !important; }
a { color: inherit; }
a:visited { color: inherit; }
body.dark a { color: #4fdad6; }
body.dark a:visited { color: #76efe9; }
body.light a { color: #06c; }
body.light a:visited { color: #551a8b; }
.topbar { display:flex; align-items:center; gap:1rem; padding:.5rem .75rem; background:#000; color:#fff; border-radius:4px; margin-bottom:1rem; }
.topbar .nav-link { color:#fff; font-weight:700; text-decoration:none; font-size:1.425rem; }
.topbar .nav-link.nav-accent { color:#7f7; }
.topbar .nav-link.nav-accent:visited { color:#7f7; }
.topbar .nav-link:visited { color:#fff; }
.topbar .nav-link.active { text-decoration:underline; }
.topbar .nav-auth-inline { margin-left:.75rem; font-size:.9rem; }
.topbar .nav-auth-inline a { color:#fff; text-decoration:none; }
.topbar .nav-auth { margin-left:auto; font-size:.9rem; }
.topbar .nav-auth a { color:#fff; text-decoration:none; }
.topbar .nav-spacer { flex:1; }
.context-box { display:flex; flex-wrap:wrap; gap:.75rem 1.25rem; padding:.6rem .85rem; margin:.5rem 0 1rem; background:#1f1f1f; border:1px solid #555; border-radius:4px; }
.context-row { display:flex; gap:.45rem; align-items:baseline; min-width:200px; }
.context-label { font-weight:700; color:#cfcfcf; font-size:.85rem; text-transform:uppercase; letter-spacing:.04em; }
.context-value { color:#e9e9e9; font-size:.95rem; }
.context-value a { color:inherit; text-decoration:none; border-bottom:1px dotted #777; }