/* Public member profile
   Structural and dark-theme rules live here. Light-only colours stay in
   light-wc.css, alongside the rest of the site's light palette. */

.wc-public-profile {
    --profile-accent: #8bb6f1;
    --profile-accent-rgb: 139, 182, 241;
    --profile-accent-2: #567eb9;
    --profile-ink: #f6f2eb;
    --profile-muted: #a9afbf;
    --profile-surface: rgba(17, 20, 32, .88);
    --profile-surface-2: rgba(24, 28, 43, .8);
    --profile-line: rgba(255, 255, 255, .11);
    position: relative;
    z-index: 3;
    margin-top: -64px;
    padding-bottom: 72px;
    color: var(--profile-ink);
}

.wc-public-profile--gryffindor {
    --profile-accent: #efb453;
    --profile-accent-rgb: 239, 180, 83;
    --profile-accent-2: #9d2c2c;
}

.wc-public-profile--hufflepuff {
    --profile-accent: #f2cc5d;
    --profile-accent-rgb: 242, 204, 93;
    --profile-accent-2: #9b7922;
}

.wc-public-profile--ravenclaw {
    --profile-accent: #7fc8f6;
    --profile-accent-rgb: 127, 200, 246;
    --profile-accent-2: #326ca8;
}

.wc-public-profile--slytherin {
    --profile-accent: #89d7a2;
    --profile-accent-rgb: 137, 215, 162;
    --profile-accent-2: #2d7751;
}

.wc-public-profile-identity {
    position: relative;
    isolation: isolate;
    display: grid;
    grid-template-columns: 136px minmax(0, 1fr) 108px;
    align-items: center;
    gap: 26px;
    min-height: 220px;
    padding: 30px 34px;
    overflow: hidden;
    border: 1px solid color-mix(in srgb, var(--profile-accent) 34%, var(--profile-line));
    border-radius: 26px;
    background:
        radial-gradient(circle at 88% 12%, rgba(var(--profile-accent-rgb), .18), transparent 34%),
        linear-gradient(135deg, rgba(var(--profile-accent-rgb), .08), transparent 46%),
        var(--profile-surface);
    box-shadow: 0 28px 70px -42px rgba(0, 0, 0, .96),
                inset 0 1px 0 rgba(255, 255, 255, .06);
    -webkit-backdrop-filter: blur(22px) saturate(135%);
    backdrop-filter: blur(22px) saturate(135%);
}

.wc-public-profile-identity::after {
    content: '';
    position: absolute;
    z-index: -1;
    inset: auto -8% -65% auto;
    width: 420px;
    height: 300px;
    border-radius: 50%;
    background: rgba(var(--profile-accent-rgb), .1);
    filter: blur(70px);
    pointer-events: none;
}

.wc-public-profile-avatar {
    display: grid;
    place-items: center;
    width: 136px;
    height: 136px;
    padding: 5px;
    border: 1px solid rgba(var(--profile-accent-rgb), .62);
    border-radius: 50%;
    background: linear-gradient(145deg, rgba(var(--profile-accent-rgb), .3), rgba(255, 255, 255, .035));
    box-shadow: 0 18px 38px -24px rgba(var(--profile-accent-rgb), .75),
                inset 0 1px 0 rgba(255, 255, 255, .12);
}

.wc-public-profile-avatar img,
.wc-public-profile-avatar #user_avatar_profile,
.wc-public-profile-avatar > span {
    display: grid;
    place-items: center;
    float: none;
    width: 100%;
    height: 100%;
    max-width: none;
    margin: 0;
    border: 0;
    border-radius: 50%;
    object-fit: cover;
}

.wc-public-profile-avatar > span {
    background: linear-gradient(145deg, var(--profile-accent-2), rgba(var(--profile-accent-rgb), .28));
    color: #fff;
    font-size: 3rem;
    font-weight: 800;
}

