/* Empêche la sélection et le glisser natif du contenu décoratif du site. */
body {
    -webkit-user-select: none;
    user-select: none;
}

body img,
body a {
    -webkit-user-drag: none;
    user-drag: none;
}

body input,
body textarea,
body select,
body [contenteditable="true"],
body .ProseMirror,
body .tt-txtarea {
    -webkit-user-select: text;
    user-select: text;
}

body .website-bg[theme="light"] {
    background-color: transparent;
}

body .website-bg[theme="light"]::before {
    background-image: url("../images/header.png");
    opacity: .7;
    background-size: cover;
    image-rendering: auto;
}

/* Page publique affichée lorsque la maintenance est activée. */
.page.frontend-maintenance-page #site-header > .frontend-maintenance-header-down {
    display: flex;
    align-items: center;
    justify-content: center;
}

body:is([data-page-id="maintenance"], [data-page-id="pin"], [data-page-id="not-found"])
    .frontend-maintenance-header-down {
    position: relative;
}

body:is([data-page-id="maintenance"], [data-page-id="pin"], [data-page-id="not-found"])
    .frontend-maintenance-header-down::before,
body:is([data-page-id="maintenance"], [data-page-id="pin"], [data-page-id="not-found"])
    .frontend-maintenance-header-down::after {
    position: absolute;
    top: 15px;
    z-index: 2;
    height: 50px;
    content: "";
    background-position: center;
    background-repeat: no-repeat;
    image-rendering: pixelated;
    pointer-events: none;
    transition: 200ms ease-in-out all;
}

body:is([data-page-id="maintenance"], [data-page-id="pin"], [data-page-id="not-found"])
    .frontend-maintenance-header-down::before {
    left: 0;
    width: 20px;
    background-image: url("../images/header-decoration/corner-left-eaeaea.png");
}

body:is([data-page-id="maintenance"], [data-page-id="pin"], [data-page-id="not-found"])
    .frontend-maintenance-header-down::after {
    right: 0;
    width: 15px;
    background-image: url("../images/header-decoration/corner-right-eaeaea.png");
}

.frontend-maintenance-header-message {
    position: relative;
    z-index: 1;
    display: flex;
    width: 100%;
    min-height: 50px;
    align-items: center;
    justify-content: center;
    margin-top: 15px;
    padding: 10px 24px;
    border-radius: 10px;
    background-color: #f27e46;
    color: #ffffff;
    font-size: 15px;
    font-weight: 700;
    line-height: 1.4;
    text-align: center;
}

body .page.frontend-maintenance-page > .frontend-maintenance-card {
    width: 1050px !important;
    max-width: calc(100% - 30px);
    float: none;
    clear: both;
    margin: 30px auto 40px;
    overflow: hidden;
}

.page.frontend-maintenance-page > .frontend-maintenance-card > .frontend-maintenance-content {
    margin-top: 0;
    padding: 15px;
}

.page.frontend-maintenance-page .frontend-maintenance-category-image {
    background-image: url("../images/forum/annonce.gif");
    background-size: cover;
}

.page.frontend-maintenance-page .frontend-maintenance-status__message {
    display: flex;
    min-height: 105px;
    align-items: center;
    gap: 15px;
    padding: 18px 25px !important;
}

.frontend-maintenance-status__message > img {
    display: block;
    image-rendering: pixelated;
}

.frontend-maintenance-status__message > div {
    min-width: 0;
    flex: 1;
}

.frontend-maintenance-status__message h1 {
    color: #3c3f51;
    font-size: 18px;
    font-weight: 700;
}

.frontend-maintenance-message {
    margin-top: 6px;
    color: #3c3f51;
    font-size: 13px;
    line-height: 1.45;
}

.page.frontend-maintenance-page .frontend-maintenance-status__progress {
    padding: 12px 25px 20px !important;
}

.frontend-maintenance-progress__labels {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 8px;
    color: #3c3f51;
    font-size: 13px;
}

.frontend-maintenance-progress__labels strong {
    color: #f27e46;
}

.frontend-maintenance-status__progress progress {
    display: block;
    width: 100%;
    height: 12px;
    overflow: hidden;
    border-radius: 10px;
    background: #edf0f2;
}

.frontend-maintenance-status__progress progress::-webkit-progress-bar {
    border-radius: 10px;
    background: #edf0f2;
}

.frontend-maintenance-status__progress progress::-webkit-progress-value {
    border-radius: 10px;
    background: #f27e46;
}

.frontend-maintenance-status__progress progress::-moz-progress-bar {
    border-radius: 10px;
    background: #f27e46;
}

.frontend-maintenance-status__progress small {
    display: block;
    margin-top: 7px;
    color: #3c3f51;
    font-size: 12px;
    opacity: .72;
}

.frontend-maintenance-access {
    width: 100%;
    float: left;
    clear: both;
    padding: 0 20px 22px;
    text-align: center;
}

.frontend-maintenance-divider {
    display: flex;
    align-items: center;
    gap: 12px;
    max-width: 520px;
    margin: 26px auto 0;
    color: #3c3f51;
    font-size: 13px;
    font-weight: 700;
    text-transform: uppercase;
}

.frontend-maintenance-divider::before,
.frontend-maintenance-divider::after {
    content: "";
    flex: 1;
    height: 1px;
    background: rgba(26, 40, 49, .12);
}

.frontend-maintenance-beta {
    max-width: 520px;
    margin: 16px auto 0;
    text-align: left;
}

.frontend-maintenance-beta > label {
    display: block;
    margin-bottom: 7px;
    color: #3c3f51;
    font-size: 13px;
    font-weight: 700;
}

.frontend-maintenance-beta-help {
    max-width: 620px;
    margin: 10px auto 0;
    color: #3c3f51;
    font-size: 14px;
    line-height: 1.55;
}

.frontend-maintenance-beta__controls {
    display: flex;
    align-items: stretch;
    gap: 10px;
}

.frontend-maintenance-beta__controls input {
    min-width: 0;
    flex: 1;
    padding: 12px 14px;
    border: 1px solid rgba(26, 40, 49, .14);
    border-radius: 10px;
    background: #ffffff;
    color: #3c3f51;
    font-size: 14px;
}

.frontend-maintenance-beta__controls input:focus {
    border-color: #f27e46;
    box-shadow: 0 0 0 3px rgba(242, 126, 70, .18);
}

.frontend-maintenance-beta__controls .btn[theme] {
    display: inline-flex;
    flex: 0 0 auto;
    min-height: 45px;
    align-items: center;
    justify-content: center;
    padding: 0 18px;
    background-color: #f27e46;
    color: #ffffff;
    font-weight: 700;
    border-radius: 10px;
    cursor: pointer;
}

.frontend-maintenance-beta__controls .btn[theme]:hover,
.frontend-maintenance-beta__controls .btn[theme]:focus-visible {
    background-color: #f27e46;
    color: #ffffff;
    opacity: .84;
}

.frontend-maintenance-beta-launch {
    display: flex;
    grid-column: 2;
    width: 100%;
    align-items: center;
    justify-content: center;
    margin: -20px auto 42px;
    flex-direction: column;
    gap: 8px;
}

.frontend-maintenance-beta-launch > .btn[theme] {
    display: inline-flex;
    min-width: 180px;
    min-height: 45px;
    align-items: center;
    justify-content: center;
    padding: 0 22px;
    border: 0;
    border-radius: 10px;
    background: #f27e46;
    color: #ffffff;
    cursor: pointer;
    font-size: 14px;
    font-weight: 700;
    transition: 200ms ease-in-out opacity;
}

.frontend-maintenance-beta-launch > .btn[theme]:hover,
.frontend-maintenance-beta-launch > .btn[theme]:focus-visible {
    color: #ffffff;
    opacity: .84;
}

.frontend-maintenance-beta-launch > noscript {
    color: #3c3f51;
    font-size: 12px;
}

#modal.frontend-maintenance-beta-overlay::after {
    background: rgba(26, 40, 49, .42);
}

#modal.frontend-maintenance-beta-overlay > .center > button.close {
    padding: 0;
    border: 0;
}

.frontend-maintenance-beta-modal > .title {
    display: flex;
    min-height: 74px;
    align-items: center;
    padding: 10px 14px;
}

.frontend-maintenance-beta-modal > .title > .avatar {
    flex: 0 0 54px;
}

.frontend-maintenance-beta-modal > .title > .avatar > img {
    max-width: none;
}

.frontend-maintenance-beta-modal > .title > .infos {
    min-width: 0;
    margin-top: 0;
}

.frontend-maintenance-beta-modal > .title > .infos > h3 {
    margin: 0;
}

.frontend-maintenance-beta-modal > .title > .infos > .description {
    margin: 4px 0 0;
}

.frontend-maintenance-beta-modal > .content {
    padding: 18px 20px 22px;
}

.frontend-maintenance-beta-modal .frontend-maintenance-beta-help {
    margin: 0;
    text-align: left;
}

.frontend-maintenance-beta-modal .frontend-maintenance-beta {
    margin-top: 16px;
}

.frontend-pin-security-note {
    display: flex;
    flex-direction: column;
    gap: 4px;
    padding: 14px 25px 20px !important;
    color: #3c3f51;
}

.frontend-pin-security-note strong {
    font-size: 13px;
}

.frontend-pin-security-note small {
    font-size: 12px;
    opacity: .72;
}

.frontend-pin-form input {
    letter-spacing: .35em;
    text-align: center;
    font-weight: 700;
}

.page.frontend-password-reset-page .frontend-password-reset-category-image {
    background-image: url("../images/forum/annonce.gif");
    background-position: center;
    background-size: cover;
}

.frontend-password-reset-form {
    max-width: 620px;
}

.frontend-password-reset-fields {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px;
}

.frontend-password-reset-fields > label {
    display: flex;
    min-width: 0;
    flex-direction: column;
    gap: 7px;
    text-align: left;
}

.frontend-password-reset-fields > label:nth-child(3) {
    grid-column: 1 / -1;
}

.frontend-password-reset-fields > label > span {
    color: #3c3f51;
    font-size: 13px;
    font-weight: 700;
}

.frontend-password-reset-fields input {
    width: 100%;
    min-height: 44px;
    box-sizing: border-box;
    padding: 0 14px;
    border: 1px solid rgba(26, 40, 49, .14);
    border-radius: 10px;
    background: #ffffff;
    color: #3c3f51;
    font-size: 14px;
    outline: none;
}

.frontend-password-reset-fields input:focus {
    border-color: #f27e46;
    box-shadow: 0 0 0 3px rgba(242, 126, 70, .18);
}

.frontend-password-reset-fields > .btn[theme="light"] {
    display: inline-flex;
    grid-column: 1 / -1;
    min-height: 44px;
    align-items: center;
    justify-content: center;
    border: 0;
    border-radius: 10px;
    background: #f27e46;
    color: #ffffff;
    cursor: pointer;
    font-size: 14px;
    font-weight: 700;
}

.frontend-password-reset-fields > .btn[theme="light"]:hover,
.frontend-password-reset-fields > .btn[theme="light"]:focus-visible {
    background: rgba(242, 126, 70, .76);
}

.frontend-pin-logout {
    display: inline-block;
    margin-top: 14px;
    color: #3c3f51;
    font-size: 13px;
    text-decoration: underline;
    opacity: .72;
}

.frontend-pin-logout:hover,
.frontend-pin-logout:focus-visible {
    color: #f27e46;
    opacity: 1;
}

.app[theme="dark"] .frontend-maintenance-status__message h1,
.app[theme="dark"] .frontend-maintenance-message,
.app[theme="dark"] .frontend-maintenance-progress__labels,
.app[theme="dark"] .frontend-maintenance-status__progress small,
.app[theme="dark"] .frontend-maintenance-divider,
.app[theme="dark"] .frontend-maintenance-beta > label,
.app[theme="dark"] .frontend-maintenance-beta-help,
.app[theme="dark"] .frontend-pin-security-note,
.app[theme="dark"] .frontend-pin-logout,
.app[theme="dark"] .frontend-password-reset-fields > label > span {
    color: #ffffff;
}

.app[theme="dark"] .frontend-maintenance-divider::before,
.app[theme="dark"] .frontend-maintenance-divider::after {
    background: rgba(255, 255, 255, .14);
}

.app[theme="dark"] .frontend-maintenance-beta__controls input {
    border-color: rgba(255, 255, 255, .12);
    background: #3c3f51;
    color: #ffffff;
}

.app[theme="dark"] .frontend-password-reset-fields input {
    border-color: rgba(255, 255, 255, .12);
    background: #3c3f51;
    color: #ffffff;
}

@media (max-width: 760px) {
    .frontend-maintenance-header-message {
        font-size: 13px;
    }

    .page.frontend-maintenance-page > .frontend-maintenance-card > .frontend-maintenance-content {
        padding: 10px;
    }

    .page.frontend-maintenance-page > .frontend-maintenance-card > .frontend-maintenance-content > .line {
        display: flex;
        flex-direction: column;
    }

    .page.frontend-maintenance-page > .frontend-maintenance-card > .frontend-maintenance-content > .line > .left,
    .page.frontend-maintenance-page > .frontend-maintenance-card > .frontend-maintenance-content > .line > .stats {
        width: 100%;
        float: none;
    }

    .page.frontend-maintenance-page > .frontend-maintenance-card > .frontend-maintenance-content > .line > .stats::after {
        display: none;
    }

    .frontend-maintenance-access {
        padding-right: 10px;
        padding-left: 10px;
    }

    .frontend-maintenance-beta__controls {
        flex-direction: column;
    }

    .frontend-maintenance-beta__controls .btn[theme] {
        min-height: 44px;
    }

    .frontend-password-reset-fields {
        grid-template-columns: 1fr;
    }

    .frontend-password-reset-fields > label:nth-child(3),
    .frontend-password-reset-fields > .btn[theme="light"] {
        grid-column: 1;
    }
}

.page.frontend-maintenance-settings-page > .left {
    width: 100% !important;
    max-width: 1000px;
    float: none;
    margin-right: auto;
    margin-left: auto;
}

.frontend-maintenance-settings-box > .content > .description {
    margin-bottom: 18px;
    color: #3c3f51;
    font-size: 14px;
    line-height: 1.55;
}

.frontend-maintenance-settings-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 15px;
}

.frontend-maintenance-settings-grid > label {
    display: flex;
    min-width: 0;
    flex-direction: column;
    gap: 7px;
}

.frontend-maintenance-settings-grid > label > span {
    color: #3c3f51;
    font-size: 13px;
    font-weight: 700;
}

.frontend-maintenance-settings-grid input,
.frontend-maintenance-settings-grid select,
.frontend-maintenance-settings-grid textarea {
    width: 100%;
    padding: 12px 14px;
    border: 1px solid rgba(26, 40, 49, .14);
    border-radius: 10px;
    background: #ffffff;
    color: #3c3f51;
    font-size: 14px;
}

.frontend-maintenance-settings-grid textarea {
    resize: vertical;
}

.frontend-maintenance-settings-grid input:focus,
.frontend-maintenance-settings-grid select:focus,
.frontend-maintenance-settings-grid textarea:focus {
    border-color: #f27e46;
    box-shadow: 0 0 0 3px rgba(242, 126, 70, .18);
}

.frontend-maintenance-settings-full {
    grid-column: 1 / -1;
}

.frontend-maintenance-settings-form > .btn[theme] {
    float: right;
    margin-top: 18px;
    padding: 0 20px;
    background-color: #f27e46;
    color: #ffffff;
}

.frontend-maintenance-settings-form > .btn[theme]:hover {
    background-color: #f27e46;
    color: #ffffff;
    opacity: .84;
}

@media (max-width: 700px) {
    .frontend-maintenance-settings-grid {
        grid-template-columns: 1fr;
    }

    .frontend-maintenance-settings-full {
        grid-column: auto;
    }
}

#site-header > .center > .logo {
    position: relative;
    top: 53px;
    display: block;
    float: none;
    width: 305px;
    height: 124px;
    margin-left: auto;
    margin-right: auto;
    background-image: url("../images/logo-dark.gif");
    background-position: top center;
    background-repeat: no-repeat;
    transition: opacity 200ms ease-in-out;
}

#switch-theme {
    padding: 0;
    border: 0;
}

#site-header[theme="light"] > .center > .logo {
    background-image: url("../images/cms-logotype2.png");
}

#site-header > .center > .logo:hover {
    opacity: .84;
}

#site-header > .center {
    position: relative;
}

.metro-header-hubbies {
    position: relative;
    z-index: 12;
    display: flex;
    grid-column: 1;
    grid-row: 1;
    justify-self: stretch;
    align-items: center;
    justify-content: center;
    flex-direction: row;
    gap: 5px;
    text-align: center;
    text-transform: uppercase;
}

.metro-header-hubbies img {
    width: 21px;
    height: 21px;
    image-rendering: pixelated;
}

.metro-header-hubbies strong {
    color: #3c3f51;
    font-size: 13px;
    line-height: 14px;
    cursor: pointer;
    font-weight: 700;
    text-transform: uppercase;
}

.metro-header-hubbies span {
    color: #3c3f51;
    font-size: 11px;
    line-height: 12px;
    cursor: pointer;
    font-weight: 700;
    text-transform: uppercase;
}

#site-header > .down > .btn[theme] {
    background-color: #59b656;
    color: #fff;
}

#site-header > .down > .btn[theme]:hover {
    background-color: #59b656;
    color: #fff;
    opacity: .84;
}

#site-header > .down > .btn[theme]:active {
    background-color: #59b656;
    color: #fff;
    opacity: .72;
}

#site-header > .down > .metro-header-hubbies[theme],
#site-header > .down > .metro-header-hubbies[theme]:hover,
#site-header > .down > .metro-header-hubbies[theme]:active {
    background: #ffffff;
    background-color: #ffffff;
    color: #3c3f51;
}

#site-header > .down > .header-navbar {
    width: 100%;
    height: 50px;
    float: none;
    grid-column: 2;
    margin-top: 15px;
    margin-left: 0;
    margin-right: 0;
    border-radius: 10px;
    background-color: #fff;
    box-shadow: 0 0 0 1px rgba(26, 40, 49, .1) inset;
    z-index: 10;
}

#site-header > .down {
    width: 81%;
    display: grid;
    grid-template-columns: 200px minmax(0, 1fr) 200px;
    column-gap: 15px;
    float: none;
    clear: both;
    margin-left: auto;
    margin-right: auto;
    align-items: start;
    transition: 200ms ease-in-out padding;
}

#site-header > .down > .btn:not(.right) {
    width: 200px;
    grid-column: 1;
}

#site-header > .down > .btn.right {
    grid-column: 3;
}

#site-header > .down > .header-navbar > ul.navigation {
    width: 100%;
    height: 50px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 24px;
    padding: 0 18px;
    margin: 0;
}

#site-header > .down > .header-navbar > ul.navigation > li {
    height: 50px;
    flex: 0 0 auto;
    list-style: none;
}

#site-header > .down > .header-navbar > ul.navigation > li > span {
    display: block;
    height: 50px;
    line-height: 50px;
    color: #3c3f51;
    cursor: pointer;
    font-size: 14px;
    font-weight: 700;
    text-transform: uppercase;
    transition: color 150ms ease-in-out;
}

#site-header > .down > .header-navbar > ul.navigation > li:hover > span,
#site-header > .down > .header-navbar > ul.navigation > li:focus-within > span {
    color: #f27e46;
}

#site-header > .down > .header-navbar > ul.navigation > li > .sub {
    display: none;
    position: absolute;
    top: calc(100% - 2px);
    left: 50%;
    min-width: 170px;
    padding: 12px 18px;
    border: 2px solid #fff;
    border-radius: 10px;
    background-color: #eaeaea;
    box-shadow: 0 8px 20px rgba(26, 40, 49, .18);
    list-style: none;
    transform: translateX(-50%);
    white-space: nowrap;
    z-index: 20;
}

#site-header > .down > .header-navbar > ul.navigation > li:hover > .sub,
#site-header > .down > .header-navbar > ul.navigation > li:focus-within > .sub {
    display: block;
}

#site-header > .down > .header-navbar > ul.navigation > li > .sub > li > a {
    display: block;
    line-height: 30px;
    color: #3c3f51;
    font-size: 14px;
    transition: color 150ms ease-in-out;
}

#site-header > .down > .header-navbar > ul.navigation > li > .sub > li > a:hover,
#site-header > .down > .header-navbar > ul.navigation > li > .sub > li > a:focus-visible {
    color: #f27e46;
}

#site-header[theme="dark"] > .down > .header-navbar {
    background-color: #282a34;
    box-shadow: 0 0 0 1px rgba(255, 255, 255, .08) inset;
}

#site-header[theme="dark"] > .down > .header-navbar > ul.navigation > li > span {
    color: #ffffff;
}

#site-header[theme="dark"] > .down > .header-navbar > ul.navigation > li > .sub {
    border-color: #282a34;
    background-color: #3c3f51;
}

#site-header[theme="dark"] > .down > .header-navbar > ul.navigation > li > .sub > li > a {
    color: #ffffff;
}

.slidernews[theme] > .cubes > .cube.active {
    background-color: #f27e46;
}

body .global-box[theme="light"] > .content > p b,
body .global-box[theme="light"] > .content > p a {
    color: #c47c47;
}

#footer,
#footer[theme="light"] {
    margin-top: 0;
    padding: 46px 0 100px;
    background-image: none;
}

.page.staff > #footer,
.page.staff > #footer[theme="light"] {
    padding-top: 0;
}

.encelade-news-image {
    display: block;
    width: 100%;
    margin-bottom: 12px;
    border-radius: 8px;
}

.encelade-news-body {
    white-space: normal;
}

.encelade-news-body img {
    display: block;
    max-width: 100%;
    height: auto;
    margin: 12px 0;
    border-radius: 10px;
}

.encelade-news-format { color: inherit; text-align: inherit; }
.encelade-news-format p, .encelade-news-format h1, .encelade-news-format h2,
.encelade-news-format h3, .encelade-news-format strong, .encelade-news-format em { color: inherit; }
.encelade-news-format img { display: inline-block; }

.encelade-news-body > :first-child {
    margin-top: 0;
}

.encelade-news-body > :last-child {
    margin-bottom: 0;
}

.encelade-news-markdown-list-item {
    margin: 5px 0;
}

.encelade-news-markdown-list-item::before {
    margin-right: 8px;
    color: #f27e46;
    content: "•";
}

.encelade-news-date {
    display: block;
    margin-top: 10px;
    color: #999;
}

.page.photos .box-photo > .picture-info-overlay > .overlay-content-small {
    position: absolute;
    inset: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-end;
    padding: 12px;
}

.page.photos .box-photo > .picture-info-overlay > .overlay-content-small > img {
    margin: 0 0 4px;
}

.page.photos .box-photo > .picture-info-overlay > .overlay-content-small > .right-content {
    position: static;
    width: auto;
}

* {
    box-sizing: border-box;
    scrollbar-width: thin;
    scrollbar-color: #f27e46 transparent;
}

*::-webkit-scrollbar {
    width: 10px;
    height: 10px;
}

*::-webkit-scrollbar-track {
    background: transparent;
}

*::-webkit-scrollbar-thumb {
    border: 2px solid transparent;
    border-radius: 10px;
    background: #f27e46;
    background-clip: padding-box;
}

*::-webkit-scrollbar-thumb:hover {
    background: #f27e46b5;
    background-clip: padding-box;
}

.encelade-feedback {
    width: 100%;
    margin: 12px 0 0;
    padding: 10px 14px;
    border-radius: 8px;
    color: #fff;
    font-size: 14px;
    font-weight: 600;
    display: flex;
}

