/* Portal additions use the existing Hebrew type, colours and touch controls. */
.portal-bar { display: flex; flex-wrap: wrap; gap: var(--s-2); padding: var(--s-3) var(--gutter); border-bottom: var(--line) solid var(--hairline); }
.portal-bar[hidden] { display: none; }
.portal-bar .btn { min-height: 44px; min-width: 0; flex: 1 1 0; white-space: normal; }
.portal-bar .portal-site { flex-basis: 100%; min-width: 0; overflow-wrap: anywhere; justify-content: flex-start; }
.portal-form { display: flex; flex-direction: column; gap: var(--s-4); min-width: 0; }
.portal-form .input, .portal-form .select { max-width: 100%; min-height: 44px; font-size: max(16px, 1em); }
.portal-form .btn, .portal-actions .btn, .portal-sites .btn { min-height: 44px; white-space: normal; }
.portal-otp { font-size: 1.6rem !important; text-align: center; letter-spacing: .18em; }
.portal-sites { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 280px), 1fr)); gap: var(--s-5); }
.portal-sites .card { display: flex; flex-direction: column; gap: var(--s-4); min-width: 0; }
.portal-site-name { overflow-wrap: anywhere; font-size: var(--fs-xl); }
.portal-tags, .portal-actions { display: flex; align-items: center; flex-wrap: wrap; gap: var(--s-2); }
.portal-actions { max-width: 100%; }
.portal-capabilities { display: grid; gap: var(--s-2); }
.portal-form .check { min-height: 44px; min-width: 44px; }
.portal-scopes { display: grid; gap: var(--s-2); }
.portal-scopes[hidden], .portal-capabilities[hidden] { display: none; }
.portal-player video { width: 100%; height: 100%; object-fit: contain; }
.portal-player-state { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; flex-direction: column; gap: var(--s-2); padding: var(--s-4); background: var(--canvas); text-align: center; }
.portal-player-state[hidden] { display: none; }
.portal-scope { display: grid; grid-template-columns: minmax(0, 1fr) auto auto; align-items: center; gap: var(--s-2); border-bottom: var(--line) solid var(--hairline); }
.portal-scope > span { overflow-wrap: anywhere; }
@media (min-width: 600px) {
  .portal-bar { align-items: center; }
  .portal-bar .btn { flex: 0 1 auto; white-space: nowrap; }
  .portal-bar .portal-site { margin-inline-end: auto; max-width: 100%; white-space: normal; }
}
@media (max-width: 374px) { .portal-scope { grid-template-columns: minmax(0, 1fr) auto; } .portal-scope > span { grid-column: 1 / -1; } }