.portal-page { min-height: 100vh; display: flex; align-items: center; justify-content: center; padding: 1rem; }
.login-box { background: #fff; padding: 2rem; border-radius: 0.5rem; box-shadow: 0 2px 10px rgba(0,0,0,0.1); max-width: 400px; width: 100%; }
.login-box h1 { margin-top: 0; color: var(--primary-1); }
.portal-header { background: #fff; box-shadow: 0 1px 3px rgba(0,0,0,0.08); min-height: var(--header-height); }
.portal-header .inner { display: flex; align-items: center; justify-content: space-between; gap: 0.5rem; min-height: var(--header-height); }
.portal-header a { color: var(--primary-3); text-decoration: none; font-weight: 600; }
.portal-header a:hover { color: var(--primary-1); }
.portal-header-start { font-size: 1rem; }
.portal-header-user { display: flex; align-items: center; gap: 0.5rem; flex-shrink: 0; }
.portal-username { font-size: 0.8rem; color: #666; white-space: nowrap; }
.portal-logout { font-size: 0.875rem; white-space: nowrap; }
.portal-main { padding: 1.5rem 0; }
.portal-tiles { display: grid; grid-template-columns: repeat(auto-fill, minmax(10rem, 1fr)); gap: 0.75rem; margin-bottom: 1.5rem; }
.portal-tile { display: flex; align-items: center; justify-content: center; min-height: 3.5rem; padding: 0.75rem 1rem; background: #fff; border-radius: 0.5rem; box-shadow: 0 1px 3px rgba(0,0,0,0.08); color: var(--primary-3); text-decoration: none; font-weight: 600; text-align: center; transition: background 0.15s, box-shadow 0.15s; }
.portal-tile:hover { background: rgba(221,97,40,0.08); box-shadow: 0 2px 6px rgba(0,0,0,0.1); color: var(--primary-1); }
.card { background: #fff; border-radius: 0.5rem; box-shadow: 0 1px 3px rgba(0,0,0,0.08); padding: 1.5rem; margin-bottom: 1rem; }
.card h2 { margin-top: 0; color: var(--primary-1); }

/* Schwarzes Brett: Avatar oder Initial-Kreis (Flex in div statt td für Firefox) */
.bulletin-user-cell { display: flex; align-items: center; gap: 0.5rem; }
.bulletin-avatar { display: block; width: 36px; height: 36px; border-radius: 50%; object-fit: cover; flex-shrink: 0; }
.bulletin-avatar-initial {
  position: relative;
  display: block;
  width: 36px;
  height: 36px;
  flex: 0 0 36px;
  box-sizing: border-box;
  border-radius: 50%;
  color: #fff;
  font-weight: 700;
  font-size: 1rem;
  overflow: hidden;
}
.bulletin-avatar-initial-char {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  line-height: 1;
  margin: 0;
  padding: 0;
}
.bulletin-username { white-space: nowrap; }