#footer[theme] > .links > a,
.page.events > .left .last > .content > a:hover,
.page.events > .left .last > .content > a.slc,
.page.events > .right .comments > .box-comment > .content > .right > .top > a {
    color: #f27e46;
}

.page.staff > .content > .col > .list > .content > .error {
    width: 100%;
    float: left;
    clear: both;
    margin-top: 15px;
    color: #3c3f51;
    opacity: 0.8;
    font-size: 14px;
}

.box-new-dedicace > .content > form > .input-group {
    margin-bottom: 6px;
}

.md-photo-control[theme] > .title > .avatar,
.md-photo-control[theme] > .content > .actions .btn.like,
.box-new-dedicace > .content > form > .input-group > input[type="submit"][theme] {
    background-color: #f27e46;
}

.md-photo-control[theme] > .content > .actions .btn.like:hover,
.box-new-dedicace > .content > form > .input-group > input[type="submit"][theme]:hover {
    background-color: #f27e46b5;
}

.page.photos > .content > .left > .btn[theme] {
    background-color: #f27e46;
    color: #ffffff;
}

.page.photos > .content > .left > .btn[theme]:hover {
    background-color: #f27e46b5;
}

:is(
    .mb-surprise > .content > .button[theme="light"],
    .panel-moving-blocks > .content button[theme="light"],
    .panel-moving-blocks > .content button.reset[theme="light"],
    .page.create[theme="light"] > .center > .step > .right > .input > input[type="submit"],
    .page.login > .center-2fa > .twofa_verification_box > .input > .btn[theme="light"],
    .page.login[theme="light"] > .center > form > .input > input[type="submit"],
    .page.login[theme="light"] > .center-2fa > .twofa_verification_box > .input > .btn,
    #settings > .forms > .box > .content > .btn[theme="light"],
    .page.homepage > .homepage > .title > .right > .btn[theme="light"],
    .page.photos > .content > .left > .btn[theme="light"],
    .page.jobs > .content > .form > .content > form.form > .input > input[type="submit"][theme="light"],
    .page.jobs[theme="light"] > .content > .form > .content > form.form > .input > input[type="submit"],
    .page.room > .left.room > .btn[theme="light"],
    .md-photo-control[theme="light"] > .content > .actions .btn.like,
    .ask-for-couple > .content > input[type="submit"][theme="light"],
    .my-couple > .content > .btn[theme="light"],
    .my-couple > .content > .btn.cancel[theme="light"],
    .box-buy-winwins > .content > .btn[theme="light"],
    .box-buy-badges-pack > .content > .pack > .content > .line > .btn[theme="light"],
    .box-buy-badges > .content > .badge > .content > .line > .btn[theme="light"],
    .box-buy-personalized-badge > .content > .btn[theme="light"],
    .box-convector > .content > .line > .button[theme="light"],
    .box-new-dedicace > .content > form > .input-group > input[type="submit"][theme="light"],
    .box-flagme > .content > form > .form-group > input[type="submit"][theme="light"],
    .badge-maker > .content > .informations > button[theme="light"],
    .buy-group > button[theme="light"],
    .global-box.toroloto > .content > .win > .btn[theme="light"],
    .blackmarket-encheres > .content > .item > .top > .case > .center > .inputs > input[type="submit"][theme="light"],
    .blackmarket-enigmes > .enigmes > .col > .enigme > .content > form > input[type="submit"][theme="light"],
    .new-ticket > .content > form.form > .input > input[type="submit"][theme="light"],
    .box-my-tickets > .content > .ticket > .body > .btn[theme="light"],
    .page.forum > .forum > .content.comments > .btn[theme="light"],
    .page.forum > .forum > .content.comments > .create-response > .content > input[type="submit"][theme="light"],
    .page.forum > .forum > .content.comments .edit-response > .content > input[type="submit"][theme="light"],
    .page.forum.create > .content > .form > .content > form.form > .input > input[type="submit"][theme="light"],
    .page.forum.create[theme="light"] > .content > .form > .content > form.form > .input > input[type="submit"]
) {
    background-color: #f27e46;
    color: #ffffff;
}

:is(
    .mb-surprise > .content > .button[theme="light"],
    .panel-moving-blocks > .content button[theme="light"],
    .page.create[theme="light"] > .center > .step > .right > .input > input[type="submit"],
    .page.login > .center-2fa > .twofa_verification_box > .input > .btn[theme="light"],
    .page.login[theme="light"] > .center > form > .input > input[type="submit"],
    .page.login[theme="light"] > .center-2fa > .twofa_verification_box > .input > .btn,
    #settings > .forms > .box > .content > .btn[theme="light"],
    .page.homepage > .homepage > .title > .right > .btn[theme="light"],
    .page.photos > .content > .left > .btn[theme="light"],
    .page.jobs > .content > .form > .content > form.form > .input > input[type="submit"][theme="light"],
    .page.jobs[theme="light"] > .content > .form > .content > form.form > .input > input[type="submit"],
    .page.room > .left.room > .btn[theme="light"],
    .md-photo-control[theme="light"] > .content > .actions .btn.like,
    .ask-for-couple > .content > input[type="submit"][theme="light"],
    .my-couple > .content > .btn[theme="light"],
    .box-buy-winwins > .content > .btn[theme="light"],
    .box-buy-badges-pack > .content > .pack > .content > .line > .btn[theme="light"],
    .box-buy-badges > .content > .badge > .content > .line > .btn[theme="light"],
    .box-buy-personalized-badge > .content > .btn[theme="light"],
    .box-convector > .content > .line > .button[theme="light"],
    .box-new-dedicace > .content > form > .input-group > input[type="submit"][theme="light"],
    .box-flagme > .content > form > .form-group > input[type="submit"][theme="light"],
    .badge-maker > .content > .informations > button[theme="light"],
    .buy-group > button[theme="light"],
    .global-box.toroloto > .content > .win > .btn[theme="light"],
    .blackmarket-encheres > .content > .item > .top > .case > .center > .inputs > input[type="submit"][theme="light"],
    .blackmarket-enigmes > .enigmes > .col > .enigme > .content > form > input[type="submit"][theme="light"],
    .new-ticket > .content > form.form > .input > input[type="submit"][theme="light"],
    .box-my-tickets > .content > .ticket > .body > .btn[theme="light"],
    .page.forum > .forum > .content.comments > .btn[theme="light"],
    .page.forum > .forum > .content.comments > .create-response > .content > input[type="submit"][theme="light"],
    .page.forum > .forum > .content.comments .edit-response > .content > input[type="submit"][theme="light"],
    .page.forum.create > .content > .form > .content > form.form > .input > input[type="submit"][theme="light"],
    .page.forum.create[theme="light"] > .content > .form > .content > form.form > .input > input[type="submit"]
):hover {
    background-color: #f27e46b5;
}

.app[theme="dark"] :is(
    .mb-surprise > .content > .button,
    .panel-moving-blocks > .content button,
    .page.create > .center > .step > .right > .input > input[type="submit"],
    .page.login > .center-2fa > .twofa_verification_box > .input > .btn,
    .page.login > .center > form > .input > input[type="submit"],
    #settings > .forms > .box > .content > .btn,
    .page.homepage > .homepage > .title > .right > .btn,
    .page.photos > .content > .left > .btn,
    .page.jobs > .content > .form > .content > form.form > .input > input[type="submit"],
    .page.room > .left.room > .btn,
    .md-photo-control > .content > .actions .btn.like,
    .ask-for-couple > .content > input[type="submit"],
    .my-couple > .content > .btn,
    .box-buy-winwins > .content > .btn,
    .box-buy-badges-pack > .content > .pack > .content > .line > .btn,
    .box-buy-badges > .content > .badge > .content > .line > .btn,
    .box-buy-personalized-badge > .content > .btn,
    .box-convector > .content > .line > .button,
    .box-new-dedicace > .content > form > .input-group > input[type="submit"],
    .box-flagme > .content > form > .form-group > input[type="submit"],
    .badge-maker > .content > .informations > button,
    .buy-group > button,
    .global-box.toroloto > .content > .win > .btn,
    .blackmarket-encheres > .content > .item > .top > .case > .center > .inputs > input[type="submit"],
    .blackmarket-enigmes > .enigmes > .col > .enigme > .content > form > input[type="submit"],
    .new-ticket > .content > form.form > .input > input[type="submit"],
    .box-my-tickets > .content > .ticket > .body > .btn,
    .page.forum > .forum > .content.comments > .btn,
    .page.forum > .forum > .content.comments > .create-response > .content > input[type="submit"],
    .page.forum > .forum > .content.comments .edit-response > .content > input[type="submit"],
    .page.forum.create > .content > .form > .content > form.form > .input > input[type="submit"]
) {
    background-color: #f27e46;
    color: #ffffff;
}

.app[theme="dark"] :is(
    .mb-surprise > .content > .button,
    .panel-moving-blocks > .content button,
    .page.create > .center > .step > .right > .input > input[type="submit"],
    .page.login > .center-2fa > .twofa_verification_box > .input > .btn,
    .page.login > .center > form > .input > input[type="submit"],
    #settings > .forms > .box > .content > .btn,
    .page.homepage > .homepage > .title > .right > .btn,
    .page.photos > .content > .left > .btn,
    .page.jobs > .content > .form > .content > form.form > .input > input[type="submit"],
    .page.room > .left.room > .btn,
    .ask-for-couple > .content > input[type="submit"],
    .my-couple > .content > .btn,
    .box-buy-winwins > .content > .btn,
    .box-buy-badges-pack > .content > .pack > .content > .line > .btn,
    .box-buy-badges > .content > .badge > .content > .line > .btn,
    .box-buy-personalized-badge > .content > .btn,
    .box-convector > .content > .line > .button,
    .box-new-dedicace > .content > form > .input-group > input[type="submit"],
    .box-flagme > .content > form > .form-group > input[type="submit"],
    .badge-maker > .content > .informations > button,
    .buy-group > button,
    .global-box.toroloto > .content > .win > .btn,
    .blackmarket-encheres > .content > .item > .top > .case > .center > .inputs > input[type="submit"],
    .blackmarket-enigmes > .enigmes > .col > .enigme > .content > form > input[type="submit"],
    .new-ticket > .content > form.form > .input > input[type="submit"],
    .box-my-tickets > .content > .ticket > .body > .btn,
    .page.forum > .forum > .content.comments > .btn,
    .page.forum > .forum > .content.comments > .create-response > .content > input[type="submit"],
    .page.forum > .forum > .content.comments .edit-response > .content > input[type="submit"],
    .page.forum.create > .content > .form > .content > form.form > .input > input[type="submit"]
):hover {
    background-color: #f27e46b5;
}

.md-photo-control > .content > .likes {
    align-items: center;
}

.md-photo-control > .content > .likes > .encelade-photo-like-icon {
    margin: 5px 6px 0 -5px;
    image-rendering: pixelated;
}

.md-photo-control > .content > .likes > .encelade-photo-like-icon + p {
    margin-left: 0;
}

.encelade-feedback--error {
    position: relative;
    top: 5px;
    margin-top: 4px;
    background: #ff3e48;
    color: #fff !important;
}

.encelade-feedback--success {
    position: relative;
    top: 4px;
    background: #59b656;
    color: #fff !important;
}

.page.blackmarket .blackmarket-enigmes {
    width: 100%;
    float: left;
    clear: both;
}

.page.blackmarket .encelade-riddle-balance {
    display: inline-flex;
    margin: 18px 0 0;
    padding: 9px 13px;
    border-radius: 8px;
    background: #eaeaea;
    color: #3c3f51;
    font-size: 13px;
    font-weight: 700;
}

.page.blackmarket .blackmarket-enigmes > .enigmes > .col > .enigme {
    margin-top: 15px;
}

.page.blackmarket .blackmarket-enigmes > .enigmes > .col > .enigme > .content > .description {
    line-height: 1.55;
}

.page.blackmarket .blackmarket-enigmes input[type="submit"]:disabled {
    cursor: wait;
    opacity: 0.65;
}

@media (max-width: 760px) {
    .page.blackmarket .blackmarket-enigmes > .enigmes {
        width: 100%;
    }

    .page.blackmarket .blackmarket-enigmes > .enigmes > .col {
        width: 100%;
        margin-right: 0;
    }

    .page.blackmarket .blackmarket-enigmes > .enigmes > .col > .enigme {
        margin-right: 0;
    }
}

.encelade-live-panel {
    width: min(1350px, calc(100% - 40px));
    margin: 30px auto;
    float: none;
    clear: both;
}

.encelade-live-panel__content {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
    gap: 12px;
}

.encelade-live-ranking {
    min-height: 72px;
    display: grid;
    grid-template-columns: 32px 54px 1fr auto;
    align-items: center;
    gap: 10px;
    padding: 8px 12px;
    border-radius: 9px;
    background: #f1f1f1;
    color: #3c3f51;
}

.encelade-live-ranking > img {
    width: 54px;
    height: 54px;
    object-fit: contain;
    image-rendering: pixelated;
}

.encelade-live-photo {
    margin: 0;
    overflow: hidden;
    border-radius: 9px;
    background: #f1f1f1;
}

.encelade-live-photo > img {
    width: 100%;
    aspect-ratio: 4 / 3;
    display: block;
    object-fit: cover;
}

.encelade-live-photo > figcaption,
.encelade-live-group {
    padding: 10px 12px;
    color: #3c3f51;
}

.encelade-live-group {
    border-radius: 9px;
    background: #f1f1f1;
}

.encelade-live-group > p {
    margin: 6px 0;
}

.encelade-support-select {
    width: 100%;
    min-height: 42px;
    margin: 0 0 8px;
    padding: 0 12px;
    border: 1px solid #c5ccd5;
    border-radius: 5px;
    background: #fff;
    color: #27384a;
}

.encelade-ticket {
    margin: 0 0 12px;
    padding: 12px;
    border: 1px solid #d7dde5;
    border-left: 4px solid #3a9f61;
    border-radius: 5px;
    background: #fff;
}

.encelade-ticket--pending { border-left-color: #e1a839; }
.encelade-ticket--closed { border-left-color: #8994a2; }

.encelade-ticket header {
    display: flex;
    justify-content: space-between;
    gap: 12px;
}

.encelade-ticket p,
.encelade-ticket blockquote {
    white-space: pre-wrap;
}

.encelade-ticket blockquote {
    margin: 10px 0 0;
    padding: 10px;
    border-left: 3px solid #61a9d8;
    background: #edf6fc;
}

.encelade-shop-offer {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: center;
    gap: 12px;
    min-width: 260px;
    padding: 12px;
    border: 1px solid #d6dce4;
    border-radius: 6px;
    background: #fff;
}

.encelade-shop-offer img {
    width: 42px;
    height: 42px;
    object-fit: contain;
    image-rendering: pixelated;
}

.encelade-shop-offer strong,
.encelade-shop-offer small {
    grid-column: 2;
}

.encelade-shop-offer button {
    grid-column: 3;
    grid-row: 1 / span 2;
}

.encelade-forum-category-link,
.encelade-forum-thread-link {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 5px 16px;
    padding: 14px 16px;
    border-bottom: 1px solid #d7dde5;
    color: #33465a;
    text-decoration: none;
}

.encelade-forum-category-link > span,
.encelade-forum-thread-link > small {
    grid-column: 1;
}

.encelade-forum-category-link > small,
.encelade-forum-thread-link > time {
    grid-column: 2;
    grid-row: 1 / span 2;
    align-self: center;
}

.encelade-forum-category-link:hover,
.encelade-forum-thread-link:hover {
    background: #edf6fc;
}

.encelade-forum-post {
    margin: 0 0 14px;
    overflow: hidden;
    border: 1px solid #ccd5df;
    border-radius: 7px;
    background: #fff;
}

.encelade-forum-post > header {
    display: grid;
    grid-template-columns: 42px 1fr auto;
    align-items: center;
    gap: 10px;
    padding: 8px 12px;
    background: #eaf1f7;
}

.encelade-forum-post > header img {
    width: 42px;
    height: 42px;
    object-fit: contain;
    image-rendering: pixelated;
}

.encelade-forum-post > p {
    min-height: 70px;
    margin: 0;
    padding: 16px;
    white-space: pre-wrap;
}

.encelade-forum-post--reply {
    margin-left: 22px;
}

.encelade-forum-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 14px;
    padding: 10px 15px;
}

.encelade-forum-empty {
    padding: 18px;
    text-align: center;
    width: 100%;
    margin-bottom: 22px;
    background-color: #ff1010;
    color: white !important;
}

.page.forum[theme="light"] > .forum > .content.thread > .body > .top,
.page.forum[theme="light"] > .forum > .content.comments > .comment > .body > .top,
.page.forum[theme="light"] > .forum > .content.thread > .body > .informations,
.page.forum[theme="light"] > .forum > .content.comments > .comment > .body > .informations {
    background-color: #fff;
}

.page.forum > .forum > .header > h1 {
    margin: 0 5px 0 12px;
}

.encelade-inline-currency {
    max-width: 18px;
    max-height: 18px;
    margin-left: 3px;
    vertical-align: middle;
    image-rendering: pixelated;
}

.global-box.toroloto > .content > button.frank {
    padding: 0;
    border: 0;
    background-color: transparent;
}

.global-box.toroloto > .content > .win[hidden] {
    display: none !important;
}

.global-box.toroloto > .content > .win > button.btn {
    border: 0;
}

.page.casino-toroloto .content.flex > .mobi > img {
    image-rendering: pixelated;
}

.page.casino-toroloto [data-toroloto-badges] {
    display: grid;
    grid-template-columns: repeat(8, minmax(0, 1fr));
    gap: 10px;
}

.page.casino-toroloto [data-toroloto-badges] > .badge {
    float: none;
    width: 100%;
    min-width: 0;
    margin: 0;
}

.page.casino-toroloto [data-toroloto-badges] > .badge > span {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.page.casino-toroloto .encelade-toroloto-balance {
    margin-top: 8px;
    color: #f27e46;
    font-weight: 700;
}

.page.items [data-rare-tier].slc {
    color: #f27e46 !important;
}

.page.items [data-rare-items] > .encelade-forum-empty {
    width: calc(100% - 15px);
    margin-top: 15px;
}

.encelade-market-open-client {
    min-height: 35px;
    margin-top: 8px;
    padding: 0 12px;
    border: 0;
    border-radius: 10px;
    background: #f27e46;
    color: #fff;
    cursor: pointer;
    font-size: 12px;
    font-weight: 700;
}

.encelade-market-open-client:hover {
    background: #f27e46b5;
}

.blackmarket-encheres > .content > .encelade-forum-empty {
    margin-bottom: 0;
}

.page.forum .tt-txtarea [data-forum-editor] img {
    display: block;
    max-width: 100%;
    max-height: 500px;
    margin: 6px 0;
    object-fit: contain;
}

.page.forum .encelade-forum-inline-editor[hidden],
.page.forum .encelade-forum-report-panel[hidden] {
    display: none !important;
}

.page.forum .encelade-forum-inline-cancel {
    float: left;
    min-height: 45px;
    margin-top: 8px;
    padding: 0 18px;
    border: 0;
    border-radius: 10px;
    background: #dd3f3f;
    color: #fff;
    cursor: pointer;
    font-weight: 700;
}

.page.forum .encelade-forum-report-panel {
    position: relative;
    z-index: 5;
    clear: both;
    padding: 14px 20px;
    background: #fff;
}

.page.forum .encelade-forum-report-panel > form {
    display: flex;
    align-items: center;
    gap: 8px;
}

.page.forum .encelade-forum-report-panel input {
    flex: 1 1 auto;
    min-width: 0;
    height: 42px;
    padding: 0 14px;
    border: 1px solid rgba(60, 63, 81, .18);
    border-radius: 10px;
    color: #3c3f51;
}

.page.forum .encelade-forum-report-panel button {
    min-height: 42px;
    padding: 0 14px;
    border: 0;
    border-radius: 10px;
    background: #f27e46;
    color: #fff;
    cursor: pointer;
    font-weight: 700;
}

.page.forum .encelade-forum-report-panel button:last-child {
    background: #dd3f3f;
}

@media (max-width: 700px) {
    .page.forum .encelade-forum-report-panel > form {
        align-items: stretch;
        flex-direction: column;
    }

    .page.forum .encelade-forum-report-panel input,
    .page.forum .encelade-forum-report-panel button {
        width: 100%;
    }
}

.page.homepage [hidden] {
    display: none !important;
}

.page.homepage > .homepage {
    clear: both;
    width: 100%;
}

.page.homepage > .encelade-homepage-editor {
    z-index: 10001;
}

.page.homepage > .encelade-homepage-editor.visible {
    pointer-events: auto;
}

.page.homepage > .homepage > .inner.is-editing {
    outline: 2px dashed rgba(242, 126, 70, 0.8);
    outline-offset: -2px;
}

.page.homepage > .homepage > .inner.is-editing > .widget {
    cursor: move;
}

.page.homepage > .homepage > .inner.is-editing > .widget:hover {
    filter: drop-shadow(0 0 5px rgba(242, 126, 70, 0.8));
}

.encelade-homepage-editor > .title > .close {
    min-width: 50px;
    text-align: center;
}

.encelade-homepage-editor > .content > .list {
    display: block;
    width: 100%;
    min-height: 38px;
    margin-top: 10px;
    padding: 0 12px;
    border: 1px solid rgba(60, 63, 81, 0.15);
    border-radius: 8px;
    background: #fff;
    color: #3c3f51;
    font-size: 12px;
}

.encelade-homepage-editor > .content > button[theme="light"] {
    width: 100%;
    margin-top: 18px;
    background-color: #f27e46;
    color: #fff;
}

.encelade-homepage-editor > .content > button[theme="light"]:hover {
    background-color: #f27e46b5;
}

.page.homepage > .homepage > .inner > .widget > .widget-edit > .content > .encelade-homepage-widget-remove {
    float: left;
    clear: both;
    width: 100%;
    min-height: 30px;
    margin: 0 0 10px;
    border: 0;
    border-radius: 8px;
    background: #dd3f3f;
    color: #fff;
    cursor: pointer;
    font-size: 12px;
    font-weight: 700;
}

.page.homepage > .homepage > .inner > .widget > .widget-edit > .content > .encelade-homepage-widget-remove:hover {
    background: #ff3e48;
}

.page.homepage > .homepage > .inner > .friends-widget > .widget-body,
.page.homepage > .homepage > .inner > .rooms-widget > .widget-body,
.page.homepage > .homepage > .inner > .groups-widget > .widget-body {
    height: 250px;
    overflow: hidden;
    padding: 0 !important;
}

.page.homepage > .homepage > .inner > .widget > .widget-body > .encelade-homepage-widget-scroll,
.page.homepage > .homepage > .inner > .badges-widget > .widget-body > .badges {
    display: flow-root;
    width: 100%;
    height: 100%;
    overflow-x: hidden;
    overflow-y: auto;
    overscroll-behavior: contain;
    touch-action: pan-y;
    scrollbar-width: none;
    -ms-overflow-style: none;
}

.page.homepage > .homepage > .inner > .widget > .widget-body > .encelade-homepage-widget-scroll {
    padding: 0 18px 18px;
}

.page.homepage > .homepage > .inner > .widget > .widget-body > .encelade-homepage-widget-scroll::-webkit-scrollbar,
.page.homepage > .homepage > .inner > .badges-widget > .widget-body > .badges::-webkit-scrollbar {
    display: none;
    width: 0;
    height: 0;
}

.page.homepage > .homepage > .inner > .friends-widget > .widget-body > .encelade-homepage-widget-scroll > p,
.page.homepage > .homepage > .inner > .rooms-widget > .widget-body > .encelade-homepage-widget-scroll > p,
.page.homepage > .homepage > .inner > .groups-widget > .widget-body > .encelade-homepage-widget-scroll > p {
    float: left;
    clear: both;
    width: 100%;
    margin: 0;
    padding: 7px 4px;
    border-bottom: 1px dashed rgba(60, 63, 81, 0.22);
    color: #3c3f51;
    font-size: 12px;
    line-height: 17px;
}

.page.homepage > .homepage > .inner > .friends-widget > .widget-body > .encelade-homepage-widget-scroll > p {
    display: flex;
    align-items: center;
    gap: 6px;
}

.page.homepage > .homepage > .inner > .friends-widget > .widget-body > .encelade-homepage-widget-scroll > p > img {
    flex: 0 0 auto;
    image-rendering: pixelated;
}

.page.homepage > .homepage > .inner > .rooms-widget > .widget-body > .encelade-homepage-widget-scroll > p {
    display: flex;
    align-items: center;
    gap: 9px;
}

.page.homepage > .homepage > .inner > .rooms-widget > .widget-body > .encelade-homepage-widget-scroll > p > .encelade-homepage-room-image {
    width: 47px;
    height: 47px;
    flex: 0 0 47px;
    object-fit: contain;
    image-rendering: pixelated;
}

.page.homepage > .homepage > .inner > .rooms-widget > .widget-body > .encelade-homepage-widget-scroll > p > .encelade-homepage-room-details {
    min-width: 0;
    overflow: hidden;
}

.page.homepage > .homepage > .inner > .friends-widget > .widget-body > .encelade-homepage-widget-scroll > p > a,
.page.homepage > .homepage > .inner > .rooms-widget > .widget-body > .encelade-homepage-widget-scroll > p > .encelade-homepage-room-details > b,
.page.homepage > .homepage > .inner > .groups-widget > .widget-body > .encelade-homepage-widget-scroll > p > b {
    color: #3c3f51;
    font-weight: 700;
}

.page.homepage > .homepage > .inner > .groups-widget > .widget-body > .encelade-homepage-widget-scroll > p {
    display: flex;
    align-items: center;
    gap: 7px;
}

.page.homepage > .homepage > .inner > .groups-widget > .widget-body > .encelade-homepage-widget-scroll > p > img {
    width: 35px;
    height: 35px;
    object-fit: contain;
    image-rendering: pixelated;
}

html,
body {
    min-width: 1420px;
    min-height: 100%;
}

body {
    margin: 0;
    /* overflow-x: hidden; */
}

html.frontend-hotel-document,
body.frontend-hotel-body {
    width: 100%;
    min-width: 0;
    height: 100%;
    min-height: 0;
    overflow: hidden;
    background: #0b0f19;
}

.frontend-hotel-app,
.page.frontend-hotel-page {
    position: fixed;
    inset: 0;
    width: 100% !important;
    max-width: none !important;
    height: 100% !important;
    min-height: 0 !important;
    margin: 0 !important;
    overflow: hidden;
    background: #0b0f19;
}

.page.frontend-hotel-page > iframe {
    position: absolute;
    z-index: 1;
    inset: 0;
    display: block;
    width: 100%;
    height: 100%;
    border: 0;
    background: #0b0f19;
}

/*
 * Grille de contenu fixe d'Encelade.
 * La page conserve ses 1350 px, avec une zone utile de 1050 px centrée.
 */
.page:is(
    .blackmarket,
    .casino-toroloto,
    .couples,
    .enables-handitems,
    .events,
    .forum,
    .gamers,
    .help-attitude,
    .help-newbie,
    .help-safety,
    .help-tickets,
    .help-tutos,
    .homepage,
    .items,
    .jobs,
    .organisations,
    .photos,
    .profile,
    .room,
    .settings-page,
    .shop-badges,
    .shop-convector,
    .shop-dedicaces,
    .shop-home,
    .shop-megapack,
    .staff,
    .top-demi
) {
    display: grid;
    grid-template-columns: 150px minmax(0, 1050px) 150px;
    grid-auto-flow: row dense;
    align-items: start;
}

.page:is(
    .blackmarket,
    .casino-toroloto,
    .couples,
    .enables-handitems,
    .events,
    .forum,
    .gamers,
    .help-attitude,
    .help-newbie,
    .help-safety,
    .help-tickets,
    .help-tutos,
    .homepage,
    .items,
    .jobs,
    .organisations,
    .photos,
    .profile,
    .room,
    .settings-page,
    .shop-badges,
    .shop-convector,
    .shop-dedicaces,
    .shop-home,
    .shop-megapack,
    .staff,
    .top-demi
) > #site-header,
.page:is(
    .blackmarket,
    .casino-toroloto,
    .couples,
    .enables-handitems,
    .events,
    .forum,
    .gamers,
    .help-attitude,
    .help-newbie,
    .help-safety,
    .help-tickets,
    .help-tutos,
    .homepage,
    .items,
    .jobs,
    .organisations,
    .photos,
    .profile,
    .room,
    .settings-page,
    .shop-badges,
    .shop-convector,
    .shop-dedicaces,
    .shop-home,
    .shop-megapack,
    .staff,
    .top-demi
) > #footer {
    grid-column: 1 / -1;
    width: 100%;
}

.page:is(
    .blackmarket,
    .casino-toroloto,
    .couples,
    .enables-handitems,
    .events,
    .forum,
    .gamers,
    .help-attitude,
    .help-newbie,
    .help-safety,
    .help-tickets,
    .help-tutos,
    .homepage,
    .items,
    .jobs,
    .organisations,
    .photos,
    .profile,
    .room,
    .settings-page,
    .shop-badges,
    .shop-convector,
    .shop-dedicaces,
    .shop-home,
    .shop-megapack,
    .staff,
    .top-demi
) > :where(:not(#site-header):not(#footer):not(.panel-moving-blocks)) {
    grid-column: 2;
    width: 100%;
    max-width: none;
    float: none;
    left: 0;
    margin-left: 0;
    margin-right: 0;
}

/* Pages dont les colonnes sont directement sous .page. */
.page.enables-handitems {
    grid-template-columns: 150px 300px 15px minmax(0, 735px) 150px;
}

.page.enables-handitems > .left,
.page.help-tickets > .left,
.page.events > .left,
.page.shop-convector > .left,
.page.shop-dedicaces > .left,
.page.shop-home > .left,
.page.profile > .left,
.page.casino-toroloto > .left {
    grid-column: 2;
}

.page.enables-handitems > .right,
.page.help-tickets > .right,
.page.events > .right,
.page.shop-convector > .right,
.page.shop-dedicaces > .right,
.page.shop-home > .right,
.page.profile > .right,
.page.casino-toroloto > .right {
    grid-column: 4;
}

.page.enables-handitems > .left,
.page.enables-handitems > .right,
.page.help-tickets > .left,
.page.help-tickets > .right,
.page.events > .left,
.page.events > .right,
.page.shop-convector > .full,
.page.shop-convector > .left,
.page.shop-convector > .right,
.page.shop-dedicaces > .left,
.page.shop-dedicaces > .right,
.page.shop-home > .left,
.page.shop-home > .right,
.page.profile > .full,
.page.profile > .left,
.page.profile > .right,
.page.casino-toroloto > .left,
.page.casino-toroloto > .right {
    width: 100%;
    max-width: none;
    margin-left: 0;
    margin-right: 0;
    float: none;
    left: 0;
}

.page.help-tickets {
    grid-template-columns: 150px 640px 15px minmax(0, 395px) 150px;
}

.page.events {
    grid-template-columns: 150px 360px 15px minmax(0, 675px) 150px;
}

.page.events > .left + .right {
    margin-top: -14px;
}

.page.shop-convector,
.page.shop-dedicaces {
    grid-template-columns: 150px minmax(0, 517.5px) 15px minmax(0, 517.5px) 150px;
}

.page.shop-convector > .full {
    grid-column: 2 / 5;
}

.page.shop-home {
    grid-template-columns: 150px 605px 15px minmax(0, 430px) 150px;
}

.page.shop-megapack {
    grid-template-columns: 150px minmax(0, 340px) 15px minmax(0, 340px) 15px minmax(0, 340px) 150px;
}

.page.shop-megapack > .col {
    grid-column: 2;
    width: 100%;
    max-width: none;
    margin-left: 0;
    margin-right: 0;
    float: none;
    left: 0;
}

.page.shop-megapack > .col + .col {
    grid-column: 4;
}

.page.shop-megapack > .col + .col + .col {
    grid-column: 6;
}

.page.casino-toroloto {
    grid-template-columns: 150px 610px 15px minmax(0, 425px) 150px;
}

.page.casino-toroloto > .right + .right,
.page.casino-toroloto > .left + .left {
    display: none;
}

.page.profile {
    grid-template-columns: 150px 600px 15px minmax(0, 435px) 150px;
}

.page.profile > .full {
    grid-column: 2 / 5;
}

.page.profile > .left:empty,
.page.profile > .right:empty {
    display: none;
}

/* Pages avec une enveloppe .content autour des colonnes. */
.page.items > .content,
.page.photos > .content,
.page.settings-page > .content {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    align-items: start;
}

.page.settings-page #settings {
    display: grid;
    grid-template-columns: 235px minmax(0, 1fr);
    gap: 15px;
    align-items: start;
    width: 100%;
}

.page.settings-page #settings > .settings-categories {
    grid-column: 1;
    grid-row: 1 / span 2;
    display: grid;
    width: 100%;
    margin-top: 15px;
    overflow: hidden;
    border-radius: 10px;
    background: #ffffff;
    box-shadow: 0 0 0 1px rgba(26, 40, 49, 0.1) inset;
}

