body #receivedRecordsModal { position: fixed; inset: 0; padding: 16px; display: grid; place-items: center; z-index: 1200; box-sizing: border-box; }
body #receivedRecordsModal[hidden] { display: none !important; }
body #receivedRecordsModal .received-records-card { width: min(100%,640px); max-height: calc(100dvh - 32px); margin: 0; border-radius: 22px; background: #f4f9fc; display: flex; flex-direction: column; overflow: hidden; min-height: 0; }
body #receivedRecordsModal .received-records-head { display: flex; flex: 0 0 auto; align-items: center; justify-content: space-between; gap: 12px; padding: 20px; background: #e8f3f7; }
body #receivedRecordsModal .received-records-head h2 { font-size: 23px; line-height: 1.2; margin: 4px 0 0; }
body #receivedRecordsModal .record-back-btn { flex: 0 0 44px; width: 44px; height: 44px; padding: 0; background: #fff; color: #173f50; border: 1px solid #8daab9; }
body #receivedRecordsModal .record-back-btn strong { display: none; }
body #receivedRecordsModal .received-records-list { overflow-y: auto; overscroll-behavior: contain; padding: 14px; min-height: 0; display: grid; gap: 12px; }
body #receivedRecordsModal .received-record-row { display: grid; grid-template-columns: 36px minmax(0,1fr); gap: 8px 12px; padding: 14px; margin: 0; border: 1px solid #9bb7c5; border-left: 4px solid #008675; border-radius: 16px; background: linear-gradient(130deg,#fff,#eaf3f8); opacity: 1; }
body #receivedRecordsModal .received-record-index { width: 36px; height: 36px; background: #d7eee9; color: #12594f; }
body #receivedRecordsModal .received-record-copy strong { color: #102f40; font-size: 16px; overflow-wrap: anywhere; }
body #receivedRecordsModal .received-record-copy span { display: block; color: #365363; font-size: 13px; margin-top: 5px; }
body #receivedRecordsModal .received-record-status { grid-column: 2; justify-self: start; margin: 0; color: #254658; background: #e1ebf1; }
body #receivedRecordsModal .received-record-detail { grid-column: 1 / -1; border-top: 1px solid #b7cbd6; padding-top: 10px; color: #254658; font-size: 14px; }
body #receivedRecordsModal .received-record-detail[hidden] { display: none; }
body #receivedRecordsModal .received-record-action { grid-column: 2; min-height: 44px; }

/* Compact, non-shrinking write-up rows. The existing action is the full-row hit target. */
body #receivedRecordsModal.is-writeups .received-records-head { padding: 12px 14px; flex-direction: row; }
body #receivedRecordsModal.is-writeups .received-records-head h2 { font-size: 20px; }
body #receivedRecordsModal.is-writeups .received-records-list { padding: 10px; gap: 6px; grid-auto-rows: max-content; align-content: start; }
body #receivedRecordsModal.is-writeups .received-record-row { position: relative; grid-template-columns: minmax(0,1fr) auto; align-items: center; gap: 4px 8px; min-height: 68px; padding: 9px 28px 9px 10px; border-radius: 10px; background: #fff; box-sizing: border-box; }
body #receivedRecordsModal.is-writeups .received-record-row.is-new { border-left-color: #d89a00; background: #fffcf2; }
body #receivedRecordsModal.is-writeups .received-record-index { display: none; }
body #receivedRecordsModal.is-writeups .received-record-copy { min-width: 0; }
body #receivedRecordsModal.is-writeups .received-record-copy strong { display: block; font-size: 14px; line-height: 18px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
body #receivedRecordsModal.is-writeups .received-record-copy span { font-size: 11px; line-height: 15px; margin-top: 3px; }
body #receivedRecordsModal.is-writeups .received-record-status { grid-column: 2; grid-row: 1; max-width: 82px; font-size: 10px; line-height: 13px; padding: 4px 6px; border-radius: 6px; white-space: normal; background: #e6f3ec; color: #286445; text-align: center; }
body #receivedRecordsModal.is-writeups .is-new .received-record-status { background: #fff0bd; color: #855600; }
body #receivedRecordsModal.is-writeups .received-record-action { position: absolute; inset: 0; width: 100%; height: 100%; margin: 0; padding: 0; border: 0; border-radius: 9px; background: transparent; box-shadow: none; font-size: 0; color: transparent; cursor: pointer; z-index: 1; }
body #receivedRecordsModal.is-writeups .received-record-action::after { content: '›'; position: absolute; right: 9px; top: 50%; transform: translateY(-50%); color: #007d70; font-size: 22px; line-height: 1; }
body #receivedRecordsModal.is-writeups .received-record-action:hover { background: #00867508; }
body #receivedRecordsModal.is-writeups .received-record-action:focus-visible { outline: 2px solid #008675; outline-offset: 2px; }
body #receivedRecordsModal.is-writeups .received-record-action[aria-expanded=true]::after { transform: translateY(-50%) rotate(90deg); }
body #receivedRecordsModal.is-writeups .received-record-action:disabled::after { content: '…'; }
body #receivedRecordsModal.is-writeups .received-record-action { grid-area: auto; background: transparent !important; border: 0 !important; opacity: 1; }
@media (max-width: 480px) {
  body #receivedRecordsModal.is-writeups { padding: 8px; }
  body #receivedRecordsModal.is-writeups .received-records-card { max-height: calc(100dvh - 16px); border-radius: 14px; }
}
/* Mobile write-up inbox: viewport shell, compact rows, list-only scrolling. */
@media (max-width: 780px) {
  body #receivedRecordsModal.is-writeups { padding: 0 !important; }
  body #receivedRecordsModal.is-writeups .received-records-card { width: 100% !important; max-width: none !important; height: 100dvh; max-height: 100dvh; border-radius: 0 !important; border: 0; }
  body #receivedRecordsModal.is-writeups .received-records-head { padding-top: max(12px, env(safe-area-inset-top)); padding-left: max(14px, env(safe-area-inset-left)); padding-right: max(14px, env(safe-area-inset-right)); }
  body #receivedRecordsModal.is-writeups .received-records-list { flex: 1 1 auto; padding-bottom: max(10px, env(safe-area-inset-bottom)); }
}

