/* Build 0160 — Members & Profile Runtime Modernization. */

body.tg-member-profile-page main,
body.tg-members-page main,
body.tg-profile-editor-page main {
    color: var(--tg007-text);
}

.tg-member-hero-title {
    max-width: 720px;
    margin: 0;
    color: #59656c;
    font-size: clamp(.96rem, 1.5vw, 1.08rem);
    line-height: 1.65;
}

.tg-member-hero-identity {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 1rem;
    width: 100%;
}

.tg-member-hero-avatar {
    flex: 0 0 auto;
    width: 78px;
    height: 78px;
    border: 3px solid rgba(255,255,255,.82);
    border-radius: 50%;
    object-fit: cover;
    background: #eff3f5;
    box-shadow: 0 8px 22px rgba(7,22,37,.25);
}

.tg-member-hero-identity-copy {
    min-width: 0;
    text-align: left;
}

.tg-member-staff-badge,
.tg-member-card-badge {
    display: inline-flex;
    align-items: center;
    width: max-content;
    border-radius: 999px;
    font-family: "Space Grotesk", "Inter", sans-serif;
    font-weight: 700;
    letter-spacing: .07em;
    text-transform: uppercase;
}

.tg-member-staff-badge {
    margin-top: .45rem;
    padding: .24rem .58rem;
    border: 1px solid rgba(255,255,255,.42);
    color: #fff;
    font-size: .66rem;
}

.tg-member-shell,
.tg-members-shell,
.tg-profile-editor-shell {
    width: min(100% - 2rem, var(--tg007-content-width));
    margin-inline: auto;
    padding: 1.7rem 0 2.8rem;
}

.tg-member-layout,
.tg-profile-editor-layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(270px, 340px);
    gap: 1.25rem;
    align-items: start;
}

.tg-member-main,
.tg-member-details,
.tg-members-toolbar,
.tg-member-card,
.tg-profile-form,
.tg-profile-avatar-panel,
.tg-profile-privacy-panel,
.tg-members-empty,
.tg-members-notice {
    border: 1px solid var(--tg007-line);
    border-radius: var(--tg007-radius);
    background: rgba(255,255,255,.96);
    box-shadow: var(--tg007-card-shadow);
}

.tg-member-main {
    min-width: 0;
    padding: clamp(1.15rem, 2.5vw, 1.7rem);
}

.tg-member-section {
    padding: .2rem 0 1.35rem;
}

.tg-member-section + .tg-member-section {
    padding-top: 1.35rem;
    border-top: 1px solid var(--tg007-line);
}

.tg-member-section-heading,
.tg-member-details-heading,
.tg-profile-panel-heading {
    margin-bottom: 1rem;
}

.tg-member-section-heading > span,
.tg-member-details-heading > span,
.tg-member-empty > span,
.tg-profile-panel-heading > span,
.tg-profile-privacy-panel > span {
    display: block;
    margin-bottom: .28rem;
    color: var(--tg007-blue);
    font-family: "Space Grotesk", "Inter", sans-serif;
    font-size: .7rem;
    font-weight: 700;
    letter-spacing: .1em;
    text-transform: uppercase;
}

.tg-member-section-heading h2,
.tg-member-details-heading h2,
.tg-member-empty h2,
.tg-profile-panel-heading h2,
.tg-profile-privacy-panel h2 {
    margin: 0;
    color: var(--tg007-text);
    font-family: "Space Grotesk", "Inter", sans-serif;
    font-size: clamp(1.18rem, 2vw, 1.5rem);
    font-weight: 650;
    letter-spacing: -.02em;
}

.tg-member-rich {
    color: #3d474e;
    font-size: .95rem;
    line-height: 1.72;
    overflow-wrap: anywhere;
}

