/* =========================================================
   RAGNAKON THEME
   ========================================================= */

* {
    box-sizing: border-box;
}
html,
body {
    margin: 0;
    padding: 0;
    min-height: 100%;
}
html {
    overflow-y: auto !important;
}
body.ragnakon-body {

    background:
        linear-gradient(
            rgba(3, 13, 29, 0.92),
            rgba(3, 13, 29, 0.98)
        ),
        url('../img/hero-bg.png') center top / cover fixed;

    color: #ffffff;

    font-family:
        Georgia,
        "Times New Roman",
        serif;
}


/* =========================================================
   NAVBAR
   ========================================================= */

.rk-navbar {

    position: relative;

    width: 100%;

    height: 82px;

    background:
        linear-gradient(
            180deg,
            #071b34 0%,
            #041326 100%
        );

    border-bottom: 1px solid #a4772d;

    box-shadow:
        0 4px 20px rgba(0,0,0,.55);

    z-index: 50;
}


.rk-navbar-inner {

    max-width: 1250px;

    height: 100%;

    margin: auto;

    display: flex;

    align-items: center;

    justify-content: space-between;

    padding: 0 25px;
}


/* =========================================================
   LOGO
   ========================================================= */

.rk-logo-link {

    display: flex;

    align-items: center;

    height: 100%;
}


.rk-logo {

    width: 175px;

    max-height: 75px;

    object-fit: contain;

    filter:
        drop-shadow(0 3px 4px rgba(0,0,0,.8));
}


/* =========================================================
   NAVIGATION
   ========================================================= */

.rk-nav {

    display: flex;

    align-items: center;

    height: 100%;

    gap: 5px;
}


.rk-nav a {

    height: 100%;

    display: flex;

    align-items: center;

    padding: 0 18px;

    color: #eee;

    text-decoration: none;

    font-size: 14px;

    font-weight: bold;

    letter-spacing: 1px;

    transition: .2s;
}


.rk-nav a:hover {

    color: #ffd46a;

    background:
        linear-gradient(
            180deg,
            rgba(218,160,58,.15),
            rgba(218,160,58,.03)
        );
}


.rk-nav a.active {

    color: #ffd36a;

    border-bottom: 3px solid #d9a63a;
}


/* =========================================================
   PLAY BUTTON
   ========================================================= */

.rk-play-now {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;

    width: 185px;
    height: 52px;

    flex: 0 0 185px;

    padding: 0 22px;
    box-sizing: border-box;

    white-space: nowrap !important;

    background: linear-gradient(
        180deg,
        #ffd96a 0%,
        #e7ad2d 55%,
        #b87a12 100%
    ) !important;

    border: 1px solid #f7d36b !important;
    border-radius: 8px;

    color: #161006 !important;

    font-family: Georgia, "Times New Roman", serif;
    font-size: 17px;
    font-weight: 700;
    letter-spacing: 1px;

    text-decoration: none !important;
    text-align: center;

    box-shadow:
        inset 0 1px 0 rgba(255,255,255,.55),
        0 3px 10px rgba(0,0,0,.35);

    cursor: pointer;
}

.rk-play-now:hover {
    background: linear-gradient(
        180deg,
        #ffe487 0%,
        #f4bd3e 55%,
        #ca8b18 100%
    ) !important;

    color: #000 !important;
    text-decoration: none !important;
}

/* =========================================================
   MAIN
   ========================================================= */

.rk-main {

    width: 100%;

    min-height: 700px;
}


/* =========================================================
   HERO
   ========================================================= */

.rk-hero {
    position: relative;

    min-height: 730px;

    display: flex;
    align-items: center;
    justify-content: center;

    background-image:
        linear-gradient(
            rgba(3, 15, 29, 0.32),
            rgba(3, 15, 29, 0.58)
        ),
        url('../img/hero-bg-new.png');

    background-size: cover;
    background-position: center center;
    background-repeat: no-repeat;

    overflow: hidden;
}

.rk-hero-overlay {

    position: absolute;

    inset: 0;

    background:
        linear-gradient(
            90deg,
            rgba(2,15,32,.75),
            rgba(2,15,32,.20),
            rgba(2,15,32,.65)
        );
}


.rk-hero-content {
    position: relative;
    z-index: 2;

    width: 100%;
    max-width: 950px;

    margin: 0 auto;
    padding: 70px 30px 90px;

    text-align: center;
}

.rk-eyebrow {

    color: #e7bd58;

    font-size: 16px;

    font-weight: bold;

    letter-spacing: 4px;

    margin-bottom: 18px;
}


.rk-hero h1 {

    margin: 0;

    color: #ffffff;

    font-size: clamp(48px, 6vw, 82px);

    line-height: .95;

    font-weight: bold;

    letter-spacing: 2px;
}


.rk-hero h1 span {

    color: #f1c34e;

    display: inline-block;

    margin-top: 10px;

    text-shadow:
        0 3px 0 #543b0d,
        0 5px 15px rgba(0,0,0,.8);
}


.rk-hero p {

    margin: 30px auto;

    max-width: 650px;

    color: #ffffff;

    font-family: Arial, sans-serif;

    font-size: 18px;

    line-height: 1.6;
}

.rk-hero-episode {
    margin-bottom: 18px;

    color: #e8bb55;

    font-family: Georgia, "Times New Roman", serif;
    font-size: 18px;
    font-weight: bold;

    letter-spacing: 4px;

    text-shadow: 0 2px 5px rgba(0,0,0,.7);
}

.rk-hero-content h1 {
    margin: 0;

    color: #ffffff;

    font-family: Georgia, "Times New Roman", serif;
    font-size: clamp(58px, 6vw, 96px);

    line-height: .95;

    text-shadow:
        0 5px 10px rgba(0,0,0,.75),
        0 0 2px #000;
}

.rk-hero-content h1 span {
    display: block;

    margin-top: 15px;

    color: #e7ad37;
}

.rk-hero-content p {
    margin: 35px auto 30px;

    color: #ffffff;

    font-size: 20px;
    line-height: 1.7;

    text-shadow: 0 2px 5px rgba(0,0,0,.8);
}

.rk-hero-buttons {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 22px;
}

/* =========================================================
   HERO BUTTONS
   ========================================================= */

.rk-hero-buttons {

    display: flex;

    justify-content: center;

    gap: 15px;

    margin-top: 25px;
}


.rk-btn {

    display: inline-flex;

    align-items: center;

    justify-content: center;

    min-width: 210px;

    height: 52px;

    padding: 0 25px;

    border-radius: 6px;

    text-decoration: none;

    font-family: Arial, sans-serif;

    font-size: 14px;

    font-weight: bold;

    letter-spacing: 1px;

    transition: .2s;
}


.rk-btn-gold {

    color: #241500;

    background:
        linear-gradient(
            #ffe8a0,
            #d9a63a
        );

    border: 2px solid #f7d27b;
}


.rk-btn-dark {

    color: white;

    background:
        linear-gradient(
            #153553,
            #071a30
        );

    border: 2px solid #7792ad;
}


.rk-btn:hover {

    transform: translateY(-2px);

    filter: brightness(1.12);
}

/* =========================================================
   HOME CONTENT BACKGROUND
   ========================================================= */

.rk-information,
.rk-bottom-grid {
    width: 100%;
    padding: 1px 0 30px;

    background:
        linear-gradient(
            180deg,
            #071b30 0%,
            #041326 100%
        );
}

/* =========================================================
   PANELS
   ========================================================= */

.rk-panel {

    position: relative;

    max-width: 1200px;

    margin: 25px auto;

    padding: 28px;

    background:
        linear-gradient(
            135deg,
            rgba(8,34,59,.97),
            rgba(3,17,32,.97)
        );

    border: 1px solid #9a702d;

    box-shadow:
        0 8px 30px rgba(0,0,0,.45);

    border-radius: 5px;
}


.rk-panel h2 {

    margin: 0 0 22px;

    text-align: center;

    color: #edc263;

    font-size: 23px;

    letter-spacing: 2px;

    border-bottom: 1px solid rgba(210,163,71,.4);

    padding-bottom: 14px;
}


/* =========================================================
   RATES
   ========================================================= */

.rk-rate {

    display: flex;

    align-items: center;

    padding: 17px 5px;

    border-bottom: 1px solid rgba(255,255,255,.08);
}


.rk-rate:last-child {

    border-bottom: 0;
}


.rk-rate-icon {

    width: 58px;

    height: 58px;

    margin-right: 18px;

    display: flex;

    align-items: center;

    justify-content: center;

    border: 2px solid #c8983b;

    border-radius: 50%;

    color: #f5cc67;

    font-size: 11px;

    font-weight: bold;

    background: #102b45;
}


.rk-rate-text {

    flex: 1;

    display: flex;

    flex-direction: column;

    gap: 4px;
}


.rk-rate-text strong {

    color: white;

    font-family: Arial, sans-serif;
}


.rk-rate-text span {

    color: #aebdcc;

    font-family: Arial, sans-serif;

    font-size: 13px;
}


.rk-rate-value {

    color: #f5c64f;

    font-size: 27px;

    font-weight: bold;
}


/* =========================================================
   FEATURES
   ========================================================= */

.rk-feature-grid {

    display: grid;

    grid-template-columns: repeat(2, 1fr);

    gap: 0 30px;
}


.rk-feature {

    display: flex;

    align-items: center;

    padding: 18px 5px;

    border-bottom: 1px solid rgba(255,255,255,.08);
}


.rk-feature-icon {

    width: 48px;

    height: 48px;

    margin-right: 15px;

    display: flex;

    align-items: center;

    justify-content: center;

    border: 1px solid #6f8eab;

    border-radius: 50%;

    color: #f1c45b;

    background: #102d48;

    font-size: 20px;
}


.rk-feature strong {

    display: block;

    color: #fff;

    font-family: Arial, sans-serif;

    margin-bottom: 4px;
}


.rk-feature span {

    color: #9eafc0;

    font-family: Arial, sans-serif;

    font-size: 12px;
}


/* =========================================================
   STATUS
   ========================================================= */

.rk-status-panel {

    text-align: center;
}


.rk-status-online {

    display: inline-flex;

    align-items: center;

    gap: 8px;

    color: #62d477;

    font-family: Arial, sans-serif;

    font-weight: bold;
}


.rk-status-online span {

    width: 10px;

    height: 10px;

    background: #4bd467;

    border-radius: 50%;

    box-shadow: 0 0 8px #4bd467;
}


/* =========================================================
   NORMAL FLUXCP PAGES
   ========================================================= */

.rk-page {

    max-width: 1200px;

    margin: 50px auto;

    padding: 30px;

    min-height: 600px;

    background:
        rgba(4,21,38,.95);

    border: 1px solid #86622a;

    border-radius: 5px;
}


/* =========================================================
   MESSAGE
   ========================================================= */

.rk-message {

    max-width: 1100px;

    margin: 20px auto;

    padding: 15px 20px;

    background: #123b2a;

    border: 1px solid #4e9b72;

    color: #d9ffe7;

    border-radius: 5px;

    font-family: Arial, sans-serif;
}


/* =========================================================
   FOOTER
   ========================================================= */

.rk-footer {

    margin-top: 50px;

    padding: 35px 20px 20px;

    background:
        linear-gradient(
            #071b31,
            #030d1b
        );

    border-top: 1px solid #8b642b;
}


.rk-footer-inner {

    max-width: 1200px;

    margin: auto;

    display: flex;

    justify-content: space-between;

    align-items: center;
}


.rk-footer strong {

    display: block;

    color: #f0c45d;

    font-size: 18px;
}


.rk-footer span {

    display: block;

    margin-top: 5px;

    color: #8195aa;

    font-family: Arial, sans-serif;

    font-size: 12px;
}


.rk-footer-links {

    display: flex;

    gap: 25px;
}


.rk-footer-links a {

    color: #bcc9d6;

    text-decoration: none;

    font-family: Arial, sans-serif;

    font-size: 13px;
}


.rk-footer-links a:hover {

    color: #f2c75e;
}


.rk-copyright {

    margin-top: 25px;

    text-align: center;

    color: #596d82;

    font-family: Arial, sans-serif;

    font-size: 11px;
}


/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width: 900px) {

    .rk-navbar {

        height: auto;

        padding: 15px 0;
    }

    .rk-navbar-inner {

        flex-direction: column;

        gap: 15px;
    }

    .rk-nav {

        flex-wrap: wrap;

        justify-content: center;

        height: auto;
    }

    .rk-nav a {

        height: 40px;

        padding: 0 10px;

        font-size: 12px;
    }

    .rk-hero {

        min-height: 520px;
    }

    .rk-feature-grid {

        grid-template-columns: 1fr;
    }

    .rk-footer-inner {

        flex-direction: column;

        gap: 20px;

        text-align: center;
    }

}


@media (max-width: 600px) {

    .rk-hero h1 {

        font-size: 44px;
    }

    .rk-hero p {

        font-size: 15px;
    }

    .rk-hero-buttons {

        flex-direction: column;

        align-items: center;
    }

    .rk-btn {

        width: 100%;

        max-width: 280px;
    }

    .rk-panel {

        margin: 15px;

        padding: 20px;
    }

}
/* =========================================================
   RAGNAKON FOOTER
   ========================================================= */

.rk-footer {
    width: 100%;
    margin-top: 60px;
    padding: 40px 30px 20px;

    background:
        linear-gradient(
            180deg,
            #071b32 0%,
            #030d1b 100%
        );

    border-top: 1px solid #a4772d;

    box-shadow:
        0 -10px 30px rgba(0,0,0,.35);

    color: #fff;
}

.rk-footer-inner {
    max-width: 1200px;
    margin: 0 auto;

    display: flex;
    align-items: center;
    justify-content: space-between;

    gap: 40px;
}

.rk-footer-brand img {
    width: 150px;
    max-height: 75px;
    object-fit: contain;
}

.rk-footer-links {
    display: flex;
    gap: 25px;
}

.rk-footer-links a {
    color: #c5d0dc;
    text-decoration: none;

    font-family: Arial, sans-serif;
    font-size: 13px;
    font-weight: bold;

    letter-spacing: 1px;
}

.rk-footer-links a:hover {
    color: #f1c45b;
}

.rk-footer-info {
    display: flex;
    flex-direction: column;
    gap: 5px;

    text-align: right;

    font-family: Arial, sans-serif;
}

.rk-footer-info strong {
    color: #f1c45b;
    font-size: 17px;
    letter-spacing: 2px;
}

.rk-footer-info span {
    color: #7f94aa;
    font-size: 12px;
}

.rk-footer-bottom {
    max-width: 1200px;
    margin: 30px auto 0;

    padding-top: 18px;

    border-top: 1px solid rgba(255,255,255,.08);

    display: flex;
    justify-content: space-between;

    color: #61758a;

    font-family: Arial, sans-serif;
    font-size: 11px;
}

@media (max-width: 800px) {

    .rk-footer-inner {
        flex-direction: column;
        text-align: center;
    }

    .rk-footer-info {
        text-align: center;
    }

    .rk-footer-links {
        flex-wrap: wrap;
        justify-content: center;
    }

    .rk-footer-bottom {
        flex-direction: column;
        gap: 8px;
        text-align: center;
    }
}

/* =========================================================
   RAGNAKON PANEL TEXT COLORS
   ========================================================= */

.rk-panel {
    color: #dce8f5;
}

/* Normal panel text */
.rk-panel p,
.rk-panel span,
.rk-panel div {
    color: #b9c9d9;
}

/* Strong / important text */
.rk-panel strong {
    color: #ffffff;
}

/* Keep panel headings gold */
.rk-panel h2,
.rk-panel h3 {
    color: #edc263;
}

/* No Convenience NPC section */
.rk-no-item {
    color: #dce8f5;
}

.rk-no-item strong {
    color: #ffffff;
}

.rk-no-item span {
    color: #aebdcc;
}

