#friends-panel .social-friends-box {
  display: flex;
  flex-direction: column;
  gap: 12px;
  padding: 14px;
  border-radius: 18px;
  border: 1px solid rgba(112, 154, 198, 0.22);
  background: linear-gradient(180deg, rgba(20, 31, 48, 0.96), rgba(10, 17, 27, 0.985));
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.05), 0 8px 22px rgba(0,0,0,0.18);
}

#friends-panel .social-friends-box .fp-section-title {
  margin: 0;
  padding: 0;
}

#friends-panel .social-friends-box .fp-list {
  margin-top: 0;
  flex: 1 1 auto;
}


/* moved from 03-panel-contract.css in pass26: dm/favpicker compat */
:is(#dm-panel,
#profile-favpicker-panel) {
  display: none;
  flex-direction: column;
}

#profile-favpicker-panel .panel-title {
  flex: 1 1 auto;
  min-width: 0;
}

.dm-body,
.favpicker-body {
  flex: 1 1 auto;
  min-height: 0;
  height: auto;
  padding: 0;
  overflow: hidden;
}

#dm-panel .dm-title {
  flex: 1 1 auto;
  min-width: 0;
  padding-right: 8px;
}

#dm-panel .panel-header-controls,
#profile-favpicker-panel .panel-header-controls {
  margin-left: 0;
}

#dm-panel .dm-body {
  display: flex;
  flex-direction: column;
  min-width: 0;
  min-height: 0;
  box-sizing: border-box;
  background: #10202e;
}

#dm-panel .dm-log {
  flex: 1 1 auto;
  min-width: 0;
  min-height: 0;
  overflow: auto;
  scrollbar-gutter: stable;
}

.favpicker-header {
  position: relative;
}

.favpicker-title {
  font-size: 15px;
  font-weight: bold;
  color: #ffd60a;
  padding-right: 42px;
}

.favpicker-body {
  padding: 10px;
  box-sizing: border-box;
}


/* extracted from 03-panel-contract.css — pass27 social spill */


/* pass21 social-panel theme normalization
   Keep the combined Social panel on the standard project shell/header/body theme.
   This file owns layout/content cards, not bespoke outer chrome. */
#friends-panel .social-profile-card,
#friends-panel .social-friends-box {
  background: linear-gradient(180deg, rgba(14, 22, 34, 0.78), rgba(10, 16, 26, 0.90));
  border: 1px solid rgba(118, 157, 200, 0.18);
  border-radius: 16px;
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.04);
}

#friends-panel .social-profile-card,
#friends-panel .social-friends-col {
  min-height: 0;
}

#friends-panel .social-profile-card {
  padding: 14px;
}

#friends-panel .social-friends-box {
  min-height: 0;
}


/* pass22 social panel sizing + friends list normalization */
#friends-panel > .panel-body.fp-body {
  height: 100%;
  overflow: hidden;
}

#friends-panel .social-combined-grid {
  width: 100%;
  height: 100%;
  min-height: 0;
  display: grid;
  grid-template-columns: minmax(320px, 360px) minmax(0, 1fr);
  gap: 16px;
  align-items: stretch;
}

#friends-panel .social-profile-card,
#friends-panel .social-friends-col,
#friends-panel .social-friends-box,
#friends-panel .social-friends-box .fp-list {
  min-height: 0;
}

#friends-panel .social-friends-col {
  min-width: 0;
}

#friends-panel .social-friends-box {
  height: 100%;
}

#friends-panel .social-friends-box .fp-list {
  display: flex;
  flex-direction: column;
  gap: 10px;
  padding: 10px;
}

#friends-panel .fp-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(180px, 0.9fr) auto auto auto;
  align-items: center;
  gap: 10px;
  padding: 10px 12px;
}

#friends-panel .fp-row-name,
#friends-panel .fp-row-id {
  min-width: 0;
}

#friends-panel .fp-row-name {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

#friends-panel .fp-row-id {
  max-width: none;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

#friends-panel .fp-dm-btn,
#friends-panel .fp-invite-btn,
#friends-panel .fp-remove-btn {
  min-width: 72px;
  justify-self: end;
}

#friends-panel .fp-add-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 10px;
  align-items: center;
}

#friends-panel .fp-input {
  width: 100%;
}