.tg-member-rich > :first-child { margin-top: 0; }
.tg-member-rich > :last-child { margin-bottom: 0; }
.tg-member-rich img,
.tg-member-rich .tgf-post-image { max-width: 100%; height: auto; }
.tg-member-rich table { display: block; max-width: 100%; overflow-x: auto; }
.tg-member-rich pre { max-width: 100%; padding: 1rem; overflow-x: auto; border: 1px solid var(--tg007-line); border-radius: var(--tg007-radius-sm); background: #eef2f5; }
.tg-member-rich a { color: var(--tg007-blue-dark); text-decoration: none; font-weight: 650; }
.tg-member-rich a:hover,
.tg-member-rich a:focus-visible { text-decoration: underline; text-underline-offset: 3px; }

.tg-member-signature {
    padding: .9rem 1rem;
    border-left: 3px solid var(--tg007-blue);
    border-radius: 0 var(--tg007-radius-sm) var(--tg007-radius-sm) 0;
    background: #f3f7fa;
}

.tg-member-details {
    position: sticky;
    top: 1rem;
    min-width: 0;
    padding: 1.1rem;
}

.tg-member-details-heading {
    padding-bottom: .85rem;
    border-bottom: 1px solid var(--tg007-line);
}

.tg-member-facts { margin: 0; }
.tg-member-facts > div {
    display: grid;
    grid-template-columns: minmax(86px, .72fr) minmax(0, 1.28fr);
    gap: .75rem;
    padding: .72rem 0;
    border-bottom: 1px solid #e7edf1;
}
.tg-member-facts dt,
.tg-member-facts dd { margin: 0; }
.tg-member-facts dt { color: var(--tg007-muted); font-size: .7rem; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; }
.tg-member-facts dd { min-width: 0; color: #2e3941; font-size: .84rem; font-weight: 550; overflow-wrap: anywhere; }
.tg-member-facts a { color: var(--tg007-blue-dark); text-decoration: none; font-weight: 700; }

.tg-member-details-actions {
    display: grid;
    gap: .55rem;
    margin-top: 1rem;
}
.tg-member-details-actions .tg-btn { width: 100%; justify-content: center; }

.tg-member-signin-note {
    margin-top: 1rem;
    padding: .85rem;
    border-radius: var(--tg007-radius-sm);
    background: var(--tg007-surface-soft);
}
.tg-member-signin-note p { margin: 0 0 .35rem; color: var(--tg007-muted); font-size: .82rem; }
.tg-member-signin-note a { color: var(--tg007-blue-dark); text-decoration: none; font-weight: 700; }

.tg-member-empty,
.tg-members-empty {
    padding: 1.35rem;
}
.tg-member-empty p,
.tg-members-empty p { margin: .55rem 0 0; color: var(--tg007-muted); line-height: 1.65; }

/* Directory */
.tg-members-toolbar { margin-bottom: 1rem; padding: 1rem; }
.tg-members-search {
    display: grid;
    grid-template-columns: minmax(220px, 1fr) minmax(170px, 220px) auto auto;
    gap: .75rem;
    align-items: end;
}
.tg-members-search label,
.tg-profile-field label,
.tg-profile-upload-label {
    display: block;
    margin-bottom: .38rem;
    color: #34434d;
    font-size: .78rem;
    font-weight: 700;
}
.tg-members-search input,
.tg-members-search select,
.tg-profile-field input,
.tg-profile-field textarea,
.tg-profile-avatar-panel input[type="file"] {
    width: 100%;
    border: 1px solid #cbd6de;
    border-radius: .7rem;
    background: #fff;
    color: var(--tg007-text);
    font: inherit;
}
.tg-members-search input,
.tg-members-search select,
.tg-profile-field input { min-height: 44px; padding: .62rem .72rem; }
.tg-members-search input:focus,
.tg-members-search select:focus,
.tg-profile-field input:focus,
.tg-profile-field textarea:focus,
.tg-profile-avatar-panel input[type="file"]:focus {
    outline: 3px solid rgba(61,126,173,.16);
    border-color: var(--tg007-blue);
}

.tg-members-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: .85rem;
}
.tg-member-card {
    display: grid;
    grid-template-columns: 64px minmax(0, 1fr);
    grid-template-areas: "avatar copy" "open open";
    gap: .8rem 1rem;
    min-width: 0;
    padding: 1rem;
}
.tg-member-card-avatar { grid-area: avatar; width: 64px; height: 64px; border-radius: 50%; overflow: hidden; background: #edf2f5; }
.tg-member-card-avatar img { width: 100%; height: 100%; object-fit: cover; }
.tg-member-card-copy { grid-area: copy; min-width: 0; }
.tg-member-card-heading { display: flex; align-items: center; flex-wrap: wrap; gap: .45rem; }
.tg-member-card-heading > a { min-width: 0; color: #1f2b34; font-family: "Space Grotesk", "Inter", sans-serif; font-size: 1.02rem; font-weight: 700; text-decoration: none; overflow-wrap: anywhere; }
.tg-member-card-heading > a:hover,
.tg-member-card-heading > a:focus-visible { color: var(--tg007-blue-dark); }
.tg-member-card-badge { padding: .16rem .42rem; background: #e8f2f8; color: var(--tg007-blue-dark); font-size: .58rem; }
.tg-member-card-copy > p { margin: .28rem 0 .5rem; color: #596872; font-size: .82rem; line-height: 1.45; }
.tg-member-card-meta { display: grid; gap: .18rem; color: #7a8790; font-size: .72rem; }
.tg-member-card-open { grid-area: open; display: flex; justify-content: space-between; align-items: center; padding-top: .68rem; border-top: 1px solid #e6edf1; color: var(--tg007-blue-dark); font-size: .78rem; font-weight: 700; text-decoration: none; }

.tg-members-pagination {
    display: grid;
    grid-template-columns: minmax(100px, 1fr) auto minmax(100px, 1fr);
    align-items: center;
    gap: 1rem;
    margin-top: 1rem;
    padding: .85rem 1rem;
    border: 1px solid var(--tg007-line);
    border-radius: var(--tg007-radius);
    background: rgba(255,255,255,.96);
}
.tg-pagination-pages { display: flex; gap: .35rem; align-items: center; justify-content: center; }
.tg-pagination-pages a,
.tg-pagination-pages span,
.tg-pagination-edge { min-width: 34px; min-height: 34px; display: inline-flex; align-items: center; justify-content: center; border-radius: .55rem; text-decoration: none; font-size: .78rem; font-weight: 700; }
.tg-pagination-pages a,
.tg-pagination-edge { color: var(--tg007-blue-dark); }
.tg-pagination-pages a:hover,
.tg-pagination-edge:hover { background: #edf4f8; }
.tg-pagination-pages .is-current { background: var(--tg007-blue-dark); color: #fff; }
.tg-members-pagination > :last-child { justify-self: end; }

.tg-members-notice { margin-bottom: 1rem; padding: .9rem 1rem; }
.tg-members-notice strong { display: block; margin-bottom: .16rem; font-family: "Space Grotesk", "Inter", sans-serif; }
.tg-members-notice p { margin: 0; color: #56646e; font-size: .86rem; }
.tg-members-notice.is-success { border-color: #b7d6c0; background: #f2faf4; }
.tg-members-notice.is-error { border-color: #dfc4c4; background: #fff6f6; }

/* Self-service profile editor */
.tg-profile-editor-main { min-width: 0; }
.tg-profile-form,
.tg-profile-avatar-panel,
.tg-profile-privacy-panel { padding: 1.15rem; }
.tg-profile-panel-heading > p { margin: .45rem 0 0; color: var(--tg007-muted); font-size: .84rem; line-height: 1.55; }
.tg-profile-field-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .9rem; }
.tg-profile-field-wide { grid-column: 1 / -1; }
.tg-profile-field label span { color: #87939b; font-weight: 500; }
.tg-profile-field textarea { min-height: 112px; padding: .7rem .75rem; resize: vertical; line-height: 1.55; }
.tg-profile-field small { display: block; margin-top: .32rem; color: #78858e; font-size: .72rem; }
.tg-profile-form-actions { display: flex; justify-content: flex-end; margin-top: 1rem; padding-top: 1rem; border-top: 1px solid var(--tg007-line); }
.tg-profile-editor-side { display: grid; gap: 1rem; position: sticky; top: 1rem; }
.tg-profile-avatar-preview { display: block; width: 132px; height: 132px; margin: 0 auto 1rem; border: 4px solid #fff; border-radius: 50%; object-fit: cover; background: #edf2f5; box-shadow: 0 8px 24px rgba(31,49,61,.16); }
.tg-profile-avatar-panel form { display: grid; gap: .65rem; padding-top: .85rem; border-top: 1px solid var(--tg007-line); }
.tg-profile-avatar-panel form + form { margin-top: .75rem; }
.tg-profile-avatar-panel input[type="file"] { padding: .48rem; font-size: .8rem; }
.tg-profile-avatar-panel p,
.tg-profile-privacy-panel p { margin: 0; color: var(--tg007-muted); font-size: .78rem; line-height: 1.55; }
.tg-profile-avatar-panel .tg-btn { width: 100%; justify-content: center; }

@media (max-width: 1040px) {
    .tg-members-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 820px) {
    .tg-member-layout,
    .tg-profile-editor-layout { grid-template-columns: 1fr; }
    .tg-member-details,
    .tg-profile-editor-side { position: static; }
    .tg-members-search { grid-template-columns: 1fr 1fr; }
    .tg-members-search .tg-btn { justify-content: center; }
}

@media (max-width: 620px) {
    .tg-member-shell,
    .tg-members-shell,
    .tg-profile-editor-shell { width: min(100% - 1rem, var(--tg007-content-width)); padding-top: 1rem; }
    .tg-member-hero-identity { justify-content: flex-start; }
    .tg-member-hero-avatar { width: 66px; height: 66px; }
    .tg-members-grid { grid-template-columns: 1fr; }
    .tg-members-search { grid-template-columns: 1fr; }
    .tg-profile-field-grid { grid-template-columns: 1fr; }
    .tg-profile-field-wide { grid-column: auto; }
    .tg-members-pagination { grid-template-columns: 1fr; justify-items: stretch; }
    .tg-members-pagination > :first-child,
    .tg-members-pagination > :last-child { justify-self: stretch; }
    .tg-pagination-edge { width: 100%; }
    .tg-pagination-pages { flex-wrap: wrap; }
}

/* Build 0168 — modern BBCode signature editing. */
.tg-profile-signature-label-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .65rem;
}

.tg-profile-signature-label-row > span {
    color: #2b7698;
    font-size: .68rem;
    font-weight: 800;
    letter-spacing: .04em;
    text-transform: uppercase;
}

.tg-profile-bbcode-toolbar {
    display: flex;
    flex-wrap: wrap;
    gap: .3rem;
    margin: .2rem 0 .45rem;
    padding: .42rem;
    border: 1px solid #d7e2e7;
    border-radius: .62rem .62rem 0 0;
    background: #f6f9fa;
}

.tg-profile-bbcode-toolbar button {
    min-width: 34px;
    min-height: 32px;
    padding: .3rem .55rem;
    border: 1px solid #cbd9df;
    border-radius: .42rem;
    background: #fff;
    color: #385665;
    font: inherit;
    font-size: .72rem;
    font-weight: 700;
    cursor: pointer;
}

.tg-profile-bbcode-toolbar button:hover,
.tg-profile-bbcode-toolbar button:focus-visible {
    border-color: #72a9c0;
    background: #eef7fb;
    color: #175f81;
    outline: none;
}

.tg-profile-signature-editor textarea {
    border-top-left-radius: 0 !important;
    border-top-right-radius: 0 !important;
    font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, "Liberation Mono", monospace;
    line-height: 1.55;
}

.tg-profile-signature-help {
    margin-top: .45rem;
    color: #6c7d86;
    font-size: .69rem;
    line-height: 1.5;
}

.tg-profile-signature-help code {
    display: inline-block;
    margin: .08rem .04rem;
    padding: .05rem .24rem;
    border-radius: .25rem;
    background: #edf3f5;
    color: #3b5968;
    font-size: .66rem;
}

/* Build 0178 — Profile, Privacy & Account Settings Completion. */
.tg-profile-private-form { margin-top: 1rem; }

.tg-profile-field select,
.tg-profile-birthday-grid select {
    width: 100%;
    min-height: 44px;
    padding: .62rem .72rem;
    border: 1px solid #cbd6de;
    border-radius: .7rem;
    background: #fff;
    color: var(--tg007-text);
    font: inherit;
}

.tg-profile-field select:focus,
.tg-profile-birthday-grid select:focus {
    outline: 3px solid rgba(61,126,173,.16);
    border-color: var(--tg007-blue);
}

.tg-profile-birthday-grid {
    display: grid;
    grid-template-columns: 1.35fr .8fr 1fr;
    gap: .65rem;
}

.tg-profile-birthday-grid label { margin: 0; }
.tg-profile-birthday-grid label > span {
    display: block;
    margin-bottom: .32rem;
    color: #78858e;
    font-size: .7rem;
    font-weight: 650;
}

.tg-profile-cover-preview {
    display: block;
    width: 100%;
    aspect-ratio: 16 / 5;
    margin: 0 0 1rem;
    border: 1px solid #d8e1e6;
    border-radius: .75rem;
    object-fit: cover;
    background: #edf2f5;
}

.tg-profile-cover-preview.is-empty {
    display: grid;
    place-items: center;
    min-height: 88px;
    color: #7b8992;
    font-size: .78rem;
    font-weight: 700;
}

.tg-member-cover-wrap {
    width: min(100% - 2rem, var(--tg007-content-width));
    margin: 1.4rem auto -0.5rem;
}

.tg-member-cover {
    display: block;
    width: 100%;
    aspect-ratio: 16 / 5;
    max-height: 330px;
    border: 1px solid var(--tg007-line);
    border-radius: var(--tg007-radius);
    object-fit: cover;
    background: #edf2f5;
    box-shadow: var(--tg007-card-shadow);
}

.tg-profile-confirm-dialog {
    width: min(92vw, 470px);
    padding: 0;
    border: 1px solid var(--tg007-line);
    border-radius: var(--tg007-radius);
    background: #fff;
    color: var(--tg007-text);
    box-shadow: 0 24px 70px rgba(8, 24, 38, .28);
}

.tg-profile-confirm-dialog::backdrop { background: rgba(8, 24, 38, .54); }
.tg-profile-confirm-dialog form { padding: 1.2rem; }
.tg-profile-confirm-dialog h2 { margin: 0 0 .55rem; font-family: "Space Grotesk", "Inter", sans-serif; font-size: 1.2rem; }
.tg-profile-confirm-dialog p { margin: 0; color: var(--tg007-muted); line-height: 1.55; }
.tg-profile-confirm-actions { display: flex; justify-content: flex-end; gap: .55rem; margin-top: 1.1rem; }

@media (max-width: 620px) {
    .tg-profile-birthday-grid { grid-template-columns: 1fr; }
    .tg-member-cover-wrap { width: min(100% - 1rem, var(--tg007-content-width)); margin-top: 1rem; }
}

/* Build 0178 Completion Fix 2 — modern Edit Profile image management. */
.tg-profile-media-manager {
    grid-column: 1 / -1;
    min-width: 0;
    padding: clamp(1rem, 2.2vw, 1.35rem);
    border: 1px solid var(--tg007-line);
    border-radius: var(--tg007-radius);
    background: rgba(255,255,255,.96);
    box-shadow: var(--tg007-card-shadow);
}

.tg-profile-media-heading {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
}

.tg-profile-media-heading .tg-profile-panel-heading {
    margin-bottom: 1rem;
}

.tg-profile-media-view {
    flex: 0 0 auto;
}

.tg-profile-media-stage {
    overflow: hidden;
    margin-bottom: 1.1rem;
    border: 1px solid #d5e0e6;
    border-radius: 1rem;
    background: #fff;
}

.tg-profile-media-cover-frame {
    position: relative;
    min-height: 180px;
    aspect-ratio: 16 / 5;
    overflow: hidden;
    background: #eaf1f5;
}

.tg-profile-media-stage .tg-profile-cover-preview {
    width: 100%;
    height: 100%;
    min-height: 180px;
    margin: 0;
    border: 0;
    border-radius: 0;
    object-fit: cover;
    aspect-ratio: auto;
}

.tg-profile-media-stage .tg-profile-cover-preview.is-empty {
    display: grid;
    min-height: 180px;
    place-items: center;
    color: #71838e;
    background: #eaf1f5;
    font-size: .76rem;
    font-weight: 800;
    letter-spacing: .06em;
    text-transform: uppercase;
}

.tg-profile-media-stage-footer {
    display: flex;
    align-items: flex-end;
    gap: 1rem;
    min-height: 72px;
    padding: 0 1rem 1rem;
}

.tg-profile-media-stage .tg-profile-avatar-preview {
    flex: 0 0 auto;
    width: 112px;
    height: 112px;
    margin: -52px 0 0;
    border: 5px solid #fff;
    border-radius: 50%;
    object-fit: cover;
    background: #edf2f5;
    box-shadow: 0 10px 26px rgba(31,49,61,.18);
}

.tg-profile-media-stage-copy {
    display: grid;
    min-width: 0;
    gap: .12rem;
    padding-bottom: .15rem;
}

.tg-profile-media-stage-copy strong {
    color: #1f2b34;
    font-family: "Space Grotesk", "Inter", sans-serif;
    font-size: 1.02rem;
    overflow-wrap: anywhere;
}

.tg-profile-media-stage-copy span {
    color: #75848d;
    font-size: .73rem;
}

.tg-profile-media-controls {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1rem;
}

.tg-profile-media-control {
    min-width: 0;
    padding: 1rem;
    border: 1px solid #dce5e9;
    border-radius: .9rem;
    background: #fbfcfd;
}

.tg-profile-media-control-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: .75rem;
    margin-bottom: .45rem;
}

.tg-profile-media-kicker {
    display: block;
    margin-bottom: .16rem;
    color: #2b7698;
    font-size: .65rem;
    font-weight: 800;
    letter-spacing: .06em;
    text-transform: uppercase;
}

.tg-profile-media-control h3 {
    margin: 0;
    color: #24323b;
    font-family: "Space Grotesk", "Inter", sans-serif;
    font-size: 1rem;
}

.tg-profile-media-status {
    flex: 0 0 auto;
    padding: .24rem .5rem;
    border: 1px solid #d5dfe4;
    border-radius: 999px;
    background: #f3f6f8;
    color: #64747e;
    font-size: .62rem;
    font-weight: 800;
    white-space: nowrap;
}

.tg-profile-media-status.is-active {
    border-color: #b8d7c4;
    background: #eef8f1;
    color: #316d48;
}

.tg-profile-media-copy,
.tg-profile-media-help {
    color: var(--tg007-muted);
    line-height: 1.5;
}

.tg-profile-media-copy {
    margin: 0 0 .8rem;
    font-size: .78rem;
}

.tg-profile-media-upload-form {
    display: grid;
    gap: .62rem;
}

.tg-profile-media-file-input {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

.tg-profile-media-dropzone {
    display: grid;
    grid-template-columns: 38px minmax(0, 1fr);
    grid-template-areas:
        "icon copy"
        "icon name";
    align-items: center;
    gap: .15rem .7rem;
    min-height: 82px;
    padding: .75rem;
    border: 1px dashed #aebfc8;
    border-radius: .75rem;
    background: #fff;
    cursor: pointer;
    transition: border-color .15s ease, background .15s ease, box-shadow .15s ease;
}

.tg-profile-media-dropzone:hover,
.tg-profile-media-dropzone:focus-visible,
.tg-profile-media-dropzone.is-dragover {
    border-color: var(--tg007-blue);
    background: #f4f9fc;
    box-shadow: 0 0 0 3px rgba(61,126,173,.12);
    outline: none;
}

.tg-profile-media-dropzone.has-file {
    border-style: solid;
    border-color: #9bc2d3;
    background: #f5fafc;
}

.tg-profile-media-dropzone.is-error {
    border-color: #c98888;
    background: #fff7f7;
}

.tg-profile-media-upload-icon {
    grid-area: icon;
    display: grid;
    width: 38px;
    height: 38px;
    place-items: center;
    border-radius: .65rem;
    background: #eaf3f7;
    color: #246e91;
}

.tg-profile-media-upload-icon svg {
    width: 21px;
    height: 21px;
    fill: currentColor;
}

.tg-profile-media-drop-copy {
    grid-area: copy;
    min-width: 0;
}

.tg-profile-media-drop-copy strong,
.tg-profile-media-drop-copy small {
    display: block;
}

.tg-profile-media-drop-copy strong {
    color: #2a3942;
    font-size: .78rem;
}

.tg-profile-media-drop-copy small {
    margin-top: .1rem;
    color: #7b8992;
    font-size: .68rem;
}

.tg-profile-media-file-name {
    grid-area: name;
    min-width: 0;
    color: #6a7c86;
    font-size: .68rem;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.tg-profile-media-help {
    margin: 0;
    font-size: .69rem;
}

.tg-profile-media-actions {
    display: flex;
    justify-content: flex-end;
    padding-top: .1rem;
}

.tg-profile-media-remove-form {
    display: flex;
    justify-content: flex-end;
    margin-top: .65rem;
    padding-top: .65rem;
    border-top: 1px solid #e2e9ed;
}

.tg-profile-media-remove-form .tg-btn {
    min-height: 36px;
}

@media (max-width: 820px) {
    .tg-profile-media-controls {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 620px) {
    .tg-profile-media-heading {
        display: block;
    }

    .tg-profile-media-view {
        width: 100%;
        justify-content: center;
        margin-bottom: 1rem;
    }

    .tg-profile-media-cover-frame,
    .tg-profile-media-stage .tg-profile-cover-preview,
    .tg-profile-media-stage .tg-profile-cover-preview.is-empty {
        min-height: 132px;
    }

    .tg-profile-media-stage-footer {
        gap: .75rem;
        padding-inline: .75rem;
    }

    .tg-profile-media-stage .tg-profile-avatar-preview {
        width: 90px;
        height: 90px;
        margin-top: -42px;
        border-width: 4px;
    }

    .tg-profile-media-control-head {
        align-items: center;
    }

    .tg-profile-media-dropzone {
        grid-template-columns: 34px minmax(0, 1fr);
        min-height: 76px;
        padding: .65rem;
    }

    .tg-profile-media-upload-icon {
        width: 34px;
        height: 34px;
    }

    .tg-profile-media-actions .tg-btn,
    .tg-profile-media-remove-form .tg-btn {
        width: 100%;
        justify-content: center;
    }
}

/* Build 0178 Completion Fix 3 — Edit/Profile layout modernization. */
.tg-profile-editor-layout {
    grid-template-columns: minmax(0, 1fr);
}

.tg-profile-editor-main {
    display: grid;
    min-width: 0;
    gap: 1rem;
}

.tg-profile-editor-main .tg-profile-private-form {
    margin-top: 0;
}

.tg-profile-privacy-strip {
    display: grid;
    grid-template-columns: minmax(180px, 240px) minmax(0, 1fr);
    align-items: center;
    gap: 1rem 1.5rem;
    padding: .9rem 1.15rem;
    border-left: 4px solid var(--tg007-blue);
}

.tg-profile-privacy-strip > div {
    min-width: 0;
}

.tg-profile-privacy-strip > span,
.tg-profile-privacy-strip > div > span {
    margin-bottom: .18rem;
}

.tg-profile-privacy-strip h2 {
    font-size: 1rem;
}

.tg-profile-privacy-strip p {
    max-width: none;
    font-size: .8rem;
}

.tg-member-profile-banner {
    width: min(100% - 2rem, var(--tg007-content-width));
    margin: 1.5rem auto 0;
    border: 1px solid var(--tg007-line);
    border-radius: var(--tg007-radius);
    background: rgba(255,255,255,.97);
    box-shadow: var(--tg007-card-shadow);
}

.tg-member-profile-cover-stage {
    position: relative;
    aspect-ratio: 16 / 5;
    min-height: 230px;
    background: #dfe9ee;
}

.tg-member-profile-cover-image,
.tg-member-profile-cover-placeholder {
    display: block;
    width: 100%;
    height: 100%;
    border-radius: var(--tg007-radius) var(--tg007-radius) 0 0;
}

.tg-member-profile-cover-image {
    object-fit: cover;
}

.tg-member-profile-cover-placeholder {
    background:
        radial-gradient(circle at 72% 34%, rgba(255,255,255,.42), transparent 28%),
        linear-gradient(135deg, #d9e6ec 0%, #edf3f6 48%, #dbe8ee 100%);
}

.tg-member-profile-avatar-wrap {
    position: absolute;
    left: 1.5rem;
    bottom: -62px;
    z-index: 2;
    width: 148px;
    height: 148px;
    padding: 5px;
    border-radius: 50%;
    background: #fff;
    box-shadow: 0 10px 28px rgba(23,42,55,.24);
}

.tg-member-profile-avatar {
    display: block;
    width: 100%;
    height: 100%;
    border-radius: 50%;
    object-fit: cover;
    background: #edf2f5;
}

.tg-member-profile-banner-body {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 1rem;
    min-height: 118px;
    padding: 1rem 1.25rem 1.15rem 12.25rem;
}

.tg-member-profile-banner-copy {
    min-width: 0;
}

.tg-member-profile-kicker {
    display: block;
    margin-bottom: .18rem;
    color: var(--tg007-blue);
    font-family: "Space Grotesk", "Inter", sans-serif;
    font-size: .67rem;
    font-weight: 800;
    letter-spacing: .09em;
    text-transform: uppercase;
}

.tg-member-profile-banner-copy h1 {
    margin: 0;
    color: var(--tg007-text);
    font-family: "Space Grotesk", "Inter", sans-serif;
    font-size: clamp(1.55rem, 3vw, 2.15rem);
    line-height: 1.05;
    letter-spacing: -.035em;
    overflow-wrap: anywhere;
}

.tg-member-profile-banner-copy p {
    margin: .42rem 0 0;
    color: var(--tg007-muted);
    font-size: .84rem;
    line-height: 1.5;
}

.tg-member-profile-staff-badge {
    display: inline-flex;
    align-items: center;
    margin-top: .5rem;
    padding: .24rem .58rem;
    border: 1px solid #bad1df;
    border-radius: 999px;
    background: #edf6fa;
    color: #2a6888;
    font-family: "Space Grotesk", "Inter", sans-serif;
    font-size: .63rem;
    font-weight: 800;
    letter-spacing: .07em;
    text-transform: uppercase;
}

.tg-member-profile-banner-actions {
    display: flex;
    flex: 0 0 auto;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: .5rem;
}

body.tg-member-profile-page .tg-member-shell {
    padding-top: 1rem;
}

@media (max-width: 900px) {
    .tg-member-profile-banner-body {
        align-items: flex-start;
        flex-direction: column;
    }

    .tg-member-profile-banner-actions {
        justify-content: flex-start;
    }
}

@media (max-width: 620px) {
    .tg-profile-privacy-strip {
        grid-template-columns: 1fr;
        gap: .4rem;
        padding: .85rem;
    }

    .tg-member-profile-banner {
        width: min(100% - 1rem, var(--tg007-content-width));
        margin-top: 1rem;
    }

    .tg-member-profile-cover-stage {
        min-height: 145px;
        aspect-ratio: 16 / 7;
    }

    .tg-member-profile-avatar-wrap {
        left: .9rem;
        bottom: -43px;
        width: 104px;
        height: 104px;
        padding: 4px;
    }

    .tg-member-profile-banner-body {
        min-height: 0;
        padding: 3.4rem .85rem .9rem;
    }

    .tg-member-profile-banner-actions {
        display: grid;
        width: 100%;
        grid-template-columns: 1fr;
    }

    .tg-member-profile-banner-actions .tg-btn {
        width: 100%;
        justify-content: center;
    }
}


/* Build 0178 Completion Fix 4 — Edit Profile cover/avatar overlap. */
.tg-profile-media-stage {
    overflow: hidden;
}

.tg-profile-media-stage-footer {
    position: relative;
    display: flex;
    align-items: center;
    min-height: 92px;
    padding: 1rem 1.25rem 1rem 10.25rem;
}

.tg-profile-media-avatar-wrap {
    position: absolute;
    z-index: 3;
    left: 1.25rem;
    top: -66px;
    width: 132px;
    height: 132px;
    border: 5px solid #fff;
    border-radius: 50%;
    background: #edf2f5;
    box-shadow: 0 12px 28px rgba(31,49,61,.2);
}

.tg-profile-media-stage .tg-profile-avatar-preview {
    width: 100%;
    height: 100%;
    margin: 0;
    border: 0;
    border-radius: 50%;
    object-fit: cover;
    background: #edf2f5;
    box-shadow: none;
}

@media (max-width: 620px) {
    .tg-profile-media-stage-footer {
        min-height: 78px;
        padding: .9rem .85rem .9rem 7.35rem;
    }

    .tg-profile-media-avatar-wrap {
        left: .85rem;
        top: -50px;
        width: 100px;
        height: 100px;
        border-width: 4px;
    }

    .tg-profile-media-stage .tg-profile-avatar-preview {
        width: 100%;
        height: 100%;
        margin: 0;
        border-width: 0;
    }
}

/* Build 0179 — Members & Directory Completion */
.tg-member-card-badge {
    padding: .2rem .48rem;
    font-size: .66rem;
    line-height: 1.2;
}

.tg-member-card-copy > p {
    font-size: .86rem;
}

.tg-member-card-meta {
    gap: .22rem;
    font-size: .76rem;
    line-height: 1.45;
}

.tg-member-card-open {
    font-size: .82rem;
}
