:root {
  --ink: #163039;
  --muted: #526363;
  --green: #2c513a;
  --line: #dce1d8;
  --paper: #f7f7f0;
  --white: #fff;
  font-family: Arial, Helvetica, sans-serif;
  color: var(--ink);
  background: var(--paper);
}
* { box-sizing: border-box; }
body { margin: 0; line-height: 1.55; }
a { color: var(--green); text-underline-offset: 3px; }
a:focus-visible, button:focus-visible, input:focus-visible, select:focus-visible, summary:focus-visible {
  outline: 3px solid #527b5e;
  outline-offset: 3px;
}
.portal-wrap { width: min(calc(100% - 36px), 1080px); margin-inline: auto; }
.portal-header { background: var(--white); border-bottom: 1px solid var(--line); }
.portal-header .portal-wrap { display: flex; align-items: center; justify-content: space-between; min-height: 84px; }
.portal-header img { width: 130px; height: auto; display: block; }
.portal-narrow { max-width: 540px; }
main { padding-block: clamp(32px, 6vw, 68px); min-height: 64vh; }
h1, h2, h3 { line-height: 1.2; margin: 0 0 14px; }
h1 { font-size: clamp(36px, 7vw, 60px); letter-spacing: -.045em; }
h2 { font-size: clamp(22px, 3vw, 30px); }
h3 { font-size: 18px; }
p { margin: 0 0 16px; }
.portal-eyebrow { font-size: 12px; font-weight: 700; letter-spacing: .15em; color: var(--green); }
.portal-intro { color: var(--muted); font-size: 18px; margin-bottom: 24px; }
.portal-card { background: var(--white); border: 1px solid var(--line); border-radius: 8px; padding: clamp(18px, 4vw, 34px); margin-bottom: 22px; }
form { display: grid; gap: 14px; align-items: start; margin: 0; }
.portal-form-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.portal-full { grid-column: 1 / -1; }
label { display: grid; gap: 6px; font-weight: 700; min-width: 0; }
input, select { width: 100%; min-width: 0; min-height: 44px; padding: 9px 11px; border: 1px solid #98a59c; border-radius: 4px; background: var(--white); color: var(--ink); font: inherit; font-weight: 400; }
input[readonly] { background: var(--paper); }
small { display: block; color: var(--muted); font-weight: 400; }
.portal-button { width: fit-content; max-width: 100%; min-height: 44px; display: inline-flex; align-items: center; justify-content: center; border: 1px solid var(--green); border-radius: 4px; padding: 8px 16px; color: var(--white); background: var(--green); font: inherit; font-weight: 700; text-decoration: none; cursor: pointer; }
.portal-secondary { background: var(--white); color: var(--green); }
.portal-danger { background: var(--white); color: #982e25; border-color: #982e25; }
.portal-help, .portal-owner-link { margin: 16px 0 0; color: var(--muted); }
.portal-alert, .portal-success { border-radius: 4px; padding: 10px 12px; }
.portal-alert { color: #84251c; background: #fff1ef; }
.portal-success { color: var(--green); background: #e5f0dd; }
.portal-invite-actions { display: flex; flex-wrap: wrap; gap: 8px; margin-block: 12px; }
.portal-nav, .portal-footer .portal-wrap { display: flex; flex-wrap: wrap; gap: 12px 22px; }
.portal-nav { margin-bottom: 24px; }
.portal-list { list-style: none; margin: 14px 0 0; padding: 0; }
.portal-list li { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 14px 0; border-top: 1px solid var(--line); overflow-wrap: anywhere; }
.portal-list .portal-admin-row { display: block; }
.portal-admin-row details { margin-top: 6px; }
summary { width: fit-content; min-height: 36px; color: var(--green); cursor: pointer; }
.portal-controls { display: grid; gap: 18px; padding: 14px; border-radius: 4px; background: var(--paper); }
.portal-footer { background: var(--white); border-top: 1px solid var(--line); padding: 18px 0; }
.portal-sr-only { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
@media (max-width: 580px) {
  .portal-form-grid { grid-template-columns: minmax(0, 1fr); }
  .portal-list li { flex-wrap: wrap; }
  .portal-header img { width: 100px; }
}

.portal-document-actions { display: flex; flex-wrap: wrap; gap: 8px; }
.portal-document-options { margin: 0; min-width: 0; padding: 0 12px; border: 1px solid var(--line); border-radius: 4px; }
.portal-document-options legend { padding-inline: 4px; font-weight: 700; }
.portal-document-options label { grid-template-columns: auto minmax(0, 1fr); gap: 10px; align-items: start; }
.portal-document-options input[type="checkbox"] { width: 20px; height: 20px; min-height: 0; margin: 3px 0 0; accent-color: var(--green); }

.portal-password { display: grid; gap: 6px; min-width: 0; }
.portal-password-control { display: flex; gap: 8px; }
.portal-password-control input { flex: 1; }
.portal-password-control button { flex: 0 0 88px; padding-inline: 8px; }
.portal-password-control button[hidden] { display: none; }
.portal-remember { grid-template-columns: auto 1fr; align-items: center; gap: 9px; min-height: 44px; font-weight: 400; }
.portal-remember input { width: 18px; height: 18px; min-height: 0; margin: 0; accent-color: var(--green); }

.personal-tools { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 22px; }
.personal-tool { display: flex; flex-direction: column; margin-bottom: 0; }
.personal-tool .portal-button { margin-top: auto; }
@media (max-width: 680px) {
  .personal-tools { grid-template-columns: minmax(0, 1fr); }
}
