/* Data room portal (Sprint 21b): the guest-facing pages. Layout only; colors come from the shared tokens. */
body { margin: 0; background: var(--bg, var(--surface)); color: var(--text); }
.skip-link { position: absolute; left: -9999px; top: 0; background: var(--surface); padding: var(--s-2) var(--s-3); z-index: 100; }
.skip-link:focus { left: var(--s-3); top: var(--s-3); }
.portal-top { display: flex; align-items: center; gap: var(--s-3); padding: var(--s-3) var(--s-4); border-bottom: 1px solid var(--line); background: var(--surface); position: sticky; top: 0; z-index: 10; }
.portal-title { flex: 1; min-width: 0; }
.portal-who { display: flex; align-items: center; gap: var(--s-2); }
.portal-main { max-width: 1200px; margin: 0 auto; padding: var(--s-4) max(16px, var(--s-4)); }
.portal-main:focus { outline: none; }
.portal-card { max-width: 480px; margin: var(--s-6, 32px) auto; }
.portal-card.wide { max-width: 760px; }
.portal-tabs { display: flex; gap: var(--s-1); border-bottom: 1px solid var(--line); margin-bottom: var(--s-4); overflow-x: auto; }
.portal-tabs a { padding: var(--s-2) var(--s-4); color: var(--text-2); text-decoration: none; border-bottom: 2px solid transparent; white-space: nowrap; }
.portal-tabs a.active { color: var(--text); border-bottom-color: var(--accent); font-weight: 600; }
.nda-text { white-space: pre-wrap; max-height: 320px; overflow: auto; border: 1px solid var(--line); border-radius: var(--r-md); padding: var(--s-3); background: var(--surface); }
.totp-key { font-size: var(--fs-md, 1rem); letter-spacing: .08em; word-break: break-all; }
.recovery { list-style: none; padding: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--s-2); margin: var(--s-3) 0; }
.recovery code { font-size: var(--fs-md, 1rem); }
.req-list, .qa-list { list-style: none; margin: 0; padding: 0; }
.req-item { display: flex; flex-wrap: wrap; gap: var(--s-3); justify-content: space-between; padding: var(--s-3) var(--s-4); border-top: 1px solid var(--line); }
.req-main { flex: 1 1 260px; min-width: 0; }
.req-side { display: flex; flex-wrap: wrap; gap: var(--s-2); align-items: center; }
.qa-item { padding: var(--s-3) var(--s-4); border-top: 1px solid var(--line); }
.qa-body { margin: var(--s-2) 0; white-space: pre-wrap; }
.qa-answer { margin: var(--s-2) 0 var(--s-2) var(--s-4); padding-left: var(--s-3); border-left: 3px solid var(--line-strong, var(--line)); white-space: pre-wrap; }

/* the room: the same folder tree and file table as the deal team's data room */
.dr-layout { display: grid; grid-template-columns: minmax(220px, 280px) minmax(0, 1fr); gap: var(--s-4); align-items: start; }
@media (max-width: 860px) { .dr-layout { grid-template-columns: 1fr; } }
.dr-tree-body { padding: var(--s-2); }
.dr-list { list-style: none; margin: 0; padding: 0; }
.dr-list .dr-list { padding-left: var(--s-4); }
.dr-row a { display: flex; align-items: center; gap: var(--s-2); padding: var(--s-2); color: var(--text); text-decoration: none; border-radius: var(--r-md); }
.dr-row.active > a { background: var(--accent-soft, var(--line)); font-weight: 600; }
.dr-row.dim a { color: var(--text-2); cursor: default; }
.dr-name { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.dr-ix { color: var(--text-2); font-variant-numeric: tabular-nums; font-size: var(--fs-xs); min-width: 2.2em; }
.dr-count { color: var(--text-2); font-size: var(--fs-xs); }
.dr-bar { display: flex; flex-wrap: wrap; align-items: center; gap: var(--s-3); }
.dr-crumb { flex: 1 1 200px; min-width: 0; }
.dr-search { display: flex; gap: var(--s-2); }
.dr-main .panel + .panel, .dr-main .dr-toolbar { margin-bottom: var(--s-3); }
.dr-drop.over { outline: 2px dashed var(--accent); outline-offset: -4px; }

/* the protected viewer: the document with the person's name drawn over it */
.pv-stage { position: relative; min-height: 60vh; background: var(--surface); }
.pv-frame { width: 100%; height: 70vh; border: 0; }
.pv-image { max-width: 100%; display: block; margin: 0 auto; }
.pv-text { white-space: pre-wrap; max-height: 70vh; overflow: auto; margin: 0; padding: var(--s-3); }
.pv-veil { position: absolute; inset: 0; overflow: hidden; pointer-events: none; display: flex; flex-wrap: wrap; align-content: space-around; justify-content: space-around; opacity: .16; transform: rotate(-22deg) scale(1.4); font-size: var(--fs-sm); font-weight: 600; user-select: none; }
.pv-veil span { padding: var(--s-4); white-space: nowrap; }
@media print { body.no-print * { display: none !important; } body.no-print::before { content: "Printing is turned off for this document."; display: block; padding: 2em; } }