.page.settings-page #settings > .settings-categories > .title {
    min-height: 50px;
    padding: 0 16px;
    background: #f27e46;
    color: #ffffff;
    font-size: 16px;
    font-weight: 700;
    line-height: 50px;
}

.page.settings-page .settings-category {
    display: grid;
    grid-template-columns: 24px minmax(0, 1fr);
    align-items: center;
    gap: 10px;
    min-height: 54px;
    padding: 9px 13px;
    border: 0;
    border-bottom: 1px solid #eaeaea;
    background: #ffffff;
    color: #3c3f51;
    cursor: pointer;
    text-align: left;
    font-size: 13px;
    font-weight: 600;
    line-height: 1.25;
    transition: 150ms ease-in-out background-color, 150ms ease-in-out color, 150ms ease-in-out box-shadow;
}

.page.settings-page .settings-category:last-child {
    border-bottom: 0;
}

.page.settings-page .settings-category:hover,
.page.settings-page .settings-category.is-active {
    background: #edf6fc;
    color: #365aa3;
}

.page.settings-page .settings-category:focus-visible {
    z-index: 1;
    outline: 2px solid #365aa3;
    outline-offset: -3px;
}

.page.settings-page .settings-category > img {
    image-rendering: pixelated;
}

.page.settings-page #settings > .top,
.page.settings-page #settings > .forms {
    grid-column: 2;
    width: 100%;
    margin-left: 0;
    margin-right: 0;
    float: none;
}

.page.settings-page #settings > .top {
    grid-row: 1;
}

.page.settings-page #settings > .forms {
    grid-row: auto;
}

.page.forum > .forum > .header > a[theme] {
    background-color: #f27e46;
    color: #ffffff;
}

.page.forum > .forum > .header > a[theme]:hover {
    background-color: #df6d37;
}

.page.forum[theme] > .forum > .header.category {
    background-color: #f27e46a8;
}

.page.forum.create[theme] > .content > .form > .content > form.form > .input > input[type="submit"] {
    background-color: #f27e46;
    color: #ffffff;
}

.page.forum.create[theme] > .content > .form > .content > form.form > .input > input[type="submit"]:hover {
    background-color: #df6d37;
}

.page.settings-page #settings > .forms > .box[hidden] {
    display: none !important;
}

.page.settings-page #settings > .forms > .box.is-active {
    display: block;
}

.page.settings-page .settings-pin-status {
    margin-top: 15px;
}

.page.settings-page .settings-pin-status > .content > b {
    font-size: 13px;
}

.app[theme="dark"] .page.settings-page #settings > .settings-categories,
.app[theme="dark"] .page.settings-page .settings-category {
    background-color: #282a34;
}

.app[theme="dark"] .page.settings-page .settings-category {
    border-bottom-color: #3c3f51;
    color: #ffffff;
}

.app[theme="dark"] .page.settings-page .settings-category:hover,
.app[theme="dark"] .page.settings-page .settings-category.is-active {
    background-color: #3c3f51;
    color: #f27e46;
}

.app[theme="dark"] .encelade-packs-balance {
    background-color: #282a34;
    color: #ffffff;
}

.app[theme="dark"] .encelade-packs-balance small {
    color: #ffffff;
    opacity: .66;
}

.page.items > .content > .left,
.page.photos > .content > .left,
.page.settings-page > .content > .global-box,
.page.top-demi > .content > .col {
    width: auto;
    margin-left: 0;
    margin-right: 0;
    float: none;
}

.page.photos > .content > .left:empty {
    display: none;
}

.page.gamers > .content {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 15px;
    align-items: start;
}

.page.gamers > .content > .left,
.page.gamers > .content > .right,
.page.couples > .content > .left,
.page.couples > .content > .right,
.page.organisations > .content > .left,
.page.organisations > .content > .right {
    width: auto;
    margin: 0;
    float: none;
}

.page.couples > .content {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 400px;
    gap: 15px;
    align-items: start;
}

.page.organisations > .content {
    display: grid;
    grid-template-columns: 360px minmax(0, 1fr);
    gap: 15px;
    align-items: start;
}

.page.couples > .content > .left {
    grid-column: 1;
}

.page.couples > .content > .right {
    grid-column: 2;
}

.page.couples > .content > .right:empty {
    display: none;
}

.page.couples > .content > .left > .couples > .title > img {
    float: right;
    margin-top: 2px;
    image-rendering: pixelated;
}

.page.couples .couple-box > .buttons > button.vote {
    border: 0;
    font: inherit;
}

.page.couples .couple-box > .buttons > button.vote:disabled {
    cursor: default;
}

.page.couples .couple-requests > .content > .encelade-forum-empty {
    margin-top: 15px;
    margin-bottom: 0;
}

.page.couples .couple-requests > .content > .users > .line > .buttons > button {
    border: 0;
}

.couple-requests > .content > .users > .line > .avatar > img {
    position: relative;
    float: left;
    height: 62px;
    object-fit: none;
    top: 13px;
}

.page.couples .encelade-couple-breakup-confirmation[hidden],
.page.couples [data-couple-overview][hidden] {
    display: none;
}

#settings > .forms > .box > .content > form > .input > input[type="submit"] {
    width: 100%;
    clear: both;
    float: left;
    min-height: 40px;
    line-height: 40px;
    background-color: #f27e46;
    border-radius: 10px;
    cursor: pointer;
    text-align: center;
    font-size: 14px;
    transition: 200ms ease-in-out all;
    padding: 0 15px;
    color: #ffffff;
}

#settings > .forms > .box > .content > form > .input > input[type="submit"]:hover {
    background-color: #f27e46c2;
}

.page.room > .encelade-room-intro {
    width: 100%;
    float: left;
    clear: both;
    margin-top: 15px;
}

.page.room > .encelade-room-list {
    display: flex;
    flex-direction: column;
    gap: 10px;
    margin-top: 15px;
}

.page.room > .encelade-room-list[hidden] {
    display: none;
}

.page.room > .encelade-room-list > .room {
    position: relative;
    width: 100%;
    min-height: 74px;
    padding: 10px 190px 10px 10px;
    border-radius: 10px;
    background-color: #ffffff;
    box-shadow: 0 0 0 1px rgba(26, 40, 49, .1) inset;
}

.page.room > .encelade-room-list > .room > .image {
    float: left;
    width: 54px;
    height: 54px;
    overflow: hidden;
    border-radius: 10px;
    background: #eaeaea;
}

.page.room > .encelade-room-list > .room > .image > img {
    display: block;
    width: 100%;
    height: 100%;
    margin: 0;
    border-radius: 10px;
    object-fit: cover;
}

.page.room > .encelade-room-list > .room > .description {
    float: left;
    width: calc(100% - 69px);
    min-width: 0;
    padding: 8px 0 0;
    margin-left: 15px;
}

.page.room > .encelade-room-list > .room > .description > b,
.page.room > .encelade-room-list > .room > .description > p {
    display: block;
    overflow: hidden;
    width: 100%;
    color: #3c3f51;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.page.room > .encelade-room-list > .room > .description > b {
    font-size: 13px;
    line-height: 16px;
    text-transform: uppercase;
}

.page.room > .encelade-room-list > .room > .description > p {
    margin-top: 5px;
    font-size: 12px;
    opacity: .65;
}

.page.room > .encelade-room-list > .room > .btn[theme="light"] {
    position: absolute;
    top: 15px;
    right: 15px;
    min-height: 45px;
    padding: 0 15px;
    border: 0;
    border-radius: 10px;
    background-color: #f27e46;
    color: #ffffff;
    font-size: 13px;
    font-weight: 700;
    line-height: 45px;
    cursor: pointer;
}

.page.room > .encelade-room-list > .room > .btn[theme="light"]:hover {
    background-color: #f27e46c2;
}

.page.room > .encelade-room-list > .room > .btn:disabled {
    cursor: default;
    opacity: .55;
}

.frontend-not-found-controls {
    justify-content: center;
}

.frontend-not-found-controls > .btn[theme="light"] {
    display: inline-flex;
    min-height: 40px;
    align-items: center;
    justify-content: center;
    padding: 0 22px;
    border-radius: 10px;
    background-color: #f27e46;
    color: #ffffff;
    font-weight: 700;
    line-height: 40px;
}

.page.artist-hub-page {
    display: grid;
    grid-template-columns: 150px minmax(0, 1050px) 150px;
    grid-auto-flow: row dense;
    align-items: start;
}

.page.artist-hub-page > #site-header,
.page.artist-hub-page > #footer {
    grid-column: 1 / -1;
    width: 100%;
}

.page.artist-hub-page > .encelade-artist-hub {
    display: grid;
    grid-column: 2;
    grid-template-columns: 285px minmax(0, 750px);
    align-items: start;
    width: 1050px;
    max-width: 100%;
    margin: 34px 0 45px;
    gap: 15px;
}

.page.artist-hub-page .encelade-artist-hub > .global-box {
    width: 100%;
    margin: 0;
    float: none;
}

.page.artist-hub-page .encelade-artist-hub__intro {
    grid-column: 1 / -1;
    overflow: hidden;
}