.rk-no {
    color: #e05a5a !important;
}

/* Server status */
.rk-status-line {
    color: #dce8f5;
}

.rk-status-line strong {
    color: #ffffff;
}

.rk-online-text,
.rk-status-online {
    color: #62d477 !important;
}

/* =========================================================
   ABOUT PAGE
   ========================================================= */

.rk-about-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 15px;
}

.rk-about-item {
    padding: 20px;
    text-align: center;

    background:
        linear-gradient(
            135deg,
            rgba(15, 48, 76, .95),
            rgba(5, 25, 44, .95)
        );

    border: 1px solid rgba(210, 163, 71, .45);
    border-radius: 5px;
}

.rk-about-item strong {
    display: block;
    margin-bottom: 8px;

    color: #ffffff;
    font-family: Arial, sans-serif;
    font-size: 14px;
}

.rk-about-item span {
    color: #f1c45b !important;
    font-size: 20px;
    font-weight: bold;
}

.rk-about-feature {
    padding: 18px 5px;
    border-bottom: 1px solid rgba(255,255,255,.08);
}

.rk-about-feature:last-child {
    border-bottom: 0;
}

.rk-about-feature strong {
    display: block;
    margin-bottom: 5px;

    color: #ffffff;
    font-family: Arial, sans-serif;
}

.rk-about-feature span {
    color: #aebdcc !important;
    font-family: Arial, sans-serif;
    font-size: 13px;
}

.rk-page p {
    color: #b9c9d9;
    font-family: Arial, sans-serif;
    line-height: 1.8;
    margin-bottom: 16px;
}

@media (max-width: 800px) {
    .rk-about-grid {
        grid-template-columns: 1fr;
    }
}

/* =========================================================
   NORMAL PAGE BACKGROUND
   ========================================================= */

.rk-main {
    background:
        linear-gradient(
            180deg,
            #06182b 0%,
            #03111f 100%
        ) !important;
}

.rk-page {
    width: 100%;
    max-width: none !important;
    margin: 0 !important;
    padding: 30px 0 60px !important;
    background:
        linear-gradient(
            180deg,
            #06182b 0%,
            #03111f 100%
        ) !important;
}

/* Keep the actual content centered */
.rk-page > .rk-panel {
    max-width: 1400px;
    margin: 0 auto 30px;
}
/* =========================================================
   PLAYER GUIDE IMAGE
   ========================================================= */

.rk-guide-image-wrap {
    width: 100%;
    text-align: center;
}

.rk-guide-image {
    display: block;

    width: 100%;
    max-width: 1536px;

    height: auto;

    margin: 0 auto;

    border: 1px solid #a4772d;
    border-radius: 6px;

    box-shadow:
        0 10px 35px rgba(0,0,0,.55);
}

/* =========================================================
   SERVER FEATURES IMAGE
   ========================================================= */

.rk-feature-image-wrap {
    width: 100%;
    text-align: center;
}

.rk-feature-image {
    display: block;

    width: 100%;
    max-width: 1536px;
    height: auto;

    margin: 0 auto;

    border: 1px solid #a4772d;
    border-radius: 6px;

    box-shadow:
        0 10px 35px rgba(0,0,0,.55);
}
/* =========================================================
   DOWNLOAD PAGE
   ========================================================= */

.rk-download-page {
    width: 100%;
    max-width: 1400px;
    margin: 0 auto;
    padding: 35px 25px 70px;
    font-family: Arial, sans-serif;
}


/* HEADER */

.rk-download-header {
    text-align: center;
    margin-bottom: 30px;
}

.rk-download-symbol {
    color: #d9a63a;
    font-size: 30px;
    margin-bottom: 5px;
}

.rk-download-header h1 {
    margin: 0 0 10px;

    color: #edc263;

    font-family: Georgia, "Times New Roman", serif;
    font-size: 34px;
    letter-spacing: 3px;
}

.rk-download-header p {
    color: #9fb3c8;
    font-size: 15px;
}


/* MAIN DOWNLOAD CARD */

.rk-download-card {
    display: grid;
    grid-template-columns: 120px 1fr 230px;
    align-items: center;
    gap: 30px;

    margin-bottom: 30px;
    padding: 35px;

    background:
        linear-gradient(
            135deg,
            rgba(8,34,59,.98),
            rgba(3,17,32,.98)
        );

    border: 1px solid #a4772d;
    border-radius: 7px;

    box-shadow:
        0 10px 30px rgba(0,0,0,.35);
}


/* ICON */

.rk-download-game-icon {
    width: 90px;
    height: 90px;

    display: flex;
    align-items: center;
    justify-content: center;

    margin: auto;

    border: 2px solid #c99734;
    border-radius: 50%;

    color: #edc263 !important;

    font-family: Georgia, serif;
    font-size: 38px;

    background: rgba(0,0,0,.15);
}


/* DOWNLOAD INFORMATION */

.rk-download-info h2 {
    margin: 0 0 8px;

    color: #ffffff !important;

    font-family: Georgia, "Times New Roman", serif;
    font-size: 27px;
}

.rk-download-description {
    margin-bottom: 20px !important;
    color: #aebdcc !important;
}

.rk-download-details {
    display: flex;
    flex-wrap: wrap;
    gap: 25px;
}

.rk-download-details span {
    color: #dce8f5 !important;
    font-size: 13px;
}

.rk-download-details strong {
    margin-right: 6px;
    color: #d9a63a !important;
}


/* DOWNLOAD BUTTON */

.rk-download-action {
    text-align: center;
}

.rk-download-button {
    display: flex;
    align-items: center;
    justify-content: center;

    width: 100%;
    min-height: 55px;

    padding: 10px 20px;

    color: #211504 !important;

    background:
        linear-gradient(
            180deg,
            #ffe59a 0%,
            #d9a63a 52%,
            #a86f18 100%
        );

    border: 1px solid #f3ce72;
    border-radius: 5px;

    box-shadow:
        inset 0 1px rgba(255,255,255,.75),
        0 5px 15px rgba(0,0,0,.35);

    font-size: 14px;
    font-weight: bold;
    letter-spacing: 1px;

    text-decoration: none;

    transition: .2s;
}

.rk-download-button:hover {
    filter: brightness(1.12);
    transform: translateY(-2px);
}

.rk-download-action small {
    display: block;
    margin-top: 8px;
    color: #8196aa !important;
}


/* GENERAL PANELS */

.rk-download-panel {
    margin-top: 30px;
    padding: 30px 35px;

    background:
        linear-gradient(
            135deg,
            rgba(8,34,59,.98),
            rgba(3,17,32,.98)
        );

    border: 1px solid #a4772d;
    border-radius: 7px;
}

.rk-download-panel > h2 {
    margin: 0 0 25px;
    padding-bottom: 15px;

    color: #edc263 !important;

    border-bottom: 1px solid rgba(217,166,58,.35);

    text-align: center;

    font-family: Georgia, "Times New Roman", serif;
    letter-spacing: 2px;
}


/* REQUIREMENTS */

.rk-requirements-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 40px;
}

.rk-requirement {
    padding: 20px;
}

.rk-requirement:first-child {
    border-right: 1px solid rgba(217,166,58,.25);
}

.rk-requirement h3 {
    color: #ffffff !important;
    margin-top: 0;
}

.rk-requirement ul {
    margin: 15px 0 0;
    padding-left: 20px;
}

.rk-requirement li {
    padding: 5px 0;
    color: #b9c9d9 !important;
}


/* INSTALLATION */

.rk-install-steps {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 15px;
}

.rk-install-steps > div {
    min-height: 115px;

    padding: 20px;

    background: rgba(0,0,0,.15);

    border: 1px solid rgba(217,166,58,.25);
    border-radius: 5px;
}

.rk-install-steps span {
    display: block;

    margin-bottom: 10px;

    color: #d9a63a !important;

    font-family: Georgia, serif;
    font-size: 22px;
    font-weight: bold;
}

.rk-install-steps p {
    margin: 0 !important;
    color: #b9c9d9 !important;
}

.rk-install-steps strong {
    color: #ffffff !important;
}


/* WARNING */

.rk-download-warning {
    margin-top: 30px;
    padding: 22px 30px;

    background: rgba(132,83,10,.18);

    border: 1px solid #a4772d;
    border-left: 4px solid #d9a63a;

    border-radius: 5px;
}

.rk-download-warning > strong {
    color: #edc263 !important;
    letter-spacing: 1px;
}

.rk-download-warning p {
    margin: 8px 0 0 !important;
    color: #c9d5e1 !important;
}

.rk-download-warning p strong {
    color: #ffffff !important;
}


/* MOBILE */

@media (max-width: 900px) {

    .rk-download-card {
        grid-template-columns: 1fr;
        text-align: center;
    }

    .rk-download-details {
        justify-content: center;
    }

    .rk-download-action {
        max-width: 350px;
        width: 100%;
        margin: auto;
    }

    .rk-requirements-grid {
        grid-template-columns: 1fr;
    }

    .rk-requirement:first-child {
        border-right: 0;
        border-bottom: 1px solid rgba(217,166,58,.25);
    }

    .rk-install-steps {
        grid-template-columns: 1fr;
    }
}
/* =========================================================
   RAGNAKON RANKING
========================================================= */

.rk-ranking {
    width: 100%;
    max-width: 1200px;
    margin: 0 auto;
    padding: 45px 25px 70px;
}


/* HEADER */

.rk-ranking-header {
    text-align: center;
    margin-bottom: 35px;
}

.rk-ranking-icon {
    font-size: 42px;
    color: #e0ae49;
    margin-bottom: 8px;

    text-shadow:
        0 0 15px rgba(224,174,73,.35);
}

.rk-ranking-header h1 {
    margin: 0;

    color: #f2c35c;

    font-size: 30px;
    font-weight: bold;

    letter-spacing: 3px;

    text-shadow:
        0 2px 5px rgba(0,0,0,.8);
}

.rk-ranking-header p {
    margin-top: 8px;

    color: #9ba9bb;

    font-size: 14px;

    letter-spacing: 1px;
}


/* FILTER */

.rk-ranking-filter {
    margin-bottom: 20px;

    padding: 15px 20px;

    background:
        linear-gradient(
            180deg,
            rgba(10,29,52,.95),
            rgba(5,18,35,.95)
        );

    border: 1px solid rgba(201,151,56,.35);

    border-radius: 5px;
}

.rk-ranking-filter form {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
}

.rk-ranking-filter label {
    color: #d5b56c;
    font-size: 13px;
    font-weight: bold;
    letter-spacing: 1px;
}

.rk-ranking-filter select {
    min-width: 200px;

    padding: 9px 12px;

    background: #071629;

    color: #e8edf5;

    border: 1px solid #3b4e65;
    border-radius: 4px;
}

.rk-ranking-button,
.rk-ranking-reset {
    padding: 9px 18px;

    border-radius: 4px;

    font-size: 12px;
    font-weight: bold;

    letter-spacing: 1px;

    cursor: pointer;
}

.rk-ranking-button {
    color: #201503;

    background:
        linear-gradient(
            180deg,
            #f4d47a,
            #c8922e
        );

    border: 1px solid #efcf73;
}

.rk-ranking-reset {
    color: #d8e0ea;

    background: #14283e;

    border: 1px solid #42576e;
}


/* TABLE CONTAINER */

.rk-ranking-table-wrap {
    overflow-x: auto;

    background:
        linear-gradient(
            180deg,
            rgba(7,25,47,.97),
            rgba(4,16,31,.97)
        );

    border: 1px solid rgba(201,151,56,.45);

    border-radius: 6px;

    box-shadow:
        0 10px 35px rgba(0,0,0,.35);
}


/* TABLE */

.rk-ranking-table {
    width: 100%;

    border-collapse: collapse;

    color: #dce4ed;

    font-size: 13px;
}

.rk-ranking-table th {
    padding: 15px 12px;

    color: #e8c36c;

    background:
        linear-gradient(
            180deg,
            #102b4a,
            #0a2039
        );

    border-bottom: 1px solid #9c732b;

    font-size: 11px;

    letter-spacing: 1px;

    text-align: left;
}

.rk-ranking-table td {
    padding: 13px 12px;

    border-bottom:
        1px solid rgba(255,255,255,.06);

    vertical-align: middle;
}

.rk-ranking-table tbody tr {
    transition: .15s;
}

.rk-ranking-table tbody tr:hover {
    background:
        rgba(207,158,57,.08);
}


/* FIRST PLACE */

.rk-ranking-table .rk-rank-first {
    background:
        linear-gradient(
            90deg,
            rgba(212,161,54,.13),
            rgba(212,161,54,.03)
        );
}

.rk-rank-number {
    width: 55px;

    color: #aeb9c6;

    font-weight: bold;

    text-align: center !important;
}

.rk-medal {
    color: #f2c65f;

    font-size: 18px;

    text-shadow:
        0 0 10px rgba(242,198,95,.4);
}


/* CHARACTER */

.rk-character-name {
    color: #ffffff;

    font-weight: bold;
}

.rk-ranking-table a {
    color: #e9c46a;

    text-decoration: none;
}

.rk-ranking-table a:hover {
    color: #ffe19a;

    text-decoration: underline;
}


/* GUILD */

.rk-guild-cell {
    display: flex;

    align-items: center;

    gap: 7px;
}

.rk-guild-emblem {
    width: 24px;
    height: 24px;

    object-fit: contain;
}

.rk-none {
    color: #68788b;
}


/* EMPTY */

.rk-ranking-empty {
    padding: 40px;

    text-align: center;

    color: #9eacbb;

    background: rgba(6,22,42,.9);

    border: 1px solid rgba(201,151,56,.3);

    border-radius: 5px;
}


/* MOBILE */

@media screen and (max-width: 800px) {

    .rk-ranking {
        padding: 30px 12px 50px;
    }

    .rk-ranking-header h1 {
        font-size: 24px;
    }

    .rk-ranking-table {
        min-width: 900px;
    }

}

/* =========================================================
   NEWS PAGE
   ========================================================= */

.rk-news-page {
    width: 100%;
    max-width: 1200px;

    margin: 0 auto;

    padding: 45px 25px 70px;

    font-family: Arial, sans-serif;
}


/* HEADER */

.rk-news-header {
    text-align: center;

    margin-bottom: 35px;
}

.rk-news-symbol {
    color: #d9a63a;

    font-size: 34px;

    margin-bottom: 5px;

    text-shadow:
        0 0 15px rgba(217,166,58,.35);
}

.rk-news-header h1 {
    margin: 0 0 8px;

    color: #edc263;

    font-family:
        Georgia,
        "Times New Roman",
        serif;

    font-size: 31px;

    letter-spacing: 3px;
}

.rk-news-header p {
    margin: 0;

    color: #94a8bc;

    font-size: 14px;
}


/* NEWS LIST */

.rk-news-list {
    display: flex;

    flex-direction: column;

    gap: 20px;
}


/* CARD */

.rk-news-card {
    display: grid;

    grid-template-columns: 75px 1fr;

    gap: 20px;

    padding: 28px;

    background:
        linear-gradient(
            135deg,
            rgba(8,34,59,.98),
            rgba(3,17,32,.98)
        );

    border:
        1px solid rgba(164,119,45,.75);

    border-radius: 6px;

    box-shadow:
        0 8px 25px rgba(0,0,0,.35);

    transition: .2s;
}

.rk-news-card:hover {
    border-color: #c99a3d;

    transform: translateY(-2px);
}


/* ICON */

.rk-news-card-icon {
    width: 58px;
    height: 58px;

    display: flex;

    align-items: center;
    justify-content: center;

    color: #edc263 !important;

    font-size: 24px;

    border:
        1px solid rgba(217,166,58,.6);

    border-radius: 50%;

    background:
        rgba(217,166,58,.08);
}


/* CONTENT */