.wc-public-profile-copy { min-width: 0; }

.wc-public-profile-eyebrow {
    display: flex;
    align-items: center;
    gap: 7px;
    margin: 0 0 5px;
    color: var(--profile-accent);
    font-size: .74rem;
    font-weight: 700;
}

.wc-public-profile-copy h1 {
    margin: 0;
    color: var(--profile-ink);
    font-size: clamp(1.85rem, 4vw, 2.65rem);
    line-height: 1.35;
    letter-spacing: -.035em;
}

.wc-public-profile-badges {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 7px;
    margin-top: 9px;
}

.wc-public-profile-badges > span {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 4px 10px;
    border: 1px solid var(--profile-line);
    border-radius: 999px;
    background: rgba(255, 255, 255, .045);
    color: var(--profile-muted);
    font-size: .7rem;
    line-height: 1.6;
}

.wc-public-profile-badges i { color: var(--profile-accent); }
.wc-public-profile-handle { direction: ltr; unicode-bidi: isolate; }

.wc-public-profile-bio {
    max-width: 710px;
    margin: 15px 0 0;
    color: #d8d9df;
    font-size: .88rem;
    line-height: 2;
}

.wc-public-profile-bio.is-empty { color: var(--profile-muted); }

.wc-public-profile-actions {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 9px;
    margin-top: 17px;
}

.wc-public-profile-action,
.wc-public-profile .wc-profile-owl .wc-room-owl-link {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    min-height: 40px;
    margin: 0;
    padding: 9px 16px;
    border: 1px solid var(--profile-line);
    border-radius: 12px;
    background: rgba(255, 255, 255, .055);
    color: var(--profile-ink);
    font-family: inherit;
    font-size: .78rem;
    line-height: 1.2;
    text-decoration: none;
    box-shadow: none;
    transition: transform .2s, border-color .2s, background .2s, color .2s;
}

.wc-public-profile-action.is-primary,
.wc-public-profile .wc-profile-owl .wc-room-owl-link {
    border-color: transparent;
    background: linear-gradient(135deg, var(--profile-accent), var(--profile-accent-2));
    color: #10141c;
    font-weight: 700;
}

.wc-public-profile-action:hover,
.wc-public-profile-action:focus-visible,
.wc-public-profile .wc-profile-owl .wc-room-owl-link:hover,
.wc-public-profile .wc-profile-owl .wc-room-owl-link:focus-visible {
    border-color: rgba(var(--profile-accent-rgb), .48);
    background-color: rgba(var(--profile-accent-rgb), .12);
    color: var(--profile-ink);
    transform: translateY(-2px);
}

.wc-public-profile-action.is-primary:hover,
.wc-public-profile-action.is-primary:focus-visible,
.wc-public-profile .wc-profile-owl .wc-room-owl-link:hover,
.wc-public-profile .wc-profile-owl .wc-room-owl-link:focus-visible {
    background: linear-gradient(135deg, var(--profile-accent), var(--profile-accent-2));
    color: #10141c;
    filter: brightness(1.08);
}

.wc-public-profile .wc-profile-owl {
    display: inline-flex;
    margin: 0;
    text-align: initial;
    line-height: inherit;
}

.wc-public-profile-crest {
    display: grid;
    place-items: center;
    align-self: start;
    width: 108px;
    height: 108px;
    padding: 9px;
    border: 1px solid rgba(var(--profile-accent-rgb), .28);
    border-radius: 24px;
    background: rgba(0, 0, 0, .16);
    opacity: .9;
    transition: transform .22s, opacity .22s, border-color .22s;
}

.wc-public-profile-crest:hover,
.wc-public-profile-crest:focus-visible {
    border-color: rgba(var(--profile-accent-rgb), .58);
    opacity: 1;
    transform: translateY(-3px) rotate(-1deg);
}