@media (max-width: 1200px) {
  #friends-panel.panel {
    width: min(880px, calc(var(--app-authored-width) - 32px)) !important;
    height: min(680px, calc(var(--app-authored-height) - 32px)) !important;
  }

  #friends-panel .social-combined-grid {
    grid-template-columns: 1fr;
  }
}


/* ============================================================
   Owner shift from legacy — records panel polish contract
   ============================================================ */
#records-panel > .panel-body.records-panel-body {
  background:
    linear-gradient(180deg, rgba(255,255,255,0.04) 0%, rgba(255,255,255,0.01) 11%, rgba(255,255,255,0.00) 22%),
    linear-gradient(180deg, rgba(7,12,20,0.16) 0%, rgba(7,12,20,0.04) 100%);
}

.records-nav,
.records-side-summary,
.records-main,
.records-card,
.quest-log-entry,
.records-history-item,
.records-list-item {
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.05);
  border-radius: 16px;
}

.records-shell {
  gap: 14px;
  padding: 14px;
}

.records-nav,
.records-side-summary {
  padding: 12px;
  background:
    linear-gradient(180deg, rgba(255,255,255,0.05) 0%, rgba(255,255,255,0.015) 100%),
    rgba(10, 16, 24, 0.56);
  border: 1px solid rgba(130, 178, 228, 0.16);
}

.records-main {
  background:
    linear-gradient(180deg, rgba(255,255,255,0.045) 0%, rgba(255,255,255,0.012) 100%),
    rgba(10, 16, 24, 0.42);
  border: 1px solid rgba(130, 178, 228, 0.14);
}

.records-tab {
  padding: 14px;
}

.records-tab-btn,
.records-section-btn {
  min-height: 38px;
  padding: 9px 14px;
  border-radius: 12px;
  border: 1px solid rgba(143, 186, 232, 0.18);
  background:
    linear-gradient(180deg, rgba(255,255,255,0.07) 0%, rgba(255,255,255,0.02) 100%),
    rgba(18, 28, 42, 0.72);
  color: #dbe9f8;
  font-weight: 800;
  letter-spacing: 0.2px;
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.04);
  transition: transform 120ms ease, border-color 120ms ease, background 120ms ease, box-shadow 120ms ease;
}

.records-tab-btn:hover,
.records-section-btn:hover {
  transform: translateY(-1px);
  border-color: rgba(159, 208, 255, 0.42);
  background:
    linear-gradient(180deg, rgba(255,255,255,0.10) 0%, rgba(255,255,255,0.03) 100%),
    rgba(24, 40, 60, 0.84);
}

.records-tab-btn.active,
.records-section-btn.active {
  color: #f6fbff;
  border-color: rgba(133, 193, 255, 0.56);
  background:
    linear-gradient(180deg, rgba(132, 193, 255, 0.22) 0%, rgba(94, 148, 208, 0.10) 100%),
    rgba(24, 42, 62, 0.94);
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.08), 0 0 0 1px rgba(120,165,214,0.12);
}

.records-filter-row select,
#records-chao-picker {
  min-height: 38px;
  padding: 8px 12px;
  border-radius: 12px;
  background: rgba(18, 28, 42, 0.84);
  color: #eef5ff;
  border: 1px solid rgba(143, 186, 232, 0.20);
}

.records-card,
.quest-log-entry {
  background:
    linear-gradient(180deg, rgba(255,255,255,0.06) 0%, rgba(255,255,255,0.015) 100%),
    rgba(12, 20, 31, 0.76);
  border: 1px solid rgba(130, 178, 228, 0.16);
  padding: 12px 14px;
}

.records-card h3,
.records-card h4 {
  color: #eff6ff;
  margin-bottom: 10px;
}

.records-history-item,
.records-list-item {
  padding: 10px 12px;
  background: rgba(255,255,255,0.05);
  border: 1px solid rgba(255,255,255,0.08);
}

.records-stat-item b,
.quest-log-entry-title,
.achievement-title {
  color: #edf6ff;
}


/* ===== extracted: dm-panel-fit-owner-shift ===== */

#dm-panel > .panel-header,
#dm-panel > .panel-header > .panel-title,
#dm-panel > .panel-header > .panel-header-controls {
  min-width: 0;
}

#dm-panel > .panel-body.dm-body {
  min-width: 0;
  min-height: 0;
  box-sizing: border-box;
  padding: 12px;
  display: flex;
  flex-direction: column;
  gap: 10px;
  overflow: hidden;
}

#dm-panel .dm-input-row {
  min-width: 0;
  min-height: 0;
}