body { font-family: sans-serif; padding: 2rem; }

/* Nav */
nav { margin-bottom: 1.5rem; }
nav a { margin-right: 1rem; color: #7eb8f7; text-decoration: none; font-weight: bold; }
nav a:hover { text-decoration: underline; }
.nav-logout { display: inline; }
.nav-logout-btn { background: none; border: none; padding: 0; color: #7eb8f7; font-weight: bold; font-family: inherit; font-size: inherit; cursor: pointer; }

/* Tables */
table { border-collapse: collapse; width: 100%; }
th { background: #1a1a2e; color: #7eb8f7; text-align: left; padding: 0.5rem 1rem; cursor: pointer; user-select: none; }
th::after { content: ' ↕'; opacity: 0.4; font-size: 0.8em; }
th.asc::after { content: ' ↑'; opacity: 1; }
th.desc::after { content: ' ↓'; opacity: 1; }
td { padding: 0.5rem 1rem; border-bottom: 1px solid #ddd; }
tbody tr:hover td { background: #f5f5f5; }
tfoot td { font-weight: bold; border-bottom: none; }

/* Holdings-specific */
.holdings tfoot td { border-top: 2px solid #1a1a2e; }

/* Accounts-specific */
tr.group-header td { background: #e8f0fe; font-weight: bold; color: #1a1a2e; padding: 0.4rem 1rem; border-top: 2px solid #1a1a2e; }
tr.subtotal td { font-weight: bold; background: #f0f4ff; border-top: 1px solid #aac; border-bottom: 2px solid #1a1a2e; }
.accounts tfoot td { border-top: 3px double #1a1a2e; }

/* Auth forms */
h1 { color: #1a1a2e; }
.card { max-width: 360px; }
label { display: block; margin-bottom: 1rem; }
label span { display: block; margin-bottom: 0.25rem; font-weight: bold; }
input[type=email], input[type=password], input[type=text] {
  width: 100%; padding: 0.5rem; box-sizing: border-box;
  border: 1px solid #ccc; border-radius: 4px; font-size: 1rem;
}
.card input[type=text] { letter-spacing: 0.2em; }
label.checkbox { display: flex; align-items: center; gap: 0.5rem; margin-bottom: 1rem; }
label.checkbox input { width: auto; }
.card button { background: #1a1a2e; color: #7eb8f7; border: none; padding: 0.6rem 1.5rem; font-size: 1rem; border-radius: 4px; cursor: pointer; font-weight: bold; }
.card button:hover { opacity: 0.85; }
.error { color: #c00; margin-bottom: 1rem; }
.hint { color: #666; margin-bottom: 1.5rem; }