.wc-public-profile-crest img {
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.wc-public-profile-facts {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 10px;
    margin: 14px 0 34px;
}

.wc-public-profile-facts > div {
    display: grid;
    grid-template-columns: 38px minmax(0, 1fr);
    grid-template-rows: auto auto;
    column-gap: 11px;
    align-items: center;
    min-width: 0;
    padding: 13px 15px;
    border: 1px solid var(--profile-line);
    border-radius: 16px;
    background: var(--profile-surface-2);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .035);
    -webkit-backdrop-filter: blur(16px);
    backdrop-filter: blur(16px);
}

.wc-public-profile-facts i {
    grid-row: 1 / 3;
    display: grid;
    place-items: center;
    width: 38px;
    height: 38px;
    border-radius: 12px;
    background: rgba(var(--profile-accent-rgb), .12);
    color: var(--profile-accent);
}

.wc-public-profile-facts span {
    color: var(--profile-muted);
    font-size: .66rem;
}

.wc-public-profile-facts strong {
    min-width: 0;
    color: var(--profile-ink);
    font-size: .84rem;
    overflow-wrap: anywhere;
}

.wc-public-profile-content { margin: 0; }

.wc-public-profile-section {
    margin-top: 34px;
    scroll-margin-top: 92px;
}

.wc-public-profile-section + .wc-public-profile-section { margin-top: 42px; }

.wc-public-profile-section-head {
    display: flex;
    align-items: center;
    gap: 12px;
    margin: 0 0 14px;
}

.wc-public-profile-section-head > span {
    display: grid;
    place-items: center;
    width: 44px;
    height: 44px;
    flex: 0 0 44px;
    border: 1px solid rgba(var(--profile-accent-rgb), .3);
    border-radius: 14px;
    background: rgba(var(--profile-accent-rgb), .1);
    color: var(--profile-accent);
}

.wc-public-profile-section-head.is-patronus > span {
    border-color: rgba(132, 217, 255, .28);
    background: rgba(132, 217, 255, .09);
    color: #84d9ff;
}

.wc-public-profile-section-head.is-topics > span {
    border-color: rgba(var(--profile-accent-rgb), .34);
    background: rgba(var(--profile-accent-rgb), .12);
    color: var(--profile-accent);
}

.wc-public-profile-section-head > small {
    margin-inline-start: auto;
    padding: 5px 10px;
    border: 1px solid var(--profile-line);
    border-radius: 999px;
    color: var(--profile-muted);
    font-size: .65rem;
    font-weight: 600;
    line-height: 1.5;
}

.wc-public-profile-section-head p {
    margin: 0 0 1px;
    color: var(--profile-muted);
    font-size: .68rem;
}

.wc-public-profile-section-head h2 {
    margin: 0;
    color: var(--profile-ink);
    font-size: 1.18rem;
    line-height: 1.45;
}

.wc-public-profile-topics {
    margin-top: 0;
    padding: 15px;
    border: 1px solid var(--profile-line);
    border-radius: 22px;
    background: var(--profile-surface);
    box-shadow: 0 24px 60px -46px rgba(0, 0, 0, .92),
                inset 0 1px 0 rgba(255, 255, 255, .045);
    -webkit-backdrop-filter: blur(18px) saturate(125%);
    backdrop-filter: blur(18px) saturate(125%);
}

.wc-public-profile-topics .wc-public-profile-section-head {
    margin: 0 2px 12px;
}

.wc-public-profile-topic-list {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
    margin: 0;
    padding: 0;
    list-style: none;
}

.wc-public-profile-topic-list li { min-width: 0; margin: 0; }

.wc-public-profile-topic-list a {
    display: grid;
    grid-template-columns: 38px minmax(0, 1fr) 18px;
    align-items: center;
    gap: 11px;
    min-height: 76px;
    padding: 11px 12px;
    border: 1px solid var(--profile-line);
    border-radius: 15px;
    background: rgba(255, 255, 255, .035);
    color: var(--profile-ink);
    text-decoration: none;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .025);
    transition: transform .2s, border-color .2s, background .2s, box-shadow .2s;
}