.rk-news-card-content h2 {
    margin: 0 0 6px;

    color: #ffffff !important;

    font-family:
        Georgia,
        "Times New Roman",
        serif;

    font-size: 23px;
}

.rk-news-date {
    margin-bottom: 18px;

    color: #d1a850 !important;

    font-size: 11px;

    text-transform: uppercase;

    letter-spacing: 1px;
}

.rk-news-description {
    color: #b7c5d3 !important;

    line-height: 1.7;

    font-size: 14px;
}

.rk-news-description p,
.rk-news-description span,
.rk-news-description div {
    color: #b7c5d3 !important;
}


/* READ MORE */

.rk-news-read {
    display: inline-flex;

    align-items: center;

    gap: 8px;

    margin-top: 18px;

    color: #edc263 !important;

    font-size: 12px;

    font-weight: bold;

    letter-spacing: 1px;

    text-decoration: none;
}

.rk-news-read span {
    color: #edc263 !important;

    font-size: 18px;
}

.rk-news-read:hover {
    color: #ffe099 !important;
}


/* EMPTY */

.rk-news-empty {
    padding: 50px 30px;

    text-align: center;

    background:
        linear-gradient(
            135deg,
            rgba(8,34,59,.98),
            rgba(3,17,32,.98)
        );

    border: 1px solid #86622a;

    border-radius: 6px;
}

.rk-news-empty h2 {
    color: #edc263 !important;
}

.rk-news-empty p {
    color: #9eafc0 !important;
}


/* MOBILE */

@media (max-width: 700px) {

    .rk-news-page {
        padding: 30px 15px 50px;
    }

    .rk-news-card {
        grid-template-columns: 1fr;
    }

    .rk-news-card-icon {
        margin: auto;
    }

    .rk-news-card-content {
        text-align: center;
    }

}

/* =========================================================
   CREATE ACCOUNT
========================================================= */

.rk-register-page {
    width: 100%;
    max-width: 850px;
    margin: 0 auto;
    padding: 45px 25px 70px;
}

.rk-register-header {
    text-align: center;
    margin-bottom: 30px;
}

.rk-register-symbol {
    color: #d9a63a;
    font-size: 32px;
    margin-bottom: 5px;
}

.rk-register-header h1 {
    margin: 0 0 8px;

    color: #edc263;

    font-family: Georgia, "Times New Roman", serif;

    font-size: 31px;
    letter-spacing: 3px;
}

.rk-register-header p {
    margin: 0;
    color: #9babbc;
    font-size: 14px;
}


/* CARD */

.rk-register-card {
    padding: 35px 40px;

    background:
        linear-gradient(
            135deg,
            rgba(8,34,59,.98),
            rgba(3,17,32,.98)
        );

    border: 1px solid rgba(164,119,45,.75);
    border-radius: 7px;

    box-shadow:
        0 12px 35px rgba(0,0,0,.4);
}


/* FIELDS */

.rk-form-group {
    margin-bottom: 20px;
}

.rk-form-row {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 20px;
}

.rk-form-group label {
    display: block;

    margin-bottom: 8px;

    color: #d7b45f;

    font-size: 11px;
    font-weight: bold;

    letter-spacing: 1.3px;
}

.rk-form-group input[type="text"],
.rk-form-group input[type="email"],
.rk-form-group input[type="password"],
.rk-form-group select {
    width: 100%;

    padding: 12px 13px;

    color: #edf2f7;

    background: #06182c;

    border: 1px solid #40536a;
    border-radius: 4px;

    outline: none;

    font-size: 14px;

    transition: .2s;
}

.rk-form-group input:focus,
.rk-form-group select:focus {
    border-color: #c99a3d;

    box-shadow:
        0 0 0 2px rgba(201,154,61,.12);
}


/* PASSWORD NOTE */

.rk-password-note {
    margin: -8px 0 22px;

    color: #8194a8;

    font-size: 11px;
}

.rk-password-note strong {
    color: #d7b45f;
}


/* GENDER */

.rk-gender-options {
    display: flex;
    gap: 30px;
}

.rk-gender-options label {
    display: flex;
    align-items: center;
    gap: 7px;

    color: #dce4ec;

    font-size: 13px;
    letter-spacing: 0;

    cursor: pointer;
}


/* BIRTHDATE */

.rk-date-field {
    display: flex;
    gap: 8px;
}

.rk-date-field select {
    padding: 10px;

    color: #edf2f7;

    background: #06182c;

    border: 1px solid #40536a;
    border-radius: 4px;
}


/* CAPTCHA */

.rk-captcha {
    padding-top: 10px;
}

.security-code img {
    margin-bottom: 10px;

    border: 1px solid #40536a;

    border-radius: 3px;
}

.rk-refresh-captcha {
    display: inline-block;

    margin-top: 8px;

    color: #d7b45f !important;

    font-size: 11px;

    text-decoration: none;
}


/* TERMS */

.rk-register-terms {
    margin: 25px 0 18px;

    color: #899bad;

    font-size: 12px;

    text-align: center;
}

.rk-register-terms a {
    color: #e3b956 !important;
}


/* BUTTON */

.rk-register-button {
    display: block;

    width: 100%;

    padding: 14px 20px;

    color: #241804;

    background:
        linear-gradient(
            180deg,
            #f6d778,
            #c28b29
        );

    border: 1px solid #f0cf70;
    border-radius: 5px;

    font-size: 13px;
    font-weight: bold;

    letter-spacing: 2px;

    cursor: pointer;

    transition: .2s;
}

.rk-register-button:hover {
    filter: brightness(1.1);
    transform: translateY(-1px);
}


/* ERROR */

.rk-register-error {
    margin-bottom: 22px;

    padding: 13px 16px;

    color: #ffb7b7;

    background: rgba(126,26,26,.25);

    border: 1px solid rgba(220,80,80,.55);

    border-radius: 4px;

    font-size: 13px;
}


/* MOBILE */

@media screen and (max-width: 700px) {

    .rk-register-page {
        padding: 30px 15px 50px;
    }

    .rk-register-card {
        padding: 25px 20px;
    }

    .rk-form-row {
        grid-template-columns: 1fr;
        gap: 0;
    }

}
/* =========================================================
   ACCOUNT REQUIREMENTS
========================================================= */

.rk-account-requirements {
    margin-bottom: 30px;
    padding: 22px 25px;

    background:
        linear-gradient(
            135deg,
            rgba(10,40,67,.75),
            rgba(4,22,40,.85)
        );

    border: 1px solid rgba(205,160,67,.45);
    border-radius: 6px;
}

.rk-account-requirements h2 {
    margin: 0 0 18px;

    color: #edc263 !important;

    font-family: Georgia, "Times New Roman", serif;
    font-size: 17px;

    letter-spacing: 2px;
}

.rk-requirement-list {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px 25px;
}

.rk-requirement-list > div {
    display: flex;
    align-items: flex-start;
    gap: 10px;
}

.rk-requirement-list > div > span {
    color: #65d47b !important;

    font-size: 15px;
    font-weight: bold;
}

.rk-requirement-list p {
    margin: 0 !important;

    color: #aebdcb !important;

    font-size: 12px;
    line-height: 1.5;
}

.rk-requirement-list p strong {
    display: block;

    margin-bottom: 2px;

    color: #ffffff !important;

    font-size: 12px;
}

.rk-account-tip {
    margin-top: 20px;
    padding-top: 15px;

    border-top: 1px solid rgba(255,255,255,.08);

    color: #95a8ba;

    font-size: 11px;

    text-align: center;
}

.rk-account-tip strong {
    color: #edc263 !important;
}

@media (max-width: 700px) {

    .rk-requirement-list {
        grid-template-columns: 1fr;
    }

}

/* =========================================================
   LOGIN PAGE
========================================================= */

.rk-login-page {
    width: 100%;
    max-width: 560px;
    margin: 0 auto;
    padding: 55px 25px 80px;
}

.rk-login-header {
    text-align: center;
    margin-bottom: 30px;
}

.rk-login-symbol {
    color: #d9a63a;
    font-size: 32px;
    margin-bottom: 5px;
}

.rk-login-header h1 {
    margin: 0 0 8px;

    color: #edc263;

    font-family: Georgia, "Times New Roman", serif;
    font-size: 31px;

    letter-spacing: 3px;
}

.rk-login-header p {
    margin: 0;

    color: #95a7b9;
    font-size: 14px;
}


/* CARD */

.rk-login-card {
    padding: 35px 40px;

    background:
        linear-gradient(
            135deg,
            rgba(8,34,59,.98),
            rgba(3,17,32,.98)
        );

    border: 1px solid rgba(164,119,45,.75);
    border-radius: 7px;

    box-shadow:
        0 12px 35px rgba(0,0,0,.4);
}


/* REGISTER LINK */

.rk-login-register {
    margin-top: 25px;
    padding-top: 20px;

    border-top: 1px solid rgba(255,255,255,.08);

    text-align: center;

    font-size: 12px;
}

.rk-login-register span {
    color: #8fa1b3 !important;
}

.rk-login-register a {
    margin-left: 5px;

    color: #edc263 !important;

    font-weight: bold;

    letter-spacing: 1px;

    text-decoration: none;
}

.rk-login-register a:hover {
    color: #ffe099 !important;
}

@media screen and (max-width: 600px) {

    .rk-login-page {
        padding: 35px 15px 60px;
    }

    .rk-login-card {
        padding: 25px 20px;
    }

}

/* =========================================================
   DONATE PAGE
========================================================= */

.rk-donate-page {
    width: 100%;
    max-width: 850px;
    margin: 0 auto;
    padding: 50px 25px 80px;
}

.rk-donate-header {
    text-align: center;
    margin-bottom: 32px;
}

.rk-donate-symbol {
    color: #d9a63a;
    font-size: 32px;
}

.rk-donate-header h1 {
    margin: 5px 0 8px;

    color: #edc263;

    font-family: Georgia, "Times New Roman", serif;
    font-size: 30px;

    letter-spacing: 3px;
}

.rk-donate-header p {
    margin: 0;
    color: #9babbc;
}


/* INFO */

.rk-donate-info {
    display: grid;
    grid-template-columns: 1fr 1fr;

    gap: 18px;
    margin-bottom: 20px;
}

.rk-donate-info-box {
    padding: 22px;

    text-align: center;

    background: rgba(5, 27, 48, .95);

    border: 1px solid rgba(180, 133, 48, .55);
    border-radius: 6px;
}

.rk-donate-info-box span {
    display: block;

    margin-bottom: 8px;

    color: #8498ab;

    font-size: 10px;
    font-weight: bold;

    letter-spacing: 1.5px;
}

.rk-donate-info-box strong {
    display: block;

    color: #edc263;

    font-size: 21px;
}

.rk-donate-info-box small {
    display: block;

    margin-top: 5px;

    color: #92a4b5;
}


/* MAIN CARD */

.rk-donate-card {
    padding: 35px 40px;

    background:
        linear-gradient(
            135deg,
            rgba(8,34,59,.98),
            rgba(3,17,32,.98)
        );

    border: 1px solid rgba(164,119,45,.75);
    border-radius: 7px;

    box-shadow: 0 12px 35px rgba(0,0,0,.35);
}

.rk-donate-card-header {
    margin-bottom: 28px;
    text-align: center;
}

.rk-donate-card-header h2 {
    margin: 0 0 8px;

    color: #edc263 !important;

    font-family: Georgia, "Times New Roman", serif;

    letter-spacing: 2px;
}

.rk-donate-card-header p {
    margin: 0;

    color: #93a6b8 !important;
}


/* AMOUNT INPUT */

.rk-donation-input {
    display: flex;
}

.rk-donation-input input {
    flex: 1;

    padding: 14px;

    color: #fff;

    background: #06182c;

    border: 1px solid #40536a;
    border-right: 0;

    border-radius: 4px 0 0 4px;

    outline: none;
}

.rk-donation-input input:focus {
    border-color: #c99a3d;
}

.rk-donation-input span {
    display: flex;
    align-items: center;

    padding: 0 18px;

    color: #edc263;

    background: #0b2137;

    border: 1px solid #40536a;

    border-radius: 0 4px 4px 0;

    font-size: 12px;
    font-weight: bold;
}


/* CONFIRMATION */

.rk-donate-result {
    margin-bottom: 15px;
    padding: 18px;

    text-align: center;

    background: rgba(3, 18, 33, .65);

    border: 1px solid rgba(255,255,255,.07);
    border-radius: 4px;
}

.rk-donate-result span {
    display: block;

    margin-bottom: 5px;

    color: #8295a8;

    font-size: 10px;
    font-weight: bold;

    letter-spacing: 1.5px;
}

.rk-donate-result strong {
    color: #edc263;

    font-size: 22px;
}


/* PAYPAL / PAYMENT BUTTON */

.rk-payment-button {
    margin-top: 25px;

    text-align: center;
}

.rk-payment-button form {
    display: inline-block;
}


/* RESET */

.rk-donate-reset {
    display: block;

    margin-top: 18px;

    color: #94a7b9 !important;

    text-align: center;

    font-size: 11px;

    text-decoration: none;
}

.rk-donate-reset:hover {
    color: #edc263 !important;
}


/* NOTICE */

.rk-donate-notice {
    margin-top: 20px;
    padding: 18px 20px;

    background: rgba(120, 88, 25, .12);

    border: 1px solid rgba(201,154,61,.35);
    border-radius: 5px;
}

.rk-donate-notice strong {
    color: #edc263;
    font-size: 11px;

    letter-spacing: 1px;
}

.rk-donate-notice p {
    margin: 6px 0 0;

    color: #a5b4c2 !important;

    font-size: 12px;
}


/* FOOTER */

.rk-donate-footer {
    margin-top: 30px;

    text-align: center;
}

.rk-donate-footer p {
    color: #8295a8 !important;

    font-size: 12px;
    line-height: 1.7;
}

.rk-donate-footer a {
    display: inline-block;

    margin-top: 8px;

    color: #edc263 !important;

    font-size: 11px;
    font-weight: bold;

    letter-spacing: 1px;

    text-decoration: none;
}

.rk-donate-footer a:hover {
    color: #ffe099 !important;
}


/* MOBILE */

@media screen and (max-width: 700px) {

    .rk-donate-page {
        padding: 35px 15px 60px;
    }

    .rk-donate-info {
        grid-template-columns: 1fr;
    }

    .rk-donate-card {
        padding: 25px 20px;
    }

}
/* =========================================================
   RAGNAKON FOOTER
========================================================= */

.rk-footer {
    width: 100%;
    background: linear-gradient(135deg, #071d32, #020f1e);
    border-top: 1px solid #b8862f;
    border-bottom: 1px solid #b8862f;
}

.rk-footer-inner {
    max-width: 1500px;
    min-height: 230px;

    margin: 0 auto;
    padding: 35px 50px;

    display: grid;
    grid-template-columns: 300px 1fr 300px;
    align-items: center;
}


/* LEFT LOGO */

.rk-footer-logo {
    display: flex;
    align-items: center;
    justify-content: flex-start;
}

.rk-footer-logo img {
    width: 190px;
    max-width: 100%;
    height: auto;
}


/* CENTER */

.rk-footer-center {
    text-align: center;
}

.rk-footer-ornament {
    display: flex;
    align-items: center;
    justify-content: center;

    margin-bottom: 22px;
}

.rk-footer-ornament span {
    width: 150px;
    height: 1px;

    background: linear-gradient(
        to right,
        transparent,
        #c99639
    );
}

.rk-footer-ornament span:last-child {
    background: linear-gradient(
        to left,
        transparent,
        #c99639
    );
}

.rk-footer-ornament b {
    margin: 0 12px;

    color: #e8b951;

    font-size: 23px;
    font-weight: normal;
}


/* COPYRIGHT */

.rk-footer-copy {
    color: #f1f1f1 !important;

    font-family: Georgia, "Times New Roman", serif;
    font-size: 18px;
}


/* SMALL ORNAMENT */

.rk-footer-small-ornament {
    margin: 18px 0 12px;

    color: #d6a644;

    font-size: 10px;
}


/* DISCLAIMER */

.rk-footer-disclaimer {
    color: #667b90 !important;

    font-family: Georgia, "Times New Roman", serif;
    font-size: 13px;

    line-height: 1.6;
}


/* RIGHT SIDE BALANCER */

.rk-footer-spacer {
    width: 300px;
}


/* MOBILE */

@media screen and (max-width: 900px) {

    .rk-footer-inner {
        min-height: auto;

        padding: 40px 20px;

        display: flex;
        flex-direction: column;

        text-align: center;
    }

    .rk-footer-logo {
        justify-content: center;
        margin-bottom: 30px;
    }

    .rk-footer-logo img {
        width: 160px;
    }

    .rk-footer-spacer {
        display: none;
    }

    .rk-footer-ornament span {
        width: 80px;
    }

}

/* =========================================================
   QUICK LINKS
========================================================= */

.rk-quick-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 14px;

    margin-top: 20px;
}