.page.artist-hub-page .encelade-artist-hub__intro > .content {
    position: relative;
    display: grid;
    min-height: 218px;
    grid-template-columns: 335px minmax(0, 1fr) 105px;
    align-items: center;
    overflow: hidden;
    box-sizing: border-box;
    padding: 0;
    background: linear-gradient(135deg, #ffffff 0%, #fff6ef 100%);
}

.page.artist-hub-page .encelade-artist-hub__category-image {
    align-self: stretch;
    min-height: 218px;
    background-image: linear-gradient(90deg, transparent 75%, #fff6ef 100%), url("../images/forum/YPuuexk.png");
    background-position: center;
    background-size: cover;
}

.encelade-artist-hub__intro-copy {
    position: relative;
    z-index: 2;
    min-width: 0;
    padding: 24px 12px 24px 28px;
}

.encelade-artist-hub__eyebrow {
    display: inline-flex;
    min-height: 25px;
    align-items: center;
    padding: 0 10px;
    border-radius: 8px;
    background: #f27e46;
    color: #ffffff;
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
}

.encelade-artist-hub__intro-copy > h1 {
    margin: 10px 0 5px;
    color: #3c3f51;
    font-size: 22px;
    line-height: 27px;
}

.encelade-artist-hub__intro-copy > p {
    max-width: 470px;
    margin: 0;
    color: #626572;
    font-size: 13px;
    line-height: 19px;
}

.encelade-artist-hub__intro-status {
    display: flex;
    flex-direction: column;
    margin-top: 14px;
    gap: 2px;
}

.encelade-artist-hub__intro-status > strong {
    color: #f27e46;
    font-size: 13px;
}

.encelade-artist-hub__intro-status > small {
    color: #3c3f51;
    font-size: 11px;
    opacity: .68;
}

.encelade-artist-hub__alfred {
    position: relative;
    right: -5px;
    display: block;
    max-width: 105px;
    max-height: 160px;
    align-self: end;
    object-fit: contain;
    object-position: bottom;
    image-rendering: pixelated;
    scale: 3;
    opacity: .4;
    transform: scaleX(-1);
}

.page.artist-hub-page .encelade-artist-hub__actions {
    grid-column: 1;
}

.page.artist-hub-page .encelade-artist-hub__actions > .content {
    padding: 18px;
    text-align: center;
}

.encelade-artist-hub__participation-icon {
    width: 100%;
    height: 112px;
    margin-bottom: 15px;
    border-radius: 10px;
    background: #f1f2f5 url("../images/forum/Iai16WK.png") center 45% / cover no-repeat;
    box-shadow: 0 0 0 1px rgba(26, 40, 49, .08) inset;
}

.page.artist-hub-page .encelade-artist-hub__actions .description {
    margin: 0;
    color: #3c3f51;
    font-size: 13px;
    line-height: 18px;
    text-align: left;
}

.encelade-artist-hub__features {
    margin: 15px 0 0;
    padding: 0;
    list-style: none;
    text-align: left;
}

.encelade-artist-hub__features > li {
    position: relative;
    min-height: 23px;
    padding: 3px 0 3px 27px;
    color: #3c3f51;
    font-size: 12px;
    line-height: 17px;
}

.encelade-artist-hub__features > li::before {
    position: absolute;
    top: 2px;
    left: 0;
    display: flex;
    width: 20px;
    height: 20px;
    align-items: center;
    justify-content: center;
    border-radius: 7px;
    background: #fff0e8;
    color: #f27e46;
    content: "\2713";
    font-size: 12px;
    font-weight: 700;
}

.page.artist-hub-page .encelade-artist-hub__actions .encelade-boutique-open-client {
    width: 100%;
    margin-top: 16px;
}

.page.artist-hub-page .encelade-artist-hub__gallery {
    grid-column: 2;
    min-width: 0;
}

.page.artist-hub-page .encelade-artist-hub__gallery > .content {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    min-height: 230px;
    gap: 12px;
    padding: 15px;
}

.page.artist-hub-page .encelade-artist-hub__gallery > .content > .loading,
.page.artist-hub-page .encelade-artist-hub__gallery > .content > .encelade-forum-empty,
.page.artist-hub-page .encelade-artist-hub__gallery > .content > .encelade-feedback {
    grid-column: 1 / -1;
}

.encelade-artist-card {
    display: flex;
    min-width: 0;
    flex-direction: column;
    overflow: hidden;
    border: 1px solid rgba(26, 40, 49, .09);
    border-radius: 10px;
    background: #fff;
    transition: 200ms ease-in-out all;
}

.encelade-artist-card:hover {
    box-shadow: 0 5px 14px rgba(26, 40, 49, .11);
    transform: translateY(-2px);
}

.encelade-artist-card__preview {
    position: relative;
    display: flex;
    height: 220px;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    border-bottom: 1px solid rgba(26, 40, 49, .08);
    background-color: #eff0f2;
    background-image: linear-gradient(45deg, rgba(60, 63, 81, .035) 25%, transparent 25%), linear-gradient(-45deg, rgba(60, 63, 81, .035) 25%, transparent 25%), linear-gradient(45deg, transparent 75%, rgba(60, 63, 81, .035) 75%), linear-gradient(-45deg, transparent 75%, rgba(60, 63, 81, .035) 75%);
    background-position: 0 0, 0 8px, 8px -8px, -8px 0;
    background-size: 16px 16px;
}

.encelade-artist-card__preview > img {
    display: block;
    image-rendering: auto;
}

.encelade-artist-card__body {
    display: flex;
    min-height: 174px;
    flex: 1;
    flex-direction: column;
    padding: 14px;
    color: #3c3f51;
}

.encelade-artist-card__body > small {
    color: #f27e46;
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
}

.encelade-artist-card__body > strong {
    margin-top: 5px;
    color: #3c3f51;
    font-size: 15px;
    line-height: 19px;
}

.encelade-artist-card__body > p {
    display: -webkit-box;
    overflow: hidden;
    margin: 8px 0;
    color: #646671;
    font-size: 12px;
    line-height: 1.45;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
}

.encelade-artist-card__body > a {
    width: max-content;
    max-width: 100%;
    overflow: hidden;
    color: #f27e46;
    font-size: 12px;
    font-weight: 700;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.encelade-artist-card__footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    margin-top: auto;
    padding-top: 12px;
    border-top: 1px solid rgba(26, 40, 49, .08);
    color: #777985;
    font-size: 11px;
}

.encelade-artist-card__votes {
    display: flex;
    gap: 5px;
}

.encelade-artist-card__votes > button {
    width: 30px;
    height: 30px;
    border: 0;
    border-radius: 8px;
    background: #f1f2f5;
    color: #3c3f51;
    cursor: pointer;
    font-weight: 700;
}

.encelade-artist-card__votes > button.is-active,
.encelade-artist-card__votes > button:hover:not(:disabled) {
    background: #f27e46;
    color: #fff;
}

@media (max-width: 850px) {
    .page.artist-hub-page {
        display: block;
    }

    .page.artist-hub-page > .encelade-artist-hub {
        width: calc(100% - 30px);
        max-width: 720px;
        margin: 25px auto 40px;
        grid-template-columns: 240px minmax(0, 1fr);
    }

    .page.artist-hub-page .encelade-artist-hub__intro > .content {
        grid-template-columns: 250px minmax(0, 1fr);
    }

    .encelade-artist-hub__alfred {
        display: none;
    }

    .page.artist-hub-page .encelade-artist-hub__gallery > .content {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 650px) {
    .page.artist-hub-page > .encelade-artist-hub {
        grid-template-columns: 1fr;
    }

    .page.artist-hub-page .encelade-artist-hub__intro,
    .page.artist-hub-page .encelade-artist-hub__actions,
    .page.artist-hub-page .encelade-artist-hub__gallery {
        grid-column: 1;
    }

    .page.artist-hub-page .encelade-artist-hub__intro > .content {
        display: block;
    }

    .page.artist-hub-page .encelade-artist-hub__category-image {
        min-height: 150px;
        background-image: linear-gradient(180deg, transparent 65%, #fff6ef 100%), url("../images/forum/YPuuexk.png");
    }

    .encelade-artist-hub__intro-copy {
        padding: 20px;
    }

    .encelade-artist-card__preview {
        height: 235px;
    }
}

@media (max-width: 700px) {
    .page.room > .encelade-room-list > .room {
        padding-right: 10px;
        padding-bottom: 65px;
    }

    .page.room > .encelade-room-list > .room > .btn[theme="light"] {
        top: auto;
        right: 10px;
        bottom: 10px;
        left: 10px;
        width: calc(100% - 20px);
        text-align: center;
    }
}

.page.organisations > .content > .right {
    grid-column: 1;
}

.page.organisations > .content > .left {
    grid-column: 2;
}

.page.organisations .encelade-hotel-events-list {
    display: grid;
    gap: 15px;
}

.page.organisations .encelade-hotel-event {
    overflow: hidden;
    border: 1px solid #e2e2e2;
    border-radius: 10px;
    background: #fff;
    color: #3c3f51;
}

.page.organisations .encelade-hotel-event.is-finished {
    opacity: .7;
}

.page.organisations .encelade-hotel-event__header {
    display: grid;
    width: 100%;
    grid-template-columns: 105px minmax(0, 1fr) 42px;
    min-height: 105px;
    padding: 0;
    border: 0;
    background: #f4f4f4;
    color: inherit;
    cursor: pointer;
    font: inherit;
    text-align: left;
}

.page.organisations .encelade-hotel-event__header:hover,
.page.organisations .encelade-hotel-event__header:focus-visible {
    background: #ececec;
    outline: 0;
}

.page.organisations .encelade-hotel-event__toggle {
    display: flex;
    align-items: center;
    justify-content: center;
    color: #f27e46;
    font-size: 25px;
    font-weight: 700;
}

.page.organisations .encelade-hotel-event__picture {
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    background: #eaeaea;
}

.page.organisations .encelade-hotel-event__picture > img {
    width: 100%;
    height: 105px;
    object-fit: cover;
}

.page.organisations .encelade-hotel-event__heading {
    display: flex;
    min-width: 0;
    flex-direction: column;
    justify-content: center;
    padding: 13px 16px;
}

.page.organisations .encelade-hotel-event__heading > small {
    color: #f27e46;
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
}

.page.organisations .encelade-hotel-event__heading > strong {
    margin-top: 3px;
    overflow: hidden;
    font-size: 17px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.page.organisations .encelade-hotel-event__heading > p {
    margin: 5px 0;
    color: #696b76;
    font-size: 13px;
}

.page.organisations .encelade-hotel-event__status {
    color: #f27e46;
    font-size: 12px;
    font-weight: 700;
}

.page.organisations .encelade-hotel-event.is-live .encelade-hotel-event__status {
    color: #59b656;
}

.page.organisations .encelade-hotel-event.is-finished .encelade-hotel-event__status {
    color: #777985;
}

.page.organisations .encelade-hotel-event__description,
.page.organisations .encelade-hotel-event__details,
.page.organisations .encelade-hotel-event__rewards,
.page.organisations .encelade-hotel-event__footer {
    margin: 0;
    padding: 14px 16px;
    border-top: 1px solid #eaeaea;
}

.page.organisations .encelade-hotel-event__body[hidden] {
    display: none;
}

.page.organisations .encelade-hotel-event__description {
    color: #3c3f51;
    font-size: 14px;
    line-height: 1.5;
}

.page.organisations .encelade-hotel-event__description > :first-child {
    margin-top: 0;
}

.page.organisations .encelade-hotel-event__description > :last-child {
    margin-bottom: 0;
}

.page.organisations .encelade-hotel-event__description p,
.page.organisations .encelade-hotel-event__description blockquote,
.page.organisations .encelade-hotel-event__description .encelade-news-markdown-list-item {
    margin: 0 0 8px;
}

.page.organisations .encelade-hotel-event__description h1,
.page.organisations .encelade-hotel-event__description h2,
.page.organisations .encelade-hotel-event__description h3 {
    margin: 12px 0 8px;
    color: #3c3f51;
    font-size: 16px;
}

.page.organisations .encelade-hotel-event__description blockquote {
    padding: 8px 12px;
    border-left: 3px solid #f27e46;
    background: #f7f7f7;
}

.page.organisations .encelade-hotel-event__description .encelade-news-markdown-list-item::before {
    content: "•";
    margin-right: 7px;
    color: #f27e46;
    font-weight: 700;
}

.page.organisations .encelade-hotel-event__details {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
}

.page.organisations .encelade-hotel-event__details > span {
    padding: 9px 11px;
    border-radius: 8px;
    background: #f3f3f3;
    font-size: 12px;
}

.page.organisations .encelade-hotel-event__rewards {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: 18px;
}

.page.organisations .encelade-hotel-event__reward-content {
    min-width: 0;
}

.page.organisations .encelade-hotel-event__reward-content > strong {
    display: block;
    margin-bottom: 8px;
    color: #f27e46;
    font-size: 14px;
}

.page.organisations .encelade-hotel-event__reward-content > p {
    margin: 0 0 9px;
    font-size: 13px;
}

.page.organisations .encelade-hotel-event__badges {
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
}

.page.organisations .encelade-hotel-event__badges > img {
    image-rendering: pixelated;
    object-fit: none;
}

.page.organisations .encelade-hotel-event__footer {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 12px;
}

.page.organisations .encelade-hotel-event__author {
    display: flex;
    min-width: 0;
    align-items: center;
    gap: 8px;
    color: #3c3f51;
    font-size: 13px;
    font-weight: 700;
}

.page.organisations .encelade-hotel-event__author > img {
    width: 40px;
    position: relative;
    top: 15px;
    object-fit: none;
    image-rendering: pixelated;
}

.page.organisations .encelade-events-client-button {
    min-height: 40px;
    padding: 0 14px;
    border: 0;
    border-radius: 10px;
    background: #f27e46;
    color: #fff;
    cursor: pointer;
    font-size: 13px;
    font-weight: 700;
}

.page.organisations .encelade-events-client-button:hover {
    background: #f27e46b5;
}

.page.organisations > .content > .right .encelade-events-client-button {
    width: 100%;
    margin-top: 15px;
}

.page.shop-home > .encelade-boutique-page {
    display: grid;
    width: 100%;
    grid-column: 2 / 5;
    gap: 15px;
    margin: 0;
}

.page.shop-home .encelade-boutique-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    gap: 15px;
}

.page.shop-home .encelade-boutique-plan {
    display: flex;
    min-width: 0;
    flex-direction: column;
    padding: 15px;
    border: 1px solid #e3e3e3;
    border-radius: 10px;
    background: #fff;
    color: #3c3f51;
}

.page.shop-home .encelade-boutique-plan > header {
    display: flex;
    min-height: 72px;
    align-items: center;
    gap: 12px;
}

.page.shop-home .encelade-boutique-plan__image {
    display: flex;
    width: 72px;
    height: 72px;
    align-items: center;
    justify-content: center;
    flex: 0 0 72px;
    border-radius: 10px;
    background: #f1f1f1;
}

.page.shop-home .encelade-boutique-plan__image > img {
    max-width: 64px;
    max-height: 64px;
    object-fit: contain;
    image-rendering: pixelated;
}

.page.shop-home .encelade-boutique-plan > header > span:last-child {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.page.shop-home .encelade-boutique-plan > header strong {
    overflow: hidden;
    font-size: 16px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.page.shop-home .encelade-boutique-plan > header small {
    display: flex;
    align-items: center;
    margin-top: 5px;
    color: #f27e46;
    font-size: 14px;
    font-weight: 700;
}

.page.shop-home .encelade-boutique-plan > header small > img {
    width: 18px;
    margin-left: 4px;
    image-rendering: pixelated;
}

.page.shop-home .encelade-boutique-plan > p {
    min-height: 58px;
    margin: 13px 0;
    color: #646671;
    font-size: 13px;
    line-height: 1.45;
}

.page.shop-home .encelade-boutique-plan > b {
    margin-bottom: 8px;
    color: #f27e46;
    font-size: 13px;
}

.page.shop-home .encelade-boutique-plan__rewards {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    align-content: start;
    gap: 7px;
    margin-bottom: 15px;
}

.page.shop-home .encelade-boutique-reward {
    display: flex;
    min-width: 0;
    min-height: 46px;
    align-items: center;
    gap: 7px;
    padding: 6px 8px;
    border-radius: 8px;
    background: #f3f3f3;
    font-size: 11px;
}

.page.shop-home .encelade-boutique-reward > img {
    width: 34px;
    height: 34px;
    flex: 0 0 34px;
    object-fit: contain;
    image-rendering: pixelated;
}

.page.shop-home .encelade-boutique-reward.is-banner > img {
    object-fit: scale-down;
}

.page.shop-home .encelade-boutique-reward > span {
    overflow: hidden;
    text-overflow: ellipsis;
}

.encelade-boutique-open-client,
.encelade-rare-open-client {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 40px;
    padding: 0 14px;
    border: 0;
    border-radius: 10px;
    background: #f27e46;
    color: #fff;
    cursor: pointer;
    font-size: 13px;
    font-weight: 700;
    text-decoration: none;
}

.encelade-boutique-open-client:hover,
.encelade-rare-open-client:hover {
    background: #f27e46b5;
}

.page.shop-home .encelade-boutique-plan > .encelade-boutique-open-client {
    width: 100%;
    margin-top: auto;
}

.page.shop-home .encelade-boutique-intro .encelade-boutique-open-client,
.page.items .encelade-rare-open-client {
    margin-top: 15px;
}

/* Accueil Boutique — services du compte dans le langage visuel Encelade. */
.page.shop-home > .encelade-shop-services-page {
    display: grid;
    width: 100%;
    grid-column: 2 / 5;
    gap: 15px;
}

.page.shop-home .encelade-shop-services-intro > .content {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
}

.page.shop-home .encelade-shop-services-intro .description {
    max-width: 720px;
}

.encelade-shop-services-balances {
    display: flex;
    flex: 0 0 auto;
    flex-wrap: wrap;
    align-items: center;
    justify-content: flex-end;
    gap: 14px;
}

.encelade-shop-services-balance,
.encelade-shop-votes__remaining {
    display: flex;
    align-items: center;
    gap: 5px;
    color: #3c3f51;
    font-size: 14px;
    white-space: nowrap;
}

.encelade-shop-services-balance > strong,
.encelade-shop-votes__remaining > strong {
    color: #f27e46;
    font-size: 18px;
}

.encelade-shop-services-balance > img,
.encelade-shop-vote-offer small > img {
    max-width: 18px;
    max-height: 18px;
    image-rendering: pixelated;
}

.page.shop-home .encelade-shop-services-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    align-items: start;
    gap: 15px;
}

.page.shop-home .encelade-shop-votes__remaining {
    margin-top: 15px;
}

.page.shop-home .encelade-shop-vote-packs {
    display: grid;
    gap: 10px;
    margin-top: 15px;
}

.page.shop-home .encelade-shop-vote-offer {
    display: flex;
    min-height: 64px;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 10px 12px;
    border: 1px solid #ddd;
    border-radius: 10px;
    background: #eaeaea;
}

.page.shop-home .encelade-shop-vote-offer > span {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.page.shop-home .encelade-shop-vote-offer strong {
    color: #3c3f51;
    font-size: 15px;
}

.page.shop-home .encelade-shop-vote-offer small {
    display: flex;
    align-items: center;
    gap: 4px;
    color: #646671;
    font-size: 13px;
}

.page.shop-home .encelade-shop-vote-offer > .btn {
    min-width: 100px;
    min-height: 40px;
    border: 0;
    border-radius: 10px;
    background: #f27e46;
    color: #fff;
    cursor: pointer;
    font-weight: 700;
}

.page.shop-home .encelade-shop-vote-offer > .btn:hover {
    background: #f27e46c2;
}

.page.shop-home .box-flagme > .content > form > .form-group > input[type=submit][theme=light] {
    background-color: #f27e46;
}

.page.shop-home .box-flagme > .content > form > .form-group > input[type=submit][theme=light]:hover {
    background-color: #f27e46c2;
}

.page.shop-home .box-flagme input:disabled {
    cursor: not-allowed;
    opacity: .65;
}

.page.shop-home .encelade-shop-username-history {
    max-height: 270px;
    overflow-y: auto;
    scrollbar-width: none;
}

.page.shop-home .encelade-shop-username-history::-webkit-scrollbar {
    display: none;
}

@media (max-width: 820px) {
    .page.shop-home .encelade-shop-services-grid {
        grid-template-columns: 1fr;
    }

    .page.shop-home .encelade-shop-services-intro > .content {
        align-items: flex-start;
        flex-direction: column;
    }
}

/* Boutique Packs — inventaires partagés avec la Boutique de l'hôtel. */
.page.shop-packs > .encelade-packs-page {
    display: grid;
    width: 1050px;
    max-width: calc(100% - 30px);
    margin: 0 auto 45px;
    padding-top: 15px;
    grid-template-columns: 270px minmax(0, 1fr);
    align-items: start;
    gap: 15px;
}

.page.shop-packs .encelade-packs-intro {
    width: 100%;
    margin: 0;
}

.page.shop-packs .encelade-packs-intro > .content {
    display: flex;
    min-height: 0;
    align-items: stretch;
    padding: 18px;
    flex-direction: column;
    gap: 18px;
}

.page.shop-packs .encelade-packs-intro > .content > div:first-child {
    min-width: 0;
}

.page.shop-packs .encelade-packs-intro strong {
    color: #3c3f51;
    font-size: 16px;
}

.page.shop-packs .encelade-packs-intro p {
    margin: 6px 0 0;
    color: #727683;
    font-size: 13px;
    line-height: 1.5;
}

.encelade-packs-balance {
    display: flex;
    width: 100%;
    align-items: center;
    justify-content: center;
    padding: 11px 16px;
    border-radius: 10px;
    background: #f5f6f7;
    box-shadow: 0 0 0 1px rgba(26, 40, 49, .1) inset;
    gap: 9px;
}

.encelade-packs-balance > img {
    width: auto;
    max-width: 28px;
    height: auto;
    image-rendering: pixelated;
}

.encelade-packs-balance > span {
    display: flex;
    flex-direction: column;
}

.encelade-packs-balance strong {
    font-size: 18px !important;
    line-height: 20px;
}

.encelade-packs-balance small {
    color: #8a8e98;
    font-size: 11px;
}

.page.shop-packs .encelade-packs-catalog > .content {
    padding: 15px;
}

.page.shop-packs .encelade-packs-catalog {
    width: 100%;
    min-width: 0;
    margin: 0;
}

.encelade-packs-toolbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 15px;
    gap: 12px;
}

.encelade-packs-tabs {
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
}

.encelade-packs-tabs > a,
.encelade-packs-more,
.encelade-pack-card__buy {
    border: 0;
    border-radius: 8px;
    background: #f27e46;
    color: #ffffff;
    cursor: pointer;
    font-family: inherit;
    font-size: 13px;
    font-weight: 700;
    text-decoration: none;
    transition: 180ms ease-in-out background-color, 180ms ease-in-out transform;
}

.encelade-packs-tabs > a {
    display: inline-flex;
    min-height: 36px;
    align-items: center;
    justify-content: center;
    padding: 0 16px;
}

.encelade-packs-tabs > a:hover,
.encelade-packs-tabs > a.is-active {
    background: #f27e46b5;
    color: #fff;
}

.encelade-packs-search {
    display: flex;
    min-width: 0;
}

.encelade-packs-search label {
    min-width: 0;
}

.encelade-packs-search input[type="search"] {
    width: 180px;
    height: 36px;
    padding: 0 12px;
    border: 1px solid #d9dce0;
    border-radius: 8px;
    outline: 0;
    color: #3c3f51;
    font-family: inherit;
}

.encelade-packs-search input[type="search"]:focus {
    border-color: #f27e46;
    box-shadow: 0 0 0 2px rgba(242, 126, 70, .15);
}

.encelade-packs-search > button {
    min-width: 42px;
    height: 36px;
    margin-left: 6px;
    border: 0;
    border-radius: 8px;
    background: #f27e46;
    color: #fff;
    cursor: pointer;
    font-weight: 700;
}

.encelade-packs-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 15px;
}

.encelade-pack-card {
    display: grid;
    min-width: 0;
    min-height: 180px;
    overflow: hidden;
    border: 1px solid #e1e2e4;
    border-radius: 10px;
    background: #ffffff;
    grid-template-columns: 190px minmax(0, 1fr);
    transition: 180ms ease-in-out border-color, 180ms ease-in-out transform, 180ms ease-in-out box-shadow;
}

.encelade-pack-card:hover {
    box-shadow: 0 5px 14px rgba(26, 40, 49, .11);
    transform: translateY(-2px);
}

.encelade-pack-card.is-owned {
    border-color: #e1e2e4;
}

.encelade-pack-card__preview {
    position: relative;
    display: flex;
    width: 190px;
    min-height: 180px;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    background: #eef0f2;
    background-image: linear-gradient(45deg, rgba(255, 255, 255, .38) 25%, transparent 25%, transparent 75%, rgba(255, 255, 255, .38) 75%), linear-gradient(45deg, rgba(255, 255, 255, .38) 25%, transparent 25%, transparent 75%, rgba(255, 255, 255, .38) 75%);
    background-position: 0 0, 8px 8px;
    background-size: 16px 16px;
}

.encelade-pack-card__preview > img {
    width: auto;
    max-width: none;
    height: auto;
    max-height: none;
    object-fit: none;
    image-rendering: pixelated;
}

.encelade-pack-card.is-badge .encelade-pack-card__preview > img {
    width: auto;
    max-width: none;
    height: auto;
    max-height: none;
}

.encelade-pack-card.is-border .encelade-pack-card__preview > img {
    position: absolute;
    max-width: none;
    max-height: none;
}

.encelade-pack-card__content {
    display: flex;
    min-width: 0;
    min-height: 180px;
    padding: 14px;
    flex: 1;
    flex-direction: column;
}

.encelade-pack-card__content > strong {
    overflow: hidden;
    color: #3c3f51;
    font-size: 13px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.encelade-pack-card__content > small {
    overflow: hidden;
    margin: 3px 0 10px;
    color: #8a8e98;
    font-size: 11px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.encelade-pack-card__buy {
    display: flex;
    width: 100%;
    min-height: 34px;
    align-items: center;
    justify-content: center;
    margin-top: auto;
    padding: 0 10px;
    gap: 4px;
    background: #f27e46;
}

.encelade-pack-card__buy:hover:not(:disabled),
.encelade-packs-more:hover {
    background: rgba(242, 126, 70, .71);
}

.encelade-pack-card__buy:disabled {
    background: #59b656;
    cursor: default;
    opacity: 1;
}

.encelade-pack-card__buy > img {
    width: auto;
    max-width: 18px;
    max-height: 18px;
    image-rendering: pixelated;
}

.encelade-pack-card__buy > span {
    color: #fff;
}

.encelade-pack-card > .encelade-feedback {
    margin: 0;
    grid-column: 1 / -1;
}

.encelade-packs-more {
    display: block;
    min-width: 160px;
    min-height: 38px;
    margin: 15px auto 0;
    padding: 0 18px;
    background: #f27e46;
}

.encelade-packs-more[hidden] {
    display: none;
}

@media (max-width: 900px) {
    .page.shop-packs > .encelade-packs-page { grid-template-columns: 230px minmax(0, 1fr); }
    .encelade-packs-grid { grid-template-columns: 1fr; }
}

@media (max-width: 700px) {
    .page.shop-packs > .encelade-packs-page { grid-template-columns: 1fr; }
    .page.shop-packs .encelade-packs-intro > .content,
    .encelade-packs-toolbar { align-items: stretch; flex-direction: column; }
    .encelade-packs-balance { align-self: flex-start; }
    .encelade-packs-search label { flex: 1; }
    .encelade-packs-search input[type="search"] { width: 100%; }
}

@media (max-width: 470px) {
    .encelade-pack-card { grid-template-columns: 1fr; }
    .encelade-pack-card__preview { width: 100%; min-height: 180px; }
    .encelade-pack-card__content { min-height: 120px; }
}

.global-box.item-box > .left.encelade-rare-layout-preview {
    display: flex;
    align-items: center;
    justify-content: center;
    line-height: normal;
}

.page.items .encelade-rare-layout-image {
    width: 128px;
    height: 128px;
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    image-rendering: pixelated;
}

.page.top-demi > .content {
    display: grid;
    grid-template-columns: minmax(0, 580px);
    justify-content: center;
    align-items: start;
}

.page.gamers > .content.encelade-stats-ranking-grid,
.page.top-demi > .content.encelade-stats-ranking-grid {
    display: grid;
    width: 1050px;
    max-width: calc(100% - 30px);
    margin: 34px auto 45px;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    align-items: start;
    justify-content: stretch;
    gap: 15px;
}

.encelade-stats-ranking-grid > .box-top-gamers {
    width: 100%;
    min-width: 0;
    margin: 0;
}

.encelade-stats-ranking-grid > .encelade-stats-ranking-intro {
    width: 100%;
    margin: 0;
    grid-column: 1 / -1;
}

.encelade-stats-ranking-grid > .box-top-gamers > .title > img {
    width: 16px;
    max-width: 41px;
    height: 18px;
    object-fit: none;
    image-rendering: pixelated;
}

.encelade-stats-ranking-grid > .box-top-gamers > .top > .pos {
    min-height: 148px;
}

.encelade-stats-ranking-grid > .box-top-gamers > .top > .pos > .infos > .username,
.encelade-stats-ranking-grid > .box-top-gamers > .others > .line > .infos > .username {
    display: block;
    overflow: hidden;
    color: inherit;
    font-size: 14px;
    font-weight: 700;
    text-decoration: none;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.encelade-stats-ranking-grid > .box-top-gamers > .top > .pos > .infos > .username {
    color: #ffffff;
}

.encelade-stats-ranking-grid > .box-top-gamers > .others > .line > .infos > .username {
    width: 100%;
    float: left;
    clear: both;
    color: #3c3f51;
}

.encelade-stats-ranking-grid > .box-top-gamers > .others > .line > .infos > .points > img {
    max-width: 18px;
    max-height: 18px;
    object-fit: contain;
}

.encelade-ranking-loading,
.encelade-ranking-empty {
    width: 100%;
    padding: 30px 15px;
    color: #8b8f94;
    text-align: center;
}

@media (max-width: 720px) {
    .page.gamers > .content.encelade-stats-ranking-grid,
    .page.top-demi > .content.encelade-stats-ranking-grid {
        grid-template-columns: 1fr;
    }
}

.page.shop-badges > .left {
    display: grid;
    width: 100%;
    grid-template-columns: 437px minmax(0, 1fr);
    gap: 15px;
    align-items: start;
}

.page.shop-badges > .left > .global-box {
    margin-top: 15px;
}

.page.forum > .forum {
    width: 100%;
    max-width: none;
    margin-left: 0;
    margin-right: 0;
    float: none;
    left: 0;
}

body .page.blackmarket > .left,
body .page.forum > .forum,
body .page.forum > .content,
body .page.help-attitude > .content,
body .page.help-newbie > .content,
body .page.help-safety > .content,
body .page.help-tutos > .content,
body .page.homepage > .homepage,
body .page.jobs > .content,
body .page.room > .left {
    width: 100% !important;
    max-width: none;
    margin-left: 0;
    margin-right: 0;
    float: none;
    left: 0;
}

.page.help-attitude > .content > .global-box,
.page.help-newbie > .content > .global-box,
.page.help-safety > .content > .global-box,
.page.jobs > .content > .form,
.page.forum.create > .content > .form {
    margin-top: 15px;
}

.page-information > .title {
    text-align: left !important;
}

.page-information > .content {
    padding: 0 15px 15px !important;
}

.page.staff > .content {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 360px;
    gap: 15px;
    align-items: start;
    width: 1093px;
    max-width: calc(100% - 30px);
    box-sizing: border-box;
    padding: 20px 30px;
    margin-left: auto;
    margin-right: auto;
}

.page.staff > .content > .col {
    width: auto;
    margin: 0;
    float: none;
}

.page.staff > .content > .col.tablet {
    display: none;
}

.page.staff > .content.staff-auth-panel {
    background: none;
    box-shadow: none;
}

.page.staff > .content > .col.left {
    grid-column: 1;
    grid-row: 1 / span 2;
}

.page.staff > .content > .col.right.notablet {
    grid-column: 2;
    grid-row: 1;
}

.page.staff > .content > .col.right:not(.notablet) {
    grid-column: 2;
    grid-row: 2;
}

.page.staff .staff-rank-header {
    display: flex;
    align-items: center;
    width: 100%;
    min-height: 50px;
    box-sizing: border-box;
    margin: -25px 0 8px;
}

.page.staff .staff-rank-card {
    min-height: 0;
    margin-top: 20px;
    padding: 10px;
    gap: 0;
    overflow: visible;
}

.page.staff .staff-rank-header-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 32px;
    image-rendering: pixelated;
}

.page.staff .staff-rank-header {
    background: #f27e46 !important;
}

.page.staff .staff-rank-content {
    display: flow-root;
    width: 100%;
}

.page.staff .staff-empty {
    display: flex;
    width: 100%;
    align-items: center;
    justify-content: center;
    margin: 15px 0 0;
    padding: 18px;
    border-radius: 10px;
    background: #ffffff;
    color: #3c3f51;
    text-align: center;
}

.page.staff .staff-right-ranks > .staff-rank-card {
    margin-top: 20px;
}

.page.staff .staff-right-ranks > .list > .content > .box-staff {
    width: 100%;
    float: left;
    clear: both;
    margin-top: 15px;
}

.page.staff > .content > .col.left > .list {
    width: 100%;
    float: none;
    clear: both;
}

button,
input,
select,
textarea {
    font: inherit;
}

.public-auth-page {
    min-height: 100vh;
}

.public-site-header #site-header > .center > .logo {
    background-image: url("../images/public/metro-logo.png") !important;
    background-position: center;
}

.public-auth-content {
    width: 100%;
    max-width: 1050px;
    float: none;
    clear: both;
    margin-left: auto;
    margin-right: auto;
    padding: 34px 0 10px;
}

.public-auth-hero {
    position: relative;
    width: 100%;
    min-height: 330px;
    overflow: hidden;
    border-radius: 12px;
    background: #ffffff;
    box-shadow: 0 0 0 1px rgba(26, 40, 49, .1) inset;
}

.public-auth-hero::after {
    position: absolute;
    inset: 0;
    z-index: 1;
    content: "";
    background: linear-gradient(90deg, #ffffff 8%, rgba(255, 255, 255, .97) 38%, rgba(255, 255, 255, .1) 72%);
    pointer-events: none;
}

.public-auth-hero-copy {
    position: relative;
    z-index: 3;
    width: 52%;
    max-width: 650px;
    padding: 54px 0 48px 50px;
}

.public-auth-kicker {
    display: inline-block;
    margin-bottom: 10px;
    color: #5ba4dd;
    font-size: 12px;
    font-weight: 800;
    letter-spacing: 2px;
}

.public-auth-hero h1,
.public-register-intro h1 {
    margin: 0 0 13px;
    color: #3c3f51;
    font-size: 34px;
    line-height: 1.12;
}

.public-auth-hero p,
.public-register-intro p {
    max-width: 560px;
    margin: 0;
    color: #6d7183;
    font-size: 15px;
    line-height: 1.55;
}

.public-auth-hero-image {
    position: absolute;
    z-index: 0;
    inset: 0 0 0 auto;
    width: 78%;
    height: 100%;
    object-fit: cover;
    object-position: center;
}

.public-auth-actions {
    display: flex;
    margin-top: 24px;
    gap: 10px;
}

.public-primary-button,
.public-secondary-button {
    display: inline-flex;
    min-height: 42px;
    align-items: center;
    justify-content: center;
    padding: 0 19px;
    border: 0;
    border-radius: 9px;
    font-size: 14px;
    font-weight: 700;
    text-align: center;
}

.public-primary-button {
    background: #5ba4dd;
    color: #ffffff;
}

.public-primary-button:hover {
    background: #76b5e5;
}

.public-secondary-button {
    background: #e9ebef;
    color: #3c3f51;
}

.public-secondary-button:hover {
    background: #dde1e8;
}

.public-auth-columns {
    display: grid;
    grid-template-columns: minmax(0, 1.15fr) minmax(360px, .85fr);
    align-items: stretch;
    margin-top: 18px;
    gap: 18px;
}

.public-auth-columns > .global-box {
    height: 100%;
    margin-top: 0;
}

.public-auth-box > .title,
.public-welcome-box > .title,
.public-register-layout .global-box > .title {
    font-weight: 800;
}

.public-auth-lead {
    margin: 0 0 20px;
    line-height: 1.5;
}

.public-auth-form {
    display: grid;
    grid-template-columns: 1fr;
    gap: 9px;
}

.public-auth-form label,
.public-register-fields > label {
    color: #3c3f51;
    font-size: 12px;
    font-weight: 700;
}

.public-auth-form input:not([type="checkbox"]),
.public-register-fields input {
    width: 100%;
    height: 44px;
    padding: 0 14px;
    border: 1px solid #d7dae2;
    border-radius: 8px;
    outline: none;
    background: #f7f8fa;
    color: #3c3f51;
}

.public-auth-form input:focus,
.public-register-fields input:focus {
    border-color: #5ba4dd;
    box-shadow: 0 0 0 2px rgba(91, 164, 221, .16);
}

.public-auth-label-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.public-auth-label-row a {
    color: #365aa3;
    font-size: 12px;
}

.public-auth-check {
    display: flex;
    min-height: 28px;
    align-items: center;
    margin-top: 4px;
    gap: 9px;
    color: #656979;
    font-size: 12px;
    cursor: pointer;
}

.public-auth-check input {
    width: 18px;
    height: 18px;
    margin: 0;
    accent-color: #5ba4dd;
}

.public-auth-submit {
    width: 100%;
    margin-top: 7px;
}

.public-welcome-box > .content {
    display: flex;
    min-height: 245px;
    align-items: center;
    gap: 26px;
}

.public-welcome-avatar {
    flex: 0 0 auto;
    image-rendering: pixelated;
}

.public-welcome-copy {
    min-width: 0;
}

.public-welcome-copy strong {
    display: block;
    margin-bottom: 12px;
    color: #3c3f51;
    font-size: 17px;
}

.public-welcome-copy ul {
    margin: 0 0 18px;
    padding: 0;
    list-style: none;
}

.public-welcome-copy li {
    margin-bottom: 9px;
    color: #6d7183;
    font-size: 13px;
}

.public-welcome-copy li::before {
    display: inline-block;
    width: 18px;
    color: #5ba4dd;
    content: "✓";
    font-weight: 900;
}

.public-register-intro {
    margin: 0 0 18px;
}

.public-register-intro > .content {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: center;
    padding: 18px 22px;
    gap: 22px;
}

.public-register-intro img {
    image-rendering: pixelated;
}

.public-register-intro h1 {
    margin-bottom: 6px;
    font-size: 25px;
}

.public-register-layout {
    display: grid;
    width: 100%;
    clear: both;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    align-items: start;
    gap: 18px;
}

.public-register-layout > .global-box {
    margin-top: 0;
}

.public-register-layout .global-box > .title > span {
    display: inline-flex;
    width: 25px;
    height: 25px;
    align-items: center;
    justify-content: center;
    margin-right: 6px;
    border-radius: 50%;
    background: #5ba4dd;
    color: #ffffff;
    font-size: 12px;
}

.public-register-fields {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px;
}

.public-register-fields > label {
    display: grid;
    gap: 7px;
}

.public-register-security {
    grid-column: 1 / -1;
    margin: 0;
    padding: 11px 13px;
    border-radius: 7px;
    background: #fff5d8;
    color: #7a6221 !important;
    font-size: 12px !important;
    line-height: 1.45;
}

.public-register-avatar-box {
    grid-column: 1 / -1;
}

.public-register-avatar-box > .content {
    display: grid;
    grid-template-columns: 120px minmax(260px, 1fr) minmax(300px, .8fr);
    align-items: center;
    gap: 22px;
}

.public-avatar-preview {
    width: 112px;
    height: 135px;
    overflow: hidden;
    border-radius: 8px;
    background: #e9ebef url("../images/light-plate.png") center bottom no-repeat;
}

.public-avatar-preview img {
    display: block;
    margin: 2px auto 0;
    image-rendering: pixelated;
}

.public-look-options {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
}

.public-look-choice {
    display: flex;
    min-height: 70px;
    align-items: center;
    padding: 7px 10px;
    gap: 9px;
    border: 2px solid #e4e6eb;
    border-radius: 9px;
    background: #f7f8fa;
    color: #3c3f51;
    font-weight: 700;
    cursor: pointer;
}

.public-look-choice.is-selected,
.public-look-choice:has(input:checked) {
    border-color: #5ba4dd;
    background: #eef7fd;
}

.public-look-choice input {
    width: 18px;
    height: 18px;
    margin: 0;
    accent-color: #5ba4dd;
}

.public-look-choice img {
    width: 48px;
    height: 52px;
    object-fit: none;
    image-rendering: pixelated;
}

.public-register-terms {
    margin: 0 0 10px;
}

.public-register-terms a {
    color: #365aa3;
    text-decoration: underline;
}

.public-site-header + .public-auth-content + .footer {
    margin-top: 15px;
}

.app[theme="dark"] .public-auth-hero,
.app[theme="dark"] .public-auth-box,
.app[theme="dark"] .public-welcome-box,
.app[theme="dark"] .public-register-intro {
    background: #282a34;
}

.app[theme="dark"] .public-auth-hero::after {
    background: linear-gradient(90deg, #282a34 8%, rgba(40, 42, 52, .97) 38%, rgba(40, 42, 52, .08) 72%);
}

.app[theme="dark"] .public-auth-hero h1,
.app[theme="dark"] .public-register-intro h1,
.app[theme="dark"] .public-auth-form label,
.app[theme="dark"] .public-register-fields > label,
.app[theme="dark"] .public-welcome-copy strong,
.app[theme="dark"] .public-look-choice {
    color: #ffffff;
}

.app[theme="dark"] .public-auth-hero p,
.app[theme="dark"] .public-register-intro p,
.app[theme="dark"] .public-welcome-copy li,
.app[theme="dark"] .public-auth-check {
    color: #c8cbd4;
}

.app[theme="dark"] .public-auth-form input:not([type="checkbox"]),
.app[theme="dark"] .public-register-fields input,
.app[theme="dark"] .public-look-choice {
    border-color: #454857;
    background: #333642;
    color: #ffffff;
}

.static-ad-space {
    min-height: 1px;
}

.empty-encelade-view {
    min-height: 100vh;
}

.empty-encelade-view::after {
    display: block;
    width: 1185px;
    max-width: calc(100% - 30px);
    min-height: 240px;
    clear: both;
    margin: 0 auto;
    content: "";
}

.cms2-auth-content {
    width: 100%;
    clear: both;
    float: left;
    padding: 34px 0 12px;
}

.cms2-auth-panel {
    position: relative;
    width: 1093px;
    max-width: calc(100% - 30px);
    margin: 0 auto 25px;
    border-radius: 10px;
    background: #ffffff;
    color: #3c3f51;
    box-shadow: 0 0 0 1px rgba(26, 40, 49, .1) inset;
}

.cms2-login-panel {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    padding: 20px 30px;
    gap: 26px;
}

.cms2-login-column {
    min-width: 0;
}

.cms2-login-column-form {
    padding: 0 28px;
}

.cms2-card {
    position: relative;
    width: 100%;
    padding: 10px;
    border: 0;
    border-radius: 10px;
    background: #ffffff;
    box-shadow: 0 0 0 1px rgba(26, 40, 49, .1) inset;
}

.cms2-login-card {
    display: flex;
    margin-top: 20px;
    flex-direction: column;
    gap: 10px;
}

.cms2-card-header {
    display: flex;
    width: 100%;
    min-height: 50px;
    align-items: center;
    margin: -25px 0 8px;
    padding: 9px 12px;
    gap: 10px;
    border-radius: 10px;
    background: #f27e46;
    color: #ffffff;
}

.cms2-card-header > span:last-child {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.cms2-card-header strong {
    color: #ffffff;
    font-size: 16px;
    line-height: 18px;
}

.cms2-card-header small {
    margin-top: 1px;
    color: #ffffff;
    font-size: 13px;
    line-height: 15px;
}

.cms2-card-header-icon {
    position: relative;
    width: 32px;
    height: 33px;
    flex: 0 0 32px;
    background-image: url("../images/public/cms2/sprite.png");
    background-repeat: no-repeat;
    image-rendering: pixelated;
}

.cms2-card-header-icon-lock {
    background-position: -360px -11px;
}

.cms2-card-header-icon-user {
    width: 29px;
    height: 28px;
    flex-basis: 29px;
    background-position: -356px -79px;
}

.cms2-card-header-icon::before,
.cms2-card-header-icon::after {
    display: none;
    content: none;
}

.cms2-auth-input {
    position: relative;
    display: flex;
    width: 100%;
    min-height: 45px;
    align-items: center;
    overflow: hidden;
}

.cms2-auth-input input,
.cms2-register-input input {
    width: 100%;
    height: 45px;
    padding: 0 12px;
    border: 0;
    border-radius: 8px;
    outline: 0;
    background: #eaeaea;
    color: #3c3f51;
    font-size: 13px;
    box-shadow: 0 0 0 1px rgba(26, 40, 49, .1) inset;
}

.cms2-auth-input input:focus,
.cms2-register-input input:focus {
    box-shadow: 0 0 0 1px #5ba4dd inset, 0 0 0 2px rgba(91, 164, 221, .16);
}

.cms2-auth-input-user input {
    padding-left: 50px;
}

.cms2-user-head {
    position: absolute;
    bottom: -41px;
    left: 6px;
    z-index: 5;
    width: 38px;
    height: 97px;
    overflow: hidden;
    background: url("../images/alfred.png") center no-repeat;
}

.cms2-auth-input-password input {
    min-width: 0;
    padding-left: 38px;
}

.cms2-input-icon {
    position: absolute;
    left: 13px;
    z-index: 1;
    color: #8a8a8a;
}

.cms2-auth-input-password .cms2-button {
    min-width: 120px;
    height: 45px;
    margin-left: 7px;
}

.cms2-button {
    display: inline-flex;
    min-height: 43px;
    align-items: center;
    justify-content: center;
    padding: 0 18px;
    border: 0;
    border-radius: 10px;
    color: #ffffff;
    font-size: 13px;
    font-weight: 700;
    text-decoration: none;
    cursor: pointer;
    box-shadow: none;
    transition: 200ms ease-in-out background-color, 200ms ease-in-out opacity;
}

.cms2-button:hover {
    opacity: 1;
}

.cms2-button-success {
    background: #59b656;
}

.cms2-button-register {
    min-width: 150px;
    background: #5ba4dd;
}

.cms2-button-cancel {
    background: #dd3f3f;
}

.cms2-button-register:hover {
    background: rgb(133.2424242424, 187.4393939394, 229.7575757576);
}

.cms2-button-success:hover {
    background: #59b656;
    opacity: .84;
}

.cms2-button-cancel:hover {
    background: rgb(228.6725663717, 106.3274336283, 106.3274336283);
}

.cms2-forgot-link {
    margin-top: 2px;
    color: #365aa3;
    font-size: 12px;
    font-weight: 600;
    text-decoration: none;
}

.cms2-discord-banner {
    display: block;
    width: 66%;
    height: 82px;
    margin: 20px auto 0;
    border-radius: 10px;
    background: #eaeaea url("../images/discorddw.png?v=20260830-01") center no-repeat;
    box-shadow: 0 0 0 1px rgba(26, 40, 49, .1) inset;
}

/* Conditions d'utilisation — document juridique dans le thème Encelade. */
.page.conditions-page {
    display: grid;
    grid-template-columns: 150px minmax(0, 1050px) 150px;
    grid-auto-flow: row dense;
    align-items: start;
}

.page.conditions-page > #site-header,
.page.conditions-page > #footer {
    grid-column: 1 / -1;
    width: 100%;
}

.page.conditions-page > .encelade-conditions-shell {
    display: grid;
    grid-column: 2;
    width: 1050px;
    max-width: 100%;
    margin: 34px 0 45px;
    gap: 15px;
}

.encelade-conditions-shell > .global-box {
    width: 100%;
    margin: 0;
    float: none;
}

.encelade-conditions-intro > .content {
    padding: 18px;
}

.encelade-conditions-intro > .content > p {
    margin: 0;
    color: #3c3f51;
    font-size: 14px;
    line-height: 1.55;
}

.encelade-conditions-intro nav {
    display: flex;
    flex-wrap: wrap;
    margin-top: 14px;
    gap: 8px;
}

.encelade-conditions-intro nav > a {
    display: inline-flex;
    min-height: 34px;
    align-items: center;
    padding: 0 12px;
    border-radius: 10px;
    background: #f27e46;
    color: #ffffff;
    font-size: 12px;
    font-weight: 700;
    text-decoration: none;
}

.encelade-conditions-intro nav > a:hover {
    background: rgba(242, 126, 70, .76);
}

.encelade-conditions-document > .content {
    padding: 28px 34px 36px;
}

.encelade-conditions-document .content-cgu {
    color: #3c3f51;
    font-size: 14px;
    line-height: 1.65;
}

.encelade-conditions-document .content-cgu h1 {
    margin: 0 0 8px;
    color: #3c3f51;
    font-size: 22px;
    line-height: 1.3;
    scroll-margin-top: 20px;
}

.encelade-conditions-document .content-cgu h2 {
    margin: 8px 0;
    color: #f27e46;
    font-size: 17px;
    line-height: 1.4;
    scroll-margin-top: 20px;
}

.encelade-conditions-document .content-cgu p {
    margin: 0;
    color: #3c3f51;
}

.encelade-conditions-document .content-cgu a {
    color: #f27e46 !important;
    font-weight: 700;
}

.encelade-conditions-document .content-cgu .cguIntro {
    padding: 16px;
    border-radius: 10px;
    background: #fff4ec;
    color: #86441f;
    font-weight: 600;
}

@media (max-width: 850px) {
    .page.conditions-page {
        display: block;
    }

    .page.conditions-page > .encelade-conditions-shell {
        width: calc(100% - 30px);
        margin: 25px auto 40px;
    }
}

@media (max-width: 560px) {
    .cms2-discord-banner {
        width: 100%;
    }

    .encelade-conditions-document > .content {
        padding: 20px;
    }

    .encelade-conditions-document .content-cgu h1 {
        font-size: 19px;
    }
}

.cms2-discord-banner:hover {
    filter: brightness(1.04);
}

.frontend-turnstile {
    width: 100%;
    min-height: 65px;
}

.frontend-turnstile > .cf-turnstile {
    width: 100%;
}

.frontend-turnstile noscript {
    display: block;
    padding: 10px;
    border-radius: 8px;
    background: #ff3e48;
    color: #ffffff;
    font-size: 12px;
    text-align: center;
}

.cms2-login-column-promo {
    display: flex;
    padding-top: 10px;
    flex-direction: column;
    gap: 8px;
}

.cms2-index-promo {
    position: relative;
    min-height: 295px;
    overflow: hidden;
    border: 0;
    border-radius: 10px;
    background: url("../images/public/cms2/header.png") center / cover no-repeat;
    box-shadow: 0 0 0 1px rgba(26, 40, 49, .1) inset;
}

.cms2-index-promo-copy {
    position: absolute;
    inset: 0;
    display: flex;
    padding: 20px;
    flex-direction: column;
    border-radius: 10px;
    background: rgba(38, 38, 38, .64);
    color: #ffffff;
}

.cms2-index-promo-copy h1 {
    margin: 0 0 9px;
    font-size: 25px;
    text-transform: uppercase;
}

.cms2-index-promo-copy p {
    margin: 0;
    color: #ffffff;
    font-size: 13px;
    line-height: 1.55;
}

.cms2-index-promo-copy > div {
    display: flex;
    align-items: center;
    margin-top: auto;
    gap: 12px;
}

.cms2-index-promo-copy small {
    flex: 1;
    color: #ffffff;
    font-size: 11px;
    line-height: 1.35;
}

.cms2-index-promo-copy strong {
    color: #ffffff;
    font-size: inherit;
    font-weight: 700;
}

.cms2-index-respect {
    position: relative;
    min-height: 64px;
    overflow: hidden;
    padding: 10px;
    border: 0;
    border-radius: 10px;
    background: url("../images/public/cms2/index1.png") center 64% / cover no-repeat;
    box-shadow: 0 0 0 1px rgba(26, 40, 49, .1) inset;
}

.cms2-index-respect p {
    position: relative;
    z-index: 1;
    margin: 0;
    padding: 10px;
    border-radius: 8px;
    background: rgba(38, 38, 38, .58);
    color: #ffffff;
    font-size: 11px;
}

.cms2-register-panel {
    display: grid;
    min-height: 479px;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    align-items: start;
    padding: 20px 30px;
    gap: 14px;
}

.cms2-register-card {
    display: flex;
    min-height: 430px;
    flex-direction: column;
    gap: 11px;
}

.cms2-register-header {
    overflow: hidden;
    background: #f27e46 url("../images/public/cms2/registerdefault.png") 151% 25% / auto no-repeat;
}

.cms2-register-card > p {
    margin: 0;
    color: #6d7183;
    font-size: 12px;
    line-height: 1.4;
}

.cms2-register-card > p strong {
    color: #3c3f51;
    font-size: inherit;
    font-weight: 700;
}

.cms2-register-input {
    display: grid;
    gap: 5px;
    color: #3c3f51;
    font-size: 12px;
    font-weight: 700;
}

.cms2-register-card-finish {
    padding-top: 16px;
}

.encelade-look-picker {
    display: grid;
    min-width: 0;
    margin: 0;
    padding: 0;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px 20px;
    border: 0;
}

.encelade-look-picker legend {
    grid-column: 1 / -1;
    margin-bottom: 2px;
    color: #3c3f51;
    font-size: 14px;
    font-weight: 700;
}

.cms2-hidden-radio {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    opacity: 0;
}

.encelade-look-list {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 10px;
}

.encelade-look-choice {
    display: block;
    height: 64px;
    overflow: hidden;
    border-radius: 20px;
    background: #ffffff;
    box-shadow: 0 0 0 2px #eeeeee;
    cursor: pointer;
    text-align: center;
    transition: 200ms ease-in-out box-shadow;
}

.encelade-look-choice:hover {
    box-shadow: 0 0 0 2px #d5d5d5;
}

.encelade-look-choice.is-selected,
.encelade-look-choice:has(.cms2-hidden-radio:checked) {
    border-color: #e4e6eb;
    background: #e4e6eb;
    box-shadow: none;
}

.encelade-look-choice img {
    max-width: none;
    margin-top: -21px;
    margin-left: -16px;
    image-rendering: pixelated;
}

.public-look-choice img {
    width: auto;
    height: auto;
    object-fit: none;
    image-rendering: pixelated;
}

.cms2-register-result {
    position: relative;
    display: flex;
    min-height: 72px;
    align-items: center;
    padding: 5px 12px 5px 66px;
    border-radius: 10px;
    background: #f27e46;
    color: #ffffff;
}

.cms2-register-result > span:last-child {
    display: flex;
    flex-direction: column;
}

.cms2-register-result strong {
    color: #ffffff;
    font-size: 16px;
    line-height: 18px;
}

.cms2-register-result small {
    margin-top: 4px;
    color: #ffffff;
    font-size: 11px;
}

.cms2-register-frank {
    position: absolute;
    bottom: 0;
    left: 3px;
    width: 64px;
    height: 83px;
    background: url("../images/alfred.png") 4px 15px no-repeat;
    image-rendering: pixelated;
}

.cms2-register-actions {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
}

.page.help-attitude > .content > .encelade-help-introduction,
.page.help-newbie > .content > .encelade-help-introduction,
.page.help-safety > .content > .encelade-help-introduction {
    margin-top: 15px !important;
}

.encelade-help-introduction > .content {
    padding: 18px 22px !important;
}

.encelade-help-introduction > .content > p {
    margin: 0;
    color: #3c3f51 !important;
    font-size: 14px;
    line-height: 1.55;
    text-align: center;
}

/* Accueil connecté MetroHotel */
.metro-me-page {
    min-height: 100vh;
}

.metro-me-shell {
    display: grid;
    grid-template-columns: minmax(0, 712px) 295px;
    width: 1050px;
    max-width: calc(100% - 30px);
    margin: 34px auto 45px;
    gap: 44px;
    align-items: start;
}

.metro-me-left,
.metro-me-right {
    display: flex;
    min-width: 0;
    flex-direction: column;
    gap: 16px;
}

.metro-me-left {
    padding-top: 19px;
}

.metro-me-profile-card,
.metro-me-news-card,
.metro-me-ranking-card {
    box-sizing: border-box;
    margin: 0;
    overflow: hidden;
    border-radius: 3px;
    background: #fff;
    box-shadow: none;
}

.metro-me-profile-card {
    position: relative;
    height: 176px;
}

.metro-me-profile-cover {
    position: relative;
    height: 112px;
    margin: 8px 8px 0;
    overflow: hidden;
    background-color: #f2f2f2;
    background-image: linear-gradient(rgba(255, 255, 255, .68), rgba(255, 255, 255, .68)), url("../images/public/me/lottery.png");
    background-position: center;
}

.metro-me-profile-bottom {
    position: relative;
    display: flex;
    height: 55px;
    align-items: center;
    padding: 0 12px 0 19px;
}

.metro-me-profile-bottom > strong {
    display: flex;
    align-items: center;
    gap: 6px;
    color: #26343c;
    font-size: 13px;
}

.metro-me-profile-bottom > strong img {
    width: 17px;
    height: auto;
    image-rendering: pixelated;
}

.metro-me-profile-avatar {
    position: absolute;
    bottom: 20px;
    left: 59px;
    width: 67px;
    height: 112px;
}

.metro-me-profile-avatar img {
    position: absolute;
    top: 0;
    left: 206px;
    max-width: none;
    transform: translateX(-50%);
    image-rendering: pixelated;
    scale: 2;
}

.metro-me-currencies {
    display: flex;
    align-items: center;
    gap: 6px;
}

.metro-me-profile-cover > .metro-me-currencies {
    position: absolute;
    left: 12px;
    bottom: 12px;
    z-index: 1;
}

.metro-me-page .slidernews > .article > a {
    background-color: #59b656;
}

.metro-me-currency {
    display: inline-flex;
    min-width: 56px;
    height: 34px;
    box-sizing: border-box;
    align-items: center;
    justify-content: center;
    gap: 5px;
    padding: 0 7px;
    border-radius: 8px;
    color: #26343c;
    font-size: 11px;
    white-space: nowrap;
    background-color: #ffffff;
}

.metro-me-currency img {
    width: auto;
    max-width: 20px;
    height: auto;
    max-height: 20px;
    image-rendering: pixelated;
}

.metro-me-currency b {
    color: #3c3f51;
    font-size: 14px;
}

.metro-me-lottery-card {
    position: relative;
    isolation: isolate;
    display: flex;
    height: 101px;
    box-sizing: border-box;
    justify-content: center;
    padding: 9px 11px;
    overflow: hidden;
    border-radius: 3px;
    background: #cceffc url("../images/lotteryBanner-DJZz7xSB.png") no-repeat;
    color: #075277;
    flex-direction: column;
    text-decoration: none;
    box-shadow: 0 0 0 1px rgba(26, 40, 49, .1) inset;
}

.metro-me-lottery-card::after {
    position: absolute;
    inset: 0;
    content: "";
    background: linear-gradient(90deg, rgba(206, 241, 253, .98) 0, rgba(206, 241, 253, .88) 37%, rgba(206, 241, 253, 0) 73%);
    pointer-events: none;
    z-index: 0;
}

.metro-me-lottery-card > * {
    position: relative;
    z-index: 1;
}

.metro-me-lottery-status {
    width: max-content;
    margin-bottom: 3px;
    padding: 3px 7px;
    border-radius: 3px;
    background: rgba(106, 218, 190, .35);
    color: #209a77;
    font-size: 10px;
    font-weight: 700;
}

.metro-me-lottery-card > strong {
    color: #075277;
    font-size: 18px;
    text-shadow: 0 1px rgba(255, 255, 255, .7);
}

.metro-me-lottery-card > small {
    margin-top: auto;
    color: #164f69;
    font-size: 12px;
    font-weight: 600;
}

.metro-me-lottery-link {
    display: flex;
    height: 33px;
    align-items: center;
    justify-content: space-between;
    box-sizing: border-box;
    padding: 0 10px;
    border-radius: 3px;
    background: #c8e7f5;
    color: #0a5b83;
    font-size: 12px;
    text-decoration: none;
}

.metro-me-lottery-link b {
    color: #fc701f;
    font-size: 17px;
}

.metro-me-news-hero {
    position: relative;
    display: flex;
    height: 179px;
    justify-content: flex-end;
    box-sizing: border-box;
    padding: 11px 9px 15px;
    overflow: hidden;
    background: #6a372b url("../images/public/me/news.png") center / cover no-repeat;
    color: #fff;
    flex-direction: column;
    text-decoration: none;
}

.metro-me-news-hero::after {
    position: absolute;
    inset: 0;
    content: "";
    background: linear-gradient(180deg, rgba(0, 0, 0, .15), rgba(48, 17, 12, .55));
}

.metro-me-news-hero > * {
    position: relative;
    z-index: 1;
}

.metro-me-news-hero > span {
    position: absolute;
    top: 11px;
    left: 9px;
    font-size: 11px;
    font-weight: 700;
}

.metro-me-news-hero > strong {
    font-size: 16px;
}

.metro-me-news-hero > small {
    margin-top: 5px;
    font-size: 11px;
}

.metro-me-news-list {
    display: flex;
    flex-direction: column;
}

.metro-me-news-list a {
    position: relative;
    display: flex;
    min-height: 50px;
    justify-content: center;
    box-sizing: border-box;
    padding: 7px 9px 7px 54px;
    border-bottom: 1px solid #dedede;
    color: #777;
    flex-direction: column;
    text-decoration: none;
}

.metro-me-news-list a::before {
    position: absolute;
    left: 23px;
    content: "▣";
    color: #9ea3a6;
}

.metro-me-news-list a.is-active,
.metro-me-news-list a:hover {
    background: #f3f3f3;
    color: #282828;
}

.metro-me-news-list strong,
.metro-me-news-list small {
    font-size: 11px;
}

.metro-me-news-list small {
    margin-top: 2px;
    color: #999;
}

.metro-me-ranking-card > header {
    display: flex;
    min-height: 39px;
    align-items: center;
    justify-content: space-between;
    padding-left: 20px;
}

.metro-me-ranking-card > header strong {
    font-size: 14px;
}

.metro-me-ranking-card > header nav {
    display: flex;
    align-self: stretch;
}

.metro-me-ranking-card > header button {
    display: flex;
    width: 36px;
    align-items: center;
    justify-content: center;
    border: 0;
    background: #fff;
    cursor: pointer;
    border-radius: 0 0 10px 10px;
}

.metro-me-ranking-card > header button:hover,
.metro-me-ranking-card > header button.is-active {
    background: #eaeaea;
}

.metro-me-ranking-card > header button img {
    max-width: 19px;
    max-height: 20px;
    image-rendering: pixelated;
}

.metro-me-ranking-card.box-top-gamers > .others > .line > .pos {
    display: flex;
    align-items: center;
    justify-content: center;
}

.metro-me-ranking-card.box-top-gamers > .others > .line > .pos > img {
    max-width: 20px;
    max-height: 30px;
    image-rendering: pixelated;
    margin-top: 3px;
}

.metro-me-ranking-loading {
    width: 100%;
    margin: 0;
    padding: 18px;
    box-sizing: border-box;
    color: #3c3f51;
    text-align: center;
    opacity: .72;
}

.metro-me-discord-card {
    display: grid;
    min-height: 76px;
    box-sizing: border-box;
    grid-template-columns: 38px minmax(0, 1fr) auto;
    align-items: center;
    gap: 10px;
    padding: 11px 12px;
    border-radius: 3px;
    background: #5865f2;
    color: #fff;
    text-decoration: none;
    box-shadow: 0 0 0 1px rgba(26, 40, 49, .1) inset;
}

.metro-me-discord-card > img {
    width: 32px;
    height: auto;
}

.metro-me-discord-card > span {
    display: flex;
    min-width: 0;
    flex-direction: column;
    gap: 3px;
}

.metro-me-discord-card strong {
    color: #fff;
    font-size: 13px;
}

.metro-me-discord-card small {
    color: rgba(255, 255, 255, .82);
    font-size: 10px;
    line-height: 13px;
}

.metro-me-discord-card > b {
    padding: 7px 8px;
    border-radius: 3px;
    background: #fff;
    color: #3c3f51;
    font-size: 10px;
    text-transform: uppercase;
}

.metro-me-discord-card:hover {
    background: #4d59dc;
}

.metro-me-referral-box {
    margin: 0;
    overflow: hidden;
}

.metro-me-referral-box > .metro-me-referral-content {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    align-items: center;
    gap: 15px;
}

.metro-me-referral-body {
    display: flex;
    min-width: 0;
    flex-direction: column;
    gap: 5px;
}

.metro-me-referral-body > p {
    margin: 0;
    color: #3c3f51;
    font-size: 14px;
    line-height: 1.45;
    opacity: .8;
}

.metro-me-referral-body > p b,
.metro-me-referral-body > small b {
    color: #f27e46;
}

.metro-me-referral-image {
    display: block;
    width: 76px;
    height: 65px;
    object-fit: contain;
    image-rendering: pixelated;
}

.metro-me-referral-copy {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 6px;
}

.metro-me-referral-copy input {
    width: 100%;
    min-width: 0;
    height: 40px;
    box-sizing: border-box;
    padding: 0 15px;
    border: 1px solid #dddddd;
    border-radius: 10px;
    outline: none;
    background: #f7f7f7;
    color: #3c3f51;
    font-size: 14px;
    font-weight: 500;
}

.metro-me-referral-button {
    display: inline-flex;
    min-width: 90px;
    min-height: 40px;
    box-sizing: border-box;
    align-items: center;
    justify-content: center;
    padding: 0 12px;
    border: 0;
    border-radius: 10px;
    background: #f27e46;
    color: #ffffff;
    font: inherit;
    font-size: 14px;
    font-weight: 700;
    text-align: center;
    transition: 200ms ease-in-out all;
}

.metro-me-referral-button:hover {
    background: rgba(242, 126, 70, .72);
}

.metro-me-referral-button[theme="light"] {
    background: #f27e46;
    color: #ffffff;
}

.metro-me-referral-button[theme="light"]:hover {
    background: rgba(242, 126, 70, .72);
}

.metro-me-referral-body > small {
    color: #3c3f51;
    font-size: 12px;
    opacity: .8;
}

.metro-me-referral-more {
    width: max-content;
    color: #f27e46;
    font-size: 12px;
    font-weight: 700;
    text-decoration: none;
}

.metro-me-referral-more:hover {
    text-decoration: underline;
}

/* Parrainage — structure Encelade, données réelles et récompense sécurisée. */
.page.referrals {
    display: grid;
    grid-template-columns: 150px minmax(0, 1050px) 150px;
    grid-auto-flow: row dense;
    align-items: start;
}

.page.referrals > #site-header,
.page.referrals > #footer {
    grid-column: 1 / -1;
    width: 100%;
}

.page.referrals > .encelade-referrals-shell {
    display: grid;
    grid-column: 2;
    grid-template-columns: 330px minmax(0, 705px);
    align-items: start;
    gap: 15px;
    width: 1050px;
    max-width: 100%;
    margin: 34px 0 45px;
}

.encelade-referrals-shell > .global-box,
.encelade-referrals-main > .global-box {
    width: 100%;
    margin: 0;
    float: none;
}

.encelade-referrals-main {
    display: grid;
    gap: 15px;
    min-width: 0;
}

.encelade-referrals-explanation > .content {
    text-align: center;
}

.encelade-referrals-explanation > .content > img {
    display: block;
    width: 126px;
    height: 107px;
    margin: 0 auto 15px;
    object-fit: contain;
    image-rendering: pixelated;
}

.encelade-referrals-explanation > .content > p,
.encelade-referrals-explanation > .content > ol {
    color: #3c3f51;
    font-size: 14px;
    line-height: 1.55;
    text-align: left;
}

.encelade-referrals-explanation > .content > .encelade-referrals-lead {
    margin: 0;
}

.encelade-referrals-explanation > .content > .encelade-referrals-lead > b {
    color: #f27e46;
    font-size: 15px;
}

.encelade-referrals-explanation > .content > ol {
    counter-reset: referral-step;
    list-style: none;
    margin: 15px 0 0;
    padding: 0;
}

.encelade-referrals-explanation > .content > ol > li {
    position: relative;
    min-height: 30px;
    padding: 6px 0 6px 38px;
    counter-increment: referral-step;
}

.encelade-referrals-explanation > .content > ol > li::before {
    position: absolute;
    top: 5px;
    left: 0;
    display: flex;
    width: 28px;
    height: 28px;
    align-items: center;
    justify-content: center;
    border-radius: 10px;
    background: #f27e46;
    color: #ffffff;
    content: counter(referral-step);
    font-size: 12px;
    font-weight: 700;
}

.encelade-referrals-explanation > .content > ol > li + li {
    margin-top: 8px;
}

.encelade-referrals-explanation > .content > ol b {
    color: #f27e46;
}

.encelade-referrals-explanation > .content > .encelade-referrals-warning {
    margin: 15px 0 0;
    padding: 12px;
    border-radius: 10px;
    background: #fff4ec;
    color: #b85324;
    font-size: 12px;
    font-weight: 700;
}

.encelade-referrals-claim > .content {
    display: grid;
    gap: 14px;
}

.encelade-referrals-bonus {
    display: flex;
    align-items: center;
    gap: 12px;
}

.encelade-referrals-bonus > img {
    display: block;
    width: 42px;
    height: 42px;
    object-fit: contain;
    image-rendering: pixelated;
}

.encelade-referrals-bonus > div {
    display: flex;
    min-width: 0;
    flex: 1 1 auto;
    flex-direction: column;
    gap: 3px;
}

.encelade-referrals-bonus > div > strong {
    color: #3c3f51;
    font-size: 16px;
}

.encelade-referrals-bonus > div > small {
    color: #3c3f51;
    font-size: 12px;
    opacity: .72;
}

.encelade-referrals-bonus > .btn[theme="light"] {
    display: inline-flex;
    min-height: 40px;
    align-items: center;
    justify-content: center;
    padding: 0 16px;
    border: 0;
    border-radius: 10px;
    background: #f27e46;
    color: #ffffff;
    font-size: 13px;
    font-weight: 700;
    cursor: pointer;
}

.encelade-referrals-bonus > .btn[theme="light"]:hover {
    background: rgba(242, 126, 70, .72);
}

.encelade-referrals-bonus > .btn:disabled {
    cursor: not-allowed;
    opacity: .55;
}

.encelade-referrals-progress {
    overflow: hidden;
    width: 100%;
    height: 8px;
    border-radius: 8px;
    background: #eceef3;
}

.encelade-referrals-progress > span {
    display: block;
    width: 0;
    height: 100%;
    border-radius: inherit;
    background: #f27e46;
    transition: width 250ms ease-in-out;
}

.encelade-referrals-copy {
    margin-top: 2px;
}

.encelade-referrals-link-label {
    margin: 0;
    color: #3c3f51;
    font-size: 13px;
    font-weight: 700;
}

.encelade-referrals-stats {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 8px;
}

.encelade-referrals-stats > span {
    display: flex;
    min-height: 58px;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    border-radius: 10px;
    background: #f5f6f8;
    color: #3c3f51;
}

.encelade-referrals-stats > span > b {
    color: #f27e46;
    font-size: 18px;
}

.encelade-referrals-stats > span > small {
    margin-top: 2px;
    font-size: 11px;
    opacity: .72;
}

.encelade-referrals-list {
    display: grid;
    gap: 8px;
}

.encelade-referral-user {
    display: flex;
    min-width: 0;
    min-height: 64px;
    align-items: center;
    gap: 12px;
    box-sizing: border-box;
    padding: 0 14px 0 6px;
    border: 1px solid rgba(26, 40, 49, .08);
    border-radius: 10px;
    background: #ffffff;
    color: #3c3f51;
    text-decoration: none;
    transition: 200ms ease-in-out all;
}

.encelade-referral-user:hover {
    box-shadow: 0 5px 14px rgba(26, 40, 49, .11);
    transform: translateY(-1px);
}

.encelade-referral-user__avatar {
    display: block;
    overflow: hidden;
    flex: 0 0 58px;
    width: 58px;
    height: 58px;
    border-radius: 58px 0 58px 58px;
    background: #efbd9c;
}

.encelade-referral-user__avatar > img {
    display: block;
    margin: -7px 0 0 -4px;
    image-rendering: pixelated;
}

.encelade-referral-user__identity {
    display: flex;
    min-width: 0;
    flex: 1 1 auto;
    flex-direction: column;
    gap: 3px;
}

.encelade-referral-user__identity > strong {
    overflow: hidden;
    color: #3c3f51;
    font-size: 14px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.encelade-referral-user__identity > small {
    color: #3c3f51;
    font-size: 11px;
    opacity: .65;
}

.encelade-referral-user__status {
    flex: 0 0 auto;
    padding: 6px 9px;
    border-radius: 8px;
    background: #f1b451;
    color: #ffffff;
    font-size: 11px;
    font-weight: 700;
}

.encelade-referral-user--validated .encelade-referral-user__status {
    background: #59b656;
}

.encelade-referral-user--invalid {
    filter: grayscale(1);
    opacity: .72;
}

.encelade-referral-user--invalid .encelade-referral-user__status {
    background: #dd3f3f;
}

.encelade-referrals-empty {
    margin: 0;
    padding: 18px;
    border-radius: 10px;
    background: #ffffff;
    color: #3c3f51;
    text-align: center;
}

/* Page VIP adaptée au thème Encelade. */
.page.shop-vip-page {
    display: grid;
    grid-template-columns: 150px minmax(0, 1050px) 150px;
    grid-auto-flow: row dense;
    align-items: start;
}

.page.shop-vip-page > #site-header,
.page.shop-vip-page > #footer {
    grid-column: 1 / -1;
    width: 100%;
}

.page.shop-vip-page > .encelade-vip-shell {
    grid-column: 2;
    width: 100%;
    margin: 34px 0 45px;
}

.encelade-vip-hero {
    display: grid;
    min-height: 190px;
    grid-template-columns: minmax(0, 1fr) 170px minmax(0, 1fr);
    align-items: center;
    overflow: hidden;
    padding: 20px 70px;
    gap: 24px;
    border-radius: 10px;
    background: #3c3f51 url("../images/public/vip/hcbgbanner-e3DKfo6j.png") center no-repeat;
    color: #ffffff;
    box-shadow: 0 0 0 1px rgba(26, 40, 49, .12) inset;
}

.encelade-vip-hero-column {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.encelade-vip-hero-column > h1,
.encelade-vip-hero-column > h2 {
    color: #ffffff;
    font-size: 18px;
    line-height: 22px;
}

.encelade-vip-hero-column > p {
    min-height: 38px;
    margin-top: 4px;
    color: #ffffff;
    font-size: 12px;
    line-height: 17px;
    opacity: .9;
}

.encelade-vip-button {
    display: flex;
    min-height: 42px;
    align-items: center;
    justify-content: center;
    margin-top: 10px;
    padding: 0 14px;
    gap: 8px;
    border-radius: 10px;
    background: #3a4047;
    color: #ffffff;
    font-size: 12px;
    font-weight: 700;
    text-decoration: none;
    transition: 200ms ease-in-out background-color;
}

.encelade-vip-button:hover {
    background: rgb(133.2424242424, 187.4393939394, 229.7575757576);
    color: #ffffff;
}

.encelade-vip-button-green {
    background: #59b656;
}

.encelade-vip-button-green:hover {
    background: rgb(123.9834710744, 197.3842975207, 121.6157024793);
}

.encelade-vip-button > img,
.encelade-vip-hero-emblem {
    image-rendering: pixelated;
}

.encelade-vip-button > img {
    max-width: 19px;
    max-height: 20px;
}

.encelade-vip-hero-emblem {
    justify-self: center;
    width: auto;
    height: auto;
    scale: 3;
}

.encelade-vip-layout {
    display: grid;
    grid-template-columns: 300px minmax(0, 1fr);
    align-items: start;
    margin-top: 15px;
    gap: 15px;
}

.encelade-vip-sidebar {
    display: flex;
    min-width: 0;
    flex-direction: column;
    gap: 15px;
}

.encelade-vip-sidebar > .global-box,
.encelade-vip-members-box {
    margin: 0;
}

body .encelade-vip-sidebar > .global-box > .title,
body .encelade-vip-members-box > .title {
    display: flex;
    align-items: center;
    gap: 8px;
}

body .encelade-vip-sidebar > .global-box > .title > img,
body .encelade-vip-members-box > .title > img {
    image-rendering: pixelated;
}

.encelade-vip-intro > .content > p {
    color: #3c3f51;
    font-size: 14px;
    line-height: 20px;
    opacity: .8;
}

.encelade-vip-benefit {
    margin-top: 10px;
    overflow: hidden;
    border: 1px solid #dddddd;
    border-radius: 10px;
    background: #eaeaea;
    color: #3c3f51;
}

.encelade-vip-benefit:first-child {
    margin-top: 0;
}

.encelade-vip-benefit > summary {
    display: flex;
    min-height: 44px;
    align-items: center;
    padding: 9px 12px;
    gap: 8px;
    color: #3c3f51;
    font-size: 13px;
    font-weight: 700;
    cursor: pointer;
    list-style: none;
}

.encelade-vip-benefit > summary::-webkit-details-marker {
    display: none;
}

.encelade-vip-benefit > summary::after {
    width: 8px;
    height: 12px;
    margin-left: auto;
    background: url("../images/public/vip/club-arrow-CN4Uqz1V.svg") center no-repeat;
    content: "";
    transform: rotate(90deg);
}

.encelade-vip-benefit:not([open]) > summary::after {
    transform: rotate(0);
}

.encelade-vip-benefit > summary > img {
    max-width: 22px;
    max-height: 22px;
    image-rendering: pixelated;
}

.encelade-vip-benefit > ul {
    padding: 0 12px 12px;
}

.encelade-vip-benefit > ul > li {
    padding: 4px 0 4px 22px;
    color: #3c3f51;
    font-size: 11px;
    line-height: 15px;
}

.encelade-vip-benefit > ul > li::before {
    position: absolute;
    top: 4px;
    left: 0;
    display: flex;
    width: 15px;
    height: 15px;
    align-items: center;
    justify-content: center;
    border-radius: 3px;
    background: #5ba4dd;
    color: #ffffff;
    content: "✓";
    font-size: 10px;
    font-weight: 700;
}

.encelade-vip-benefit > ul > li > b {
    color: #365aa3;
    font-size: 11px;
}

body .encelade-vip-members-box > .title > img {
    margin-left: auto;
}

body .encelade-vip-members-box > .encelade-vip-members {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    align-items: start;
    gap: 10px;
}

/* Forum Encelade : états statiques et éditeur interactif. */
.page.forum [hidden] {
    display: none !important;
}

.page.forum .tt-editor-menubar {
    flex-wrap: wrap;
    gap: 5px;
}

.page.forum .tt-editor-menubar > button.tt-btn {
    border: 0;
    background: transparent;
    font: inherit;
}

.page.forum [data-forum-editor] {
    min-height: 170px;
    outline: 0;
}

.page.forum > .forum > .content.home > .line > .stats > .top > .col > .users > .response-avatar > img {
    margin-top: -35px;
    margin-left: -21px;
    scale: .5;
}

.page.forum > .forum > .content.category > .line:not(.head) > .col.users > .response-avatar > img {
    margin-top: -35px;
    margin-left: -20px;
    scale: 0.5;
}

/* Règlement — structure et couleurs adaptées au shell Encelade. */
.page.regles-page > .encelade-rules-shell {
    display: block;
    width: 1050px;
    max-width: calc(100% - 30px);
    float: none;
    clear: both;
    margin: 34px auto 45px;
    padding-top: 15px;
}

.page.regles-page .rules-grid {
    display: grid;
    width: 100%;
    clear: both;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    align-items: stretch;
    gap: 14px;
}

.page.regles-page .encelade-rules-intro {
    margin: 0 0 15px;
}

.page.regles-page .rules-card {
    display: grid;
    gap: 12px;
    padding: 14px;
    border-radius: 12px;
    box-shadow: inset 0 -2px rgba(0, 0, 0, .12);
}

.page.regles-page .rules-card--good {
    background: #8bc34a;
    color: #38563e;
}

.page.regles-page .rules-card--staff {
    background: #ffd970;
    color: #9a6127;
}

.page.regles-page .rules-card--forbidden {
    background: #d95250;
    color: #762f2e;
}

.page.regles-page .rules-card--large {
    grid-row: 1 / span 2;
    grid-column: 2;
}

.page.regles-page .rules-card__heading {
    display: flex;
    align-items: flex-start;
    gap: 10px;
}

.page.regles-page .rules-card__heading img {
    width: 30px;
    height: 30px;
    flex: 0 0 auto;
    object-fit: contain;
    image-rendering: pixelated;
}

.page.regles-page .rules-card__heading h2 {
    margin: 0;
    color: inherit;
    font-size: 16px;
    line-height: 1.2;
}

.page.regles-page .rules-card__heading p {
    margin: 4px 0 0;
    color: inherit;
    font-size: 12px;
    line-height: 1.45;
    opacity: .9;
}

.page.regles-page .rules-card ol {
    margin: 0;
    padding-left: 20px;
    color: inherit;
    font-size: 12px;
    line-height: 1.55;
}

.page.regles-page .rules-card li {
    list-style: decimal;
}

.page.regles-page .rules-card li + li {
    margin-top: 6px;
}

.page.regles-page .rules-card strong {
    color: inherit;
}

@media (max-width: 760px) {
    .page.regles-page .rules-grid {
        grid-template-columns: 1fr;
    }

    .page.regles-page .rules-card--large {
        grid-row: auto;
        grid-column: auto;
    }
}

/* Hall of Fame — contenu de classements-hotel adapté au thème Encelade. */
.encelade-hotel-rankings {
    width: 1050px;
    max-width: calc(100% - 30px);
    margin: 34px auto 45px;
    padding: 0;
}

.hall-of-fame-page > .encelade-hotel-rankings {
    margin-top: 0;
}

.encelade-hotel-rankings-intro {
    margin: 0 0 15px;
}

.encelade-hotel-rankings-grid {
    display: grid;
    width: 100%;
    clear: both;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    align-items: start;
    gap: 15px;
}

.encelade-hotel-ranking {
    min-width: 0;
    overflow: hidden;
    border-radius: 10px;
    background: #ffffff;
    box-shadow: 0 0 0 1px rgba(26, 40, 49, .1) inset;
}

.encelade-hotel-ranking > header {
    position: relative;
    height: 157px;
    min-height: 218px;
    align-self: stretch;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
}

.encelade-hotel-ranking--animations > header {
    background-image: linear-gradient(181deg, transparent 8%, #ffffff 84%), url('../images/forum/1-annonces-globales.png');
}

.encelade-hotel-ranking--lotboxes > header {
    background-image: linear-gradient(181deg, transparent 8%, #ffffff 84%), url('../images/forum/DbngJz7.png');
}

.encelade-hotel-ranking > header > strong {
    position: absolute;
    top: 10px;
    left: 10px;
    padding: 6px 10px;
    border-radius: 8px;
    background: #f27e46;
    color: #ffffff;
    font-size: 14px;
    text-shadow: 0 1px rgba(0, 0, 0, .25);
}

.encelade-hotel-ranking-list {
    background: #ffffff;
}

.encelade-hotel-ranking-list > a {
    display: grid;
    min-height: 57px;
    grid-template-columns: 62px minmax(0, 1fr) 27px;
    align-items: center;
    padding: 5px 13px 5px 17px;
    gap: 10px;
    box-shadow: 0 -1px rgba(26, 40, 49, .1) inset;
    color: #3c3f51;
    text-decoration: none;
    transition: 150ms ease-in-out background-color;
}

.encelade-hotel-ranking-list > a:last-child {
    box-shadow: none;
}

.encelade-hotel-ranking-list > a:hover {
    background: #eaeaea;
    color: #3c3f51;
}

.encelade-hotel-ranking-list > a.is-winner {
    min-height: 68px;
}

.encelade-hotel-ranking-winner {
    position: relative;
    z-index: 2;
    align-self: start;
    width: 62px;
    height: 126px;
    margin-top: -62px;
    overflow: hidden;
}

.encelade-hotel-ranking-winner::after {
    position: absolute;
    inset: 0;
    z-index: 2;
    background: url("../images/public/rankings/bg-avatar-gold-FV58CkFM.png") center no-repeat;
    content: "";
    pointer-events: none;
}

.encelade-hotel-ranking-winner > img {
    position: absolute;
    bottom: 12px;
    left: 50%;
    z-index: 3;
    max-width: none;
    transform: translateX(-50%);
    image-rendering: pixelated;
}

.encelade-hotel-ranking-avatar {
    position: relative;
    width: 62px;
    height: 47px;
    overflow: hidden;
    border-radius: 8px;
    background: #eaeaea;
}

.encelade-hotel-ranking-avatar > img {
    position: absolute;
    top: -17px;
    left: 50%;
    max-width: none;
    transform: translateX(-50%);
    image-rendering: pixelated;
}

.encelade-hotel-ranking-identity {
    display: flex;
    min-width: 0;
    gap: 3px;
    flex-direction: column;
}

.encelade-hotel-ranking-identity > strong {
    display: block;
    width: 100%;
    float: left;
    clear: both;
    overflow: hidden;
    color: #3c3f51;
    font-size: 14px;
    font-weight: 700;
    text-decoration: none;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.encelade-hotel-ranking-identity > small {
    color: #3c3f51;
    font-size: 12px;
}

.encelade-hotel-ranking--animations .encelade-hotel-ranking-identity > small,
.encelade-hotel-ranking--lotboxes .encelade-hotel-ranking-identity > small {
    color: #3c3f51;
    font-size: 14px;
    opacity: .7;
}

.encelade-hotel-ranking-medal {
    justify-self: end;
    max-width: 25px;
    max-height: 30px;
    image-rendering: pixelated;
}

.encelade-hotel-ranking-empty {
    padding: 28px 12px;
    color: #8b8f94;
    text-align: center;
}

@media (max-width: 900px) {
    .encelade-hotel-rankings-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 620px) {
    .encelade-hotel-rankings-grid { grid-template-columns: 1fr; }
}

.encelade-vip-member {
    display: flex;
    min-width: 0;
    overflow: hidden;
    border: 1px solid #dddddd;
    border-radius: 10px;
    background: #eaeaea;
    color: #3c3f51;
    flex-direction: column;
    text-decoration: none;
    transition: 200ms ease-in-out border-color, 200ms ease-in-out transform;
}

.encelade-vip-member:hover {
    color: #3c3f51;
    transform: translateY(-2px);
}

.encelade-vip-member-cover {
    display: block;
    height: 126px;
    overflow: hidden;
    background-color: #eaeaea;
    background-image: url("../images/public/vip/HCbgperfil-CJcnEM_E.png");
    background-position: center;
    background-repeat: no-repeat;
}

.encelade-vip-member-avatar {
    position: absolute;
    bottom: -1px;
    left: 50%;
    display: block;
    width: 50px;
    height: 52px;
    overflow: hidden;
    border: 2px solid #ffffff;
    border-radius: 10px 10px 0 0;
    background: #eaeaea;
    transform: translateX(-50%);
}

.encelade-vip-member-avatar > img {
    position: absolute;
    top: -15px;
    left: 50%;
    max-width: none;
    transform: translateX(-50%);
    image-rendering: pixelated;
}

.encelade-vip-member-name {
    display: flex;
    min-height: 45px;
    align-items: center;
    justify-content: center;
    padding: 6px;
    gap: 5px;
    background: #ffffff;
}

.encelade-vip-member-name > img {
    image-rendering: pixelated;
}

.encelade-vip-member-name > strong {
    overflow: hidden;
    color: #3c3f51;
    font-size: 12px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* Carte bêta de l'accueil connecté : le visuel de l'insigne reste à droite. */
.metro-me-page .metro-me-left > .encelade-articles:first-child {
    margin-top: 0;
}

.metro-me-page .encelade-articles:first-child > .content.encelade-articles-list {
    padding: 25px 15px 15px;
    overflow: hidden;
}

.encelade-beta-account-card {
    display: flex;
    min-height: 220px;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
    box-sizing: border-box;
    padding: 30px 34px;
    border-radius: 10px;
}

.encelade-beta-account-card__alfred {
    display: block;
    flex: 0 0 38px;
    width: 38px;
    height: 99px;
    object-fit: contain;
    image-rendering: pixelated;
    scale: 3;
    opacity: .4;
    left: -5px;
    top: 48px;
    margin-right: 18px;
}

.encelade-beta-account-card__copy {
    min-width: 0;
    flex: 1;
}

.encelade-beta-account-card__copy > .title {
    padding: 0;
    color: #3c3f51;
    font-size: 24px;
    font-weight: 700;
    line-height: 1.25;
}

.encelade-beta-account-card__copy > p {
    margin: 12px 0 0;
    color: #3c3f51;
    font-size: 15px;
    line-height: 1.55;
}

.encelade-beta-account-card__copy > .btn[theme="light"] {
    display: inline-flex;
    min-height: 45px;
    align-items: center;
    justify-content: center;
    margin-top: 20px;
    padding: 0 18px;
    border-radius: 10px;
    background-color: #f27e46;
    color: #ffffff;
    font-size: 14px;
    font-weight: 700;
    line-height: 45px;
    text-align: center;
    cursor: pointer;
    transition: 200ms ease-in-out all;
}

.encelade-beta-account-card__copy > .btn[theme="light"]:hover,
.encelade-beta-account-card__copy > .btn[theme="light"]:focus-visible {
    background-color: #f27e46;
    color: #ffffff;
    opacity: .84;
}

.encelade-beta-account-card__copy > .btn.is-owned {
    cursor: default;
    opacity: .75;
}

.encelade-beta-account-card__copy > .encelade-feedback {
    margin-top: 12px;
}

.encelade-beta-account-card__badge {
    display: block;
    flex: 0 0 72px;
    width: 72px;
    height: 72px;
    object-fit: contain;
    image-rendering: pixelated;
}

@media (max-width: 640px) {
    .encelade-beta-account-card {
        min-height: 190px;
        gap: 12px;
        padding: 22px 18px;
    }

    .encelade-beta-account-card__copy > .title {
        font-size: 20px;
    }

    .encelade-beta-account-card__copy > p {
        font-size: 13px;
    }

    .encelade-beta-account-card__badge {
        flex-basis: 60px;
        width: 60px;
        height: 60px;
    }

}

/* Responsive MetroHotel — reprend la navigation tablette/mobile d'Encelade. */
.metro-mobile-menu-toggle {
    display: none;
}

@media screen and (max-width: 1200px) {
    html,
    body,
    .app {
        width: 100%;
        min-width: 0;
    }

    body.metro-mobile-navigation-open {
        overflow: hidden;
        touch-action: none;
    }

    body .website-bg {
        display: none;
    }

    body .page.online,
    body .page.conditions-page,
    body .page.referrals,
    body .page.shop-vip-page,
    body .page.artist-hub-page {
        width: 100% !important;
        max-width: none !important;
        grid-template-columns: 12px minmax(0, 1fr) 12px !important;
        overflow-x: clip;
    }

    body .page.online > #site-header,
    body .page.online > #footer,
    body .page.conditions-page > #site-header,
    body .page.conditions-page > #footer,
    body .page.referrals > #site-header,
    body .page.referrals > #footer,
    body .page.shop-vip-page > #site-header,
    body .page.shop-vip-page > #footer,
    body .page.artist-hub-page > #site-header,
    body .page.artist-hub-page > #footer {
        grid-column: 1 / -1 !important;
        width: 100%;
    }

    body .page.online > :where(:not(#site-header):not(#footer):not(.panel-moving-blocks)),
    body .page.conditions-page > .encelade-conditions-shell,
    body .page.referrals > .encelade-referrals-shell,
    body .page.shop-vip-page > .encelade-vip-shell,
    body .page.artist-hub-page > .encelade-artist-hub {
        grid-column: 2 !important;
        max-width: 100%;
    }

    #site-header {
        min-height: 225px;
    }

    #site-header > .center {
        width: 100%;
        height: 145px;
    }

    #site-header > .center > .logo {
        top: 21px;
        width: 230px;
        height: 105px;
        background-position: center;
        background-size: contain;
    }

    .metro-mobile-menu-toggle {
        position: fixed;
        top: 25px;
        right: 18px;
        z-index: 1004;
        display: flex;
        width: 46px;
        height: 46px;
        align-items: center;
        justify-content: center;
        flex-direction: column;
        gap: 5px;
        padding: 0;
        border: 0;
        border-radius: 50%;
        background: #f27e46;
        cursor: pointer;
        box-shadow: 0 4px 12px rgba(26, 40, 49, .22);
    }

    .metro-mobile-menu-toggle > span {
        display: block;
        width: 22px;
        height: 2px;
        border-radius: 2px;
        background: #ffffff;
        transition: 180ms ease-in-out transform, 180ms ease-in-out opacity;
    }

    .metro-mobile-menu-toggle[aria-expanded="true"] > span:nth-child(1) {
        transform: translateY(7px) rotate(45deg);
    }

    .metro-mobile-menu-toggle[aria-expanded="true"] > span:nth-child(2) {
        opacity: 0;
    }

    .metro-mobile-menu-toggle[aria-expanded="true"] > span:nth-child(3) {
        transform: translateY(-7px) rotate(-45deg);
    }

    #site-header > .down {
        width: calc(100% - 24px);
        grid-template-columns: repeat(2, minmax(0, 1fr));
        column-gap: 10px;
    }

    #site-header > .down > .btn:not(.right),
    #site-header > .down > .btn.right {
        grid-column: auto;
        width: 100%;
        min-width: 0;
        margin-top: 15px;
        padding-right: 10px;
        padding-left: 10px;
    }

    #site-header > .down > .metro-header-hubbies {
        grid-column: 1;
    }

    #site-header > .down > .btn.right {
        grid-column: 2;
    }

    #site-header > .down.frontend-maintenance-header-down {
        display: block;
    }

    #site-header > .down > .header-navbar {
        position: fixed;
        inset: 0;
        z-index: 1002;
        display: block;
        width: 100% !important;
        height: 100dvh;
        margin: 0;
        padding: 88px 18px 38px;
        overflow-x: hidden;
        overflow-y: auto;
        border-radius: 0;
        background: #eaeaea;
        box-shadow: none;
        opacity: 0;
        visibility: hidden;
        transform: translateX(100%);
        transition: 200ms ease-in-out transform, 150ms ease-in-out opacity, 0s linear visibility 200ms;
        overscroll-behavior: contain;
    }

    #site-header > .down > .header-navbar::before {
        position: fixed;
        top: 0;
        right: 0;
        left: 0;
        height: 72px;
        content: "PixelCity menüsü";
        padding: 0 84px 0 22px;
        background: #ffffff;
        color: #3c3f51;
        font-size: 16px;
        font-weight: 700;
        line-height: 72px;
        box-shadow: 0 1px rgba(26, 40, 49, .1);
    }

    #site-header > .down > .header-navbar.is-open {
        opacity: 1;
        visibility: visible;
        transform: translateX(0);
        transition-delay: 0s;
    }

    #site-header > .down > .header-navbar > ul.navigation {
        display: block;
        width: 100%;
        height: auto;
        padding: 0;
    }

    #site-header > .down > .header-navbar > ul.navigation > li {
        position: relative;
        width: 100%;
        height: auto;
        margin-bottom: 14px;
    }

    #site-header > .down > .header-navbar > ul.navigation > li > span {
        display: flex;
        width: 100%;
        height: 48px;
        align-items: center;
        padding: 0 16px;
        border-radius: 10px 10px 0 0;
        background: #f27e46;
        color: #ffffff;
        line-height: 48px;
    }

    #site-header > .down > .header-navbar > ul.navigation > li > .sub,
    #site-header > .down > .header-navbar > ul.navigation > li:hover > .sub,
    #site-header > .down > .header-navbar > ul.navigation > li:focus-within > .sub {
        position: relative;
        top: auto;
        left: auto;
        display: grid;
        min-width: 0;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 1px 12px;
        padding: 9px 16px 12px;
        border: 0;
        border-radius: 0 0 10px 10px;
        background: #ffffff;
        box-shadow: 0 0 0 1px rgba(26, 40, 49, .08) inset;
        transform: none;
        white-space: normal;
    }

    #site-header > .down > .header-navbar > ul.navigation > li > .sub > li > a {
        min-height: 36px;
        padding: 7px 0;
        line-height: 22px;
    }

    #site-header[theme="dark"] > .down > .header-navbar,
    .app[theme="dark"] #site-header > .down > .header-navbar {
        background: #282a34;
    }

    #site-header[theme="dark"] > .down > .header-navbar::before,
    .app[theme="dark"] #site-header > .down > .header-navbar::before,
    #site-header[theme="dark"] > .down > .header-navbar > ul.navigation > li > .sub,
    .app[theme="dark"] #site-header > .down > .header-navbar > ul.navigation > li > .sub {
        background: #3c3f51;
        color: #ffffff;
    }

    #site-header[theme="dark"] > .down > .header-navbar > ul.navigation > li > .sub > li > a,
    .app[theme="dark"] #site-header > .down > .header-navbar > ul.navigation > li > .sub > li > a {
        color: #ffffff;
    }

    #footer,
    #footer[theme] {
        width: 100%;
        padding: 34px 15px 55px;
    }

    #footer > .links {
        display: flex;
        align-items: center;
        justify-content: center;
        flex-wrap: wrap;
        gap: 8px 16px;
    }

    body .page.online > .left,
    body .page.online > .right,
    body .page.online > .full,
    body .page.online > .col,
    .page.shop-megapack > .col,
    .page.shop-megapack > .col + .col,
    .page.shop-megapack > .col + .col + .col {
        grid-column: 2 !important;
        width: 100% !important;
        max-width: 100% !important;
        margin-right: 0 !important;
        margin-left: 0 !important;
        float: none !important;
    }
}