.wc-public-profile-topic-list a:hover,
.wc-public-profile-topic-list a:focus-visible {
    border-color: rgba(var(--profile-accent-rgb), .38);
    background: rgba(var(--profile-accent-rgb), .075);
    color: var(--profile-ink);
    box-shadow: 0 14px 30px -25px rgba(var(--profile-accent-rgb), .5),
                inset 0 1px 0 rgba(255, 255, 255, .055);
    transform: translateY(-2px);
}

.wc-public-profile-topic-icon {
    display: grid;
    place-items: center;
    width: 38px;
    height: 38px;
    border-radius: 12px;
    background: rgba(var(--profile-accent-rgb), .11);
    color: var(--profile-accent);
    font-size: .82rem;
}

.wc-public-profile-topic-copy { min-width: 0; }

.wc-public-profile-topic-copy > strong {
    display: block;
    color: var(--profile-ink);
    font-size: .79rem;
    line-height: 1.75;
    overflow-wrap: anywhere;
}

.wc-public-profile-topic-meta {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 3px 11px;
    margin-top: 3px;
    color: var(--profile-muted);
    font-size: .61rem;
    line-height: 1.65;
}

.wc-public-profile-topic-meta > span {
    display: inline-flex;
    align-items: center;
    gap: 4px;
}

.wc-public-profile-topic-meta i { color: rgba(var(--profile-accent-rgb), .78); }

.wc-public-profile-topic-meta .is-locked {
    color: #e4a0a0;
}