.rk-quick-card {
    position: relative;

    display: grid;
    grid-template-columns: 48px 1fr 25px;
    align-items: center;

    gap: 14px;

    padding: 16px 18px;

    background:
        linear-gradient(
            135deg,
            rgba(10,35,59,.95),
            rgba(4,20,37,.95)
        );

    border: 1px solid rgba(168,119,39,.45);
    border-radius: 6px;

    text-decoration: none !important;

    transition:
        transform .2s ease,
        border-color .2s ease,
        background .2s ease,
        box-shadow .2s ease;
}

.rk-quick-card:hover {
    transform: translateY(-3px);

    border-color: #d6a441;

    background:
        linear-gradient(
            135deg,
            rgba(17,52,83,.98),
            rgba(6,27,49,.98)
        );

    box-shadow:
        0 8px 20px rgba(0,0,0,.3);
}


/* ICON */

.rk-quick-icon {
    width: 44px;
    height: 44px;

    display: flex;
    align-items: center;
    justify-content: center;

    color: #e7ba58 !important;

    border: 1px solid rgba(220,173,72,.55);
    border-radius: 50%;

    background: rgba(219,166,60,.06);

    font-size: 19px;

    transition: .2s ease;
}

.rk-quick-card:hover .rk-quick-icon {
    transform: scale(1.08);

    background: rgba(219,166,60,.14);

    box-shadow:
        0 0 15px rgba(219,166,60,.16);
}


/* TEXT */

.rk-quick-text {
    display: flex;
    flex-direction: column;
}

.rk-quick-text strong {
    color: #ffffff !important;

    font-size: 13px;

    letter-spacing: .5px;
}

.rk-quick-text small {
    margin-top: 3px;

    color: #8398ac !important;

    font-size: 11px;
}


/* ARROW */

.rk-quick-arrow {
    color: #c99a3d !important;

    font-size: 24px;

    transition: transform .2s ease;
}

.rk-quick-card:hover .rk-quick-arrow {
    transform: translateX(4px);
}


/* MOBILE */

@media screen and (max-width: 700px) {

    .rk-quick-grid {
        grid-template-columns: 1fr;
    }

}

.rk-play-button {
    flex-shrink: 0;
    white-space: nowrap;
    min-width: 150px;
}

/* =========================================================
   MONSTER DATABASE
========================================================= */

.rk-main .search-form,
.rk-main .horizontal-table,
.rk-main .vertical-table {
    color: #d9e3ec !important;
}


/* SEARCH AREA */

.rk-main .search-form {
    margin: 20px auto 30px;
    padding: 22px 25px;

    max-width: 1450px;

    background:
        linear-gradient(
            135deg,
            rgba(8,34,59,.96),
            rgba(3,17,32,.98)
        );

    border: 1px solid rgba(190,143,53,.65);
    border-radius: 7px;

    box-shadow: 0 10px 30px rgba(0,0,0,.25);
}

.rk-main .search-form label {
    color: #d7b35e !important;
    font-weight: bold;
}

.rk-main .search-form input[type="text"],
.rk-main .search-form select {
    padding: 8px 10px;

    color: #eaf0f6 !important;

    background: #06182c !important;

    border: 1px solid #40536a;
    border-radius: 4px;

    outline: none;
}

.rk-main .search-form input[type="text"]:focus,
.rk-main .search-form select:focus {
    border-color: #d6a441;

    box-shadow:
        0 0 0 2px rgba(214,164,65,.12);
}


/* SEARCH BUTTONS */

.rk-main .search-form input[type="submit"],
.rk-main .search-form input[type="button"] {
    padding: 8px 15px;

    color: #241704;

    background:
        linear-gradient(
            180deg,
            #f5d778,
            #bb8426
        );

    border: 1px solid #e8c765;
    border-radius: 4px;

    font-weight: bold;

    cursor: pointer;

    transition:
        transform .2s ease,
        filter .2s ease,
        box-shadow .2s ease;
}

.rk-main .search-form input[type="submit"]:hover,
.rk-main .search-form input[type="button"]:hover {
    transform: translateY(-2px);
    filter: brightness(1.08);

    box-shadow:
        0 5px 15px rgba(0,0,0,.25);
}


/* RESULTS INFO */

.rk-main .search-form + p,
.rk-main .paginator-info,
.rk-main .pagination-info {
    color: #8fa5b9 !important;
}


/* MONSTER TABLE */

.rk-main .horizontal-table {
    width: calc(100% - 80px);
    max-width: 1500px;

    margin: 0 auto 25px;

    border-collapse: separate;
    border-spacing: 0;

    overflow: hidden;

    background: rgba(5,25,44,.96);

    border: 1px solid rgba(183,134,47,.55);
    border-radius: 7px;

    box-shadow:
        0 10px 30px rgba(0,0,0,.25);
}

.rk-main .horizontal-table th {
    padding: 13px 10px;

    color: #edc263 !important;

    background:
        linear-gradient(
            180deg,
            #0c2b49,
            #071d34
        );

    border-bottom: 1px solid rgba(199,151,57,.5);

    font-size: 12px;
    letter-spacing: .6px;

    text-align: left;
}

.rk-main .horizontal-table th a {
    color: #edc263 !important;
    text-decoration: none !important;
}


/* ROWS */

.rk-main .horizontal-table td {
    padding: 11px 10px;

    color: #c9d5df !important;

    border-bottom: 1px solid rgba(255,255,255,.05);

    transition:
        background .2s ease,
        color .2s ease;
}

.rk-main .horizontal-table tr:not(:first-child) {
    transition:
        transform .15s ease,
        background .2s ease,
        box-shadow .2s ease;
}

.rk-main .horizontal-table tr:not(:first-child):hover {
    background: rgba(28,67,101,.55);

    box-shadow:
        inset 3px 0 0 #d5a442;
}

.rk-main .horizontal-table tr:not(:first-child):hover td {
    color: #ffffff !important;
}


/* LINKS */

.rk-main .horizontal-table td a {
    color: #73b8ff !important;

    font-weight: bold;

    text-decoration: none !important;

    transition:
        color .2s ease,
        text-shadow .2s ease;
}

.rk-main .horizontal-table td a:hover {
    color: #ffd66b !important;

    text-shadow:
        0 0 8px rgba(255,214,107,.25);
}


/* MVP */

.rk-main .mvp {
    display: inline-block;

    margin-right: 6px;
    padding: 2px 6px;

    color: #2b1900 !important;

    background: #e6b54a;

    border-radius: 3px;

    font-size: 10px;
    font-weight: bold;
}


/* PAGINATION */

.rk-main .pagination,
.rk-main .paginator {
    margin: 20px auto 35px;

    text-align: center;
}

.rk-main .pagination a,
.rk-main .paginator a {
    display: inline-block;

    min-width: 31px;
    padding: 7px 9px;
    margin: 2px;

    color: #dbe6ef !important;

    background: #082039;

    border: 1px solid rgba(174,128,43,.45);
    border-radius: 4px;

    text-decoration: none !important;

    transition:
        transform .2s ease,
        background .2s ease,
        border-color .2s ease;
}

.rk-main .pagination a:hover,
.rk-main .paginator a:hover {
    transform: translateY(-2px);

    color: #ffe08a !important;

    background: #103657;

    border-color: #d2a044;
}


/* PAGE HEADING */

.rk-main > h2 {
    margin: 35px auto 20px;

    color: #edc263 !important;

    text-align: center;

    font-family: Georgia, "Times New Roman", serif;
    font-size: 30px;

    letter-spacing: 2px;
}


/* TOGGLER */

.rk-main .toggler {
    text-align: center;
}

.rk-main .toggler a {
    color: #d7b25a !important;

    text-decoration: none !important;
}


/* MOBILE */

@media screen and (max-width: 1000px) {

    .rk-main .horizontal-table {
        width: calc(100% - 25px);

        display: block;
        overflow-x: auto;
    }

    .rk-main .search-form {
        margin-left: 12px;
        margin-right: 12px;
    }

}

/* =========================================================
   FLUXCP PAGINATION
========================================================= */

.pages {
    margin: 24px 0 10px;
    text-align: center;
}

/* Page number buttons */
.pages .page-num,
.pages .page-prev,
.pages .page-next {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    min-width: 36px;
    height: 36px;

    margin: 3px;
    padding: 0 11px;

    color: #ffffff !important;
    background: #0a2946;

    border: 1px solid #b8862f;
    border-radius: 5px;

    font-weight: bold;
    text-decoration: none !important;

    transition:
        background .2s ease,
        color .2s ease,
        transform .2s ease,
        box-shadow .2s ease;
}

/* Hover */
.pages .page-num:hover,
.pages .page-prev:hover,
.pages .page-next:hover {
    color: #1b1203 !important;
    background: #e8b84f;

    border-color: #ffd873;

    transform: translateY(-2px);

    box-shadow:
        0 5px 14px rgba(0,0,0,.3);
}

/* Current page */
.pages .current-page {
    color: #171000 !important;

    background:
        linear-gradient(
            180deg,
            #f8d96f,
            #c88d29
        );

    border-color: #ffe28a;

    box-shadow:
        0 0 12px rgba(232,184,79,.3);

    cursor: default;
}


/* PAGE JUMP */

.jump-to-page {
    margin: 12px 0 35px;

    text-align: center;

    color: #d9e4ee !important;
}

.jump-to-page label {
    color: #edc263 !important;

    font-weight: bold;
}

.jump-to-page input {
    width: 70px !important;

    margin-left: 7px;
    padding: 7px 9px;

    color: #ffffff !important;

    background: #071c31 !important;

    border: 1px solid #b8862f;
    border-radius: 4px;

    outline: none;
}

.jump-to-page input:focus {
    border-color: #f1c75e;

    box-shadow:
        0 0 0 2px rgba(241,199,94,.15);
}
/* =========================================================
   MONSTER DETAIL PAGE
========================================================= */

.rk-monster-view {
    max-width: 1450px;
    margin: 0 auto;
    padding: 45px 30px 80px;
}


/* HERO */

.rk-monster-hero {
    display: flex;
    align-items: center;
    gap: 35px;

    margin-bottom: 25px;
    padding: 30px 35px;

    background:
        linear-gradient(
            135deg,
            rgba(10,39,65,.97),
            rgba(3,18,33,.98)
        );

    border: 1px solid rgba(190,142,48,.7);
    border-radius: 8px;

    box-shadow: 0 12px 35px rgba(0,0,0,.3);
}

.rk-monster-image {
    width: 150px;
    min-width: 150px;
    height: 150px;

    display: flex;
    align-items: center;
    justify-content: center;

    background: rgba(0,0,0,.18);

    border: 1px solid rgba(210,160,64,.4);
    border-radius: 8px;
}

.rk-monster-image img {
    max-width: 130px;
    max-height: 130px;

    image-rendering: auto;

    transition: transform .25s ease;
}

.rk-monster-hero:hover .rk-monster-image img {
    transform: scale(1.08);
}

.rk-monster-id {
    color: #8298ac !important;

    font-size: 11px;
    font-weight: bold;

    letter-spacing: 2px;
}

.rk-monster-title h1 {
    margin: 5px 0 15px;

    color: #edc263 !important;

    font-family: Georgia, "Times New Roman", serif;
    font-size: 36px;

    letter-spacing: 1px;
}


/* TAGS */

.rk-monster-tags {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.rk-tag {
    padding: 6px 10px;

    color: #dce8f2 !important;

    background: rgba(52,91,124,.28);

    border: 1px solid rgba(95,135,168,.45);
    border-radius: 20px;

    font-size: 11px;
}

.rk-tag-mvp {
    color: #291700 !important;

    background: #e7b84f;

    border-color: #ffd972;

    font-weight: bold;
}


/* PANELS */

.rk-monster-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 20px;

    margin-bottom: 20px;
}

.rk-monster-panel {
    margin-bottom: 20px;
    padding: 28px 30px;

    background:
        linear-gradient(
            135deg,
            rgba(8,32,55,.97),
            rgba(3,18,33,.98)
        );

    border: 1px solid rgba(177,128,42,.55);
    border-radius: 7px;

    box-shadow: 0 10px 28px rgba(0,0,0,.25);
}

.rk-monster-panel h2 {
    margin: 0 0 22px;
    padding-bottom: 12px;

    color: #edc263 !important;

    border-bottom: 1px solid rgba(199,151,57,.3);

    font-family: Georgia, "Times New Roman", serif;

    font-size: 19px;
    letter-spacing: 1.5px;
}


/* BASIC STATS */

.rk-stat-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);

    gap: 12px;
}

.rk-stat-grid > div {
    padding: 13px 15px;

    background: rgba(0,0,0,.12);

    border: 1px solid rgba(255,255,255,.05);
    border-radius: 5px;

    transition:
        transform .2s ease,
        background .2s ease,
        border-color .2s ease;
}

.rk-stat-grid > div:hover {
    transform: translateY(-2px);

    background: rgba(30,65,94,.35);

    border-color: rgba(211,163,66,.35);
}

.rk-stat-grid span {
    display: block;

    color: #7f94a7 !important;

    font-size: 10px;
    font-weight: bold;

    letter-spacing: 1px;
}

.rk-stat-grid strong {
    display: block;

    margin-top: 4px;

    color: #ffffff !important;

    font-size: 16px;
}


/* ATTRIBUTES */

.rk-attribute-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);

    gap: 10px;

    margin-bottom: 20px;
}

.rk-attribute-grid div {
    padding: 14px;

    text-align: center;

    background: rgba(0,0,0,.15);

    border: 1px solid rgba(190,142,48,.28);
    border-radius: 5px;
}

.rk-attribute-grid span {
    display: block;

    color: #d6a94e !important;

    font-size: 10px;
    font-weight: bold;
}

.rk-attribute-grid strong {
    display: block;

    margin-top: 4px;

    color: #ffffff !important;

    font-size: 18px;
}

.rk-monster-extra p {
    display: flex;
    justify-content: space-between;

    margin: 0;
    padding: 9px 3px;

    border-bottom: 1px solid rgba(255,255,255,.05);
}

.rk-monster-extra span {
    color: #879aac !important;
}

.rk-monster-extra strong {
    color: #dbe6ef !important;
}


/* MODES */

.rk-mode-list {
    display: flex;
    flex-wrap: wrap;
    gap: 9px;
}

.rk-mode-list span {
    padding: 7px 11px;

    color: #dce7ef !important;

    background: rgba(30,67,98,.4);

    border: 1px solid rgba(81,125,159,.45);
    border-radius: 4px;

    font-size: 11px;
}


/* DROPS */

.rk-drop-list {
    display: grid;
    grid-template-columns: repeat(2, 1fr);

    gap: 12px;
}

