.terminal-header {
    background: var(--bg-alt);
    color: var(--fg);
    padding: var(--spacing-sm) var(--spacing-lg);
    display: flex; align-items: center;
    gap: var(--spacing-lg);
    border-bottom: 1px solid var(--border-color);
    flex-shrink: 0; font-family: var(--font); font-size: 0.9rem;
}

.header-brand { display: flex; align-items: center; flex-shrink: 0; }

.logo-link {
    display: flex; align-items: center; text-decoration: none;
    color: var(--fg-bright); gap: var(--spacing-xs);
}
.logo-link:hover { background: transparent; color: var(--green); text-decoration: underline; }

.text-logo {
    font-family: var(--font); font-size: 1rem;
    font-weight: 700; color: var(--green); line-height: 1;
}
.logo-link:hover .text-logo { color: var(--green); }

.category-list { display: flex; gap: 2px; }
.category-item { position: relative; }

.category-button {
    gap: var(--spacing-xs); font-size: 0.85rem; font-family: var(--font);
    border: 1px solid transparent; background: transparent; color: var(--fg);
    padding: var(--spacing-xs) var(--spacing-sm);
}
.category-button[aria-expanded="true"] { background: var(--cyan); color: var(--bg); border-color: var(--cyan); }
.category-button::before { content: './'; color: var(--fg-dim); }
.category-button[aria-expanded="true"]::before { color: var(--bg); }

.dropdown-arrow { display: none; }

.dropdown-menu {
    display: none; position: absolute; top: calc(100% + 2px); left: 0;
    background-color: var(--bg); border: 1px solid var(--cyan);
    border-radius: 0; box-shadow: none; min-width: 240px; z-index: 101;
    padding: var(--spacing-xs); font-family: var(--font);
}
.dropdown-menu.show { display: block; }

.tool-icon { width: 16px; height: 16px; margin-right: var(--spacing-sm); flex-shrink: 0; opacity: 0.8; }

.dropdown-menu li a.tool-link {
    display: flex; align-items: center;
    padding: var(--spacing-sm) var(--spacing-md);
    color: var(--fg); font-weight: 400; font-size: 0.85rem;
    white-space: nowrap; text-decoration: none; border-radius: 0;
}
.dropdown-menu li a.tool-link:hover,
.dropdown-menu li a.tool-link:focus {
    background: var(--cyan); color: var(--bg); text-decoration: none; outline: none;
}
.dropdown-menu li a.tool-link.active-link {
    background: var(--cyan); color: var(--bg); font-weight: 700;
}
.dropdown-menu li a.tool-link::before { content: '$ '; opacity: 0.4; }

#theme-toggle {
    padding: var(--spacing-xs); line-height: 0; margin-left: auto;
    background: transparent; border: 1px solid var(--border-color); color: var(--fg);
    border-radius: 0;
}

.theme-icon { width: 16px; height: 16px; }
.theme-icon-svg { color: var(--fg); }
#theme-icon-moon { color: var(--yellow); }
[data-theme="light"] #theme-icon-sun { color: var(--yellow); }
.theme-icon.hidden { display: none; }

@media (max-width: 768px) {
    .terminal-header {
        flex-direction: column; align-items: stretch;
        padding: var(--spacing-sm); gap: var(--spacing-sm);
    }
    .header-brand { width: 100%; justify-content: center; }
    #top-navigation { width: 100%; }
    .category-list { flex-direction: column; width: 100%; gap: 1px; }
    .category-item { width: 100%; }
    .category-button { width: 100%; justify-content: flex-start; }
    .dropdown-menu { position: static; width: 100%; border-color: var(--border-color); border-left: none; border-right: none; border-radius: 0; margin-top: 0; }
    .dropdown-menu li a.tool-link { padding-left: var(--spacing-xl); }
    #theme-toggle { margin-left: 0; align-self: center; }
}