@media screen and (max-width: 860px) {
    body .page.online > .left,
    body .page.online > .right,
    body .page.online > .full,
    body .page.online > .col {
        grid-column: 2 !important;
        width: 100% !important;
        max-width: 100% !important;
        margin-right: 0 !important;
        margin-left: 0 !important;
        float: none !important;
    }

    .page.events > .left + .right {
        margin-top: 15px;
    }

    .page.shop-megapack > .col,
    .page.shop-megapack > .col + .col,
    .page.shop-megapack > .col + .col + .col {
        grid-column: 2 !important;
    }

    .page.gamers > .content,
    .page.couples > .content,
    .page.organisations > .content,
    .page.staff > .content,
    .encelade-vip-layout,
    .encelade-referrals-main {
        grid-template-columns: minmax(0, 1fr) !important;
    }

    .page.couples > .content > .left,
    .page.couples > .content > .right,
    .page.organisations > .content > .left,
    .page.organisations > .content > .right,
    .page.staff > .content > .col.left,
    .page.staff > .content > .col.right,
    .page.staff > .content > .col.right.notablet {
        grid-column: 1 !important;
        grid-row: auto !important;
    }

    .page.staff > .content {
        width: calc(100% - 24px);
        max-width: none;
        padding: 20px 0;
    }

    .page.staff > .content > .col.right.notablet {
        margin-top: 0;
    }

    .page.settings-page #settings {
        grid-template-columns: minmax(0, 1fr);
    }

    .page.settings-page #settings > .settings-categories,
    .page.settings-page #settings > .top,
    .page.settings-page #settings > .forms {
        grid-column: 1;
        grid-row: auto;
    }

    .page.settings-page #settings > .settings-categories {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .page.settings-page #settings > .settings-categories > .title {
        grid-column: 1 / -1;
    }

    .metro-me-shell {
        width: calc(100% - 24px);
        max-width: none;
        grid-template-columns: minmax(0, 1fr);
        gap: 16px;
        margin: 22px auto 35px;
    }

    .metro-me-left {
        padding-top: 0;
    }

    .cms2-login-panel,
    .cms2-register-panel {
        grid-template-columns: minmax(0, 1fr);
    }

    .cms2-login-column-form {
        padding: 0;
    }

    .cms2-login-column-promo {
        padding-top: 0;
    }

    .cms2-auth-panel {
        width: calc(100% - 24px);
        max-width: none;
    }

    .page.forum > .forum > .content.home > .line {
        display: flex;
        height: auto;
        flex-direction: column;
    }

    .page.forum > .forum > .content.home > .line > .left,
    .page.forum > .forum > .content.home > .line > .stats {
        width: 100%;
        height: auto;
        float: none;
    }

    .page.forum > .forum > .content.home > .line > .stats::after {
        display: none;
    }

    .page.forum > .forum > .content.category {
        padding: 0 12px;
    }

    .page.forum > .forum > .content.category > .line.head > .users,
    .page.forum > .forum > .content.category > .line.head > .last_activity,
    .page.forum > .forum > .content.category > .line:not(.head) > .col.users,
    .page.forum > .forum > .content.category > .line:not(.head) > .col.last_activity {
        display: none;
    }

    .page.forum > .forum > .content.category > .line.head > span.title,
    .page.forum > .forum > .content.category > .line:not(.head) > .col.title {
        width: 80%;
    }

    .page.forum > .forum > .content.category > .line.head > span.nb_responses,
    .page.forum > .forum > .content.category > .line:not(.head) > .col.nb_responses {
        width: 20%;
        text-align: right;
    }

    .page.forum > .forum > .content.thread > .body > .thread,
    .page.forum > .forum > .content.comments > .comment > .body > .thread {
        overflow-wrap: anywhere;
    }

    .page.forum .markdown-formatter img,
    .page.forum .vue-markdown img,
    .page.forum .ProseMirror img {
        max-width: 100%;
        height: auto;
    }

    .page.forum.create > .content > .background {
        width: 100%;
        min-height: 130px;
    }

    .page.forum.create > .content > .form {
        width: 100%;
    }

    .page.forum.create > .content > .form > .content > form.form > .input.demi,
    .page.forum.create > .content > .form > .content > form.form > .input.demi.right {
        width: 100%;
        margin-right: 0;
        margin-left: 0;
    }

    .page.homepage > .homepage {
        overflow-x: auto;
        overflow-y: hidden;
        overscroll-behavior-inline: contain;
    }

    .page.homepage > .homepage > .inner {
        min-width: 1000px;
    }

    .page table {
        display: block;
        max-width: 100%;
        overflow-x: auto;
        white-space: nowrap;
    }

    #modal > .center {
        width: 100%;
        max-width: 100%;
        padding: 0 12px;
    }

    #modal > .center > .modal-box {
        width: calc(100vw - 60px);
        max-width: 400px;
        margin-top: 65px;
    }

    #modal > .center > .close {
        margin-top: 82px;
    }
}