.wc-public-profile-topic-meta .is-locked i { color: #e4a0a0; }

.wc-public-profile-topic-arrow {
    color: rgba(var(--profile-accent-rgb), .64);
    font-size: .65rem;
    transition: transform .2s, color .2s;
}

.wc-public-profile-topic-list a:hover .wc-public-profile-topic-arrow,
.wc-public-profile-topic-list a:focus-visible .wc-public-profile-topic-arrow {
    color: var(--profile-accent);
    transform: translateX(-2px);
}

.wc-public-profile .wc-profile-wand,
.wc-public-profile .wc-profile-patronus,
.wc-public-profile .wc-wand-empty--profile,
.wc-public-profile .wc-profile-patronus-empty {
    margin-top: 0;
}

.wc-public-profile .wc-wand-result,
.wc-public-profile .wc-patronus-result {
    overflow: hidden;
    border-radius: 24px;
    box-shadow: 0 24px 60px -42px rgba(0, 0, 0, .9);
}

.wc-public-profile .wc-wand-lore {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
    margin-top: 14px;
    padding: 14px;
    border: 1px solid var(--profile-line);
    border-radius: 22px;
    background: var(--profile-surface);
    box-shadow: 0 22px 55px -44px rgba(0, 0, 0, .9);
    -webkit-backdrop-filter: blur(18px);
    backdrop-filter: blur(18px);
}

.wc-public-profile .wc-wand-lore__title {
    grid-column: 1 / -1;
    margin: 0;
    padding: 3px 5px 8px;
    color: var(--profile-accent);
    font-size: .85rem;
}

.wc-public-profile .wc-wand-lore__entry {
    min-width: 0;
    margin: 0;
    padding: 18px 19px;
    border: 1px solid var(--profile-line);
    border-radius: 16px;
    background: rgba(255, 255, 255, .035);
}

.wc-public-profile .wc-wand-lore__entry + .wc-wand-lore__entry {
    margin: 0;
    padding-top: 18px;
    border-top: 1px solid var(--profile-line);
}

.wc-public-profile .wc-wand-lore__entry strong {
    color: var(--profile-ink);
    font-size: .88rem;
}

.wc-public-profile .wc-wand-lore__entry p {
    color: var(--profile-muted);
    font-size: .8rem;
    line-height: 2;
    text-align: right;
}

@media (max-width: 780px) {
    .wc-public-profile {
        margin-top: -42px;
        padding: 0 14px 54px;
    }

    .wc-public-profile-identity {
        grid-template-columns: 96px minmax(0, 1fr);
        gap: 18px;
        min-height: 0;
        padding: 24px 20px;
        border-radius: 22px;
    }

    .wc-public-profile-avatar { width: 96px; height: 96px; }
    .wc-public-profile-avatar > span { font-size: 2.2rem; }

    .wc-public-profile-crest {
        position: absolute;
        inset: 17px auto auto 17px;
        width: 54px;
        height: 54px;
        padding: 5px;
        border-radius: 16px;
        opacity: .5;
    }

    .wc-public-profile-bio { grid-column: 1 / -1; }
    .wc-public-profile-facts { margin-bottom: 28px; }

    .wc-public-profile .wc-wand-lore { grid-template-columns: 1fr; }
    .wc-public-profile-topic-list { grid-template-columns: 1fr; }
}

@media (max-width: 560px) {
    .wc-public-profile-identity {
        grid-template-columns: 76px minmax(0, 1fr);
        gap: 14px;
        padding: 20px 16px;
    }

    .wc-public-profile-avatar { width: 76px; height: 76px; padding: 3px; }
    .wc-public-profile-avatar > span { font-size: 1.75rem; }
    .wc-public-profile-copy h1 { font-size: 1.55rem; }
    .wc-public-profile-eyebrow { font-size: .68rem; }

    .wc-public-profile-badges {
        grid-column: 1 / -1;
        margin-top: 7px;
    }

    .wc-public-profile-bio {
        margin-top: 13px;
        font-size: .8rem;
    }

    .wc-public-profile-actions {
        grid-column: 1 / -1;
        align-items: stretch;
    }

    .wc-public-profile-action,
    .wc-public-profile .wc-profile-owl,
    .wc-public-profile .wc-profile-owl .wc-room-owl-link {
        flex: 1 1 100%;
        width: 100%;
    }

    .wc-public-profile-crest { width: 46px; height: 46px; }

    .wc-public-profile-facts {
        grid-template-columns: 1fr;
        gap: 7px;
        margin-top: 10px;
    }

    .wc-public-profile-section,
    .wc-public-profile-section + .wc-public-profile-section { margin-top: 30px; }

    .wc-public-profile-section-head { margin-bottom: 11px; }
    .wc-public-profile-section-head > span { width: 40px; height: 40px; flex-basis: 40px; }

    .wc-public-profile .wc-wand-result,
    .wc-public-profile .wc-patronus-result,
    .wc-public-profile .wc-wand-lore { border-radius: 18px; }

    .wc-public-profile .wc-wand-lore { padding: 10px; }
    .wc-public-profile .wc-wand-lore__entry { padding: 15px; }

    .wc-public-profile-topics {
        padding: 11px;
        border-radius: 18px;
    }

    .wc-public-profile-topic-list a {
        grid-template-columns: 36px minmax(0, 1fr) 14px;
        gap: 9px;
        min-height: 70px;
        padding: 10px;
    }

    .wc-public-profile-topic-icon { width: 36px; height: 36px; }
}

@media (max-width: 460px) {
    .wc-public-profile-identity {
        grid-template-columns: 1fr;
        text-align: center;
    }

    .wc-public-profile-avatar { margin-inline: auto; }
    .wc-public-profile-eyebrow,
    .wc-public-profile-badges,
    .wc-public-profile-actions { justify-content: center; }
    .wc-public-profile-bio { margin-inline: auto; }
}

@media (prefers-reduced-motion: reduce) {
    .wc-public-profile-action,
    .wc-public-profile-crest,
    .wc-public-profile-topic-list a,
    .wc-public-profile-topic-arrow { transition: none; }
}
