@charset "utf-8";

/*
 * Verified Crew Server GM presentation.
 * The matching HTML is emitted only after a server-side mb_level check.
 */
.crew-gm-name {
    position:relative;
    isolation:isolate;
    display:inline-flex;
    align-items:center;
    max-width:100%;
    line-height:1.45;
    vertical-align:middle;
    white-space:nowrap;
}
.crew-gm-name::before {
    position:absolute;
    z-index:-1;
    top:50%;
    left:38%;
    width:88%;
    height:1.8em;
    border-radius:999px;
    background:radial-gradient(ellipse,rgba(70,215,205,.27) 0,rgba(227,177,69,.18) 43%,rgba(255,255,255,0) 74%);
    filter:blur(4px);
    content:"";
    pointer-events:none;
    transform:translate(-50%,-50%);
    animation:crew-gm-aura 2.8s ease-in-out infinite;
}

.crew-gm-text {
    position:relative;
    z-index:1;
    display:inline-block;
    min-width:0;
    max-width:11em;
    overflow:hidden;
    color:#b77b17;
    font-weight:900;
    letter-spacing:-.025em;
    text-overflow:ellipsis;
    text-shadow:0 0 8px rgba(72,202,196,.35),0 1px 0 rgba(255,255,255,.92);
    vertical-align:middle;
}

@supports ((-webkit-background-clip:text) or (background-clip:text)) {
    .crew-gm-text {
        background:linear-gradient(105deg,#9e6410 0,#f4cf69 24%,#fff3b3 43%,#40bfb7 62%,#e6bd50 82%,#9e6410 100%);
        background-size:240% 100%;
        -webkit-background-clip:text;
        background-clip:text;
        -webkit-text-fill-color:transparent;
        animation:crew-gm-shimmer 4.8s linear infinite;
    }
}

.crew-gm-crown {
    position:relative;
    z-index:2;
    display:inline-flex;
    flex:0 0 auto;
    align-items:center;
    justify-content:center;
    width:1.15em;
    height:1.15em;
    margin-right:.2em;
    color:#d69a25;
    filter:drop-shadow(0 1px 2px rgba(113,72,0,.32));
    transform-origin:50% 100%;
    animation:crew-gm-crown 3.4s ease-in-out infinite;
}

.crew-gm-crown svg {
    display:block;
    width:100%;
    height:auto;
    overflow:visible;
}

.crew-gm-crown path:first-child {
    fill:#f5c84c;
    stroke:#9d6510;
    stroke-linejoin:round;
    stroke-width:1.15;
}

.crew-gm-crown path:last-child {
    fill:none;
    stroke:#9d6510;
    stroke-linecap:round;
    stroke-width:1.7;
}

.crew-gm-badge {
    position:relative;
    z-index:2;
    display:inline-flex;
    flex:0 0 auto;
    align-items:center;
    height:1.65em;
    margin-left:.42em;
    padding:0 .48em 0 .3em;
    border:1px solid rgba(151,101,17,.64);
    border-radius:999px;
    background:linear-gradient(135deg,#fff7cf 0,#e8b83f 48%,#55c9c1 100%);
    box-shadow:inset 0 1px 0 rgba(255,255,255,.82),0 2px 7px rgba(65,134,130,.25);
    color:#3e453f;
    font-size:.68em;
    font-weight:1000;
    letter-spacing:.06em;
    line-height:1;
    text-shadow:0 1px 0 rgba(255,255,255,.55);
    vertical-align:middle;
}

.crew-gm-shield {
    display:block;
    width:1.05em;
    height:1.15em;
    margin-right:.18em;
    overflow:visible;
}

.crew-gm-shield path:first-child {
    fill:#143b4b;
    stroke:#fff4b6;
    stroke-linejoin:round;
    stroke-width:1.1;
}

.crew-gm-shield path:last-child {
    fill:none;
    stroke:#79e5d7;
    stroke-linecap:round;
    stroke-linejoin:round;
    stroke-width:2;
}

.crew-gm-sr {
    position:absolute!important;
    width:1px!important;
    height:1px!important;
    margin:-1px!important;
    padding:0!important;
    border:0!important;
    overflow:hidden!important;
    clip:rect(0 0 0 0)!important;
    clip-path:inset(50%)!important;
    white-space:nowrap!important;
}

.crew-gm-profile {
    border-radius:50%;
    box-shadow:0 0 0 2px #f0c453,0 0 0 5px rgba(66,196,187,.18),0 0 16px rgba(70,205,196,.5);
}

.crew-gm-profile::after {
    position:absolute;
    right:auto;
    bottom:-3px;
    left:-5px;
    display:flex;
    align-items:center;
    justify-content:center;
    width:20px;
    height:20px;
    border:2px solid #fff6c7;
    border-radius:50%;
    background:linear-gradient(135deg,#173e4f,#267f7d);
    box-shadow:0 2px 6px rgba(13,51,62,.32);
    color:#f6cf64;
    font-size:9px;
    font-weight:900;
    line-height:1;
    content:"GM";
    pointer-events:none;
}

.crew-outlogin-member-name {
    min-width:0;
    max-width:100%;
}

.crew-outlogin-member-name .crew-gm-name {
    max-width:100%;
}

.sv_wrap .crew-gm-name {
    cursor:pointer;
}

@keyframes crew-gm-aura {
    0%,100% {opacity:.55;transform:translate(-50%,-50%) scale(.88)}
    50% {opacity:1;transform:translate(-50%,-50%) scale(1.08)}
}

@keyframes crew-gm-shimmer {
    0% {background-position:100% 50%}
    100% {background-position:-140% 50%}
}

@keyframes crew-gm-crown {
    0%,84%,100% {transform:rotate(0) translateY(0)}
    89% {transform:rotate(-7deg) translateY(-1px)}
    94% {transform:rotate(6deg) translateY(-1px)}
}

@media (max-width:767px) {
    .crew-gm-text {
        max-width:8.5em;
    }

    .crew-gm-badge {
        margin-left:.3em;
        font-size:.64em;
    }

    #ol_after_hd .crew-outlogin-member-name {
        max-width:calc(100% - 185px);
        overflow:hidden;
    }

    #ol_after_hd .crew-outlogin-member-name .crew-gm-text {
        max-width:6.4em;
    }
}

@media (max-width:380px) {
    .crew-gm-text {
        max-width:6.8em;
    }

    .crew-gm-badge {
        padding-right:.35em;
    }

    #ol_after_hd .crew-outlogin-member-name .crew-gm-text {
        max-width:4.7em;
    }
}

@media (prefers-reduced-motion:reduce) {
    .crew-gm-name::before,
    .crew-gm-text,
    .crew-gm-crown {
        animation:none!important;
    }
}