@media screen and (max-width: 600px) {
    #site-header {
        min-height: 226px;
    }

    #site-header > .center {
        height: 130px;
    }

    #site-header > .center > .logo {
        top: 20px;
        width: 190px;
        height: 92px;
    }

    .metro-mobile-menu-toggle {
        top: 20px;
        right: 12px;
        width: 42px;
        height: 42px;
    }

    #site-header > .down {
        width: calc(100% - 20px);
    }

    #site-header > .down > .btn:not(.right),
    #site-header > .down > .btn.right {
        min-height: 54px;
        line-height: 1.2;
    }

    .metro-header-hubbies {
        flex-wrap: wrap;
        align-content: center;
        gap: 2px 5px;
    }

    .metro-header-hubbies span {
        width: 100%;
        font-size: 9px;
    }

    #site-header > .down > .header-navbar > ul.navigation > li > .sub {
        grid-template-columns: minmax(0, 1fr);
    }

    .frontend-maintenance-header-message {
        min-height: 54px;
        padding: 9px 30px;
    }

    .frontend-maintenance-beta__controls input {
        font-size: 16px;
    }

    .cms2-auth-content {
        padding-top: 22px;
    }

    .cms2-login-panel,
    .cms2-register-panel {
        padding: 20px 12px;
    }

    .cms2-register-card {
        min-height: 0;
    }

    .encelade-look-picker {
        grid-template-columns: minmax(0, 1fr);
    }

    .cms2-auth-input-password {
        align-items: stretch;
        overflow: visible;
        flex-wrap: wrap;
    }

    .cms2-auth-input-password input {
        flex: 1 1 calc(100% - 38px);
    }

    .cms2-auth-input-password .cms2-button {
        width: 100%;
        margin: 8px 0 0;
    }

    .cms2-discord-banner {
        width: 100%;
        background-size: cover;
    }

    .metro-me-profile-avatar img {
        left: 160px;
    }

    .encelade-beta-account-card {
        align-items: flex-start;
        flex-wrap: wrap;
    }

    .encelade-beta-account-card__alfred {
        display: none;
    }

    .encelade-beta-account-card__copy {
        flex-basis: calc(100% - 75px);
    }

    .page.photos > .content > .left > .photos > .content > .box-photo {
        width: calc(50% - 8px);
        margin-right: 16px;
    }

    .page.photos > .content > .left > .photos > .content > .box-photo:nth-child(2n) {
        margin-right: 0;
    }

    .page.forum > .forum > .header {
        display: flex;
        min-height: 70px;
        align-items: center;
        flex-wrap: wrap;
        padding: 9px 10px;
        gap: 8px;
    }

    .page.forum > .forum > .header > h1 {
        width: 100%;
        height: auto;
        margin: 0;
        line-height: 35px;
    }

    .page.forum > .forum > .header > a {
        flex: 1;
        min-width: 0;
        margin: 0;
        padding: 0 8px;
        text-align: center;
    }

    .page.forum > .forum > .content.home > .line > .left {
        padding: 14px 12px;
    }

    .page.forum > .forum > .content.home > .line > .left > .background {
        right: 10px;
        left: 10px;
    }

    .page.forum > .forum > .content.home > .line > .left > .link,
    .page.forum > .forum > .content.home > .line > .left > p {
        width: calc(100% - 20px);
        margin-left: 10px;
    }

    .page.forum > .forum > .content.home > .line > .stats > .top > .col {
        padding: 14px 10px 8px;
    }

    .page.forum > .forum > .content.thread > .body > .top,
    .page.forum > .forum > .content.comments > .comment > .body > .top {
        min-height: 94px;
        padding-right: 8px;
    }

    .page.forum > .forum > .content.thread > .body > .top > .avatar,
    .page.forum > .forum > .content.comments > .comment > .body > .top > .avatar {
        width: 78px;
    }

    .page.forum > .forum > .content.thread > .body > .top > .informations,
    .page.forum > .forum > .content.comments > .comment > .body > .top > .informations {
        width: calc(100% - 116px);
    }

    .page.forum > .forum > .content.thread > .body > .informations,
    .page.forum > .forum > .content.comments > .comment > .body > .informations {
        display: flex;
        min-height: 42px;
        align-items: flex-start;
        flex-direction: column;
        padding: 9px 12px;
        gap: 7px;
    }

    .page.forum > .forum > .content.thread > .body > .informations > .right,
    .page.forum > .forum > .content.comments > .comment > .body > .informations > .right {
        display: flex;
        width: 100%;
        flex-wrap: wrap;
        gap: 5px 10px;
        float: none;
    }

    .tt-editor-menubar {
        overflow-x: auto;
        flex-wrap: nowrap !important;
    }

    .page.settings-page #settings > .settings-categories {
        grid-template-columns: minmax(0, 1fr);
    }

    .page.settings-page #settings > .settings-categories > .title {
        grid-column: 1;
    }

    .frontend-maintenance-status__message {
        padding-right: 15px !important;
        padding-left: 15px !important;
    }

    .frontend-maintenance-status__message > img {
        max-width: 65px;
    }
}