.rk-drop-card {
    display: grid;
    grid-template-columns: 45px 1fr auto;
    align-items: center;

    gap: 12px;

    padding: 12px 15px;

    background: rgba(0,0,0,.12);

    border: 1px solid rgba(255,255,255,.05);
    border-radius: 5px;

    transition:
        transform .2s ease,
        background .2s ease,
        border-color .2s ease;
}

.rk-drop-card:hover {
    transform: translateY(-2px);

    background: rgba(27,61,91,.4);

    border-color: rgba(213,164,67,.45);
}

.rk-drop-icon {
    width: 40px;
    height: 40px;

    display: flex;
    align-items: center;
    justify-content: center;
}

.rk-drop-icon img {
    max-width: 32px;
    max-height: 32px;
}

.rk-drop-info {
    display: flex;
    flex-direction: column;
}

.rk-drop-info a {
    color: #ffffff !important;

    font-weight: bold;

    text-decoration: none !important;
}

.rk-drop-info a:hover {
    color: #edc263 !important;
}

.rk-drop-info small {
    margin-top: 3px;

    color: #74889a !important;
}

.rk-drop-rate {
    text-align: right;
}

.rk-drop-rate strong {
    color: #edc263 !important;
}

.rk-drop-mvp {
    display: block;

    margin-bottom: 3px;

    color: #f0bc51 !important;

    font-size: 9px;
    font-weight: bold;
}


/* SKILLS */

.rk-skill-table-wrap {
    overflow-x: auto;
}

.rk-skill-table {
    width: 100%;

    border-collapse: collapse;
}

.rk-skill-table th {
    padding: 11px 10px;

    color: #edc263 !important;

    background: rgba(17,50,78,.5);

    border-bottom: 1px solid rgba(198,149,56,.4);

    text-align: left;

    font-size: 11px;
}

.rk-skill-table td {
    padding: 11px 10px;

    color: #cbd7e1 !important;

    border-bottom: 1px solid rgba(255,255,255,.05);
}

.rk-skill-table tbody tr {
    transition: background .2s ease;
}

.rk-skill-table tbody tr:hover {
    background: rgba(31,67,96,.4);
}


/* EMPTY */

.rk-empty {
    color: #879bad !important;

    text-align: center;
}


/* MOBILE */

@media screen and (max-width: 900px) {

    .rk-monster-grid,
    .rk-drop-list {
        grid-template-columns: 1fr;
    }

    .rk-monster-hero {
        flex-direction: column;

        text-align: center;
    }

    .rk-monster-tags {
        justify-content: center;
    }

}
.rk-online-count {
    margin-top: 12px;

    color: #ffffff !important;

    font-weight: bold;
}

.rk-online-count span {
    margin-left: 5px;

    color: #edc263 !important;

    font-size: 18px;
}

/* =========================================================
   RAGNAKON POSTER POPUP
========================================================= */

.rk-poster-overlay {
    position: fixed;
    inset: 0;
    z-index: 999999;

    display: flex;
    align-items: center;
    justify-content: center;

    padding: 25px;

    background: rgba(4, 18, 30, 0.12);

    /* Slight blur instead of hiding everything */
    backdrop-filter: blur(3px);
    -webkit-backdrop-filter: blur(3px);

    animation: rkPosterFade .3s ease;
}

.rk-poster-window {
    position: relative;

    width: auto;
    max-width: 900px;
    max-height: 92vh;
    
    animation: rkPosterOpen .45s ease;
}

.rk-poster-image {
    display: block;

    max-width: 100%;
    max-height: 88vh;

    width: auto;
    height: auto;

    border: 2px solid rgba(216, 169, 70, .75);
    border-radius: 8px;

    box-shadow:
        0 25px 80px rgba(0,0,0,.8),
        0 0 35px rgba(214,165,63,.20);
}

/* CLOSE BUTTON */

.rk-poster-close {
    position: absolute;

    top: -18px;
    right: -18px;

    z-index: 10;

    width: 42px;
    height: 42px;

    padding: 0;

    display: flex;
    align-items: center;
    justify-content: center;

    color: #fff;

    background: #172c3e;

    border: 2px solid #d4a542;
    border-radius: 50%;

    font-size: 28px;
    line-height: 1;

    cursor: pointer;

    box-shadow: 0 5px 20px rgba(0,0,0,.5);

    transition:
        transform .2s ease,
        background .2s ease;
}

.rk-poster-close:hover {
    background: #c99534;

    transform: rotate(90deg);
}


/* OPEN ANIMATION */

@keyframes rkPosterFade {

    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}

@keyframes rkPosterOpen {

    from {
        opacity: 0;
        transform: translateY(30px) scale(.94);
    }

    to {
        opacity: 1;
        transform: translateY(0) scale(1);
    }
}


/* MOBILE */

@media screen and (max-width: 700px) {

    .rk-poster-overlay {
        padding: 15px;
    }

    .rk-poster-window {
        max-width: 95vw;
    }

    .rk-poster-image {
        max-height: 85vh;
    }

    .rk-poster-close {
        top: -14px;
        right: -8px;

        width: 36px;
        height: 36px;

        font-size: 24px;
    }
    
    .rk-slide-arrow {
        width: 38px;
        height: 50px;
        font-size: 24px;
    }

    .rk-slide-prev {
        left: 6px;
    }

    .rk-slide-next {
        right: 6px;
    }

}

/* Don't show again today */

.rk-poster-today {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 9px;

    margin-top: 12px;
    padding: 10px 15px;

    color: #d6e0e8;

    background: rgba(4, 18, 30, 0.85);

    border: 1px solid rgba(212, 165, 66, 0.45);
    border-radius: 5px;

    font-size: 13px;

    cursor: pointer;
    user-select: none;
}

.rk-poster-today:hover {
    border-color: #d4a542;
    color: #ffffff;
}

.rk-poster-today input {
    width: 16px;
    height: 16px;

    cursor: pointer;

    accent-color: #d4a542;
}

/* =========================================================
   HERO LOGO
========================================================= */

.rk-hero-logo {
    display: block;

    width: min(470px, 70vw);
    height: auto;

    margin: 0 auto 10px;

    filter:
        drop-shadow(0 5px 8px rgba(0,0,0,.55))
        drop-shadow(0 0 12px rgba(58,140,220,.15));
}

.rk-hero-episode {
    margin: 0 0 22px;

    color: #eab74c;

    font-family: Georgia, "Times New Roman", serif;
    font-size: 17px;
    font-weight: bold;

    letter-spacing: 4px;

    text-shadow: 0 2px 5px rgba(0,0,0,.8);
}


/* =========================================================
   HERO BUTTONS
========================================================= */

.rk-hero-buttons {
    display: flex;
    align-items: center;
    justify-content: center;

    gap: 18px;

    margin-top: 30px;
}

.rk-hero-btn {
    width: 260px;
    height: 62px;

    display: inline-flex;
    align-items: center;
    justify-content: center;

    box-sizing: border-box;

    border-radius: 6px;

    font-size: 15px;
    font-weight: 800;

    letter-spacing: 1px;

    text-decoration: none !important;

    transition:
        transform .2s ease,
        box-shadow .2s ease,
        filter .2s ease;
}


/* DOWNLOAD */

.rk-hero-btn-gold {
    color: #211500 !important;

    background:
        linear-gradient(
            180deg,
            #f7d879 0%,
            #e5ad39 55%,
            #bd8121 100%
        );

    border: 2px solid #f7d575;

    box-shadow:
        inset 0 1px 0 rgba(255,255,255,.6),
        0 5px 18px rgba(0,0,0,.35);
}


/* CREATE ACCOUNT / DONATE */

.rk-hero-btn-blue {
    color: #ffffff !important;

    background:
        linear-gradient(
            180deg,
            #16446c 0%,
            #0b2d4d 55%,
            #071f38 100%
        );

    border: 2px solid #6689a8;

    box-shadow:
        inset 0 1px 0 rgba(255,255,255,.10),
        0 5px 18px rgba(0,0,0,.35);
}

/* HOVER */

.rk-hero-btn:hover {
    transform: translateY(-3px);

    filter: brightness(1.08);

    box-shadow:
        0 9px 24px rgba(0,0,0,.4);
}


/* MOBILE */

@media screen and (max-width: 650px) {

    .rk-hero-logo {
        width: min(350px, 85vw);
    }

    .rk-hero-buttons {
        flex-direction: column;
    }

    .rk-hero-btn {
        width: min(300px, 90vw);
    }
}

.rk-nav-account {
    display: inline-flex;
    align-items: center;
    gap: 7px;

    white-space: nowrap;

    color: #ffffff !important;
    text-decoration: none !important;

    font-weight: bold;
}

.rk-nav-account-icon {
    font-size: 16px;
    line-height: 1;
}

.rk-nav-account:hover {
    color: #edc263 !important;
}

/* =========================================================
   ITEM DATABASE
========================================================= */

.rk-item-page {
    max-width: 1500px;
    margin: 0 auto;
    padding: 45px 30px 80px;
}

.rk-item-heading {
    margin-bottom: 28px;
    text-align: center;
}

.rk-item-symbol {
    display: block;

    margin-bottom: 5px;

    color: #d5a442;

    font-size: 25px;
}

.rk-item-heading h1 {
    margin: 0;

    color: #edc263 !important;

    font-family: Georgia, "Times New Roman", serif;
    font-size: 32px;

    letter-spacing: 2px;
}

.rk-item-heading p {
    margin-top: 10px;

    color: #899dad !important;
}


/* SEARCH */

.rk-item-search {
    margin-bottom: 28px;
    padding: 24px;

    background:
        linear-gradient(
            135deg,
            rgba(8,35,59,.97),
            rgba(3,17,31,.98)
        );

    border: 1px solid rgba(190,143,53,.6);
    border-radius: 7px;

    box-shadow: 0 10px 30px rgba(0,0,0,.25);
}

.rk-item-search-grid {
    display: grid;

    grid-template-columns:
        150px
        minmax(240px, 2fr)
        180px
        180px
        110px
        150px;

    gap: 13px;
}

.rk-item-field {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.rk-item-field label {
    color: #d9b45c !important;

    font-size: 10px;
    font-weight: bold;

    letter-spacing: 1px;
}

.rk-item-field input,
.rk-item-field select {
    height: 40px;

    box-sizing: border-box;

    padding: 0 11px;

    color: #eaf1f6 !important;

    background: #071c31 !important;

    border: 1px solid #354c61;
    border-radius: 4px;

    outline: none;
}

.rk-item-field input:focus,
.rk-item-field select:focus {
    border-color: #d5a442;

    box-shadow:
        0 0 0 2px rgba(213,164,66,.12);
}


/* SEARCH BUTTONS */

.rk-item-search-buttons {
    display: flex;
    justify-content: center;

    gap: 10px;

    margin-top: 20px;
}

.rk-item-search-buttons button,
.rk-item-search-buttons a {
    min-width: 120px;
    height: 38px;

    display: inline-flex;
    align-items: center;
    justify-content: center;

    box-sizing: border-box;

    border-radius: 4px;

    font-weight: bold;
    font-size: 11px;

    letter-spacing: 1px;

    cursor: pointer;

    text-decoration: none !important;

    transition:
        transform .2s ease,
        filter .2s ease;
}

.rk-item-search-buttons button {
    color: #201500 !important;

    background:
        linear-gradient(
            #f1ce69,
            #bc8427
        );

    border: 1px solid #efd274;
}

.rk-item-search-buttons a {
    color: #dce7ef !important;

    background: #0a2946;

    border: 1px solid #51697e;
}

.rk-item-search-buttons button:hover,
.rk-item-search-buttons a:hover {
    transform: translateY(-2px);

    filter: brightness(1.08);
}


/* RESULT INFO */

.rk-item-results-top {
    display: flex;
    justify-content: space-between;
    align-items: center;

    margin-bottom: 10px;

    color: #879bad !important;

    font-size: 12px;
}


/* TABLE */

.rk-item-table-wrap {
    overflow-x: auto;

    background: rgba(5,25,44,.97);

    border: 1px solid rgba(183,134,47,.55);
    border-radius: 7px;

    box-shadow:
        0 10px 30px rgba(0,0,0,.25);
}

.rk-item-table {
    width: 100%;

    border-collapse: collapse;
}

.rk-item-table th {
    padding: 13px 11px;

    color: #edc263 !important;

    background:
        linear-gradient(
            #0c2b49,
            #071d34
        );

    border-bottom: 1px solid rgba(199,151,57,.45);

    font-size: 11px;

    letter-spacing: .6px;

    text-align: left;

    white-space: nowrap;
}

.rk-item-table th a {
    color: #edc263 !important;

    text-decoration: none !important;
}

.rk-item-table td {
    padding: 10px 11px;

    color: #c9d5df !important;

    border-bottom: 1px solid rgba(255,255,255,.045);

    vertical-align: middle;
}

.rk-item-table tbody tr {
    transition:
        background .2s ease,
        box-shadow .2s ease;
}

.rk-item-table tbody tr:hover {
    background: rgba(31,67,98,.48);

    box-shadow:
        inset 3px 0 0 #d4a442;
}


/* ITEM */

.rk-item-id a {
    color: #68b7ff !important;

    font-weight: bold;

    text-decoration: none !important;
}

.rk-item-icon {
    width: 42px;

    text-align: center;
}

.rk-item-icon img {
    max-width: 32px;
    max-height: 32px;

    transition: transform .2s ease;
}

.rk-item-table tbody tr:hover .rk-item-icon img {
    transform: scale(1.15);
}

.rk-item-name {
    min-width: 220px;
}

.rk-item-name > a {
    display: block;

    color: #ffffff !important;

    font-weight: bold;

    text-decoration: none !important;
}

.rk-item-name > a:hover {
    color: #edc263 !important;
}

.rk-item-name small {
    display: block;

    margin-top: 3px;

    color: #6f8497 !important;

    font-size: 10px;
}


/* EMPTY */

.rk-item-empty {
    padding: 45px;

    text-align: center;

    color: #899dad;

    background: rgba(5,25,44,.96);

    border: 1px solid rgba(183,134,47,.45);
    border-radius: 7px;
}

.rk-item-empty strong {
    color: #edc263;
}


/* MOBILE */

@media screen and (max-width: 1100px) {

    .rk-item-search-grid {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));
    }

}

@media screen and (max-width: 650px) {

    .rk-item-page {
        padding-left: 12px;
        padding-right: 12px;
    }

    .rk-item-search-grid {
        grid-template-columns: 1fr;
    }

    .rk-item-results-top {
        flex-direction: column;
        gap: 5px;

        align-items: flex-start;
    }

}

/* =========================================================
   ITEM DETAIL PAGE
========================================================= */

.rk-item-view-page {
    max-width: 1500px;
    margin: 0 auto;
    padding: 42px 30px 80px;
}


/* HERO */

.rk-item-view-hero {
    display: flex;
    align-items: center;
    gap: 28px;

    margin-bottom: 28px;
    padding: 28px 34px;

    background:
        linear-gradient(
            135deg,
            rgba(13, 48, 78, .98),
            rgba(4, 21, 38, .98)
        );

    border: 1px solid rgba(201, 151, 55, .65);
    border-radius: 8px;

    box-shadow:
        0 15px 40px rgba(0,0,0,.28);
}

.rk-item-view-icon {
    width: 115px;
    height: 115px;

    flex: 0 0 115px;

    display: flex;
    align-items: center;
    justify-content: center;

    background:
        radial-gradient(
            circle,
            rgba(255,255,255,.08),
            rgba(0,0,0,.20)
        );

    border: 1px solid rgba(214, 167, 72, .45);
    border-radius: 8px;
}

.rk-item-view-icon img {
    max-width: 90px;
    max-height: 90px;

    image-rendering: auto;

    filter: drop-shadow(0 6px 8px rgba(0,0,0,.35));

    transition: transform .25s ease;
}

.rk-item-view-hero:hover .rk-item-view-icon img {
    transform: scale(1.08);
}

