/* X5 desktop template: invitation and friendship pages.
   Uses the active palette, including its dark appearance. */
#nv_home #ct.cdbao-public-friend-page > .mn > .bm.bw0 {
    background: var(--dz-bgf);
}

#nv_home #ct .cdbao-friend-layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 220px;
    align-items: start;
    gap: 20px;
}
#nv_home #ct .cdbao-friend-layout::after { display: none; }
#nv_home #ct .cdbao-friend-layout > .cdbao-friend-tools {
    grid-column: 2;
    grid-row: 1;
    min-width: 0;
}
#nv_home #ct .cdbao-friend-layout > div:not(.cdbao-friend-tools) {
    grid-column: 1;
    grid-row: 1;
    min-width: 0;
}
#nv_home #ct .cdbao-friend-tools .bm {
    margin: 0 0 16px;
    border: 1px solid var(--dz-borderb) !important;
    border-radius: var(--dz-radius-m);
    background: var(--dz-bgf);
    box-shadow: none;
}
#nv_home #ct .cdbao-friend-tools .bm_h {
    height: auto;
    padding: 10px 12px;
    border-bottom: 1px solid var(--dz-borderb);
    background: transparent;
    font-size: 13px;
    line-height: 24px;
}
#nv_home #ct .cdbao-friend-tools .bm_h h3 { font-size: 13px; font-weight: 500; }
#nv_home #ct .cdbao-friend-tools .bm_c { padding: 10px 12px; }
#nv_home #ct .cdbao-friend-tools .pns {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 6px;
    font-size: 0;
}
#nv_home #ct .cdbao-friend-tools .pns .px {
    flex: 1 1 100px;
    min-width: 0;
    width: 100%;
    height: 34px;
    box-sizing: border-box;
    border-radius: var(--dz-radius-s);
    font-size: 13px;
}
#nv_home #ct .cdbao-friend-tools .pns .pn { margin: 0; height: 34px; font-size: 13px; line-height: 32px; }
#nv_home #ct .buddy_group { margin: 0; }
#nv_home #ct .buddy_group li { padding: 8px 0; border-color: var(--dz-borderb); line-height: 24px; }
#nv_home #ct .buddy_group li:last-child { border-bottom: 0; }
#nv_home #ct .buddy_group li.a > a:not(.b, .o) { color: var(--dz-nvbg); }
#nv_home #ct .buddy {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 240px), 1fr));
    gap: 12px;
    margin: 12px 0 18px;
}
#nv_home #ct .buddy::after { display: none; }
#nv_home #ct .buddy > li {
    position: relative;
    display: block;
    float: none;
    box-sizing: border-box;
    width: auto;
    height: auto;
    min-height: 104px;
    margin: 0;
    padding: 14px 12px 14px 72px;
    border: 1px solid var(--dz-borderb);
    border-radius: var(--dz-radius-m);
    background: var(--dz-bgf);
    overflow: visible;
    overflow-wrap: anywhere;
}
#nv_home #ct .buddy .avt { position: absolute; top: 14px; left: 14px; margin: 0; }
#nv_home #ct .buddy .avt img {
    display: block;
    box-sizing: border-box;
    width: 44px;
    height: 44px;
    padding: 0;
    border: 1px solid var(--dz-borderb);
    border-radius: 50%;
    object-fit: cover;
}
#nv_home #ct .buddy h4 { height: auto; min-height: 22px; margin-bottom: 4px; font-size: 14px; line-height: 22px; }
#nv_home #ct .buddy h4 > .y { float: none; display: block; margin-bottom: 4px; }
#nv_home #ct .buddy .maxh { height: auto; max-height: 44px; margin: 4px 0 8px; color: var(--dz-fc); font-size: 12px; line-height: 22px; }
#nv_home #ct .buddy .xg1 { font-size: 12px; line-height: 24px; }
#nv_home #ct .buddy .addbuddy { color: var(--dz-nvbg); font-size: 12px; }
#nv_home #ct .tbmu { padding: 10px 0; border-color: var(--dz-borderb); font-size: 12px; line-height: 24px; }
#nv_home #ct .tbmu a.a { color: var(--dz-nvbg); font-weight: 500; }
#nv_home #ct .emp {
    margin: 14px 0;
    padding: 32px 16px;
    border: 1px dashed var(--dz-borderb);
    border-radius: var(--dz-radius-m);
    background: var(--dz-bgc);
    color: var(--dz-fc);
    font-size: 13px;
    line-height: 24px;
}
#nv_home #ct .tfm :is(td, th) { box-sizing: border-box; overflow-wrap: anywhere; }
#nv_home #ct .tfm :is(.px, .pt, .ps) { max-width: 100%; border-radius: var(--dz-radius-s); }
#nv_home #ct .tfm caption { padding: 14px 0; font-size: 13px; line-height: 24px; }
#nv_home #ct .tfm caption h2 { margin-bottom: 6px; font-size: 15px; font-weight: 500; }
#nv_home #ct .bmn {
    box-sizing: border-box;
    padding: 12px;
    border: 1px solid var(--dz-borderb) !important;
    border-radius: var(--dz-radius-m);
    background: var(--dz-bgc);
    box-shadow: none;
}
#nv_home #ct .quote { margin: 8px 0; padding: 10px 12px; border-left: 3px solid var(--dz-borderb); background: var(--dz-bgc); }
#nv_home #ct .quote blockquote { padding: 0; background: none; font-size: 13px; line-height: 24px; }
#nv_home #ct :is(.pn, a.pn) { border-radius: var(--dz-radius-s); }
/* Requests retain their table and callback IDs for native AJAX updates. */
#nv_home #ct li[id^="friend_tbody_"] { margin: 12px 0; padding: 14px; border: 1px solid var(--dz-borderb); border-radius: var(--dz-radius-m); background: var(--dz-bgf); }
#nv_home #ct li[id^="friend_tbody_"] .tfm { width: 100%; }
#nv_home #ct li[id^="friend_tbody_"] .tfm td:first-child { width: 100px; }
#nv_home #ct li[id^="friend_tbody_"] .avtm img { width: 72px; height: 72px; border-radius: 50%; object-fit: cover; }
#nv_home #ct li[id^="friend_tbody_"] h4 { margin-bottom: 6px; font-size: 15px; }
#nv_home #ct a[id^="afr_"] { background: var(--dz-nvbg); color: var(--dz-ff); }
/* The public invitation page has no member-center sidebar. */
#nv_home #ct.cdbao-invite-page {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 260px;
    align-items: start;
    gap: 20px;
    box-sizing: border-box;
    width: 100%;
    margin: 0 0 32px;
    padding: 0;
    border: 0;
    background: transparent;
}
#nv_home #ct.cdbao-invite-page::after { display: none; }
#nv_home #ct.cdbao-invite-page > :is(.mn, .sd) { float: none; box-sizing: border-box; width: auto; min-width: 0; margin: 0; }
#nv_home #ct.cdbao-invite-page .bm {
    margin: 0;
    padding: 20px;
    border: 1px solid var(--dz-borderb) !important;
    border-radius: var(--dz-radius-m);
    background: var(--dz-bgf);
    box-shadow: none;
}
#nv_home #ct.cdbao-invite-page .bm_h {
    height: auto;
    margin: 0;
    padding: 0 0 12px;
    border-bottom: 1px solid var(--dz-borderb);
    background: transparent;
    font-size: 18px;
    font-weight: 500;
    line-height: 30px;
    overflow-wrap: anywhere;
}
#nv_home #ct.cdbao-invite-page .sd .bm_h { font-size: 14px; line-height: 24px; }
#nv_home #ct.cdbao-invite-page .bm_c { padding: 14px 0 0; font-size: 13px; line-height: 24px; }

