.portal-modal-layer {
  position: fixed;
  inset: 0;
  z-index: 1450;
  display: grid;
  place-items: center;
  padding: 24px;
}
.portal-document-viewer-layer { z-index: 5100; }

.portal-modal-backdrop {
  position: absolute;
  inset: 0;
  background: rgba(15, 43, 37, 0.42);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
}

.portal-modal-panel {
  position: relative;
  width: min(760px, calc(100vw - 32px));
  max-height: min(860px, calc(100dvh - 48px));
  overflow: hidden;
  border: 1px solid rgba(var(--primary-rgb), 0.14);
  border-radius: 8px;
  background: #f8f9f7;
  box-shadow: 0 32px 88px rgba(23, 31, 40, 0.26);
}

.portal-modal-panel--document-viewer { height: min(860px, calc(100dvh - 48px)); }

.portal-modal-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
  padding: 18px 20px;
  border-bottom: 1px solid rgba(var(--primary-rgb), 0.1);
  background: #fff;
}

.portal-modal-header h2 {
  margin: 0;
  color: var(--text-deep);
  font-family: var(--font-heading);
  font-size: 1.18rem;
}

.portal-modal-header p { margin: 4px 0 0; color: var(--text-soft); font-size: 0.86rem; }
.portal-modal-body { max-height: calc(100dvh - 150px); overflow-y: auto; }

.portal-document-gallery { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; padding: 20px; }
.portal-document-card { display: grid; gap: 10px; min-width: 0; padding: 12px; border: 1px solid rgba(var(--primary-rgb), 0.12); border-radius: 8px; background: #fff; }
.portal-document-preview-tile { display: grid; grid-template-rows: minmax(140px, 1fr) auto; min-width: 0; overflow: hidden; padding: 0; border: 1px solid rgba(var(--primary-rgb), 0.14); border-radius: 6px; background: #f8f9f7; color: inherit; cursor: pointer; text-align: left; }
.portal-document-preview-tile:hover { border-color: rgba(var(--primary-rgb), 0.42); }
.portal-document-preview-tile:focus-visible { outline: 3px solid rgba(var(--primary-rgb), 0.3); outline-offset: 2px; }
.portal-document-preview-art { display: grid; min-height: 140px; place-items: center; overflow: hidden; border-bottom: 1px solid rgba(var(--primary-rgb), 0.12); background: #e7f0ec; }
.portal-document-preview-art canvas { display: block; max-width: 100%; height: auto !important; box-shadow: 0 5px 14px rgba(23, 31, 40, 0.16); }
.portal-document-preview-badge { display: grid; width: 64px; height: 78px; place-items: center; border: 1px solid rgba(163, 63, 63, 0.25); border-radius: 4px; background: #fff; box-shadow: 0 8px 18px rgba(23, 31, 40, 0.12); color: #a33f3f; font-size: 0.78rem; font-weight: 800; letter-spacing: 0; }
.portal-document-card-copy { display: grid; gap: 4px; min-width: 0; padding: 12px; }
.portal-document-card-copy span { color: var(--text-soft); font-size: 0.75rem; font-weight: 700; text-transform: uppercase; }
.portal-document-card-copy strong { overflow-wrap: anywhere; color: var(--text-deep); font-family: var(--font-heading); }
.portal-document-card-copy small { color: var(--text-soft); font-size: 0.78rem; }
.portal-document-card-actions { display: flex; }
.portal-document-card-actions .btn-secondary { min-height: 38px; width: 100%; padding: 8px 12px; }
.portal-documents-empty { margin: 0; padding: 24px; color: var(--text-soft); }

.portal-document-viewer {
  position: absolute;
  inset: 0;
  z-index: 1;
  display: grid;
  grid-template-rows: auto minmax(0, 1fr);
  background: #f8f9f7;
}

.portal-document-viewer-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 14px 18px;
  border-bottom: 1px solid rgba(var(--primary-rgb), 0.1);
  background: #fff;
}

.portal-document-viewer-header strong { min-width: 0; overflow-wrap: anywhere; color: var(--text-deep); }
.portal-document-viewer-pages { display: grid; min-height: 0; gap: 18px; overflow-y: auto; padding: 18px; justify-items: center; background: #e7ece8; }
.portal-document-viewer-page { display: grid; width: fit-content; max-width: 100%; background: #fff; box-shadow: 0 8px 22px rgba(23, 31, 40, 0.18); }
.portal-document-viewer-page canvas { display: block; max-width: 100%; height: auto !important; }
.portal-document-viewer-loading, .portal-document-viewer-error { margin: 0; align-self: start; color: var(--text-soft); }

.portal-modal-body .session-info-card {
  display: grid;
  gap: 0;
  margin: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}

.portal-modal-body .profile-settings-section,
.portal-modal-body .profile-settings-row,
.portal-modal-body .profile-delete-zone {
  margin: 0;
  padding: 22px 24px;
  border: 0;
  border-radius: 0;
  box-shadow: none;
}

.portal-modal-body .profile-settings-section h3 {
  margin: 0 0 16px;
  color: var(--text-deep);
  font-family: var(--font-heading);
  font-size: 0.94rem;
}

.portal-modal-body .account-modal-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
}

.portal-modal-body .profile-settings-section .btn-main {
  display: flex;
  width: auto;
  min-width: 148px;
  margin: 18px 0 0 auto;
}

.portal-modal-body .profile-settings-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 16px;
  border-top: 1px solid rgba(var(--primary-rgb), 0.1);
}

.portal-modal-body .profile-settings-notice { grid-column: 1 / -1; margin: -5px 0 0; }

.portal-modal-body .profile-delete-zone {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 16px;
  border-top: 1px solid rgba(163, 63, 63, 0.18);
  background: rgba(163, 63, 63, 0.045);
}

.portal-modal-body .profile-delete-zone p { max-width: 440px; margin: 5px 0 0; font-size: 0.82rem; line-height: 1.45; }
.portal-modal-body .profile-delete-confirm { grid-column: 1 / -1; padding-top: 4px; }

@media (max-width: 620px) {
  .portal-modal-layer { padding: 12px; }
  .portal-modal-panel { width: min(100%, calc(100vw - 24px)); max-height: calc(100dvh - 24px); }
  .portal-modal-panel--document-viewer { height: calc(100dvh - 24px); }
  .portal-modal-header { padding: 16px; }
  .portal-modal-body .profile-settings-section,
  .portal-modal-body .profile-settings-row,
  .portal-modal-body .profile-delete-zone { padding: 18px 16px; }
  .portal-modal-body .account-modal-grid { grid-template-columns: minmax(0, 1fr); }
  .portal-modal-body .profile-settings-row,
  .portal-modal-body .profile-delete-zone { grid-template-columns: minmax(0, 1fr); align-items: start; }
  .portal-modal-body .profile-settings-section .btn-main { width: 100%; margin-top: 16px; }
  .portal-modal-body .profile-settings-row .btn-secondary,
  .portal-modal-body .profile-delete-zone > .btn-secondary { justify-self: start; }
  .portal-document-gallery { padding: 16px; }
  .portal-document-gallery { grid-template-columns: minmax(0, 1fr); }
  .portal-document-viewer-header { align-items: flex-start; flex-direction: column; }
  .portal-document-viewer-header .btn-secondary { width: 100%; }
}