@media (min-width: 768px) {
    :root {
        --l-margin: 5%;
        --w-full: 90%;
        --p-username: 3vh;
    }
}
@media (min-width: 1023px) {
    :root {
        --l-margin: 10%;
        --w-full: 80%;
        --p-username: 3.5vh;
    }
}
@media (min-width: 1440px) {
    :root {
        --l-margin: 10%;
        --w-full: 80%;
        --p-username: 4vh;
    }
}
@media (min-width: 1920px) {
    :root {
        --l-margin: 12.5%;
        --w-full: 75%;
        --p-username: 4.5vh;
    }
}
.pc-menu{position:absolute !important;}
.logo-left .blue {color: var(--c-white) !important;}

.spacer {height: 8vh;}
.profile-banner {
    position:relative;display:block;width:100%;height:40%;
    background-size: cover;background-position: center;z-index: 10;
}
/*.profile-banner::before {
    position:absolute;bottom:0;left:0;width:100%;height:100%;content: "";
    background: linear-gradient(to top, #0F0F0F, rgba(0,0,0,0));
}*/


.profile-wrap {
    position:relative;width: var(--w-full);margin-left: var(--l-margin);margin-top: -5%;z-index: 20;
    padding-bottom: 5%;
}
.profile-left, .profile-right {position:relative;display: inline-block;vertical-align: top;}
.profile-left {width: 20%;}.profile-right {width: 77%;margin-left: 3%;}

.profile-pfp {
    position:relative;display:block;width: calc(100% - 8px);border: solid 4px var(--c-blue);
    overflow: hidden;aspect-ratio: 1 / 1;
}
.pfp-wrap {position:relative;display:block;width:100%;height:100%;aspect-ratio: 1 / 1;overflow: hidden;background-color: black;}
.profile-pfp img {display:block;width:100%;height: 100%;margin: 0;object-fit: cover;}

.profile-badge {
    position:absolute;top:1vh;right:1vh;z-index:400;cursor:pointer;

}
.profile-badge img {
    height: 4vh;width:4vh;
    filter: drop-shadow(0 0 12px rgba(200,200,200,0.7));
}
.title-ribbon {
    position:absolute;bottom:calc(1vh + 15px);left:-24px;padding: 0.5vh 0;
    text-align: center;width: calc(100% + 48px);display:block;
}
.title-ribbon::before {
    left: 0px;bottom:-10px;content: "";position:absolute;
    border-width: 0 20px 10px 0;border-style: solid;
}
.title-ribbon::after {
    right: 0px;bottom:-10px;content: "";position:absolute;
    border-width: 10px 20px 0 0;border-style: solid;
}


.profile-username, .member-since, .followers {
    white-space: nowrap;text-overflow: ellipsis;margin-top: 1vh;
    overflow: hidden;width:100%;text-align: center;
}
.member-since {opacity: 0.6;padding: 0.25vh 0;}
.profile-name-hover {position:relative;display:block;width:100%;overflow:visible;}
.profile-name-hover .profile-username {overflow:visible;}
.profile-stat-tooltip {position:relative;overflow:visible !important;}

.followers, .following {
    cursor: pointer;width:47.5%;border-radius: 4px;
    padding: 1vh 0;background-color: rgba(50,50,50,0.5);font-size:17px;
}
.followers {margin-right: 5%;}
.f-ing {margin-right: 0 !important;}
.f-bg {
    position:fixed;top:0;left:0;width:100%;height:100%;display: none;
    z-index: 995;background-color: rgba(0, 0, 0, 0.4);
}
.followers-box, .following-box {
    position:fixed;top: 50%;left:50%;transform: translate(-50%, -50%);
    min-width: 50%;height: 70%;max-width: 80%;
    background-color: var(--c-dgray);z-index: 996;display: none;
    overflow: hidden;
}
.followers-box a, .following-box a {
    display:block;padding: 0.75vh 0;color: var(--c-white);
    text-decoration: none;
}
.fbox-top {
    padding: 1.5vh 1.5vw 1.35vh 1.5vw;background-color: var(--c-blue);
}
.f-list {
    width: calc(100% - 3vw);padding: 1vh 1.5vw;overflow: auto;display:block;height: 62vh;
}