@media screen and (max-width: 420px) {
    .page.photos > .content > .left > .photos > .content > .box-photo {
        width: 100%;
        margin-right: 0;
    }

    .cms2-index-promo-copy > div,
    .encelade-referrals-bonus,
    .frontend-maintenance-status__message {
        align-items: stretch;
        flex-direction: column;
    }

    .cms2-index-promo-copy .cms2-button,
    .encelade-referrals-bonus > .btn {
        width: 100%;
    }

    .metro-me-profile-avatar img {
        left: 132px;
    }

    #modal > .center > .modal-box {
        width: calc(100vw - 54px);
    }
}

/* Modale d'accès BÊTA : variante soignée du contrôle photo Encelade. */
#modal.frontend-maintenance-beta-overlay {
    position: fixed;
    inset: 0;
    z-index: 1100;
    width: 100%;
    min-height: 100%;
    align-items: center;
    justify-content: center;
    padding: 34px 18px;
    overflow-x: hidden;
    overflow-y: auto;
}

#modal.frontend-maintenance-beta-overlay.visible {
    display: flex;
}

#modal.frontend-maintenance-beta-overlay::after {
    z-index: -1;
    background: rgba(26, 40, 49, .58);
    backdrop-filter: blur(3px);
}

#modal.frontend-maintenance-beta-overlay > .center {
    position: relative;
    display: block;
    width: min(720px, 100%) !important;
    max-width: 720px !important;
    margin: auto !important;
    padding: 0 !important;
    float: none;
    clear: both;
    animation: frontend-beta-modal-enter 180ms ease-out both;
}

