/* components/header/header.css */
.header{position:sticky;top:0;z-index:40;background:var(--card);border-bottom:1px solid var(--border)}
.header__inner{display:flex;align-items:center;gap:12px;height:60px}
.header__logo{font-weight:700;letter-spacing:.3px}
.header__spacer{flex:1}
.icon-btn{border:1px solid var(--border);background:var(--card);width:40px;height:40px;border-radius:10px;display:grid;place-items:center;cursor:pointer}
.icon-btn:hover{border-color:var(--red);color:var(--red)}
.pill-btn{border:1px solid var(--border);background:var(--card);height:36px;border-radius:999px;padding:0 12px;cursor:pointer}
.pill-btn:hover{border-color:var(--red);color:var(--red)}
.profile{position:relative}
.profile__btn{display:flex;align-items:center;gap:8px;border:1px solid var(--border);background:var(--card);height:40px;border-radius:999px;padding:0 10px;cursor:pointer}
.profile__btn:hover{border-color:var(--red);color:var(--red)}
.profile__avatar{width:24px;height:24px;border-radius:50%;border:1px solid var(--border)}
.profile__menu{position:absolute;right:0;top:calc(100% + 6px);background:var(--card);border:1px solid var(--border);border-radius:12px;min-width:180px;box-shadow:0 12px 24px rgba(0,0,0,.08);padding:8px;display:flex;flex-direction:column}
.profile__menu a{padding:10px 12px;border-radius:8px}
.profile__menu a:hover{background:var(--bg-soft);color:var(--red)}