#nv_home #ct .cdbao-invite-profile .avtm img { width: 88px; height: 88px; padding: 0; border-radius: 50%; object-fit: cover; }
#nv_home #ct .cdbao-invite-profile h4 { margin-bottom: 8px; font-size: 17px; }
#nv_home #ct .cdbao-invite-actions { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; margin-top: 18px; }
#nv_home #ct .cdbao-invite-actions::after { display: none; }
#nv_home #ct .cdbao-invite-actions :is(.pn, strong) { float: none; }
#nv_home #ct .cdbao-invite-actions .pn { display: inline-flex; align-items: center; height: auto; min-height: 36px; margin: 0; line-height: 24px; }
#nv_home #ct .cdbao-invite-actions .pn strong { padding: 6px 14px; }
#nv_home #ct.cdbao-invite-page .mls { display: grid; grid-template-columns: repeat(auto-fit, minmax(60px, 1fr)); gap: 12px; padding: 4px 0; }
#nv_home #ct.cdbao-invite-page .mls::after { display: none; }
#nv_home #ct.cdbao-invite-page .mls li { float: none; width: auto; margin: 0; padding: 0; }
#nv_home #ct.cdbao-invite-page .mls .avt img { padding: 0; border-radius: 50%; }
/* Full-width management links span both invitation-code columns. */
#nv_home #ct .cdbao-invite-link-row { display: flex; align-items: baseline; flex-wrap: wrap; gap: 6px 10px; line-height: 24px; }
#nv_home #ct .cdbao-invite-link-label { color: var(--dz-fc); font-size: 12px; }
#nv_home #ct .cdbao-invite-link { min-width: 0; max-width: 100%; font-weight: 400; overflow-wrap: anywhere; }
#nv_home #ct .cdbao-invite-copy { flex: none; white-space: nowrap; font-size: 12px; }
/* Preview keeps native escaping and the live sayPreview update hook. */
#nv_home #ct .cdbao-invite-letter { margin-top: 12px; padding: 20px; background: var(--dz-bgf); }
#nv_home #ct .cdbao-invite-letter .avt img { display: block; width: 56px; height: 56px; margin: 0; padding: 0; border: 1px solid var(--dz-borderb); border-radius: 50%; object-fit: cover; }
#nv_home #ct .cdbao-invite-letter h4 { margin: 0; font-size: 14px; font-weight: 500; line-height: 24px; }
#nv_home #ct .cdbao-invite-letter h4.mtm { margin-top: 18px; }
#nv_home #ct .cdbao-invite-letter p.mtm { margin-top: 12px; color: var(--dz-fc); }
#nv_home #ct #sayPreview { box-sizing: border-box; width: 100%; min-height: 44px; margin: 6px 0 0; padding: 10px 12px; border: 1px solid var(--dz-borderb); border-radius: var(--dz-radius-s); background: var(--dz-bgc); font-size: 13px; line-height: 24px; overflow-wrap: anywhere; }
#nv_home #ct .cdbao-invite-letter-url { margin-top: 6px; padding: 8px 12px; border-radius: var(--dz-radius-s); background: var(--dz-bgc); font-size: 13px; line-height: 24px; overflow-wrap: anywhere; }
/* Menu skin is shared; this friend picker only needs its minimum width. */
#nv_home #append_parent .p_pop:is([id^="opfrd_"], [id^="interaction_"]) { min-width: 120px; }
@media (max-width: 1050px) {
    #nv_home #ct .cdbao-friend-layout { grid-template-columns: minmax(0, 1fr); }
    #nv_home #ct .cdbao-friend-layout > .cdbao-friend-tools { grid-column: 1; grid-row: 1; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
    #nv_home #ct .cdbao-friend-layout > div:not(.cdbao-friend-tools) { grid-column: 1; grid-row: 2; }
    #nv_home #ct .cdbao-friend-tools .bm { margin: 0; }
}
@media (max-width: 640px) {
    #nv_home #ct.cdbao-invite-page { grid-template-columns: minmax(0, 1fr); gap: 16px; }
    #nv_home #ct .cdbao-friend-layout > .cdbao-friend-tools { grid-template-columns: minmax(0, 1fr); }
    #nv_home #ct .tbmu > :is(.y, .z) { float: none; }
    #nv_home #ct .tfm .px { max-width: 100%; }
    #nv_home #ct li[id^="friend_tbody_"] .tfm td:first-child { width: 72px; }
    #nv_home #ct li[id^="friend_tbody_"] .avtm img { width: 52px; height: 52px; }
    #nv_home #ct.cdbao-invite-page .bm { padding: 16px; }
}
@media (max-width: 420px) {
    #nv_home #ct li[id^="friend_tbody_"] .tfm,
    #nv_home #ct li[id^="friend_tbody_"] .tfm :is(tbody, tr, td) { display: block; width: 100%; }
    #nv_home #ct li[id^="friend_tbody_"] .tfm td:first-child { width: 100%; }
}