#modal.frontend-maintenance-beta-overlay > .center > .close {
    position: absolute;
    top: -14px;
    right: -14px;
    z-index: 4;
    width: 38px;
    height: 38px;
    margin: 0;
    padding: 0;
    float: none;
    border: 3px solid #ffffff;
    border-radius: 50%;
    background: #dd3f3f;
    color: #ffffff;
    cursor: pointer;
    font-size: 21px;
    font-weight: 700;
    line-height: 30px;
    box-shadow: 0 4px 12px rgba(26, 40, 49, .25);
    transition: 160ms ease-in-out transform, 160ms ease-in-out background-color;
}

#modal.frontend-maintenance-beta-overlay > .center > .close:hover,
#modal.frontend-maintenance-beta-overlay > .center > .close:focus-visible {
    background: #c93434;
    transform: scale(1.07);
}

#modal.frontend-maintenance-beta-overlay > .center > .modal-box {
    width: 100% !important;
    margin: 0 !important;
    float: none;
}

.frontend-maintenance-beta-modal {
    position: relative;
    isolation: isolate;
    width: 100%;
    min-height: 340px;
    padding: 0;
    overflow: hidden;
    border-radius: 10px;
    background: linear-gradient(135deg, #ffffff 0%, #fff6ef 100%);
    box-shadow: 0 18px 50px rgba(26, 40, 49, .3), 0 0 0 1px rgba(26, 40, 49, .08);
}

.frontend-maintenance-beta-modal::after {
    position: absolute;
    right: -78px;
    bottom: -104px;
    z-index: -1;
    width: 260px;
    height: 260px;
    border: 34px solid rgba(242, 126, 70, .08);
    border-radius: 50%;
    content: "";
    pointer-events: none;
}

.frontend-maintenance-beta-modal > .content {
    position: relative;
    display: grid;
    min-height: 340px;
    grid-template-columns: minmax(0, 1fr) 132px;
    align-items: stretch;
    overflow: hidden;
    padding: 0;
    background: transparent;
}

.frontend-maintenance-beta-modal__copy {
    position: relative;
    z-index: 2;
    min-width: 0;
    padding: 34px 8px 30px 38px;
}

.frontend-maintenance-beta-modal__eyebrow {
    display: inline-flex;
    min-height: 25px;
    align-items: center;
    padding: 0 10px;
    border-radius: 8px;
    background: #f27e46;
    color: #ffffff;
    font-size: 11px;
    font-weight: 700;
    line-height: 25px;
    text-transform: uppercase;
}

.frontend-maintenance-beta-modal__copy > h3 {
    margin: 12px 0 6px;
    color: #3c3f51;
    font-size: 24px;
    line-height: 29px;
}

.frontend-maintenance-beta-modal__alfred {
    position: relative;
    right: -5px;
    bottom: -58px;
    z-index: 1;
    display: block;
    width: auto;
    max-width: 105px;
    max-height: 160px;
    align-self: end;
    justify-self: end;
    object-fit: contain;
    object-position: bottom;
    image-rendering: pixelated;
    opacity: .4;
    scale: 2;
    transform: scaleX(-1);
    transform-origin: right bottom;
    pointer-events: none;
    user-select: none;
}

.frontend-maintenance-beta-modal .frontend-maintenance-beta-help {
    max-width: 480px;
    margin: 0;
    color: #626572;
    font-size: 14px;
    line-height: 20px;
    text-align: left;
}

.frontend-maintenance-beta-modal .frontend-maintenance-beta {
    width: 100%;
    max-width: none;
    margin: 24px 0 0;
}

.frontend-maintenance-beta-modal .frontend-maintenance-beta > label {
    margin-bottom: 8px;
    color: #3c3f51;
    font-size: 13px;
}

.frontend-maintenance-beta-modal .frontend-maintenance-beta__controls {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 174px;
    gap: 10px;
}

.frontend-maintenance-beta-modal .frontend-maintenance-beta__controls > input,
.frontend-maintenance-beta-modal .frontend-maintenance-beta__controls > .btn[theme] {
    width: 100%;
    height: 50px;
    min-height: 50px;
    box-sizing: border-box;
}

.frontend-maintenance-beta-modal .frontend-maintenance-beta__controls > input {
    padding: 0 15px;
    border-color: rgba(26, 40, 49, .14);
    background: #f1f2f3;
}

.frontend-maintenance-beta-modal .frontend-maintenance-beta__controls > .btn[theme] {
    border: 0;
    box-shadow: 0 3px 8px rgba(242, 126, 70, .2);
}

.frontend-maintenance-beta-note {
    position: relative;
    display: block;
    max-width: 430px;
    margin-top: 13px;
    padding-left: 18px;
    color: #7a7f86;
    font-size: 11px;
    line-height: 1.4;
}

.frontend-maintenance-beta-note::before {
    position: absolute;
    left: 1px;
    color: #f27e46;
    content: "●";
}

@keyframes frontend-beta-modal-enter {
    from {
        opacity: 0;
        transform: translateY(14px) scale(.98);
    }
    to {
        opacity: 1;
        transform: translateY(0) scale(1);
    }
}

@media screen and (max-width: 620px) {
    #modal.frontend-maintenance-beta-overlay {
        align-items: flex-start;
        padding: 54px 14px 24px;
    }

    #modal.frontend-maintenance-beta-overlay > .center {
        width: 100% !important;
        max-width: 520px !important;
    }

    #modal.frontend-maintenance-beta-overlay > .center > .close {
        top: -17px;
        right: -4px;
    }

    .frontend-maintenance-beta-modal {
        min-height: 0;
    }

    .frontend-maintenance-beta-modal > .content {
        display: block;
        min-height: 430px;
    }

    .frontend-maintenance-beta-modal__copy {
        padding: 28px 22px 140px;
    }

    .frontend-maintenance-beta-modal__copy > h3 {
        font-size: 21px;
        line-height: 26px;
    }

    .frontend-maintenance-beta-modal__alfred {
        position: absolute;
        right: 12px;
        bottom: 0;
        max-height: 135px;
        scale: 1.65;
    }

    .frontend-maintenance-beta-modal .frontend-maintenance-beta__controls {
        grid-template-columns: minmax(0, 1fr);
    }
}

@media (prefers-reduced-motion: reduce) {
    #modal.frontend-maintenance-beta-overlay > .center {
        animation: none;
    }
}

body .metro-imager {
    display: flow-root;
    clear: both;
    width: min(1040px, calc(100% - 32px));
    margin: 26px auto 60px;
}

.metro-imager-layout {
    clear: both;
    display: grid;
    grid-template-columns: minmax(0, 1.35fr) minmax(300px, .65fr);
    gap: 18px;
    align-items: stretch;
    margin-top: 18px;
}

body .metro-imager .global-box,
body .metro-imager .global-box > .title,
body .metro-imager .global-box > .content {
    float: none;
    min-width: 0;
    box-sizing: border-box;
}

body .metro-imager .global-box {
    display: flow-root;
}

body .metro-imager .navigation {
    margin: 0 0 18px;
}

body .metro-imager .navigation > .content {
    padding: 15px;
}

body .metro-imager .metro-imager-feedback {
    float: none;
    width: auto;
    color: #438255;
}

body .metro-imager .metro-imager-feedback.is-error {
    color: #c94949;
}

.metro-imager-layout > .global-box {
    margin: 0;
}

body .metro-imager-form {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px;
}

body .metro-imager-field {
    display: grid;
    gap: 7px;
    color: #555b66;
    font-size: 12px;
    font-weight: 700;
}

.metro-imager-field--wide {
    grid-column: 1 / -1;
}

body .metro-imager .metro-imager-field input,
body .metro-imager .metro-imager-field select {
    width: 100%;
    min-width: 0;
    height: 42px;
    box-sizing: border-box;
    padding: 0 11px;
    border: 1px solid #cbd0d5;
    border-radius: 5px;
    background: #f7f8f9;
    color: #353945;
    font: inherit;
}

.metro-imager-search {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 9px;
}

.metro-imager-search .btn[theme] {
    min-height: 42px;
}

.metro-imager-check {
    display: flex;
    gap: 9px;
    align-items: center;
    color: #555b66;
    font-size: 12px;
    font-weight: 700;
}

.metro-imager-feedback {
    min-height: 18px;
    margin: 14px 0 0;
    color: #438255;
    font-size: 12px;
}

.metro-imager-feedback.is-error {
    color: #c94949;
}

body .metro-imager .metro-imager-preview > .content {
    display: flex;
    min-height: 460px;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 14px;
}

.metro-imager-stage {
    display: grid;
    width: min(250px, 100%);
    min-height: 280px;
    place-items: center;
    overflow: hidden;
    border: 1px solid rgba(79, 87, 99, .14);
    border-radius: 9px;
    background-color: #eef1f3;
    background-image: linear-gradient(45deg, #e2e6e9 25%, transparent 25%), linear-gradient(-45deg, #e2e6e9 25%, transparent 25%), linear-gradient(45deg, transparent 75%, #e2e6e9 75%), linear-gradient(-45deg, transparent 75%, #e2e6e9 75%);
    background-position: 0 0, 0 10px, 10px -10px, -10px 0;
    background-size: 20px 20px;
}

.metro-imager-stage img {
    display: block;
    max-width: 100%;
    max-height: 340px;
    image-rendering: pixelated;
}

.metro-imager-actions {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 8px;
}

@media screen and (max-width: 760px) {
    .metro-imager-layout {
        grid-template-columns: minmax(0, 1fr);
    }

    body .metro-imager .metro-imager-preview > .content {
        min-height: 380px;
    }
}

@media screen and (max-width: 480px) {
    body .metro-imager {
        width: min(100% - 20px, 1040px);
    }

    body .metro-imager-form {
        grid-template-columns: minmax(0, 1fr);
    }

    .metro-imager-field--wide {
        grid-column: auto;
    }

    .metro-imager-search {
        grid-template-columns: minmax(0, 1fr);
    }
}

/* Isolation des controles Imager vis-a-vis des formulaires et cartes globaux. */
body .metro-imager .metro-imager-heading {
    display: block;
    float: none;
    padding: 20px 24px;
    border-radius: 10px;
    background: #f8f9fa;
    border: 1px solid #dde1e5;
    color: #353945;
}

body .metro-imager-heading h1 {
    margin: 0 0 6px;
    font-size: 24px;
    line-height: 1.2;
    color: #353945;
}

body .metro-imager-heading p {
    margin: 0;
    font-size: 13px;
    line-height: 1.5;
    color: #646a76;
}

body .metro-imager-layout > .global-box {
    margin: 0;
    border: 1px solid #dde1e5;
    border-radius: 10px;
    background: #fff;
    overflow: hidden;
}

body .metro-imager-layout > .global-box > .title {
    padding: 17px 20px;
    border-bottom: 1px solid #e6e8eb;
    background: #f8f9fa;
    color: #353945;
    font-size: 16px;
    font-weight: 700;
    line-height: 22px;
}

body .metro-imager-layout > .global-box > .content {
    padding: 20px;
    color: #353945;
}

body .metro-imager .metro-imager-form,
body .metro-imager .metro-imager-field,
body .metro-imager .metro-imager-field > span,
body .metro-imager .metro-imager-field input,
body .metro-imager .metro-imager-field select {
    float: none;
    clear: none;
    min-width: 0;
    max-width: 100%;
    margin: 0;
    text-align: left;
    box-sizing: border-box;
}

body .metro-imager .metro-imager-field {
    width: 100%;
    padding: 0;
    background: transparent;
    line-height: 18px;
}

body .metro-imager .metro-imager-search {
    display: grid;
    width: 100%;
    align-items: center;
}

body .metro-imager .btn[theme] {
    display: inline-flex;
    float: none;
    clear: none;
    align-items: center;
    justify-content: center;
    width: auto;
    min-height: 42px;
    margin: 0;
    padding: 10px 14px;
    line-height: 20px;
    font-size: 12px;
    white-space: normal;
    box-sizing: border-box;
}

body .metro-imager .metro-imager-check input {
    appearance: auto;
    position: static;
    display: inline-block;
    width: 16px;
    height: 16px;
    margin: 0;
    flex: 0 0 16px;
    opacity: 1;
    accent-color: #f27e46;
}

body .metro-imager .metro-imager-stage {
    width: 100%;
    min-height: 310px;
    flex: 1;
    box-sizing: border-box;
}

body .metro-imager .metro-imager-actions {
    width: 100%;
    display: grid;
    grid-template-columns: 1fr;
}

body .metro-imager input:focus-visible,
body .metro-imager select:focus-visible,
body .metro-imager .btn:focus-visible {
    outline: 2px solid #f27e46;
    outline-offset: 2px;
}