.rk-item-view-id {
    color: #6ca8d5 !important;

    font-size: 11px;
    font-weight: bold;

    letter-spacing: 2px;
}

.rk-item-view-title h1 {
    margin: 4px 0 13px;

    color: #ffffff !important;

    font-family: Georgia, "Times New Roman", serif;
    font-size: 33px;

    text-shadow: 0 3px 8px rgba(0,0,0,.5);
}


/* TAGS */

.rk-item-view-tags {
    display: flex;
    flex-wrap: wrap;

    gap: 7px;
}

.rk-item-tag {
    padding: 5px 10px;

    color: #bcd0df !important;

    background: #0a2946;

    border: 1px solid #315675;
    border-radius: 20px;

    font-size: 10px;
    font-weight: bold;

    letter-spacing: .5px;
}

.rk-item-tag-gold {
    color: #f2ce77 !important;

    border-color: #a67c2c;
}

.rk-item-tag-blue {
    color: #78c8ff !important;

    border-color: #3174a5;
}


/* MAIN GRID */

.rk-item-view-grid {
    display: grid;

    grid-template-columns:
        repeat(2, minmax(0, 1fr));

    gap: 24px;

    margin-bottom: 24px;
}


/* PANEL */

.rk-item-panel {
    padding: 26px 28px;

    background:
        linear-gradient(
            145deg,
            rgba(8, 34, 58, .98),
            rgba(4, 20, 35, .98)
        );

    border: 1px solid rgba(190, 140, 48, .55);
    border-radius: 7px;

    box-shadow:
        0 10px 28px rgba(0,0,0,.20);
}

.rk-item-panel-wide {
    margin-bottom: 24px;
}

.rk-item-panel h2 {
    margin: 0 0 20px;
    padding-bottom: 11px;

    color: #edc263 !important;

    font-family: Georgia, "Times New Roman", serif;
    font-size: 20px;

    letter-spacing: 1px;

    border-bottom:
        1px solid rgba(190,145,58,.28);
}


/* STATS */

.rk-item-stat-grid {
    display: grid;

    grid-template-columns:
        repeat(2, minmax(0, 1fr));

    gap: 11px;
}

.rk-item-stat-grid-wide {
    grid-template-columns:
        repeat(3, minmax(0, 1fr));
}

.rk-item-stat-grid > div {
    padding: 12px 14px;

    background: rgba(2,15,27,.35);

    border: 1px solid rgba(255,255,255,.045);
    border-radius: 5px;

    transition:
        background .2s ease,
        border-color .2s ease,
        transform .2s ease;
}

.rk-item-stat-grid > div:hover {
    background: rgba(20,52,79,.65);

    border-color:
        rgba(198,151,61,.30);

    transform: translateY(-1px);
}

.rk-item-stat-grid span {
    display: block;

    margin-bottom: 4px;

    color: #70889c !important;

    font-size: 9px;
    font-weight: bold;

    letter-spacing: 1px;
}

.rk-item-stat-grid strong {
    color: #e8f0f6 !important;

    font-size: 14px;

    word-break: break-word;
}


/* STATUS */

.rk-good {
    color: #58db8d !important;
}

.rk-muted {
    color: #718292 !important;
}


/* CHIPS */

.rk-item-chip-list {
    display: flex;
    flex-wrap: wrap;

    gap: 8px;
}

.rk-item-chip {
    padding: 6px 11px;

    color: #c9d8e4 !important;

    background: rgba(10,42,70,.9);

    border: 1px solid #315774;
    border-radius: 4px;

    font-size: 10px;
}

.rk-item-chip-gold {
    color: #ebc66f !important;

    border-color: #926e2c;
}

.rk-item-chip-danger {
    color: #eba5a5 !important;

    background: rgba(77,22,22,.35);

    border-color: rgba(174,79,79,.55);
}


/* SUBHEAD */

.rk-item-subheading {
    margin: 18px 0 10px;

    color: #8299ab !important;

    font-size: 10px;

    letter-spacing: 1.5px;
}


/* DESCRIPTION */

.rk-item-description {
    color: #c8d4dd !important;

    line-height: 1.8;

    white-space: normal;
}


/* SCRIPT */

.rk-item-script {
    max-height: 350px;

    overflow: auto;

    margin: 0;
    padding: 18px;

    color: #bcd7e8 !important;

    background: #020d17;

    border: 1px solid rgba(95,131,160,.35);
    border-radius: 5px;

    font-family:
        Consolas,
        Monaco,
        monospace;

    font-size: 12px;
    line-height: 1.65;

    white-space: pre-wrap;
}


/* DROP TABLE */

.rk-item-drop-table-wrap {
    overflow-x: auto;
}

.rk-item-drop-table {
    width: 100%;

    border-collapse: collapse;
}

.rk-item-drop-table th {
    padding: 11px 12px;

    color: #edc263 !important;

    background: #071e34;

    border-bottom:
        1px solid rgba(191,142,50,.45);

    font-size: 10px;

    letter-spacing: .8px;

    text-align: left;
}

.rk-item-drop-table td {
    padding: 11px 12px;

    color: #c4d2dd !important;

    border-bottom:
        1px solid rgba(255,255,255,.05);
}

.rk-item-drop-table tbody tr {
    transition: background .2s ease;
}

.rk-item-drop-table tbody tr:hover {
    background:
        rgba(29,67,96,.48);
}

.rk-item-drop-table a {
    color: #69b9ff !important;

    font-weight: bold;

    text-decoration: none !important;
}

.rk-item-drop-table a:hover {
    color: #edc263 !important;
}

.rk-item-drop-table small {
    display: block;

    margin-top: 2px;

    color: #64798b !important;

    font-size: 9px;
}

.rk-drop-rate {
    color: #6cdb9a !important;

    font-weight: bold;
}


/* EMPTY */

.rk-item-empty-text {
    margin: 0;

    color: #8096a8 !important;

    text-align: center;
}


/* BACK */

.rk-item-back {
    margin-top: 26px;

    text-align: center;
}

.rk-item-back a {
    display: inline-block;

    padding: 10px 18px;

    color: #edc263 !important;

    background: #082440;

    border: 1px solid rgba(192,145,56,.55);
    border-radius: 4px;

    font-size: 10px;
    font-weight: bold;

    letter-spacing: 1px;

    text-decoration: none !important;

    transition:
        background .2s ease,
        transform .2s ease;
}

.rk-item-back a:hover {
    background: #0c345a;

    transform: translateY(-2px);
}


/* NOT FOUND */

.rk-item-not-found {
    padding: 70px 20px;

    text-align: center;

    color: #9aacba;

    background: #071c30;

    border: 1px solid rgba(190,143,53,.5);
    border-radius: 7px;
}


/* MOBILE */

@media screen and (max-width: 850px) {

    .rk-item-view-grid {
        grid-template-columns: 1fr;
    }

    .rk-item-stat-grid-wide {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));
    }

}

@media screen and (max-width: 600px) {

    .rk-item-view-page {
        padding-left: 12px;
        padding-right: 12px;
    }

    .rk-item-view-hero {
        flex-direction: column;

        text-align: center;
    }

    .rk-item-view-tags {
        justify-content: center;
    }

    .rk-item-stat-grid,
    .rk-item-stat-grid-wide {
        grid-template-columns: 1fr;
    }

}
/* =========================================================
   KRO STYLE LOGIN MODAL
========================================================= */

.rk-login-overlay {
    position: fixed;
    inset: 0;

    z-index: 999999;

    display: flex;
    align-items: center;
    justify-content: center;

    visibility: hidden;
    opacity: 0;

    padding: 20px;

    background: rgba(2, 12, 24, .55);

    backdrop-filter: blur(5px);
    -webkit-backdrop-filter: blur(5px);

    transition:
        opacity .25s ease,
        visibility .25s ease;
}

.rk-login-overlay.active {
    visibility: visible;
    opacity: 1;
}


/* WINDOW */

.rk-login-box {
    position: relative;

    width: 100%;
    max-width: 420px;

    padding: 38px 40px 34px;

    text-align: center;

    background:
        linear-gradient(
            145deg,
            rgba(9, 38, 65, .99),
            rgba(3, 17, 31, .99)
        );

    border: 1px solid #b98b32;
    border-radius: 8px;

    box-shadow:
        0 25px 70px rgba(0,0,0,.6),
        0 0 28px rgba(210,163,66,.12);

    transform: translateY(18px) scale(.97);

    transition:
        transform .25s ease;
}

.rk-login-overlay.active .rk-login-box {
    transform: translateY(0) scale(1);
}


/* CLOSE */

.rk-login-close {
    position: absolute;

    top: 11px;
    right: 15px;

    padding: 0;

    color: #8193a4;

    background: transparent;

    border: 0;

    font-size: 27px;

    cursor: pointer;

    transition:
        color .2s ease,
        transform .2s ease;
}

.rk-login-close:hover {
    color: #edc263;

    transform: rotate(90deg);
}


/* LOGO */

.rk-login-logo img {
    width: 190px;
    max-width: 70%;

    margin-bottom: 10px;

    filter:
        drop-shadow(0 4px 8px rgba(0,0,0,.5));
}


/* TITLES */

.rk-login-box h2 {
    margin: 0 0 5px;

    color: #edc263 !important;

    font-family: Georgia, "Times New Roman", serif;

    font-size: 22px;

    letter-spacing: 2px;
}

.rk-login-subtitle {
    margin: 0 0 24px;

    color: #8fa3b4 !important;

    font-size: 12px;
}


/* FORM */

.rk-login-form {
    text-align: left;
}

.rk-login-field {
    margin-bottom: 14px;
}

.rk-login-field label {
    display: block;

    margin-bottom: 6px;

    color: #d7b45f !important;

    font-size: 9px;
    font-weight: bold;

    letter-spacing: 1.2px;
}

.rk-login-field input {
    width: 100%;
    height: 44px;

    box-sizing: border-box;

    padding: 0 13px;

    color: #eef5fa !important;

    background: #061b2e !important;

    border: 1px solid #3b566d;
    border-radius: 4px;

    outline: none;

    transition:
        border-color .2s ease,
        box-shadow .2s ease;
}

.rk-login-field input:focus {
    border-color: #c4973d;

    box-shadow:
        0 0 0 2px rgba(196,151,61,.12);
}


/* BUTTON */

.rk-login-submit {
    width: 100%;
    height: 44px;

    margin-top: 6px;

    color: #221600 !important;

    background:
        linear-gradient(
            180deg,
            #f3d274,
            #bd8427
        );

    border: 1px solid #f3d274;
    border-radius: 4px;

    font-weight: 800;

    letter-spacing: 1px;

    cursor: pointer;

    transition:
        transform .2s ease,
        filter .2s ease,
        box-shadow .2s ease;
}

.rk-login-submit:hover {
    transform: translateY(-2px);

    filter: brightness(1.08);

    box-shadow:
        0 7px 18px rgba(0,0,0,.3);
}


/* LINKS */

.rk-login-links {
    display: flex;
    align-items: center;
    justify-content: center;

    gap: 8px;

    margin-top: 18px;

    font-size: 9px;
}

.rk-login-links a {
    color: #7eb7e2 !important;

    text-decoration: none !important;
}

.rk-login-links a:hover {
    color: #edc263 !important;
}

.rk-login-links span {
    color: #54697b;
}


/* MOBILE */

@media screen and (max-width: 500px) {

    .rk-login-box {
        padding:
            32px 22px
            26px;
    }

}

/* =========================================================
   RAGNAKON STREAMER PROGRAM
   ========================================================= */

.rk-streamer {
    width: min(1180px, calc(100% - 40px));
    margin: 0 auto;
    padding: 55px 0 80px;
    color: #d8e5f3;
}


/* HEADER */

.rk-streamer-header {
    margin-bottom: 35px;
    padding-bottom: 25px;
    border-bottom: 1px solid rgba(205, 166, 90, .35);
}

.rk-streamer-eyebrow {
    display: block;
    color: #c99c50;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 3px;
    margin-bottom: 8px;
}

.rk-streamer-header h1 {
    color: #ffffff;
    font-size: 38px;
    line-height: 1.15;
    margin: 0 0 10px;
    font-weight: 700;
}

.rk-streamer-header p {
    color: #8fa8c0;
    font-size: 16px;
    margin: 0;
}


/* GRID */

.rk-streamer-grid {
    display: grid;
    grid-template-columns: minmax(0, 2fr) minmax(290px, 1fr);
    gap: 24px;
    align-items: start;
}


/* CARD */

.rk-streamer-card {
    background:
        linear-gradient(
            180deg,
            rgba(10, 32, 52, .96),
            rgba(5, 21, 36, .97)
        );

    border: 1px solid rgba(190, 153, 85, .45);
    border-radius: 6px;

    padding: 28px;

    box-shadow:
        0 10px 30px rgba(0, 0, 0, .25),
        inset 0 0 30px rgba(29, 101, 160, .035);
}

.rk-card-title {
    text-align: center;
    color: #55b8ff;
    font-size: 20px;
    font-weight: 700;
    letter-spacing: .5px;
    margin-bottom: 8px;
}

.rk-card-subtitle {
    text-align: center;
    color: #8fa7bb;
    margin: 0 0 30px;
    font-size: 14px;
}


/* FORM */

.rk-streamer-form {
    width: 100%;
}

.rk-form-group {
    margin-bottom: 19px;
}

.rk-form-group label {
    display: block;
    margin-bottom: 8px;

    color: #e6edf5;

    font-size: 14px;
    font-weight: 600;
}

.rk-form-group input,
.rk-form-group select,
.rk-form-group textarea {

    box-sizing: border-box;

    display: block;

    width: 100%;

    background: #06192a;

    color: #dfeaf4;

    border: 1px solid #23435e;

    border-radius: 4px;

    padding: 12px 14px;

    min-height: 46px;

    font-family: inherit;

    font-size: 14px;

    outline: none;

    transition:
        border-color .2s ease,
        box-shadow .2s ease,
        background .2s ease;
}

.rk-form-group textarea {
    min-height: 125px;
    resize: vertical;
}

.rk-form-group input::placeholder,
.rk-form-group textarea::placeholder {
    color: #668197;
}

.rk-form-group input:focus,
.rk-form-group select:focus,
.rk-form-group textarea:focus {

    border-color: #339be4;

    background: #071e32;

    box-shadow:
        0 0 0 3px rgba(51, 155, 228, .12);
}


/* Fix native select appearance */

.rk-form-group select {
    cursor: pointer;
}

.rk-form-group select option {
    background: #07192a;
    color: #ffffff;
}


/* BUTTON */

.rk-streamer-submit {

    display: block;

    width: 100%;

    min-height: 50px;

    margin-top: 8px;

    border: 1px solid #48a8ec;

    border-radius: 4px;

    background:
        linear-gradient(
            180deg,
            #278edb,
            #1462ab
        );

    color: #ffffff;

    font-size: 15px;

    font-weight: 700;

    letter-spacing: .7px;

    cursor: pointer;

    transition:
        transform .15s ease,
        box-shadow .15s ease,
        filter .15s ease;
}

.rk-streamer-submit:hover {

    filter: brightness(1.1);

    box-shadow:
        0 5px 20px rgba(33, 142, 222, .28);

    transform: translateY(-1px);
}


/* RIGHT INFORMATION */

.rk-side-text {
    color: #9bb0c4;
    line-height: 1.7;
    margin: 0 0 22px;
}

.rk-info-section {

    border-top: 1px solid rgba(100, 155, 200, .16);

    padding-top: 20px;
    margin-top: 20px;
}

.rk-info-section h3 {

    color: #54b9ff;

    font-size: 16px;

    margin: 0 0 13px;
}

.rk-info-section ul {

    padding-left: 20px;

    margin: 0;

    color: #bac8d5;

    line-height: 2;
}

.rk-info-section li::marker {
    color: #4aa9ed;
}


/* NOTICE */