/* Performance rows must grow with their content instead of shrinking grid tracks. */
body #receivedRecordsModal.is-performance .received-records-list{flex:1 1 auto;grid-auto-rows:max-content!important;align-content:start!important;min-height:0;overflow-y:auto}
body #receivedRecordsModal.is-performance .received-record-row{height:auto!important;min-height:0!important;max-height:none!important;grid-template-columns:28px minmax(0,1fr)!important;grid-template-rows:auto auto auto!important;align-items:start!important;align-content:start!important;padding:12px!important;gap:8px 10px!important;box-sizing:border-box;overflow:visible!important}
body #receivedRecordsModal.is-performance .received-record-index{width:28px;height:28px;font-size:11px;grid-column:1;grid-row:1;align-self:start}
body #receivedRecordsModal.is-performance .received-record-copy{min-width:0!important;grid-column:2;grid-row:1;overflow:visible!important}
body #receivedRecordsModal.is-performance .received-record-copy strong{display:block;font:650 14px/1.4 system-ui!important;white-space:normal!important;overflow-wrap:anywhere;max-height:none!important}
body #receivedRecordsModal.is-performance .received-record-copy span{font:400 12px/1.55 system-ui!important;white-space:normal!important;overflow-wrap:anywhere;display:block;max-height:none!important}
body #receivedRecordsModal.is-performance .received-record-status{grid-column:2;grid-row:2;justify-self:start;align-self:start;font-size:10px;padding:3px 7px}
body #receivedRecordsModal.is-performance .received-record-action{grid-column:2;grid-row:3;position:static!important;min-height:36px;height:auto!important;width:auto!important;justify-self:start;padding:7px 13px;font-size:12px}

/* Compact Performance history: full descriptions live in the opened report. */
body #receivedRecordsModal.is-performance .received-records-head{padding:12px 14px;flex-direction:row;gap:10px}
body #receivedRecordsModal.is-performance .received-records-head h2{font-size:20px!important}
body #receivedRecordsModal.is-performance .received-records-list{padding:8px!important;gap:5px!important}
body #receivedRecordsModal.is-performance .received-record-row{position:relative!important;grid-template-columns:minmax(0,1fr) auto!important;grid-template-rows:auto!important;gap:3px 8px!important;padding:7px 29px 7px 9px!important;border-radius:8px!important;background:var(--surface,#fff);border-left-width:3px}
body #receivedRecordsModal.is-performance .received-record-index{display:none!important}
body #receivedRecordsModal.is-performance .received-record-copy{grid-column:1;grid-row:1!important}
body #receivedRecordsModal.is-performance .received-record-copy strong{font-size:13px!important;line-height:1.25!important}
body #receivedRecordsModal.is-performance .received-record-copy span{font-size:11px!important;line-height:1.3!important;margin-top:3px!important}
body #receivedRecordsModal.is-performance .received-record-status{grid-column:2!important;grid-row:1!important;align-self:center!important;max-width:72px;white-space:normal;font-size:10px!important;line-height:1.2!important}
body #receivedRecordsModal.is-performance .received-record-action{position:absolute!important;inset:0!important;width:100%!important;height:100%!important;min-height:0!important;padding:0!important;border:0!important;background:transparent!important;color:transparent!important;font-size:0!important;box-shadow:none!important;z-index:1}
body #receivedRecordsModal.is-performance .received-record-action::after{content:'›';position:absolute;right:9px;top:50%;transform:translateY(-50%);font-size:20px;color:#008675}
body #receivedRecordsModal.is-performance .received-record-action:focus-visible{outline:2px solid #008675!important;outline-offset:1px}
@media(max-width:600px){body #receivedRecordsModal.is-performance .received-records-card{width:100%!important;max-width:none!important;max-height:calc(100dvh - 16px)!important;border-radius:14px!important}}