.p-actions {
    position:relative;display:block;text-align: left;margin-top: 10%;
}
.p-social, .p-follow, .p-social-icon, .p-social-text {position:relative;display: inline-block;vertical-align: middle;}
.phone-follow {display: none;}
.premium-get {margin-right: 1vh;background-color: #DBAD6A;}
.under-name-social {
    margin-bottom: 2vh;display:block;padding: 1vh;width: calc(100% - 2vh);
    background-color: rgba(50,50,50,0.5);border-radius: 4px;
    transition: all 0.2s ease-in-out;
}
.under-name-social:hover {background-color: var(--c-blue);}
.platforms-title {margin: 4vh 0 2vh 0;}
.p-social {width: 50%;}.p-follow {width: 50%;text-align: right;}
.p-social-link {
    position:relative;padding: 1vh 1vh;margin-right: 1.5vw;text-decoration: none;
    transition: all 0.2s ease-in-out;border-bottom: solid 3px transparent;
    white-space: nowrap;overflow: hidden;font-family: Minecraft Ten;
}
.p-social-icon {height: 3.5vh;}
.p-youtube img {height: 4vh;}
.p-social-text {opacity:0;width: 0;transition: all 0.2s ease-in-out;font-size: 2.5vh;}
.un-social-text {cursor:pointer;font-size: 2vh;position:relative;display: inline-block;vertical-align: middle;margin-left: 2vh;}
.un-minecraft img {border-radius: 2px;}
.mc-pfp {
    height: 3.5vh;width: 3.5vh;
}


.p-social-icon:hover ~ .p-social-text {width: auto;margin-left: 1vh;opacity: 1;}

.p-youtube:hover, .p-youtube .p-social-text {color: #FF0000 !important;}
.p-instagram:hover, .p-instagram .p-social-text {color: #bc2a8d !important;}
.p-twitter:hover, .p-twitter .p-social-text {color: #1DA1F2 !important;}
.p-tiktok:hover, .p-tiktok .p-social-text {color: #FF004F !important;}
.p-twitch:hover, .p-twitch .p-social-text {color: #6441a5 !important;}

.button font {margin-top: -0.25vh;}
.profile-feed {
    margin: 5% 0 10vh 0;width:100%;display:block;
}
.profile-feed h3 {margin-bottom: 4vh;}
.side-links {
    display:inline-block;vertical-align: middle;margin-right: 1vh;
    cursor:pointer;transition: all 0.2s ease-in-out;position:relative;
    padding: 0.6vh 1.5vh;border-radius: 6px;
    background: rgba(255,255,255,0.05);
}
.side-links:hover {color: var(--c-blue);background: rgba(255,255,255,0.1);}
.side-links.blue {background: var(--c-blue);color: white !important;}
.side-links a {text-decoration: none;}

.feed-section, .packs-section, .user-settings {width:100%;}
.feed-section {display: none;}
.pack-file.banner-file {height: 13.5vh;}
.pack-gallery.pack-b-gallery {height: 13.5vh;}
input[type="file"] {opacity: 0;}
input[type="submit"] {width:100%;}
.auth-box input:not([type="checkbox"]) {
    box-sizing:border-box;
}
.auth-box input[type="submit"] {
    width:100% !important;
}
.auth-box input.password-field {
    width:calc(100% - 5vh) !important;
    height:5vh;
    padding-top:0 !important;
    padding-bottom:0 !important;
    vertical-align:top;
}
.auth-box .view-p {
    width:5vh;
    height:5vh;
    vertical-align:top;
}
.auth-box .submit-field h4 {
    width:100%;
    box-sizing:border-box;
}
.auth-box .input-field:has(.checkbox) {
    display:flex;
    align-items:flex-start;
    gap:0.75vw;
}
.auth-box .input-field:has(.checkbox) .checkbox {
    flex:0 0 auto;
}
.auth-box .input-field:has(.checkbox) .input-next {
    width:auto;
    flex:1;
    margin-left:0;
    line-height:1.35;
}


.user-settings {
    display:none;box-sizing:border-box;
}
.user-settings .settings-title {
    margin-bottom:1.2vh;line-height:1;
}
.settings-tab-row {
    display:flex;align-items:center;justify-content:space-between;gap:2vh;margin-bottom:2.4vh;
    padding-bottom:1.2vh;border-bottom:1px solid rgba(255,255,255,0.07);
    width:100%;
    box-sizing:border-box;
}
.settings-tab-main,
.settings-tab-actions {
    display:flex;
    align-items:center;
    flex-wrap:wrap;
    gap:0.7vh;
}
.settings-tab-actions {
    margin-left:auto;
    justify-content:flex-end;
}
.user-settings .side-links {
    display:inline-flex;align-items:center;gap:0.55vh;
    min-height:32px;margin:0 !important;padding:0 1.2vh;border-radius:4px;
    background:rgba(255,255,255,0.055);line-height:1;box-sizing:border-box;
}
.user-settings .side-links:hover {
    background:rgba(255,255,255,0.1);
}
.user-settings .side-links.blue {
    background:var(--c-blue);color:var(--c-white) !important;
    box-shadow:0 8px 18px -10px rgba(76,131,226,0.85);
}
.user-settings .side-links {transition:background .14s ease, box-shadow .14s ease;}
.user-settings .side-links a {
    display:block;color:inherit;text-decoration:none;
}
.settings-new-pill {
    display:inline-flex;
    align-items:center;
    justify-content:center;
    height:18px;
    margin-left:0.45vh;
    padding:0 0.55vh;
    background:#DBAD6A;
    color:#141820;
    font-size:10px;
    line-height:1;
    vertical-align:middle;
    min-width:28px;
    letter-spacing:0;
    border:1px solid rgba(255,255,255,0.18);
    text-shadow:none;
    box-shadow:inset 0 -1px 0 rgba(88,55,16,0.25);
}
.user-settings .settings-report-link {
    background:rgba(255,255,255,0.075);
    color:rgba(255,255,255,0.72);
}
.user-settings .settings-report-link:hover {
    background:rgba(255,255,255,0.12);
    color:var(--c-white);
}
.user-settings .settings-logout-link {
    background:rgba(231,81,81,0.16);
    color:#ff6b6b;
}
.user-settings .settings-logout-link:hover {
    background:#e75151;
    color:var(--c-white);
}
.hiddensettings {display: none;}

.input-field.social {display:flex;align-items:center;gap:0;}
.input-field.social:not(:has(.social-radio)) .social-input {margin-right:calc(6vh + 2vh);}
.social-img {
    display: inline-block;width: 4vh;margin-right: 2vh;vertical-align: middle;
}
.input-field .social-input {
    flex:1;vertical-align:middle;display:inline-block;min-width:0;width:auto !important;
}
.social-radio {
    width: 6vh;margin-left: 2vh;vertical-align: middle;display: inline-block;
    position:relative;height: 6vh;cursor: pointer;
}
.social-radio input {cursor: pointer;width:6vh !important;margin:0 !important;padding:0 !important;height:6vh !important;}
.selected-radio-social::before {
    top: 16%;left:16%;position:absolute;content:"";
    width: 70%;height:70%;background-image: url(../assets/icons/checkmark.png);
    background-size: 100% 100%;z-index: 10;
}




.box-ov {
    position:fixed;top:0;left:0;width:100%;height:100%;z-index:995;display: none;
}
.box-ov-bg {
    position:absolute;top:0;left:0;width:100%;height:100%;background-color: var(--c-bg);
    opacity: 0.5;z-index: 1;
}
.box-ov-mid {
    position:absolute;top:50%;left:50%;min-width:50%;max-width:80%;
    transform: translate(-50%, -50%);padding: 2vw;background-color: var(--c-switch2);
    text-align: left;z-index: 2;max-height: 80%;
}
.box-ov-mid .h-pad {line-height: 1.5;}

.pc-profile {position:relative;}
.phone-profile, .phone-followers {display: none;}


.level-display {
    position:absolute;top:50%;left: 35%;width: 30%;
    text-align: center;transform: translateY(-50%);
}
.level-display:hover .tooltip {bottom: 100% !important;}
.level-box {
    position:absolute;top:50%;left:50%;transform: translate(-50%, -50%);
}
.xp-bar {
    height:10vw;width:10vw;display:block;
    border-radius:100%;
}
.progress-circle {
    transform: rotate(-90deg);
}
.progress-circle-back {
	fill: none; 
	stroke: var(--c-white);
	stroke-width:8px;
}
.progress-circle-prog {
	fill: none; 
	stroke: var(--c-blue);
	stroke-width: 9px;
	stroke-dashoffset: 0px;
    transition: stroke-dasharray 0.7s ease-in-out 0.25s;
    filter: drop-shadow( 0 0 3px var(--c-blue));
}
.progress-circle-prog {
    transition: all 0.7s ease-in-out;
}



.switch-order, .grid-switch {
    display: inline-block;vertical-align: middle;position:relative;
    margin-right: 1vw;cursor: pointer;transition: color 0.2s ease-in-out;
}
.profile-grid-select {display:none;}
.grid-switch {margin-right: 0 !important;margin-left: 1vw;line-height:0.8;}
.switch-order:hover, .grid-switch:hover {color: var(--c-blue);}
.profile-pack-toolbar {
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:1.2vh 2vh;
    margin:1.2vh 0 2vh;
    padding:0;
}
.pending-order, .pending-grid-order {position:relative;display:inline-block;vertical-align: middle;width:auto;}
.profile-sort-control {
    display:flex;
    align-items:center;
    flex-wrap:wrap;
    gap:0.35vh;
    padding:0.42vh;
    background:rgba(255,255,255,0.035);
    border:1px solid rgba(255,255,255,0.08);
    border-radius:6px;
    box-shadow:inset 0 1px 0 rgba(255,255,255,0.035);
}
.profile-sort-label {
    display:none;
}
.profile-sort-btn {
    appearance:none;
    -webkit-appearance:none;
    padding:0.78vh 1.02vh;
    color:var(--c-switch);
    background:transparent;
    border:1px solid transparent;
    border-radius:4px;
    cursor:pointer;
    font-size:1.36vh;
    line-height:1;
    white-space:nowrap;
    transition:background-color 0.16s ease, border-color 0.16s ease, color 0.16s ease, transform 0.16s ease;
}
.profile-sort-btn:hover {
    color:#fff;
    background:rgba(66,133,244,0.14);
    border-color:rgba(66,133,244,0.38);
    transform:translateY(-1px);
}
.profile-sort-btn.active {
    color:#fff;
    background:var(--c-blue);
    border-color:var(--c-blue);
    box-shadow:0 0.45vh 1.1vh rgba(66,133,244,0.18);
}
.pending-grid-order {
    display:flex;
    align-items:center;
    justify-content:flex-end;
    gap:0.45vh;
    padding:0.42vh;
    text-align: right;
    background:rgba(255,255,255,0.035);
    border:1px solid rgba(255,255,255,0.08);
    border-radius:6px;
    box-shadow:inset 0 1px 0 rgba(255,255,255,0.035);
}
.pending-grid-order .grid-switch {
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-width:3.45vh;
    height:3.1vh;
    margin:0 !important;
    padding:0.24vh 0.36vh;
    color:rgba(223,227,233,0.5);
    background:transparent;
    border:1px solid transparent;
    border-radius:4px;
    font-size:1.02vh;
    line-height:0.72;
    text-align:center;
    opacity:0.88;
}
.pending-grid-order .grid-switch:hover {
    color:#fff;
    background:rgba(66,133,244,0.12);
    border-color:rgba(66,133,244,0.3);
}
.pending-grid-order .grid-switch.blue {
    color:var(--c-blue);
    background:rgba(66,133,244,0.14);
    border-color:rgba(66,133,244,0.36);
}
.pend-pack-grid .grid-text {text-shadow: 0 0 1px black;}

.close-settings {margin-bottom: 2vh !important;}
.form-sep-or {
    margin: 1.6vh 0 !important;text-align: center !important;
    color: rgba(255,255,255,0.38) !important;font-size: 0.82em;letter-spacing: 0.18em;
}
.user-settings .s-changes {box-shadow: 0 10px 24px -12px rgba(76,131,226,0.85);transition: filter .14s ease;}
.user-settings .s-changes:hover {filter: brightness(1.1);}
.user-settings .close-settings-b {
    background: rgba(255,255,255,0.05);border: 1px solid rgba(255,255,255,0.13);
    color: rgba(255,255,255,0.8);transition: border-color .14s ease, color .14s ease;
}
.user-settings .close-settings-b:hover {border-color: rgba(255,255,255,0.32);color: #fff;}
.close-settings-b {display:block;}
.close-settings-a {}

@media (max-width: 980px) and (orientation: portrait) {
    .form-sep-or {margin: 4vw 0 !important;}
    .close-settings {margin-bottom: 4vw !important;}
    .feed-section, .packs-section, .user-settings {width:90%;margin-left: 5%;}
    .user-settings {
        padding:0;
    }
    .settings-tab-row {
        display:grid;grid-template-columns:1fr 1fr;gap:2vw;margin-bottom:4vw;
        padding-bottom:3vw;
    }
    .settings-tab-main,
    .settings-tab-actions {
        display:contents;
    }
    .user-settings .settings-title {
        margin-bottom:3vw;
    }
    .profile-banner {display: none;}
    .profile-wrap {width: 100%;margin-left: 0%;margin-top: 0%;}
    .profile-left, .profile-right {position:relative;display: block;width: 100%;margin: 0 !important;}
    .profile-pfp {width: 100%;margin-left: 0%;border: none;}
    .profile-pic-p {background-color: var(--c-bg);}
    .profile-pic-p::before {
        position:absolute;bottom:-2px;left:0;width:100%;height:calc(60% + 2px);z-index: 1;content:"";
        background: linear-gradient(to top, var(--c-switch2), rgba(0,0,0,0));
    }
    .p-actions {margin-top: 5%;}
    .p-social {display:block;width:90%;margin-top: 7vw;margin-left: 5%;}
    .pc-follow {display: none;}
    .phone-follow {display:block;text-align: right;width: 100% !important;margin-top: 5%;}
    .phone-follow .button {width: 70%;}
    .settings, .premium-get {background-color: transparent !important;width: auto !important;}
    .settings img, .premium-get img {margin: 0 !important;padding: 1vh !important;}
    .premium-get {margin-right: 0 !important;}
    .phone-follow .button font {margin-top: -0.25vh;}
    .p-social-link {margin: 0 2vw !important;padding: 1.5vw 3vw;}.p-social-text {display: none;}
    .p-social-link:first-child {margin-left: 0 !important;padding-left: 0;}

    .profile-feed {margin-top: 5.5vh;}
    .profile-feed > .packs-title {
        width: 90%;
        margin-left: 5%;
        box-sizing: border-box;
        text-align: left;
    }
    .follow {padding: 1.15vh 2.5vh 1vh 2.5vh;}
    .side-links {
        padding: 1vh 1vh 1vh 0.15vh;background-color: transparent;margin-left: 5%;text-align:left;
    }
    .side-links.blue {color: var(--c-switch);background-color: transparent;}
    .user-settings .side-links {
        margin:0 !important;padding:2vw 2.5vw;background:var(--c-gray);text-align:center;
        display:flex;align-items:center;justify-content:center;min-height:42px;
        border:1px solid rgba(255,255,255,0.07);border-radius:4px;box-sizing:border-box;
    }
    .user-settings .side-links.blue {
        color:var(--c-white) !important;background:var(--c-blue);border-color:rgba(255,255,255,0.16);
        box-shadow:0 8px 18px -10px rgba(76,131,226,0.8);
    }
    .profile-feed h3 {margin-bottom: 0;}


    .pc-profile {display: none;}
    .phone-profile {display:block;position:relative;}
    .phone-followers {
        display:inline-block;width: auto !important;margin-left: 5%;
        margin-top: 3.5vh;padding: 0.85vh 1.35vh;
    }
    .phone-followers + .phone-followers {
        margin-left: 1vh;
    }
    .phone-over {
        position:absolute;top: 92.5%;left: 5%;width: 90%;
        z-index: 3;
    }
    .phone-left, .phone-right {
        display: inline-block;vertical-align: middle;position:relative;
    }
    .phone-left {text-align: left;width:60%;}
    .phone-right {text-align: right;width:40%;}
    .profile-pic-p {position:relative;display:block;width:100%;aspect-ratio:1 / 1;overflow:hidden;}
    .profile-pic-p img {width:100%;height:100%;display:block;object-fit:cover;}
    .packs-section > br:first-child {
        display:none;
    }
    .profile-pack-toolbar {
        width: 90%;
        margin: 1vh 0 1.5vh 5%;
        display:block;
        padding:0;
        border:0;
    }
    .pending-order,
    .pending-grid-order {
        width: 100%;
        box-sizing: border-box;
        display:block;
    }
    .profile-sort-control {
        display:grid;
        grid-template-columns:repeat(2,minmax(0,1fr));
        gap:0.45vh;
        padding:0;
        background:transparent;
        border:0;
        box-shadow:none;
    }
    .profile-sort-label {
        grid-column:1 / -1;
        margin:0 0 0.15vh;
        font-size:0.9em;
    }
    .profile-sort-btn {
        width:100%;
        padding:0.86vh 0.55vh;
        font-size:0.82em;
        text-align:center;
        background:rgba(255,255,255,0.025);
        border-color:rgba(255,255,255,0.055);
    }
    .pending-grid-order {
        display:none !important;
    }
    .profile-grid-select {
        display:none !important;
    }
    #prof-packs.grid {
        grid-template-columns:repeat(2,minmax(0,1fr)) !important;
        gap:1.8vh 1.35vh !important;
    }
    #prof-packs .in-grid {
        min-width:0;
    }
    #prof-packs.two-grid,
    #prof-packs.tri-grid,
    #prof-packs.four-grid,
    #prof-packs.five-grid {
        grid-template-columns:repeat(2,minmax(0,1fr)) !important;
        gap:1.8vh 1.35vh !important;
    }
    #prof-packs .grid-text {
        margin-top:0.65vh;
    }
    #prof-packs .grid-text h4 {
        font-size:0.95em;
        line-height:1.05;
    }
    #prof-packs .grid-text h5 {
        font-size:0.82em;
        line-height:1.18;
    }
    .auth-box {
        top:7vh;
        right:-96%;
        width:88%;
        height:auto;
        max-height:calc(100vh - 15vh);
        max-height:calc(100dvh - 15vh - env(safe-area-inset-bottom));
        padding:3vh 4vw 3.4vh;
        box-sizing:border-box;
        overflow-y:auto;
        -webkit-overflow-scrolling:touch;
    }
    .show-auth-top {
        right:4%;
    }
    .auth-box .input-field {
        margin-bottom:2.6vw;
    }
    .auth-box input:not([type="checkbox"]) {
        width:100% !important;
        box-sizing:border-box;
    }
    .auth-box input.password-field {
        width:calc(100% - 4.8vh) !important;
        height:4.8vh;
        padding-top:0 !important;
        padding-bottom:0 !important;
        vertical-align:top;
    }
    .auth-box .view-p {
        width:4.8vh;
        height:4.8vh;
        vertical-align:top;
    }
    .auth-box .submit-field h4 {
        width:100%;
        box-sizing:border-box;
    }
}
@media (max-width: 1920px) {

    .title-ribbon {
        bottom:15px;left:-24px;padding: 0.35vh 0;
        width: calc(100% + 48px);
    }
    .title-ribbon::before {bottom:-8px;border-width: 0 20px 8px 0;}
    .title-ribbon::after {bottom:-8px;border-width: 8px 20px 0 0;}
    
}












.premium-profile {background-color: #ffe136;}
.premium-profile::before {border-color: transparent #c7b030 transparent transparent;}
.premium-profile::after {border-color: #9c8a2a transparent transparent transparent;}
.premium-profile .f-mc {color: var(--c-dgray);}

.creator-profile {background-color: #AF6AE9;}
.creator-profile::before {border-color: transparent #6b418e transparent transparent;}
.creator-profile::after {border-color: #6b418e transparent transparent transparent;}

.moderator-profile {background-color: #FF7979;}
.moderator-profile::before {border-color: transparent #8e4545 transparent transparent;}
.moderator-profile::after {border-color: #8e4545 transparent transparent transparent;}

.manager-profile {background-color: #D23F3F;}
.manager-profile::before {border-color: transparent #8a2a2a transparent transparent;}
.manager-profile::after {border-color: #8a2a2a transparent transparent transparent;}

.developer-profile {background-color: #FEA060;}
.developer-profile::before {border-color: transparent #9c6036 transparent transparent;}
.developer-profile::after {border-color: #9c6036 transparent transparent transparent;}

.admin-profile {background-color: #EB1819;}
.admin-profile::before {border-color: transparent #6b0d0d transparent transparent;}
.admin-profile::after {border-color: #6b0d0d transparent transparent transparent;}


.pvprp-profile {background-color: var(--c-blue);}
.pvprp-profile::before {border-color: transparent #1b3562 transparent transparent;}
.pvprp-profile::after {border-color: #1b3562 transparent transparent transparent;}

.settings-level-card {
    margin-top:1vh;
    padding:0;
    background:transparent;
    box-sizing:border-box;
}
.settings-level-head {
    display:flex;
    align-items:center;
    gap:0.9vw;
    padding-bottom:1vw;
    border-bottom:1px solid rgba(255,255,255,0.08);
}
.settings-level-head img {
    width:2.2vw;
    height:2.2vw;
    object-fit:contain;
}
.settings-level-head h4 {
    margin:0 0 0.2vw 0;
    font-size:1.25vw;
}
.settings-level-head h5 {
    margin:0;
    font-weight:normal;
    font-size:0.9vw;
}
.settings-link-state {
    margin-left:auto;
    padding:0.35vw 0.7vw;
    background:rgba(255,255,255,0.08);
    color:var(--c-white);
    text-decoration:none;
    font-size:0.75vw;
}
.settings-link-state.linked {
    background:rgba(119,240,90,0.12);
    color:#77f05a;
}
.settings-link-state.unlinked {
    background:rgba(231,81,81,0.12);
    color:#e75151;
}
.settings-level-stats {
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:0.8vw;
    margin-top:1.1vw;
}
.settings-level-stats div {
    padding:0.9vw;
    background:var(--c-gray);
}
.settings-level-stats strong,
.settings-level-stats span {
    display:block;
}
.settings-level-stats strong {
    font-size:1.05vw;
}
.settings-level-stats span {
    margin-top:0.2vw;
    font-size:0.85vw;
}
.settings-level-actions {
    display:flex;
    gap:0.7vw;
    margin-top:1vw;
}
.settings-level-btn {
    display:inline-flex;
    justify-content:center;
    align-items:center;
    min-height:2.4vw;
    padding:0 1.1vw;
    background:var(--c-blue);
    color:var(--c-white);
    text-decoration:none;
    font-size:0.85vw;
}
.settings-level-btn-outline {
    background:var(--c-gray);
    border:0;
    color:var(--c-white);
}
.settings-level-note {
    margin:0.8vw 0 0 0;
    font-size:0.86vw;
}
.starter-quests-card {
    margin-top:1.2vw;
    padding:1.15vw;
    background:rgba(52,63,78,0.74);
    border-left:0.25vw solid var(--c-blue);
    outline:1px solid rgba(255,255,255,0.06);
}
.starter-quests-head {
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:1vw;
}
.starter-quests-head h4 {
    margin:0;
    font-size:1.2vw;
}
.starter-quests-head h5 {
    margin:0.35vw 0 0 0;
    font-weight:normal;
    font-size:0.86vw;
}
.starter-quests-level-link {
    padding:0.45vw 0.7vw;
    color:var(--c-blue);
    background:rgba(66,133,244,0.08);
    text-decoration:none;
    font-size:0.75vw;
    white-space:nowrap;
}
.starter-quests-intro {
    margin:0.85vw 0 0 0;
    font-size:0.86vw;
}
.starter-quest-list {
    display:grid;
    gap:0.55vw;
    margin-top:0.9vw;
}
.starter-quest-row {
    display:grid;
    grid-template-columns:2vw minmax(0,1fr) auto;
    align-items:center;
    gap:0.75vw;
    padding:0.7vw;
    background:rgba(20,26,34,0.48);
    border:1px solid rgba(255,255,255,0.05);
}
.starter-quest-row.is-ready {
    border-color:rgba(66,133,244,0.45);
}
.starter-quest-row.is-done {
    opacity:0.72;
}
.starter-quest-mark {
    display:flex;
    align-items:center;
    justify-content:center;
    width:2vw;
    height:2vw;
    background:rgba(255,255,255,0.07);
    color:var(--c-blue);
    font-size:0.72vw;
}
.starter-quest-copy h5 {
    margin:0;
    font-size:0.92vw;
}
.starter-quest-copy p {
    margin:0.22vw 0 0 0;
    font-size:0.82vw;
    line-height:1.28;
}
.starter-quest-meta {
    display:flex;
    align-items:center;
    gap:0.55vw;
}
.starter-quest-xp {
    color:var(--c-white);
    font-size:0.72vw;
    white-space:nowrap;
}
.starter-quest-btn,
.starter-quest-pill {
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-height:1.75vw;
    padding:0 0.65vw;
    border:0;
    background:var(--c-blue);
    color:var(--c-white);
    text-decoration:none;
    cursor:pointer;
    font-size:0.68vw;
}
.starter-quest-btn-muted {
    background:rgba(255,255,255,0.08);
}
.starter-quest-pill {
    background:rgba(119,240,90,0.13);
    color:#77f05a;
}
.starter-quest-claim {
    margin:0;
}
.starter-quest-modal {
    display:none;
    position:fixed;
    inset:0;
    z-index:99999;
}
.starter-quest-modal.is-open {
    display:block;
}
.starter-quest-modal-backdrop {
    position:absolute;
    inset:0;
    background:rgba(5,8,12,0.72);
}
.starter-quest-modal-box {
    position:absolute;
    top:50%;
    left:50%;
    width:min(34vw, 92vw);
    transform:translate(-50%, -50%);
    padding:1.4vw;
    background:#222b37;
    border-left:0.25vw solid var(--c-blue);
    outline:1px solid rgba(255,255,255,0.12);
    box-shadow:0 1.1vw 3vw rgba(0,0,0,0.42);
}
.starter-quest-modal-close {
    position:absolute;
    top:0.65vw;
    right:0.65vw;
    width:1.8vw;
    height:1.8vw;
    border:0;
    background:rgba(255,255,255,0.08);
    color:var(--c-white);
    cursor:pointer;
    font-size:0.7vw;
}
.starter-quest-modal-kicker {
    display:inline-flex;
    padding:0.28vw 0.5vw;
    background:rgba(66,133,244,0.16);
    color:var(--c-blue);
    font-size:0.68vw;
}
.starter-quest-modal-box h4 {
    margin:0.8vw 2vw 0 0;
    font-size:1.35vw;
}
.starter-quest-steps {
    display:grid;
    gap:0.45vw;
    margin-top:0.9vw;
}
.starter-quest-steps div {
    display:grid;
    grid-template-columns:1.35vw minmax(0,1fr);
    gap:0.55vw;
    align-items:start;
    color:rgba(255,255,255,0.78);
    font-size:0.88vw;
    line-height:1.35;
}
.starter-quest-steps b {
    display:flex;
    align-items:center;
    justify-content:center;
    width:1.35vw;
    height:1.35vw;
    background:rgba(66,133,244,0.18);
    color:#dfe9ff;
    font-size:0.62vw;
}
.starter-quest-steps strong {
    color:var(--c-white);
    font-weight:bold;
}
.starter-quest-bookmark-demo {
    position:relative;
    display:grid;
    grid-template-columns:1fr auto;
    gap:0.8vw;
    align-items:center;
    margin-top:1.35vw;
    padding:0.8vw;
    background:#151b24;
    border:1px solid rgba(255,255,255,0.08);
}
.starter-quest-bookmark-demo em {
    position:absolute;
    right:0.8vw;
    top:-1.35vw;
    color:var(--c-blue);
    font-style:normal;
    font-size:0.62vw;
}
.starter-quest-bookmark-demo span {
    color:var(--c-white);
    opacity:0.9;
    font-size:0.92vw;
}
.starter-quest-bookmark-demo b {
    padding:0.38vw 0.55vw;
    background:var(--c-blue);
    color:var(--c-white);
    font-size:0.65vw;
}
.starter-quest-bookmark-demo i {
    position:absolute;
    right:1.45vw;
    top:-0.55vw;
    width:0;
    height:0;
    border-left:0.4vw solid transparent;
    border-right:0.4vw solid transparent;
    border-top:0.75vw solid var(--c-blue);
}
.starter-quest-modal-form {
    margin:1vw 0 0 0;
}
.starter-quest-modal-confirm {
    width:100%;
    min-height:2.35vw;
    border:0;
    background:var(--c-blue);
    color:var(--c-white);
    cursor:pointer;
    font-size:0.78vw;
}
.starter-quest-modal-confirm:disabled {
    cursor:not-allowed;
    background:rgba(66,133,244,0.28);
    color:rgba(255,255,255,0.8);
}
.starter-quest-modal-claimed {
    margin-top:1vw;
    padding:0.7vw;
    background:rgba(119,240,90,0.12);
    color:#77f05a;
    text-align:center;
    font-size:0.72vw;
}

@media(max-width:1200px) {
    .settings-level-card {
        padding:4vw;
        margin-top:4vw;
    }
    .settings-level-head {
        gap:3vw;
        align-items:flex-start;
    }
    .settings-level-head img {
        width:8vw;
        height:8vw;
    }
    .settings-level-head h4 {
        font-size:4.5vw;
    }
    .settings-level-head h5,
    .settings-level-stats span,
    .settings-level-note {
        font-size:3.4vw;
    }
    .settings-link-state {
        padding:1.4vw 2vw;
        font-size:2.8vw;
    }
    .settings-level-stats {
        grid-template-columns:1fr 1fr 1fr;
        gap:2vw;
        margin-top:3vw;
    }
    .settings-level-stats div {
        padding:2.5vw;
    }
    .settings-level-stats strong {
        font-size:3.8vw;
    }
    .settings-level-actions {
        gap:2vw;
        margin-top:3vw;
    }
    .settings-level-btn {
        min-height:9vw;
        padding:0 3vw;
        font-size:3vw;
    }
    .starter-quests-card {
        margin-top:4vw;
        padding:3.5vw;
        border-left-width:1vw;
    }
    .starter-quests-head h4 {
        font-size:4vw;
    }
    .starter-quests-head h5,
    .starter-quests-intro {
        font-size:3.15vw;
    }
    .starter-quests-level-link {
        padding:1.4vw 2vw;
        font-size:2.8vw;
    }
    .starter-quest-list {
        gap:2vw;
        margin-top:3vw;
    }
    .starter-quest-row {
        grid-template-columns:7vw minmax(0,1fr);
        gap:2.5vw;
        padding:2.5vw;
    }
    .starter-quest-meta {
        grid-column:2;
        justify-content:flex-start;
    }
    .starter-quest-mark {
        width:7vw;
        height:7vw;
        font-size:2.3vw;
    }
    .starter-quest-copy h5 {
        font-size:3.4vw;
    }
    .starter-quest-copy p {
        margin-top:0.8vw;
        font-size:3vw;
    }
    .starter-quest-xp {
        font-size:2.7vw;
    }
    .starter-quest-btn,
    .starter-quest-pill {
        min-height:7vw;
        padding:0 2.4vw;
        font-size:2.6vw;
    }
    .starter-quest-modal-box {
        width:86vw;
        padding:4vw;
        border-left-width:1vw;
    }
    .starter-quest-modal-close {
        top:2vw;
        right:2vw;
        width:7vw;
        height:7vw;
        font-size:2.4vw;
    }
    .starter-quest-modal-kicker {
        padding:1vw 1.5vw;
        font-size:2.3vw;
    }
    .starter-quest-modal-box h4 {
        margin:2.5vw 8vw 0 0;
        font-size:4.1vw;
    }
    .starter-quest-steps {
        gap:1.5vw;
        margin-top:2.5vw;
    }
    .starter-quest-steps div {
        grid-template-columns:5.5vw minmax(0,1fr);
        gap:2vw;
        font-size:3.1vw;
    }
    .starter-quest-steps b {
        width:5.5vw;
        height:5.5vw;
        font-size:2.2vw;
    }
    .starter-quest-bookmark-demo {
        gap:2vw;
        margin-top:6vw;
        padding:2.5vw;
    }
    .starter-quest-bookmark-demo em {
        right:2.5vw;
        top:-4.5vw;
        font-size:2.2vw;
    }
    .starter-quest-bookmark-demo span {
        font-size:3vw;
    }
    .starter-quest-bookmark-demo b {
        padding:1.2vw 1.8vw;
        font-size:2.2vw;
    }
    .starter-quest-bookmark-demo i {
        right:5vw;
        top:-1.8vw;
        border-left-width:1.2vw;
        border-right-width:1.2vw;
        border-top-width:2.3vw;
        border-bottom-width:0;
    }
    .starter-quest-modal-form {
        margin-top:3vw;
    }
    .starter-quest-modal-confirm {
        min-height:9vw;
        font-size:2.8vw;
    }
    .starter-quest-modal-claimed {
        margin-top:3vw;
        padding:2.3vw;
        font-size:2.6vw;
    }
    .settings-new-pill {
        margin-left:6px;
        height:17px;
        padding:0 6px;
        font-size:10px;
        min-width:28px;
    }
}

/* Starter quest per-quest icons (in the .starter-quest-mark box). The box used to
   show OK/! text; it now shows a distinguishing SVG per quest, tinted by status:
   neutral = to-do, blue = ready to claim, green = done. Status is still obvious
   from the row border, the +XP/Done label, and the Claim/Done button. */
.starter-quest-mark {
    color:rgba(255,255,255,0.5);
    border-radius:4px;
}
.starter-quest-mark svg {
    width:62%;
    height:62%;
    display:block;
}
.starter-quest-row.is-ready .starter-quest-mark {
    color:var(--c-blue);
    background:rgba(66,133,244,0.16);
}
.starter-quest-row.is-done .starter-quest-mark {
    color:#77f05a;
    background:rgba(119,240,90,0.14);
}
@media (max-width:700px) {
    .starter-quest-mark svg { width:60%; height:60%; }
}

/* Starter quest workspace polish — 2026-07-13 */
.starter-quests-card {
    margin-top:1.2vw;
    padding:1.35vw;
    background:linear-gradient(180deg,rgba(42,52,66,0.92),rgba(34,42,54,0.94));
    border:1px solid rgba(255,255,255,0.08);
    border-top:3px solid var(--c-blue);
    border-left:1px solid rgba(255,255,255,0.08);
    outline:0;
}
.starter-quests-head {
    align-items:center;
    padding-bottom:1.05vw;
    border-bottom:1px solid rgba(255,255,255,0.08);
}
.starter-quests-kicker,
.starter-quest-state {
    display:block;
    color:rgba(126,167,238,0.9);
    font-size:0.64vw;
    line-height:1;
    letter-spacing:0.08em;
    text-transform:uppercase;
}
.starter-quests-head h4 {
    margin:0.45vw 0 0;
    font-size:1.35vw;
}
.starter-quests-intro {
    max-width:40vw;
    margin:0.45vw 0 0;
    line-height:1.45;
}
.starter-quests-level-link {
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-height:2.1vw;
    padding:0 0.85vw;
    color:var(--c-white);
    background:rgba(66,133,244,0.16);
    border:1px solid rgba(66,133,244,0.48);
}
.starter-quests-overview {
    display:grid;
    grid-template-columns:minmax(0,1fr) minmax(260px,18vw);
    grid-template-rows:auto auto;
    column-gap:1.4vw;
    row-gap:0.65vw;
    align-items:center;
    margin-top:1vw;
    padding:1vw 1.05vw;
    background:rgba(17,22,30,0.46);
    border:1px solid rgba(255,255,255,0.06);
}
.starter-quests-progress-copy {
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:1vw;
    font-size:0.78vw;
}
.starter-quests-progress-copy strong {
    font-size:0.9vw;
}
.starter-quests-progress {
    position:relative;
    height:7px;
    overflow:hidden;
    background:rgba(255,255,255,0.08);
}
.starter-quests-progress span {
    display:block;
    height:100%;
    background:linear-gradient(90deg,var(--c-blue),#77f05a);
}
.starter-quests-stats {
    grid-column:2;
    grid-row:1 / 3;
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    height:100%;
}
.starter-quests-stats div {
    display:flex;
    flex-direction:column;
    justify-content:center;
    min-width:0;
    padding:0 0.85vw;
    border-left:1px solid rgba(255,255,255,0.08);
}
.starter-quests-stats strong,
.starter-quests-stats span {
    display:block;
}
.starter-quests-stats strong {
    font-size:1vw;
}
.starter-quests-stats span {
    margin-top:0.2vw;
    font-size:0.68vw;
    white-space:nowrap;
}
.starter-quests-stats .has-ready strong {
    color:var(--c-blue);
}
.starter-quest-filters {
    display:flex;
    gap:0.45vw;
    margin-top:1vw;
}
.starter-quest-filter {
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:0.45vw;
    min-height:2vw;
    padding:0 0.72vw;
    border:1px solid rgba(255,255,255,0.09);
    background:rgba(255,255,255,0.035);
    color:rgba(255,255,255,0.58);
    cursor:pointer;
    font-size:0.68vw;
}
.starter-quest-filter span {
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-width:1.25vw;
    height:1.25vw;
    padding:0 0.25vw;
    background:rgba(255,255,255,0.07);
    color:rgba(255,255,255,0.72);
    font-family:Arial,sans-serif;
    font-size:0.62vw;
}
.starter-quest-filter:hover,
.starter-quest-filter.is-active {
    color:var(--c-white);
    background:rgba(66,133,244,0.16);
    border-color:rgba(66,133,244,0.52);
}
.starter-quest-list {
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:0.7vw;
    margin-top:0.8vw;
}
.starter-quest-row {
    position:relative;
    display:grid;
    grid-template-columns:2.35vw minmax(0,1fr);
    grid-template-rows:minmax(4.5vw,1fr) auto;
    align-items:start;
    gap:0.75vw;
    min-height:8.2vw;
    padding:0.9vw;
    background:rgba(16,21,29,0.5);
    border:1px solid rgba(255,255,255,0.07);
    transition:border-color .16s ease,background-color .16s ease,transform .16s ease;
}
.starter-quest-row:hover {
    border-color:rgba(255,255,255,0.14);
    transform:translateY(-1px);
}
.starter-quest-row.is-ready {
    background:linear-gradient(135deg,rgba(66,133,244,0.12),rgba(16,21,29,0.55) 55%);
    border-color:rgba(66,133,244,0.5);
    box-shadow:inset 3px 0 0 var(--c-blue);
}
.starter-quest-row.is-done {
    opacity:0.7;
    background:rgba(15,24,22,0.42);
    border-color:rgba(119,240,90,0.16);
}
.starter-quest-row.is-filtered-out {
    display:none;
}
.starter-quest-mark {
    width:2.35vw;
    height:2.35vw;
    border-radius:0;
    border:1px solid rgba(255,255,255,0.07);
}
.starter-quest-copy {
    min-width:0;
}
.starter-quest-copy h5 {
    margin:0.48vw 0 0;
    font-size:0.92vw;
    line-height:1.15;
}
.starter-quest-copy p {
    margin:0.32vw 0 0;
    font-size:0.78vw;
    line-height:1.38;
}
.starter-quest-row.is-ready .starter-quest-state {
    color:var(--c-blue);
}
.starter-quest-row.is-done .starter-quest-state {
    color:#77f05a;
}
.starter-quest-meta {
    grid-column:1 / -1;
    display:flex;
    align-items:center;
    justify-content:space-between;
    min-height:2.15vw;
    padding-top:0.7vw;
    border-top:1px solid rgba(255,255,255,0.07);
}
.starter-quest-xp {
    color:rgba(228,235,247,0.82);
    font-size:0.7vw;
}
.starter-quest-row.is-ready .starter-quest-xp {
    color:var(--c-blue);
}
.starter-quest-btn,
.starter-quest-pill {
    min-width:3.7vw;
    min-height:1.9vw;
    padding:0 0.72vw;
    font-size:0.66vw;
}
.starter-quest-btn-muted {
    border:1px solid rgba(255,255,255,0.1);
    background:rgba(255,255,255,0.055);
}

@media(max-width:1200px) {
    .starter-quests-card {
        margin-top:24px;
        padding:20px;
        border-top-width:3px;
        border-left-width:1px;
    }
    .starter-quests-head {
        gap:14px;
        padding-bottom:16px;
    }
    .starter-quests-kicker,
    .starter-quest-state {
        font-size:10px;
    }
    .starter-quests-head h4 {
        margin-top:7px;
        font-size:24px;
    }
    .starter-quests-intro {
        max-width:none;
        margin-top:7px;
        font-size:14px;
    }
    .starter-quests-level-link {
        min-height:38px;
        padding:0 14px;
        font-size:12px;
    }
    .starter-quests-overview {
        grid-template-columns:1fr;
        grid-template-rows:auto;
        gap:10px;
        margin-top:16px;
        padding:14px;
    }
    .starter-quests-progress-copy {
        font-size:13px;
    }
    .starter-quests-progress-copy strong {
        font-size:14px;
    }
    .starter-quests-stats {
        grid-column:1;
        grid-row:auto;
        min-height:58px;
        margin-top:4px;
    }
    .starter-quests-stats div {
        padding:0 12px;
    }
    .starter-quests-stats div:first-child {
        border-left:0;
        padding-left:0;
    }
    .starter-quests-stats strong {
        font-size:16px;
    }
    .starter-quests-stats span {
        margin-top:3px;
        font-size:11px;
    }
    .starter-quest-filters {
        display:grid;
        grid-template-columns:1fr 1fr;
        gap:8px;
        margin-top:16px;
        overflow:visible;
        padding-bottom:0;
    }
    .starter-quest-filter {
        width:100%;
        min-height:40px;
        gap:7px;
        padding:0 12px;
        font-size:12px;
    }
    .starter-quest-filter span {
        min-width:20px;
        height:20px;
        padding:0 4px;
        font-size:10px;
    }
    .starter-quest-list {
        grid-template-columns:1fr;
        gap:10px;
        margin-top:12px;
    }
    .starter-quest-row {
        grid-template-columns:42px minmax(0,1fr);
        grid-template-rows:auto auto;
        gap:12px;
        min-height:0;
        padding:14px;
    }
    .starter-quest-mark {
        width:42px;
        height:42px;
    }
    .starter-quest-copy h5 {
        margin-top:7px;
        font-size:15px;
    }
    .starter-quest-copy p {
        margin-top:5px;
        font-size:13px;
    }
    .starter-quest-meta {
        grid-column:1 / -1;
        min-height:38px;
        padding-top:10px;
    }
    .starter-quest-xp {
        font-size:11px;
    }
    .starter-quest-btn,
    .starter-quest-pill {
        min-width:68px;
        min-height:34px;
        padding:0 12px;
        font-size:11px;
    }
}

@media(max-width:520px) {
    .starter-quests-card { padding:16px; }
    .starter-quests-head { align-items:flex-start; }
    .starter-quests-head h4 { font-size:21px; }
    .starter-quests-level-link { min-height:34px; padding:0 10px; }
    .starter-quests-stats div { padding:0 8px; }
    .starter-quests-stats span { white-space:normal; }
}

/* Profile settings workspace polish - 2026-07-13 */
.user-settings {
    --settings-line:rgba(255,255,255,0.09);
    --settings-soft:rgba(255,255,255,0.035);
}
.user-settings .settings-in { width:100%;box-sizing:border-box; }
.settings-panel-head {
    display:flex;align-items:flex-start;justify-content:space-between;gap:24px;
    margin:0 0 24px;padding:0 0 20px;border-bottom:1px solid var(--settings-line);
}
.settings-panel-head > div { min-width:0; }
.settings-panel-kicker {
    display:block;margin:0 0 7px;color:#6ea3ff;font-size:12px;line-height:1;text-transform:uppercase;
}
.settings-panel-head h4 { margin:0;font-size:clamp(24px,2vw,32px);line-height:1.05; }
.settings-panel-head p { max-width:700px;margin:9px 0 0;font-size:15px;line-height:1.55; }
.settings-panel-state {
    flex:0 0 auto;display:inline-flex;align-items:center;min-height:32px;padding:0 11px;
    color:#9dbcf4;border:1px solid rgba(110,163,255,0.3);background:rgba(76,131,226,0.08);
    font-size:11px;line-height:1;
}
.settings-field-label {
    display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:24px;margin:0 0 12px;
}
.settings-field-label span { color:#fff;font-size:15px; }
.settings-field-label small { color:rgba(255,255,255,0.42);font-size:12px; }
.settings-field-help { margin:11px 0 0;font-size:13px;line-height:1.5; }
.user-settings .settings-general .settings-form {
    grid-template-columns:minmax(220px,280px) minmax(0,1fr);gap:28px 42px;max-width:1120px;
}
.settings-avatar-block { min-width:0; }
.user-settings .settings-general .pfp-file { border:1px solid var(--settings-line);background:#171e28; }
.user-settings .settings-general .pfp-file .over-pack-file { background-color:#202936; }
.user-settings .settings-general .banner-selection { max-width:none;padding:0; }
.user-settings .settings-general .banner-selection > .banner-special-title {
    padding-top:18px;border-top:1px solid rgba(255,255,255,0.055);
}
.user-settings .settings-general .banner-color-grid {
    grid-template-columns:repeat(12,36px);gap:8px;width:100%;
}
.user-settings .settings-general .color-radio:not(.special-banner-radio) { width:36px;height:36px; }
.user-settings .settings-general .special-banner-grid {
    grid-template-columns:repeat(3,minmax(120px,1fr));gap:8px;width:100%;
}
.user-settings .settings-general .special-banner-radio { width:100%;height:52px; }
.user-settings .settings-general .input-field.social {
    padding:6px 14px;border:1px solid var(--settings-line);background:#171e28;min-height:50px;box-sizing:border-box;
}
.user-settings .settings-general .input-field.social .social-img { width:34px;height:34px;margin-right:12px;flex:0 0 auto;object-fit:contain; }
.user-settings .settings-general .input-field.social .social-input { min-height:38px;padding:9px 2px;font-size:clamp(14px,1.02vw,17px);line-height:1.3;background:transparent; }
.user-settings .settings-general .input-field.social:not(:has(.social-radio)) .social-input { margin-right:10px; }
.user-settings .settings-general .profile-status textarea {
    min-height:96px;padding:14px;border:1px solid var(--settings-line);background:#171e28;box-sizing:border-box;
}
.settings-form-actions {
    display:flex;align-items:center;justify-content:flex-end;gap:10px;margin-top:8px;padding-top:18px;
    border-top:1px solid var(--settings-line);
}
.user-settings .settings-general .settings-form-actions { grid-column:2; }
.user-settings .settings-form-actions .s-changes,
.user-settings .settings-form-actions .close-settings-b { width:auto;max-width:none;min-width:170px;margin:0 !important; }
.settings-form-actions .s-changes { order:2; }
.settings-form-actions .close-settings-b { order:1; }
.settings-account-grid {
    display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;max-width:1120px;
}
.settings-account-section {
    position:relative;min-width:0;padding:22px;border:1px solid var(--settings-line);
    border-top:2px solid rgba(76,131,226,0.75);background:var(--settings-soft);box-sizing:border-box;
}
.settings-section-number {
    position:absolute;top:20px;right:20px;color:rgba(110,163,255,0.62);font-size:13px;
}
.settings-section-copy { padding-right:38px; }
.settings-section-copy h4 { margin:0;font-size:18px; }
.settings-section-copy p { min-height:42px;margin:7px 0 20px;font-size:14px;line-height:1.5; }
.user-settings .settings-account-section .settings-form { width:100%;max-width:none; }
.settings-input-label {
    display:block;margin:13px 0 7px;color:rgba(255,255,255,0.76);font-size:13px;font-weight:700;
}
.settings-account-section .profile-input {
    min-height:48px;padding:12px 14px !important;border:1px solid var(--settings-line);background:#171e28;
}
.settings-account-section .s-changes { min-height:44px;margin-top:18px; }
.settings-account-locked { display:flex;flex-direction:column; }
.settings-inline-link {
    display:inline-flex;align-items:center;justify-content:center;align-self:flex-start;min-height:42px;
    margin-top:auto;padding:0 16px;color:#fff;background:var(--c-blue);text-decoration:none;
}
.settings-footer-actions { display:flex;justify-content:flex-end;max-width:1120px;margin-top:16px; }
.settings-footer-actions .close-settings-b { width:auto;min-width:170px;margin:0 !important; }
.settings-social-key { display:flex;align-items:center;gap:9px;margin:-8px 0 16px; }
.settings-social-key > span {
    width:13px;height:13px;border:3px solid #fff;outline:2px solid var(--c-blue);
    background:var(--c-blue);box-sizing:border-box;
}
.settings-social-key p { margin:0;font-size:13px; }
.user-settings .settings-social .settings-form { max-width:1120px; }
.settings-social-grid { display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px; }
.user-settings .settings-social .input-field.social {
    min-height:58px;margin:0;padding:8px 20px;border:1px solid var(--settings-line);
    background:var(--settings-soft);box-sizing:border-box;
    transition:border-color .14s ease,background .14s ease,box-shadow .14s ease;
}
.user-settings .settings-social .input-field.social:focus-within {
    border-color:rgba(110,163,255,0.65);background:rgba(76,131,226,0.06);
    box-shadow:inset 3px 0 0 rgba(110,163,255,0.7);
}
.user-settings .settings-social .social-img { width:30px;height:30px;margin:0 14px 0 12px;object-fit:contain; }
.user-settings .settings-social .social-img[src*="twitch"] { width:34px;height:34px; }
.user-settings .settings-social .social-input {
    min-height:42px;padding:9px 10px;background:#171e28;box-sizing:border-box;
}
.user-settings .settings-social .social-radio {
    flex:0 0 34px;width:34px;height:34px;margin:0 8px 0 14px;
}
.user-settings .settings-social .social-radio input { width:34px !important;height:34px !important; }
.user-settings .settings-social .selected-radio-social::before {
    top:23%;left:23%;width:54%;height:54%;
}
.user-settings .settings-social .input-field.social:not(:has(.social-radio)) .social-input { margin-right:56px; }
.user-settings :is(button,a,input,textarea,select):focus-visible {
    outline:2px solid rgba(110,163,255,0.9);outline-offset:2px;
}
.settings-perk-note {
    display:flex;align-items:center;gap:12px;margin-top:14px;padding:12px 14px;
    border-left:3px solid #d9ad62;background:rgba(217,173,98,0.07);
}
.settings-perk-note > span { color:#e6bd75; }
.settings-perk-note p { flex:1;margin:0;font-size:13px; }
.settings-perk-note a { color:#6ea3ff;text-decoration:none; }
.settings-social .settings-form-actions { margin-top:18px; }

@media (max-width:980px) and (orientation:portrait) {
    .settings-panel-head { gap:3vw;margin-bottom:5vw;padding-bottom:4vw; }
    .settings-panel-head h4 { font-size:6vw; }
    .settings-panel-head p { font-size:3.5vw; }
    .settings-panel-kicker { font-size:2.8vw; }
    .settings-panel-state { min-height:8vw;padding:0 2.4vw;font-size:2.5vw; }
    .user-settings .settings-general .settings-form { display:block;max-width:none; }
    .settings-field-label { margin-bottom:2.5vw; }
    .settings-field-label span { font-size:3.8vw; }
    .settings-field-label small { font-size:3vw; }
    .settings-field-help { margin:2.5vw 0 5vw;font-size:3.2vw; }
    .user-settings .settings-general .banner-color-grid {
        grid-template-columns:repeat(6,1fr);gap:2vw;width:100%;
    }
    .user-settings .settings-general .color-radio:not(.special-banner-radio) {
        width:100%;height:auto;aspect-ratio:1;
    }
    .user-settings .settings-general .special-banner-grid { grid-template-columns:1fr;gap:2vw; }
    .user-settings .settings-general .special-banner-radio { height:14vw; }
    .user-settings .settings-general .settings-form-actions { grid-column:auto; }
    .settings-account-grid,
    .settings-social-grid { grid-template-columns:1fr; }
    .settings-account-grid { gap:3vw; }
    .settings-account-section { padding:5vw; }
    .settings-section-number { top:5vw;right:5vw;font-size:3vw; }
    .settings-section-copy h4 { font-size:4.5vw; }
    .settings-section-copy p { min-height:0;margin:2vw 0 4vw;font-size:3.3vw; }
    .settings-input-label { margin:3vw 0 1.5vw;font-size:3.2vw;text-align:left; }
    .settings-account-section .profile-input { min-height:12vw; }
    .settings-account-section .s-changes { min-height:11vw;margin-top:4vw; }
    .settings-footer-actions { margin-top:3vw; }
    .settings-form-actions { display:grid;grid-template-columns:1fr;gap:2vw;padding-top:4vw; }
    .settings-form-actions .s-changes,
    .settings-form-actions .close-settings-b,
    .settings-footer-actions .close-settings-b { width:100%;min-width:0; }
    .settings-form-actions .s-changes { order:1; }
    .settings-form-actions .close-settings-b { order:2; }
    .settings-social-key { margin:-2vw 0 3vw; }
    .settings-social-key p { font-size:3vw;text-align:left; }
    .user-settings .settings-social .input-field.social { min-height:15vw;padding:2.5vw 4vw; }
    .user-settings .settings-social .social-img { width:8vw;height:8vw;margin:0 3vw 0 2.5vw; }
    .user-settings .settings-social .social-img[src*="twitch"] { width:9.2vw;height:9.2vw; }
    .user-settings .settings-social .social-input { min-height:11vw;padding:2vw !important; }
    .user-settings .settings-social .social-radio {
        flex-basis:9vw;width:9vw !important;height:9vw !important;margin:0 1.5vw 0 3vw;
    }
    .user-settings .settings-social .social-radio input { width:9vw !important;height:9vw !important; }
    .user-settings .settings-social .input-field.social:not(:has(.social-radio)) .social-input { margin-right:13.5vw; }
    .settings-perk-note { align-items:flex-start;flex-wrap:wrap;margin-top:3vw;padding:3vw; }
    .settings-perk-note p { flex-basis:calc(100% - 18vw);font-size:3vw;text-align:left; }
}

@media (max-width:520px) and (orientation:portrait) {
    .settings-panel-head { display:block; }
    .settings-panel-state { margin-top:3vw; }
}

/* clickable annotation banner (deep-links into quests) */
.annotation[data-ann-href]{cursor:pointer;}