.rk-streamer-notice {

    margin-top: 25px;

    padding: 16px;

    background: rgba(18, 71, 111, .18);

    border: 1px solid rgba(69, 158, 222, .28);

    border-radius: 4px;

    color: #9bb9cf;

    font-size: 13px;

    line-height: 1.6;
}


/* STATUS */

.rk-streamer-profile h2 {
    margin-top: 0;
    color: #ffffff;
}

.rk-info-row {

    display: flex;

    justify-content: space-between;

    gap: 20px;

    padding: 13px 0;

    border-bottom:
        1px solid rgba(105, 146, 180, .12);

    color: #839db4;
}

.rk-info-row strong {
    color: #e1edf7;
}

.rk-info-row a {
    color: #53b8ff;
}

.rk-status {
    text-transform: uppercase;
}

.rk-status-approved {
    color: #61d896 !important;
}

.rk-status-pending {
    color: #f0c264 !important;
}

.rk-status-suspended,
.rk-status-rejected {
    color: #ef6b6b !important;
}


/* REWARD HISTORY */

.rk-reward-card {
    margin-top: 24px;
}

.rk-table-wrap {
    overflow-x: auto;
    margin-top: 20px;
}

.rk-streamer-table {
    width: 100%;
    border-collapse: collapse;
}

.rk-streamer-table th {

    background: rgba(30, 104, 158, .15);

    color: #66bfff;

    text-align: left;

    padding: 13px;

    font-size: 13px;

    border-bottom: 1px solid #23435e;
}

.rk-streamer-table td {

    padding: 13px;

    color: #b4c4d1;

    border-bottom:
        1px solid rgba(74, 112, 143, .14);

    font-size: 13px;
}

.rk-streamer-table tr:hover td {
    background: rgba(39, 125, 190, .05);
}

.rk-cash {
    color: #66d8a0 !important;
    font-weight: 700;
}

.rk-empty {
    padding: 30px;
    text-align: center;
    color: #718ba0;
}


/* ALERT */

.rk-alert {

    padding: 15px 18px;

    background: rgba(188, 125, 30, .13);

    border: 1px solid rgba(220, 157, 59, .4);

    color: #e5c582;

    border-radius: 4px;
}


/* MOBILE */

@media (max-width: 900px) {

    .rk-streamer-grid {
        grid-template-columns: 1fr;
    }

}

@media (max-width: 600px) {

    .rk-streamer {
        width: calc(100% - 24px);
        padding: 35px 0 60px;
    }

    .rk-streamer-card {
        padding: 20px;
    }

    .rk-streamer-header h1 {
        font-size: 29px;
    }

    .rk-info-row {
        flex-direction: column;
        gap: 5px;
    }

}

/* =========================================================
   STREAMER APPLICATION STATUS MESSAGE
   ========================================================= */

.rk-streamer-success {
    display: flex;
    align-items: flex-start;
    gap: 18px;

    margin-bottom: 28px;
    padding: 22px 25px;

    background:
        linear-gradient(
            135deg,
            rgba(19, 77, 115, .35),
            rgba(7, 31, 50, .95)
        );

    border: 1px solid rgba(68, 169, 235, .45);
    border-left: 4px solid #3daeff;

    border-radius: 6px;

    box-shadow:
        0 8px 25px rgba(0, 0, 0, .2);
}

.rk-streamer-success-icon {
    display: flex;
    align-items: center;
    justify-content: center;

    flex: 0 0 42px;

    width: 42px;
    height: 42px;

    border-radius: 50%;

    background: rgba(51, 164, 237, .15);

    border: 1px solid #3daeff;

    color: #5fc3ff;

    font-size: 22px;
    font-weight: bold;
}

.rk-streamer-success h2 {
    margin: 0 0 8px;

    color: #ffffff;

    font-size: 20px;
}

.rk-streamer-success p {
    margin: 4px 0;

    color: #a9bccd;

    line-height: 1.6;
}

.rk-streamer-success strong {
    color: #5fc3ff;
}


/* APPROVED */

.rk-streamer-approved {
    border-color: rgba(65, 207, 137, .45);
    border-left-color: #41cf89;
}

.rk-streamer-approved .rk-streamer-success-icon {
    color: #65e2a4;
    border-color: #41cf89;
    background: rgba(65, 207, 137, .12);
}


/* REJECTED */

.rk-streamer-rejected {
    border-color: rgba(226, 83, 83, .45);
    border-left-color: #e25353;
}

.rk-streamer-rejected .rk-streamer-success-icon {
    color: #ff7a7a;
    border-color: #e25353;
}


/* SUSPENDED */

.rk-streamer-suspended {
    border-color: rgba(230, 168, 61, .45);
    border-left-color: #e6a83d;
}

.rk-streamer-suspended .rk-streamer-success-icon {
    color: #ffc75c;
    border-color: #e6a83d;
}

/* =========================================================
   STREAMER ADMIN PANEL
   ========================================================= */

.rk-streamer-admin {
    padding-top: 45px;
}


/* STREAMER LIST */

.rk-admin-streamer-list {
    display: grid;
    gap: 25px;
}

.rk-admin-streamer-card {
    padding: 28px;
}


/* CARD HEADER */

.rk-admin-card-header {

    display: flex;
    justify-content: space-between;
    align-items: center;

    gap: 20px;

    padding-bottom: 20px;

    margin-bottom: 22px;

    border-bottom:
        1px solid rgba(92, 145, 184, .18);
}

.rk-admin-card-header h2 {

    margin: 0 0 5px;

    color: #ffffff;

    font-size: 24px;
}

.rk-admin-account {

    color: #708ba1;

    font-size: 13px;
}


/* STATUS BADGES */

.rk-admin-status {

    display: inline-block;

    padding: 7px 13px;

    border-radius: 3px;

    font-size: 11px;

    font-weight: 700;

    letter-spacing: 1px;
}

.rk-admin-status-pending {

    color: #ffd36d;

    background: rgba(214, 159, 48, .12);

    border: 1px solid rgba(214, 159, 48, .35);
}

.rk-admin-status-approved {

    color: #61dda0;

    background: rgba(60, 196, 131, .12);

    border: 1px solid rgba(60, 196, 131, .35);
}

.rk-admin-status-suspended {

    color: #ffbc5c;

    background: rgba(219, 143, 45, .12);

    border: 1px solid rgba(219, 143, 45, .35);
}

.rk-admin-status-rejected {

    color: #ff7777;

    background: rgba(222, 76, 76, .12);

    border: 1px solid rgba(222, 76, 76, .35);
}


/* INFO GRID */

.rk-admin-info-grid {

    display: grid;

    grid-template-columns:
        repeat(4, minmax(0, 1fr));

    gap: 12px;

    margin-bottom: 25px;
}

.rk-admin-info-box {

    padding: 15px 17px;

    background: rgba(2, 18, 31, .6);

    border: 1px solid rgba(58, 107, 145, .25);

    border-radius: 4px;
}

.rk-admin-info-label {

    color: #6f8aa0;

    font-size: 11px;

    text-transform: uppercase;

    letter-spacing: .8px;

    margin-bottom: 6px;
}

.rk-admin-info-value {

    color: #e4edf5;

    font-size: 15px;

    font-weight: 600;
}

.rk-admin-cp {
    color: #61c6ff;
}


/* ONLINE OFFLINE */

.rk-account-online {

    color: #ff6868;

    font-weight: 700;
}

.rk-account-offline {

    color: #57d493;

    font-weight: 700;
}


/* SECTIONS */

.rk-admin-section {

    padding: 15px 0;

    border-top:
        1px solid rgba(81, 128, 163, .14);
}

.rk-admin-section-title {

    color: #57baff;

    font-size: 12px;

    font-weight: 700;

    letter-spacing: 1.1px;

    margin-bottom: 9px;
}

.rk-admin-channel {

    color: #68c5ff;

    text-decoration: none;

    word-break: break-all;
}

.rk-admin-channel:hover {
    text-decoration: underline;
}

.rk-admin-text {

    color: #b6c7d5;
}

.rk-admin-notes {

    padding: 15px;

    background: rgba(2, 17, 29, .55);

    border-left: 3px solid #317eb3;

    color: #9eb1c1;

    line-height: 1.6;
}


/* WARNING */

.rk-admin-warning {

    margin: 18px 0;

    padding: 14px 17px;

    background: rgba(180, 57, 57, .10);

    border: 1px solid rgba(222, 82, 82, .35);

    border-left: 3px solid #e85c5c;

    border-radius: 3px;

    color: #dd9f9f;

    font-size: 13px;

    line-height: 1.6;
}


/* ACTIONS */

.rk-admin-actions {

    display: flex;

    flex-wrap: wrap;

    gap: 10px;

    padding-top: 20px;

    margin-top: 10px;

    border-top:
        1px solid rgba(80, 131, 169, .15);
}

.rk-admin-actions form {
    margin: 0;
}

.rk-admin-button {

    border: 0;

    border-radius: 3px;

    padding: 11px 21px;

    color: #ffffff;

    font-weight: 700;

    font-size: 12px;

    letter-spacing: .7px;

    cursor: pointer;

    transition:
        filter .15s ease,
        transform .15s ease;
}

.rk-admin-button:hover {

    filter: brightness(1.12);

    transform: translateY(-1px);
}

.rk-admin-approve {

    background:
        linear-gradient(
            180deg,
            #28a96b,
            #19794b
        );
}

.rk-admin-suspend {

    background:
        linear-gradient(
            180deg,
            #cf912a,
            #9a6319
        );
}

.rk-admin-reject {

    background:
        linear-gradient(
            180deg,
            #ca4b4b,
            #8f3030
        );
}


/* REWARD SECTION */

.rk-admin-reward-section {

    margin-top: 25px;

    padding-top: 25px;

    border-top:
        1px solid rgba(79, 133, 173, .18);
}

.rk-admin-reward-form {

    display: grid;

    grid-template-columns:
        repeat(2, minmax(0, 1fr));

    gap: 16px;

    margin-top: 18px;
}

.rk-admin-reward-form .rk-form-group {
    margin: 0;
}

.rk-admin-reward-button {

    grid-column: 1 / -1;

    min-height: 48px;

    border: 1px solid #3da8ed;

    border-radius: 4px;

    background:
        linear-gradient(
            180deg,
            #278edb,
            #145da2
        );

    color: #ffffff;

    font-weight: 700;

    letter-spacing: .7px;

    cursor: pointer;
}

.rk-admin-reward-button:hover {

    filter: brightness(1.1);
}


/* REWARD LOG */

.rk-admin-log-card {

    margin-top: 30px;
}


/* RESPONSIVE */

@media (max-width: 950px) {

    .rk-admin-info-grid {

        grid-template-columns:
            repeat(2, minmax(0, 1fr));
    }

}

@media (max-width: 650px) {

    .rk-admin-card-header {

        align-items: flex-start;

        flex-direction: column;
    }

    .rk-admin-info-grid {

        grid-template-columns: 1fr;
    }

    .rk-admin-reward-form {

        grid-template-columns: 1fr;
    }

    .rk-admin-actions {

        flex-direction: column;
    }

    .rk-admin-actions form,
    .rk-admin-button {

        width: 100%;
    }

}


/* =========================================================
   RAGNAKON NAVBAR - CLEAN FINAL LAYOUT
   ========================================================= */

html,
body {
    max-width: 100%;
    overflow-x: hidden;
}

.rk-navbar {
    width: 100%;
}

.rk-navbar-inner {
    width: 100%;
    max-width: 1500px;
    height: 100%;
    margin: 0 auto;
    padding: 0 22px;

    display: flex;
    align-items: center;
    justify-content: space-between;

    gap: 18px;
}

.rk-logo-link {
    flex: 0 0 auto;
}

.rk-logo {
    width: 165px;
}


/* Main menu */

.rk-nav {
    flex: 1 1 auto;
    min-width: 0;

    display: flex;
    align-items: center;
    justify-content: center;

    height: 100%;
    gap: 0;
}

.rk-nav a {
    height: 100%;

    display: flex;
    align-items: center;

    padding: 0 12px;

    color: #eee;
    text-decoration: none;

    font-size: 13px;
    font-weight: bold;
    letter-spacing: .7px;

    white-space: nowrap;

    transition: .2s;
}

.rk-nav a:hover {
    color: #ffd46a;

    background:
        linear-gradient(
            180deg,
            rgba(218,160,58,.15),
            rgba(218,160,58,.03)
        );
}

.rk-nav a.active {
    color: #ffd36a;
    border-bottom: 3px solid #d9a63a;
}


/* Play Now stays separate from the menu */

.rk-play-now {
    width: 165px !important;
    min-width: 165px !important;
    height: 52px !important;

    flex: 0 0 165px !important;

    padding: 0 18px !important;

    display: inline-flex !important;
    align-items: center;
    justify-content: center;

    white-space: nowrap !important;
}


/* =========================================================
   LOGGED-IN ACCOUNT STRIP
   ========================================================= */

.rk-account-strip {
    width: 100%;

    background:
        linear-gradient(
            180deg,
            rgba(4,19,38,.98),
            rgba(3,15,30,.98)
        );

    border-bottom: 1px solid rgba(164,119,45,.38);
}

.rk-account-strip-inner {
    width: 100%;
    max-width: 1500px;

    min-height: 34px;

    margin: 0 auto;
    padding: 0 22px;

    display: flex;
    align-items: center;
    justify-content: flex-end;

    gap: 9px;

    font-family: Arial, sans-serif;
}

.rk-account-status-dot {
    width: 7px;
    height: 7px;

    border-radius: 50%;

    background: #62d477;

    box-shadow:
        0 0 7px rgba(98,212,119,.55);
}

.rk-account-strip-label {
    color: #708ba3;

    font-size: 10px;
    font-weight: 700;

    letter-spacing: 1.1px;
    text-transform: uppercase;
}

.rk-account-strip-name {
    color: #e8bd58;

    font-size: 12px;
    font-weight: 700;

    text-decoration: none;
}

.rk-account-strip-name:hover {
    color: #ffe08b;
}

.rk-account-strip-separator {
    color: #40586d;

    font-size: 11px;
}

.rk-account-strip-logout {
    color: #8fa7bc;

    font-size: 10px;
    font-weight: 700;

    letter-spacing: .8px;

    text-decoration: none;
}

.rk-account-strip-logout:hover {
    color: #efc45d;
}


/* Desktop compression */

@media (max-width: 1500px) {

    .rk-navbar-inner {
        padding-left: 14px;
        padding-right: 14px;
        gap: 10px;
    }

    .rk-logo {
        width: 145px;
    }

    .rk-nav a {
        padding-left: 9px;
        padding-right: 9px;

        font-size: 12px;
    }

    .rk-play-now {
        width: 145px !important;
        min-width: 145px !important;
        flex-basis: 145px !important;

        font-size: 15px !important;
    }

    .rk-account-strip-inner {
        padding-left: 14px;
        padding-right: 14px;
    }
}


/* Tablet/mobile */

@media (max-width: 1050px) {

    .rk-navbar {
        height: auto;
        padding: 10px 0;
    }

    .rk-navbar-inner {
        flex-wrap: wrap;
        justify-content: center;
    }

    .rk-nav {
        order: 3;

        width: 100%;
        height: auto;

        flex: 0 0 100%;

        flex-wrap: wrap;
    }

    .rk-nav a {
        height: 38px;
        padding: 0 9px;
    }

    .rk-play-now {
        width: 150px !important;
        min-width: 150px !important;
        flex-basis: 150px !important;
    }

    .rk-account-strip-inner {
        justify-content: center;
    }
}

/* =========================================================
   RAGNAKON PASSWORD RESET
   ========================================================= */

.rk-reset-page {
    min-height: calc(100vh - 136px);

    display: flex;
    justify-content: center;
    align-items: flex-start;

    padding: 65px 20px 90px;

    background:
        radial-gradient(
            circle at top,
            rgba(17, 55, 83, 0.28),
            transparent 520px
        ),
        #031426;
}