#nv_home #ct .cdbao-invite-field { box-sizing: border-box; width: 100%; margin-right: 0; }
#nv_home .cdbao-friend-menu { width: 120px; }

/* Avatar and text are independent grid panels, without table cells. */
#nv_home #ct .cdbao-invite-profile { display:grid; grid-template-columns:88px minmax(0,1fr); gap:22px; padding:12px 0; }
#nv_home #ct .cdbao-invite-letter-layout { display:grid; grid-template-columns:56px minmax(0,1fr); gap:16px; }
#nv_home #ct :is(.cdbao-invite-avatar,.cdbao-invite-content) { min-width:0; line-height:24px; }
@media(max-width:420px) { #nv_home #ct :is(.cdbao-invite-profile,.cdbao-invite-letter-layout) { grid-template-columns:minmax(0,1fr); gap:12px; } }

/* Invitation data and purchase controls have separate structures. */
#nv_home #ct .cdbao-invite-codes { margin:16px 0; font-size:13px; line-height:24px; }
#nv_home #ct .cdbao-invite-codes > header { padding:12px 0; }
#nv_home #ct .cdbao-invite-codes > header h2 { margin-bottom:6px; font-size:15px; font-weight:500; }
#nv_home #ct .cdbao-invite-code-scroll { max-width:100%; overflow:auto; border:1px solid var(--dz-borderb); border-radius:var(--dz-radius-m); }
#nv_home #ct .cdbao-invite-code-table { width:100%; border-collapse:separate; border-spacing:0; table-layout:fixed; }
#nv_home #ct .cdbao-invite-code-table :is(th,td) { padding:10px 12px; border:0; border-bottom:1px solid var(--dz-borderb); vertical-align:top; text-align:left; overflow-wrap:anywhere; }
#nv_home #ct .cdbao-invite-code-table th { background:var(--dz-bgc); color:var(--dz-fc); font-weight:400; }
#nv_home #ct .cdbao-invite-code-table th:last-child { width:35%; }
#nv_home #ct .cdbao-invite-code-table tbody tr:last-child td { border-bottom:0; }
#nv_home #ct .cdbao-invite-purchase { padding:16px 0; }
#nv_home #ct .cdbao-invite-purchase .d { margin:6px 0 12px; color:var(--dz-fc); }
#nv_home #ct .cdbao-invite-purchase .cdbao-invite-count { box-sizing:border-box; width:100px; max-width:100%; height:36px; margin-right:8px; padding:6px 10px; border:1px solid var(--dz-borderb); border-radius:var(--dz-radius-s); background:var(--dz-bgf); }
@media(max-width:640px) { #nv_home #ct .cdbao-invite-code-table :is(th,td) { padding:8px; } }