.rk-reset-card {
    width: 100%;
    max-width: 560px;

    padding: 42px 46px;

    background: #071d31;

    border: 1px solid rgba(216, 164, 48, 0.55);
    border-radius: 7px;

    box-shadow:
        0 20px 50px rgba(0, 0, 0, 0.32);
}


/* Header */

.rk-reset-header {
    text-align: center;
    margin-bottom: 34px;
}

.rk-reset-eyebrow {
    display: block;

    margin-bottom: 8px;

    color: #dba93e;

    font-size: 11px;
    font-weight: 700;

    letter-spacing: 3px;
}

.rk-reset-header h1 {
    margin: 0;

    color: #f1c35b;

    font-size: 34px;
    line-height: 1.15;
}

.rk-reset-header p {
    max-width: 440px;

    margin: 13px auto 0;

    color: #91abc1;

    font-size: 14px;
    line-height: 1.65;
}


/* Form */

.rk-reset-form {
    margin: 0;
}

.rk-reset-field {
    margin-bottom: 22px;
}

.rk-reset-field label {
    display: block;

    margin-bottom: 8px;

    color: #e3b84f;

    font-size: 11px;
    font-weight: 700;

    letter-spacing: 1.4px;
}

.rk-reset-field input {
    width: 100%;
    height: 50px;

    padding: 0 14px;

    box-sizing: border-box;

    background: #06192b;

    border: 1px solid #38536b;
    border-radius: 5px;

    color: #ffffff;

    font-size: 15px;

    outline: none;

    transition: 0.2s;
}

.rk-reset-field input:focus {
    border-color: #d9a53a;

    box-shadow:
        0 0 0 2px rgba(217, 165, 58, 0.1);
}

.rk-reset-field span {
    display: block;

    margin-top: 7px;

    color: #617e97;

    font-size: 11px;
}


/* Submit */

.rk-reset-submit {
    width: 100%;
    height: 54px;

    margin-top: 8px;

    border: 1px solid #e5b74e;
    border-radius: 5px;

    background:
        linear-gradient(
            180deg,
            #f3ca63,
            #c99024
        );

    color: #17120a;

    font-size: 13px;
    font-weight: 800;

    letter-spacing: 1.3px;

    cursor: pointer;
}

.rk-reset-submit:hover {
    filter: brightness(1.07);
}


/* Footer */

.rk-reset-footer {
    margin-top: 25px;

    padding-top: 20px;

    border-top: 1px solid rgba(102, 137, 164, 0.18);

    text-align: center;
}

.rk-reset-footer a {
    color: #7fb3dc;

    font-size: 11px;
    font-weight: 700;

    letter-spacing: 1px;

    text-decoration: none;
}

.rk-reset-footer a:hover {
    color: #e6b94f;
}


/* Error */

.rk-reset-message {
    margin-bottom: 22px;

    padding: 12px 14px;

    border-radius: 4px;

    font-size: 13px;
}

.rk-reset-error {
    color: #ff9d9d;

    background: rgba(153, 39, 39, 0.16);

    border: 1px solid rgba(220, 77, 77, 0.35);
}
html,
body {
    margin: 0 !important;
    padding: 0 !important;
    background: #031426 !important;
}

.rk-main {
    margin-top: 0 !important;
    padding-top: 0 !important;
}

/* =========================
   POSTER SLIDER
   ========================= */

.rk-poster-slider {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
}

.rk-poster-slides {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
}

.rk-slide {
    display: none;
}

.rk-slide.active {
    display: block;
}

/* LEFT / RIGHT ARROWS */
.rk-slide-arrow {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);

    z-index: 20;

    width: 46px;
    height: 60px;

    border: none;
    border-radius: 8px;

    background: rgba(10, 28, 45, 0.8);
    color: #fff;

    font-size: 30px;
    font-weight: bold;

    cursor: pointer;

    transition:
        background .2s ease,
        transform .2s ease;
}

.rk-slide-arrow:hover {
    background: rgba(201, 149, 52, 0.95);
}

.rk-slide-prev {
    left: 12px;
}

.rk-slide-next {
    right: 12px;
}

/* =========================================
   RAGNAKON PAYPAL DONATION PAGE
   ========================================= */

.rk-donate {
    max-width: 1200px;
    margin: 50px auto 80px;
    padding: 45px 40px;

    color: #eaf4ff;

    background:
        linear-gradient(
            145deg,
            rgba(12, 36, 57, .96),
            rgba(5, 22, 38, .96)
        );

    border: 1px solid rgba(89, 173, 255, .20);
    border-radius: 20px;

    box-shadow:
        0 25px 70px rgba(0, 0, 0, .30),
        inset 0 1px 0 rgba(255, 255, 255, .04);
}


/* HEADER */

.rk-donate-head {
    text-align: center;
    margin-bottom: 38px;
}

.rk-donate-head h1 {
    margin: 0 0 10px;

    color: #ffffff !important;

    font-size: 38px;
    font-weight: 800;
    letter-spacing: .5px;
}

.rk-donate-head p {
    color: #a9c5dd !important;
    font-size: 16px;
    margin: 8px 0;
}

.rk-account {
    color: #bcd4e8 !important;
}

.rk-account strong {
    color: #55b8ff !important;
}


/* SANDBOX */

.rk-sandbox {
    display: inline-block;

    margin-top: 15px;
    padding: 7px 15px;

    color: #ffcb57;

    border: 1px solid rgba(255, 203, 87, .45);
    background: rgba(255, 203, 87, .08);

    border-radius: 999px;

    font-size: 11px;
    font-weight: 800;
    letter-spacing: 1px;
}


/* PACKAGES */

.rk-packages {
    display: grid;

    grid-template-columns:
        repeat(4, minmax(0, 1fr));

    gap: 18px;

    margin-bottom: 32px;
}


/* PACKAGE CARD */

.rk-package {
    position: relative;

    min-height: 145px;

    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;

    padding: 25px 15px;

    color: #ffffff !important;

    background:
        linear-gradient(
            145deg,
            rgba(20, 53, 80, .95),
            rgba(10, 33, 53, .95)
        );

    border: 1px solid rgba(120, 180, 225, .22);

    border-radius: 14px;

    cursor: pointer;

    box-shadow:
        0 8px 25px rgba(0, 0, 0, .18);

    transition:
        transform .18s ease,
        border-color .18s ease,
        box-shadow .18s ease,
        background .18s ease;
}


/* HOVER */

.rk-package:hover {
    transform: translateY(-4px);

    border-color: rgba(74, 174, 255, .65);

    background:
        linear-gradient(
            145deg,
            rgba(25, 69, 103, .98),
            rgba(12, 41, 65, .98)
        );

    box-shadow:
        0 12px 30px rgba(0, 0, 0, .28),
        0 0 20px rgba(50, 155, 255, .08);
}


/* SELECTED PACKAGE */

.rk-package.active {
    transform: translateY(-4px);

    border-color: #4eb4ff;

    background:
        linear-gradient(
            145deg,
            rgba(24, 77, 117, .98),
            rgba(12, 47, 75, .98)
        );

    box-shadow:
        0 12px 30px rgba(0, 0, 0, .28),
        0 0 0 1px rgba(78, 180, 255, .25),
        0 0 25px rgba(78, 180, 255, .15);
}


/* PRICE */

.rk-price {
    display: block;

    color: #ffffff !important;

    font-size: 31px;
    font-weight: 800;

    line-height: 1;

    margin-bottom: 12px;
}


/* CASH POINTS */

.rk-points {
    display: block;

    color: #8fcfff !important;

    font-size: 15px;
    font-weight: 600;
}


/* PAYPAL */

.rk-paypal-box {
    max-width: 600px;

    margin: 10px auto 0;

    padding-top: 10px;
}


/* STATUS MESSAGE */

#rk-paypal-message {
    margin-top: 16px;

    min-height: 24px;

    color: #b9d6eb !important;

    text-align: center;

    font-size: 14px;
}


/* FORCE FLUXCP THEME FROM TURNING TEXT BLACK */

.rk-donate,
.rk-donate p,
.rk-donate span,
.rk-donate strong {
    text-shadow: none;
}


/* TABLET */

@media (max-width: 900px) {

    .rk-packages {
        grid-template-columns: repeat(2, 1fr);
    }

}


/* MOBILE */

@media (max-width: 550px) {

    .rk-donate {
        margin: 20px 12px 50px;
        padding: 30px 18px;
    }

    .rk-donate-head h1 {
        font-size: 29px;
    }

    .rk-packages {
        grid-template-columns: 1fr;
    }

}

.rk-admin-button-wrap {
    margin-top: 18px;
}

.rk-admin-button {
    display: inline-block;

    padding: 11px 18px;

    color: #ffffff !important;

    background:
        linear-gradient(
            90deg,
            #8b5cf6,
            #6d28d9
        );

    border: 1px solid rgba(255,255,255,.12);
    border-radius: 9px;

    font-size: 12px;
    font-weight: 800;
    letter-spacing: 1px;

    text-decoration: none !important;

    box-shadow:
        0 8px 20px rgba(109,40,217,.20);

    transition: .2s ease;
}

.rk-admin-button:hover {
    color: #ffffff !important;

    transform: translateY(-2px);

    box-shadow:
        0 10px 25px rgba(109,40,217,.32);
}

.rk-gtop-vote {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    padding: 12px 24px;

    background: linear-gradient(135deg, #f0b52b, #d98913);
    border: 1px solid #ffd56a;
    border-radius: 6px;

    color: #ffffff !important;
    font-size: 14px;
    font-weight: 700;
    text-decoration: none !important;

    transition: 0.2s ease;
    cursor: pointer;
}

.rk-gtop-vote:hover {
    transform: translateY(-2px);
    filter: brightness(1.1);
}

.rk-vote-stack {
    width: 280px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 10px;
}

.rk-vote-mini {
    height: 46px;

    display: flex;
    align-items: center;
    justify-content: center;

    background: linear-gradient(135deg, #f4b52a, #df8f08);
    border: 1px solid #ffd36a;
    border-radius: 7px;

    color: #fff !important;
    font-family: Georgia, serif;
    font-size: 15px;
    font-weight: bold;

    text-decoration: none !important;
    text-align: center;

    box-sizing: border-box;

    transition: 0.2s ease;
}

.rk-vote-mini:hover {
    transform: translateY(-2px);
    filter: brightness(1.1);
}

.rk-vote-rms {
    background: linear-gradient(135deg, #315f8f, #183f68);
    border-color: #6893bd;
}

/* =========================================================
   EXTRA PLAYER GUIDES
   ========================================================= */

.rk-extra-guides {
    max-width: 1050px;
    margin: 24px auto 0;
}

.rk-extra-guide-card {
    display: flex;
    align-items: center;
    gap: 18px;

    padding: 20px 24px;

    background:
        linear-gradient(
            135deg,
            rgba(38, 31, 27, 0.96),
            rgba(20, 17, 15, 0.96)
        );

    border: 1px solid rgba(204, 164, 94, 0.35);
    border-radius: 10px;

    text-decoration: none !important;

    transition:
        border-color 0.2s ease,
        transform 0.2s ease,
        background 0.2s ease;
}

.rk-extra-guide-card:hover {
    border-color: rgba(218, 177, 104, 0.85);
    transform: translateY(-2px);

    background:
        linear-gradient(
            135deg,
            rgba(48, 38, 31, 0.98),
            rgba(24, 20, 17, 0.98)
        );
}

.rk-extra-guide-icon {
    width: 54px;
    height: 54px;

    flex: 0 0 54px;

    display: flex;
    align-items: center;
    justify-content: center;

    border-radius: 8px;

    background: rgba(177, 132, 63, 0.12);
    border: 1px solid rgba(204, 164, 94, 0.28);

    color: #d7aa5c;
    font-size: 23px;
}

.rk-extra-guide-info {
    flex: 1;
}

.rk-extra-guide-info h3 {
    margin: 0 0 5px;

    color: #e5c27d;
    font-size: 18px;
    font-weight: 600;
}

.rk-extra-guide-info p {
    margin: 0;

    color: #aaa097;
    font-size: 13px;
    line-height: 1.6;
}

.rk-extra-guide-arrow {
    color: #b88b4c;
    font-size: 14px;
}

@media (max-width: 600px) {
    .rk-extra-guide-card {
        padding: 16px;
        gap: 13px;
    }

    .rk-extra-guide-icon {
        width: 46px;
        height: 46px;
        flex-basis: 46px;
    }

    .rk-extra-guide-info h3 {
        font-size: 16px;
    }

    .rk-extra-guide-info p {
        font-size: 12px;
    }
}

/* Improve text readability */
.rk-costume-guide p,
.rk-costume-guide li,
.rk-cg-npc p,
.rk-cg-item {
    color: #ddd2c4 !important;
}

.rk-costume-guide strong {
    color: #fff0cc;
}

.rk-cg-warning {
    color: #f0ddd0 !important;
}

.rk-cg-count {
    color: #d8c8b5 !important;
}

.rk-cg-table td {
    color: #e2d7c9;
}

.rk-cg-coord {
    color: #ead4b7 !important;
}

/* Costume Guide Screenshots */

.rk-cg-main-image {
    margin: 15px 0;
    padding: 8px;
    background: rgba(20, 16, 13, 0.96);
    border: 1px solid var(--rk-line);
    border-radius: 12px;
    text-align: center;
}

.rk-cg-main-image img {
    display: block;
    width: 100%;
    max-width: 780px;
    height: auto;
    margin: 0 auto;
    border-radius: 8px;
}

.rk-cg-image-caption {
    padding: 8px 4px 3px;
    color: #ddd2c4;
    font-size: 12px;
}

.rk-cg-npc-image {
    display: block;
    width: 100%;
    height: 230px;
    object-fit: contain;

    margin-bottom: 14px;

    background: rgba(10, 8, 7, 0.45);
    border: 1px solid rgba(211, 173, 100, 0.18);
    border-radius: 8px;
}

.rk-vote-stack {
    width: 280px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 7px;
}

.rk-vote-mini {
    height: 38px;

    display: flex;
    align-items: center;
    justify-content: center;

    background: linear-gradient(135deg, #f4b52a, #df8f08);
    border: 1px solid #ffd36a;
    border-radius: 6px;

    color: #fff !important;
    font-family: Georgia, serif;
    font-size: 14px;
    font-weight: bold;

    text-decoration: none !important;
    text-align: center;

    box-sizing: border-box;

    transition: 0.2s ease;
}

.rk-vote-mini:hover {
    transform: translateY(-1px);
    filter: brightness(1.1);
}

/* GameTop.GG */
.rk-vote-gametop {
    background: linear-gradient(135deg, #c94b37, #8f2d23);
    border-color: #df796b;
}

/* RateMyServer */
.rk-vote-rms {
    background: linear-gradient(135deg, #315f8f, #183f68);
    border-color: #6893bd;
}

.rk-item-panel.rk-item-description-panel {
    padding: 28px 34px;
    margin-bottom: 26px;
    background: linear-gradient(
        180deg,
        rgba(8, 35, 61, 0.98),
        rgba(5, 27, 48, 0.98)
    );
    border: 1px solid rgba(211, 173, 100, .55);
    box-shadow: 0 8px 30px rgba(0,0,0,.28);
}

.rk-item-description-panel h2 {
    font-size: 30px;
    margin-bottom: 18px;
}

.rk-item-description-panel .rk-item-description-source {
    font-size: 12px;
    padding: 6px 10px;
    margin-bottom: 18px;
}

.rk-item-description-panel .rk-client-item-description {
    font-size: 18px;
    line-height: 1.8;
}

.rk-item-description-panel .rk-client-desc-line {
    min-height: 1.5em;
}

.rk-item-description-panel .rk-client-desc-separator {
    margin: 16px 0;
    border-top: 1px solid rgba(211,173,100,.28);
}