/* ===========================
   CSS Custom Properties (Variables)
   =========================== */

/* Light Theme Colors */
:root,
:root.light {
    --color-base-bk: #ffffff;
    --color-base: #1f1f1f;
    --color-gray: #444746;
    --color-gray-border: #c4c7c5;
    --color-gray-back: #f2f2f2;
    --color-gray-star: #e3e3e3;
    --color-blue: #0b57d0;
    --color-bk-menu: #f0f4f9;
    --color-green: #01875f;
    --color-btn-blue: #ffffff;
    --color-btn-gray: #aaabab;
    --color-btn-gray-bk: #e8e8e8;
}

/* Dark Theme Colors (Automatic) */
@media (prefers-color-scheme: dark) {
    :root {
        --color-base-bk: #131314;
        --color-base: #e3e3e3;
        --color-gray: #c4c7c5;
        --color-gray-border: #444746;
        --color-gray-back: #303030;
        --color-gray-star: #303030;
        --color-blue: #a8c7fa;
        --color-bk-menu: #1e1f20;
        --color-green: #01875f;
        --color-btn-base: #ffffff;
        --color-btn-blue: #062e6f;
        --color-btn-gray: #646564;
        --color-btn-gray-bk: #282829;
    }
}

/* Dark Theme Colors (Manual) */
:root.dark {
    --color-base-bk: #131314;
    --color-base: #e3e3e3;
    --color-gray: #c4c7c5;
    --color-gray-border: #444746;
    --color-gray-back: #303030;
    --color-gray-star: #303030;
    --color-blue: #a8c7fa;
    --color-bk-menu: #1e1f20;
    --color-green: #01875f;
    --color-btn-base: #ffffff;
    --color-btn-blue: #062e6f;
    --color-btn-gray: #646564;
    --color-btn-gray-bk: #282829;
}

/* ===========================
   Base Styles
   =========================== */

html {
    font-size: 62.5%; /* 1rem = 10px */
}

body,
html {
    height: 100%;
    overflow: hidden;
    overflow-y: auto;
}

body {
    -webkit-font-smoothing: antialiased;
    -webkit-text-size-adjust: 100%;
    -moz-text-size-adjust: 100%;
    text-size-adjust: 100%;
    background-color: var(--color-base-bk);
    color: var(--color-base);
    font-family: 'Google Sans Text', 'Google Sans Display', 'Google Sans', 'Roboto', 'RobotoDraft', 'Helvetica', 'Arial', sans-serif;
    margin: 0;
}

body[data-page-type='app'] .btnInstall_btnInstallWrap {
    display: none;
}

* {
    box-sizing: border-box;
}

/* ===========================
   Layout Components
   =========================== */

/* Main Container */
.container {
    height: 100vh;
}

.container .wrap {
    margin: 0 auto;
    max-width: 1080px;
    width: 100%;
}

.container .bWrap {
    display: block;
    height: 76px;
}

/* ===========================
   Modal Components
   =========================== */

.modal_wrap {
    background-color: var(--color-base-bk);
    height: 100%;
    left: 0;
    position: fixed;
    top: 0;
    width: 100%;
    z-index: 2001;
}

.modal_wrap svg {
    fill: var(--color-gray);
}

.modal_body {
    height: 100%;
    overflow-y: auto;
}

/* ===========================
   Header Components
   =========================== */

.header_headerWrap {
    align-items: center;
    display: flex;
    height: 56px;
    justify-content: space-between;
    margin-bottom: 1px;
}

.header_headerWrap svg {
    fill: var(--color-gray);
}

.header_btnPrev {
    align-items: center;
    display: flex;
    height: 48px;
    justify-content: center;
    margin: 4px;
    width: 48px;
}

.header_btnPrev .header_btnPrevImg {
    height: 24px;
    margin: 16px;
    width: 24px;
}

.header_btnPoint {
    align-items: center;
    display: flex;
    height: 48px;
    justify-content: center;
    margin: 4px;
    width: 48px;
}

.header_btnPoint .header_btnPointImg {
    height: 24px;
    margin: 16px;
    width: 24px;
}

/* ===========================
   Title and Icon Components
   =========================== */

.titleIcon_titleIconWrap {
    margin-top: 12px;
    place-items: center;
}

.titleIcon_header {
    display: flex;
    max-height: 100%;
    padding: 1px 12px 0;
    width: 100%;
}

.titleIcon_iconWrap {
    flex: 0 0 96px;
    position: relative;
    width: 96px;
}

.titleIcon_iconWrap img {
    border-radius: 14px;
    box-shadow: 0 0 1px rgba(0, 0, 0, 0.25);
    height: 72px;
    width: 72px;
}

/* Loading State */
.titleIcon_iconWrap.titleIcon_load img {
    border-radius: 8px;
    box-shadow: 0 0 4px rgba(0, 0, 0, 0.8);
    height: 36px;
    margin-left: 18px;
    margin-top: 18px;
    width: 36px;
}

/* Loading Animation */
.titleIcon_iconWrap .titleIcon_loader {
    animation: titleIcon_loader20-1 0.8s linear infinite alternate, titleIcon_loader20-2 1.6s linear infinite;
    aspect-ratio: 1;
    border: 2px solid var(--color-blue);
    border-radius: 50%;
    display: block;
    height: 72px;
    left: 0;
    position: absolute;
    top: 0;
    width: 72px;
}

.titleIcon_iconWrap .titleIcon_loaderProc {
    display: block;
    height: 72px;
    left: 0;
    position: absolute;
    top: 0;
    width: 72px;
}

.titleIcon_iconWrap .titleIcon_loaderProc circle {
    fill: none;
    stroke: var(--color-blue);
    stroke-width: 2;
    stroke-dasharray: 220;
    stroke-dashoffset: 220;
    transform: rotate(-90deg);
    transform-origin: 50% 50%;
    transition: stroke-dashoffset 0.3s linear;
}

/* Loading Animations */
@keyframes titleIcon_loader20-1 {
    0% {
        clip-path: polygon(50% 50%, 0 0, 50% 0, 50% 0, 50% 0, 50% 0, 50% 0);
    }
    12.5% {
        clip-path: polygon(50% 50%, 0 0, 50% 0, 100% 0, 100% 0, 100% 0, 100% 0);
    }
    25% {
        clip-path: polygon(
            50% 50%,
            0 0,
            50% 0,
            100% 0,
            100% 100%,
            100% 100%,
            100% 100%
        );
    }
    50% {
        clip-path: polygon(
            50% 50%,
            0 0,
            50% 0,
            100% 0,
            100% 100%,
            50% 100%,
            0 100%
        );
    }
    62.5% {
        clip-path: polygon(
            50% 50%,
            100% 0,
            100% 0,
            100% 0,
            100% 100%,
            50% 100%,
            0 100%
        );
    }
    75% {
        clip-path: polygon(
            50% 50%,
            100% 100%,
            100% 100%,
            100% 100%,
            100% 100%,
            50% 100%,
            0 100%
        );
    }
    100% {
        clip-path: polygon(
            50% 50%,
            50% 100%,
            50% 100%,
            50% 100%,
            50% 100%,
            50% 100%,
            0 100%
        );
    }
}

@keyframes titleIcon_loader20-2 {
    0% {
        transform: scaleY(1) rotate(0deg);
    }
    49.99% {
        transform: scaleY(1) rotate(135deg);
    }
    50% {
        transform: scaleY(-1) rotate(0deg);
    }
    100% {
        transform: scaleY(-1) rotate(-135deg);
    }
}

/* Title Information */
.titleIcon_titleInfo .titleIcon_title {
    color: var(--color-base);
    font-size: 2.4rem;
    font-weight: 500;
    hyphens: auto;
    line-height: 1.34;
    padding-right: 1px;
    padding-top: 1px;
}

.titleIcon_titleInfo .titleIcon_devName {
    color: var(--color-blue);
    font-family: 'Google Sans Text', 'Google Sans', 'Roboto', 'RobotoDraft', 'Helvetica', 'Arial', sans-serif;
    font-size: 1.45rem;
    line-height: 24px;
}

.titleIcon_titleInfo .titleIcon_infoAds {
    color: var(--color-gray);
    font-size: 1.2rem;
    line-height: 14px;
}

.titleIcon_titleInfo .titleIcon_precPer {
    color: var(--color-base);
    font-size: 1.4rem;
    font-weight: 500;
}

.titleIcon_titleInfo .titleIcon_extDataItem > span {
    display: inline-block;
}

.titleIcon_titleInfo .titleIcon_extDataItem > span:after {
    content: '•';
    display: inline-block;
    margin-left: 6px;
    margin-right: 6px;
}

.titleIcon_titleInfo .titleIcon_extDataItem > span:last-child:after {
    display: none;
}

.titleIcon_titleInfo .titleIcon_extDataItem .titleIcon_verPlay {
    display: flex;
}

.titleIcon_titleInfo .titleIcon_extDataItem .titleIcon_verPlay svg {
    fill: var(--color-green);
    height: 12px;
    margin-right: 4px;
    width: 12px;
}

/* ===========================
   Icon Info Components
   =========================== */

.iconInfo_iconInfoWrap {
    cursor: grab;
    height: 64px;
    margin-top: 12px;
    overflow: hidden;
    white-space: nowrap;
    width: 100%;
}

.iconInfo_iconInfoWrap .iconInfo_scrollCon {
    align-items: center;
    display: flex;
    height: 100%;
    overflow-x: auto;
    overflow-y: hidden;
    transition: transform 0.3s ease;
    scrollbar-width: none;
    -ms-overflow-style: none;
}

.iconInfo_iconInfoWrap .iconInfo_scrollCon::-webkit-scrollbar {
    display: none;
}

.iconInfo_iconInfoWrap .iconInfo_item {
    display: inline-block;
    margin-left: 16px;
    margin-right: 16px;
    min-width: fit-content;
    position: relative;
    text-align: center;
}

.iconInfo_iconInfoWrap .iconInfo_item:after {
    border-right: 1px solid var(--color-gray-border);
    content: '';
    height: 22px;
    position: absolute;
    right: -16px;
    top: 8px;
}

.iconInfo_iconInfoWrap .iconInfo_item:first-child {
    margin-left: 24px;
}

.iconInfo_iconInfoWrap .iconInfo_item:last-child {
    margin-right: 24px;
}

.iconInfo_iconInfoWrap .iconInfo_item:last-child:after {
    display: none;
}

.iconInfo_iconInfoWrap .iconInfo_item .iconInfo_icon {
    align-content: center;
    align-items: center;
    display: flex;
    flex-wrap: nowrap;
    font-size: 1.45rem;
    font-weight: 500;
    height: 22px;
    justify-content: center;
    min-width: 80px;
    gap: 4px;
}

.iconInfo_iconInfoWrap .iconInfo_item .iconInfo_icon img,
.iconInfo_iconInfoWrap .iconInfo_item .iconInfo_icon svg {
    max-height: 100%;
    width: 18px;
    height: 18px;
    flex-shrink: 0;
}

.iconInfo_iconInfoWrap .iconInfo_item .iconInfo_icon svg {
    fill: var(--color-base);
}

.iconInfo_iconInfoWrap .iconInfo_item .iconInfo_text {
    align-items: center;
    color: var(--color-gray);
    display: flex;
    flex-wrap: nowrap;
    font-size: 1.2rem;
    height: 16px;
    justify-content: center;
    padding-top: 1px;
    white-space: nowrap;
}

.iconInfo_iconInfoWrap .iconInfo_item .iconInfo_text > svg {
    margin-left: 3px;
    width: 10px;
}

/* ===========================
   Install Button Components
   =========================== */

.btnInstall_btnInstallWrap {
    margin-top: 12px;
    place-items: center;
}

.btnInstall_wrap {
    padding: 6px 12px;
    width: 100%;
}

.btnInstall_button {
    align-items: center;
    background: var(--color-blue);
    border-radius: 100px;
    color: var(--color-btn-blue);
    display: flex;
    font-size: 1.4rem;
    font-weight: 500;
    height: 39px;
    justify-content: center;
    width: 100%;
    border: none;
    cursor: pointer;
    transition: background-color 0.2s ease;
}

.btnInstall_button:hover {
    opacity: 0.9;
}

.btnInstall_button.btnInstall_norm {
    background: none;
    border: 2px solid var(--color-gray-border);
    color: var(--color-blue);
}

.btnInstall_button.btnInstall_gray {
    background: var(--color-btn-gray-bk);
    color: var(--color-btn-gray);
}

/* ===========================
   Screenshot Components
   =========================== */

.screen_wrap {
    cursor: grab;
    height: 168px;
    margin-top: 12px;
    overflow: hidden;
    white-space: nowrap;
    width: 100%;
}

.screen_wrap .screen_scrollCon {
    align-items: center;
    display: flex;
    height: 166px;
    overflow-x: auto;
    overflow-y: hidden;
    transition: transform 0.3s ease;
    scrollbar-width: none; /* Firefox */
    -ms-overflow-style: none; /* IE and Edge */
}

.screen_wrap .screen_scrollCon::-webkit-scrollbar {
    display: none; /* Chrome, Safari, Opera */
}

.screen_wrap .screen_item {
    display: inline-block;
    height: 166px;
    margin-right: 8px;
    min-width: fit-content;
    padding: 0 2px;
    text-align: center;
}

.screen_wrap .screen_item:first-child {
    margin-left: 12px;
}

.screen_wrap .screen_item:last-child {
    margin-right: 12px;
}

.screen_wrap .screen_item img {
    border-radius: 8px;
    height: 166px;
}

/* ===========================
   About Game Components
   =========================== */

.aboutGame_desc {
    max-height: 45px;
    overflow: hidden;
    text-overflow: ellipsis;
}

.aboutGame_mHeader {
    align-items: center;
    border-bottom: 1.6px solid var(--color-gray-border);
    display: flex;
    height: 58px;
    justify-content: flex-start;
}

.aboutGame_mBtnPrev {
    align-items: center;
    display: flex;
    height: 48px;
    justify-content: center;
    margin: 4px;
    width: 48px;
}

.aboutGame_mBtnPrev .aboutGame_mBtnPrevImg {
    margin: 0 9px;
}

.aboutGame_mBtnPrev img,
.aboutGame_mBtnPrev svg {
    border-radius: 6px;
    height: 24px;
    width: 24px;
}

.aboutGame_mCont {
    display: flex;
}

.aboutGame_mCont .aboutGame_mIcon {
    margin-left: 3px;
    margin-top: 3px;
}

.aboutGame_mCont .aboutGame_mIcon img,
.aboutGame_mCont .aboutGame_mIcon svg {
    border-radius: 6px;
    height: 30px;
    width: 30px;
}

.aboutGame_mCont .aboutGame_mWTitle {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    line-height: 1;
    margin-left: 24px;
}

.aboutGame_mCont .aboutGame_mTitle {
    font-size: 1.6rem;
    font-weight: 500;
    white-space: nowrap;
}

.aboutGame_mCont .aboutGame_mSubTitle {
    color: var(--color-gray);
    font-size: 1.23rem;
}

.aboutGame_mBody {
    color: var(--color-gray);
    font-size: 1.41rem;
    line-height: 2rem;
    padding: 18px 24px;
}

.aboutGame_mbTitle {
    color: var(--color-base);
    font-size: 1.54rem;
    font-weight: 500;
    margin-bottom: 16px;
}

/* ===========================
   Block Info Components
   =========================== */

.blockInfo_wrap {
    margin-top: 12px;
    padding: 0 12px;
}

.blockInfo_wrap .blockInfo_titleWrap {
    align-items: center;
    display: flex;
    height: 56px;
    justify-content: space-between;
}

.blockInfo_wrap .blockInfo_titleWrap .blockInfo_title {
    font-family: 'Google Sans Display', 'Google Sans Text', 'Google Sans', 'Roboto', 'RobotoDraft', 'Helvetica', 'Arial', sans-serif;
    font-size: 1.68rem;
    font-weight: 500;
    letter-spacing: 0.075rem;
}

.blockInfo_wrap .blockInfo_titleWrap .blockInfo_subTitle {
    color: var(--color-gray);
    font-family: 'Google Sans Text', 'Google Sans Display', 'Google Sans', 'Roboto', 'RobotoDraft', 'Helvetica', 'Arial', sans-serif;
    font-size: 1.15rem;
    letter-spacing: 0.00001rem;
    line-height: 1.55;
}

.blockInfo_wrap .blockInfo_titleWrap .blockInfo_icon {
    margin-right: 4px;
    margin-top: 3px;
}

.blockInfo_wrap .blockInfo_titleWrap .blockInfo_icon svg {
    fill: var(--color-gray);
    rotate: 180deg;
}

.blockInfo_wrap .blockInfo_body {
    color: var(--color-gray);
    font-size: 1.375rem;
    letter-spacing: 0.00001rem;
    line-height: 1.5;
}

.blockInfo_wrap .blockInfo_body.blockInfo_slide {
    display: none;
}

.blockInfo_wrap .blockInfo_body.blockInfo_slide.blockInfo_show {
    display: block;
}

/* ===========================
   Tags Components
   =========================== */

.tags_wrap {
    cursor: grab;
    height: 48px;
    margin-top: 12px;
    overflow: hidden;
    padding-top: 2px;
    white-space: nowrap;
    width: 100%;
}

.tags_wrap .tags_scrollCon {
    align-items: center;
    display: flex;
    height: 100%;
    overflow-x: auto;
    overflow-y: hidden;
    transition: transform 0.3s ease;
    scrollbar-width: none; /* Firefox */
    -ms-overflow-style: none; /* IE and Edge */
}

.tags_wrap .tags_scrollCon::-webkit-scrollbar {
    display: none; /* Chrome, Safari, Opera */
}

.tags_wrap .tags_item {
    align-items: center;
    border: 1.6px solid var(--color-gray-border);
    border-radius: 10px;
    color: var(--color-gray);
    display: flex;
    font-size: 1.4rem;
    height: 32px;
    margin-right: 8px;
    min-width: fit-content;
    padding: 0 16px;
}

.tags_wrap .tags_item:first-child {
    margin-left: 12px;
}

.tags_wrap .tags_item:last-child {
    margin-right: 24px;
}

/* ===========================
   Data Safety Components
   =========================== */

.dataSafety_wrapTI {
    border: 1.6px solid var(--color-gray-border);
    border-radius: 8px;
    margin-bottom: 32px;
    margin-top: 32px;
    padding: 22px;
}

.dataSafety_wrapTI .dataSafety_secItem {
    align-items: flex-start;
    display: flex;
    margin-top: 15px;
}

.dataSafety_wrapTI .dataSafety_secItem:first-child {
    margin-top: 0;
}

.dataSafety_wrapTI .dataSafety_secItem .dataSafety_icon,
.dataSafety_wrapTI .dataSafety_secItem .dataSafety_icon img,
.dataSafety_wrapTI .dataSafety_secItem .dataSafety_icon svg {
    width: 24px;
}

.dataSafety_wrapTI .dataSafety_secItem .dataSafety_icon svg {
    fill: var(--color-gray);
}

.dataSafety_wrapTI .dataSafety_secItem .dataSafety_info {
    margin-left: 16px;
    padding-top: 1px;
}

.dataSafety_wrapTI .dataSafety_secItem .dataSafety_subInfo {
    font-size: 1.2rem;
    letter-spacing: 0.00001rem;
    line-height: 1.37;
    margin-top: 6px;
}

.dataSafety_wrapTI .dataSafety_secItem .dataSafety_subInfo > span {
    text-decoration: underline;
}

.dataSafety_wrapTI .dataSafety_more {
    color: var(--color-blue);
    font-size: 1.4rem;
    font-weight: 500;
    margin-bottom: 8px;
    margin-top: 23px;
}

/* ===========================
   Rating & Review Components
   =========================== */

.ratingReview_rrInfo {
    font-size: 1.2rem;
    line-height: 1.3;
    padding: 9px 0;
}

.ratingReview_rrInfo svg {
    height: 11px;
    margin-bottom: -1px;
    width: 11px;
}

.ratingReview_wrapRat {
    display: flex;
}

.ratingReview_wrapRat .ratingReview_ratingTitle {
    font-family: 'Google Sans Display', 'Google Sans Text', 'Google Sans', 'Roboto', 'RobotoDraft', 'Helvetica', 'Arial', sans-serif;
    font-size: 5.7rem;
    line-height: 1.25;
}

.ratingReview_wrapRat .ratingReview_review {
    font-size: 1.2rem;
    line-height: 1.5;
    margin-top: 2px;
}

.ratingReview_wRatLine {
    margin-left: 32px;
    margin-top: 4px;
    width: 100%;
}

.ratingReview_wRatLine .ratingReview_lineW {
    align-items: center;
    display: flex;
    height: 16px;
    margin-top: 4px;
}

.ratingReview_wRatLine .ratingReview_lineNum {
    font-size: 1.15rem;
    width: 27px;
}

.ratingReview_wRatLine .ratingReview_lineBase {
    background-color: var(--color-gray-star);
    border-radius: 9999px;
    height: 10px;
    width: 100%;
}

.ratingReview_wRatLine .ratingReview_lineBaseFill {
    background-color: var(--color-blue);
    border-radius: inherit;
    height: 100%;
}

.ratingReview_wrapCom {
    margin-top: 26px;
}

.ratingReview_wrapCom .ratingReview_more {
    color: var(--color-blue);
    font-size: 1.4rem;
    font-weight: 500;
    margin-bottom: 8px;
    margin-top: 24px;
}

/* ===========================
   Star Rating Components
   =========================== */

.starRating_starList {
    display: flex;
    justify-content: space-between;
    line-height: 0;
    width: 66px;
}

.starRating_starItem {
    display: inline-block;
    height: 12px;
    position: relative;
    text-align: left;
    width: 12px;
}

.starRating_starItem svg {
    height: 100%;
    width: 100%;
}

.starRating_starItem:last-child {
    margin-right: 0;
}

.starRating_starItem > .starRating_starItemFill {
    left: 0;
    position: absolute;
    top: 0;
}

.starRating_starItemFill svg {
    fill: var(--color-blue);
    stop-color: var(--color-blue);
    color: var(--color-blue);
}

.starRating_starItemNotFill svg {
    fill: var(--color-gray-star);
    stop-color: var(--color-gray-star);
}

/* ===========================
   Comment Components
   =========================== */

.commentItem_wrap {
    margin-top: 3px;
}

.commentItem_wrap .commentItem_top {
    align-items: center;
    display: flex;
    height: 64px;
    justify-content: space-between;
}

.commentItem_wrap .commentItem_top .commentItem_avatarW {
    align-items: center;
    display: flex;
}

.commentItem_wrap .commentItem_top .commentItem_avatarW img,
.commentItem_wrap .commentItem_top .commentItem_avatarW svg {
    border-radius: 50%;
    height: 32px;
    width: 32px;
}

.commentItem_wrap .commentItem_top .commentItem_name {
    margin-left: 16px;
}

.commentItem_wrap .commentItem_top .commentItem_btn {
    align-items: center;
    display: flex;
}

.commentItem_wrap .commentItem_top .commentItem_btn svg {
    fill: var(--color-gray);
}

.commentItem_wrap .commentItem_rating {
    align-items: center;
    display: flex;
    height: 16px;
    line-height: 0;
}

.commentItem_wrap .commentItem_date {
    font-size: 1.18rem;
    margin-left: 8px;
}

.commentItem_wrap .commentItem_comment {
    font-size: 1.37rem;
    letter-spacing: 0;
    margin: 8px 0;
}

.commentItem_wrap .commentItem_like {
    font-size: 1.21rem;
    letter-spacing: 0;
    line-height: 2rem;
    margin-top: 10px;
}

.commentItem_wrap .commentItem_wasRev {
    align-items: center;
    display: flex;
    font-size: 1.2rem;
    height: 48px;
    justify-content: space-between;
    margin-top: 15px;
}

.commentItem_wrap .commentItem_wasRev .commentItem_btn {
    display: flex;
}

.commentItem_wrap .commentItem_wasRev .commentItem_btnItem {
    border: 1.6px solid var(--color-gray-border);
    border-radius: 8px;
    margin-right: 8px;
    padding: 6px 16px;
}

.commentItem_wrap .commentItem_wasRev .commentItem_btnItem:last-child {
    margin-right: 0;
}

.commentItem_resWrap {
    background-color: var(--color-gray-back);
    margin-top: 3px;
    padding: 16px 16px 6px;
}

.commentItem_resWrap .commentItem_resTop {
    display: flex;
    justify-content: space-between;
}

.commentItem_resWrap .commentItem_resDate {
    font-size: 1.2rem;
    line-height: 1.5rem;
}

.commentItem_resWrap .commentItem_resComm {
    margin: 8px 0;
}

.commentItem_min {
    max-height: 40px;
    overflow: hidden;
}

/* ===========================
   App Support Components
   =========================== */

.appSupport_item {
    display: flex;
    min-height: 48px;
    padding: 8px 0;
}

.appSupport_icon {
    margin-right: 16px;
    width: 18px;
}

.appSupport_icon img,
.appSupport_icon svg {
    height: 18px;
    width: 18px;
}

.appSupport_title {
    font-size: 1.37rem;
    font-weight: 500;
    height: 26px;
}

.appSupport_cont {
    color: var(--color-gray);
}

.appSupport_ainfo {
    margin: 10px 0;
}

/* ===========================
   Similar Games Components
   =========================== */

.similarGames_wrap {
    cursor: grab;
    margin-top: 1px;
    overflow: hidden;
    white-space: nowrap;
    width: 100%;
}

.similarGames_scrollCon {
    align-items: flex-start;
    display: flex;
    height: 100%;
    overflow: hidden;
    transition: transform 0.3s ease;
}

.similarGames_item {
    cursor: pointer;
    font-size: 1.17rem;
    letter-spacing: 0;
    line-height: 1.55rem;
    margin-right: 12px;
    width: 100px;
}

.similarGames_item:first-child {
    margin-left: 12px;
}

.similarGames_item:last-child {
    margin-right: 0;
}

.similarGames_icon {
    margin-bottom: 4px;
}

.similarGames_icon img,
.similarGames_icon svg {
    border-radius: 20px;
    box-shadow: 0 0 1px rgba(0, 0, 0, 0.25);
    height: 100px;
    width: 100px;
}

.similarGames_title {
    max-height: 32px;
    overflow: hidden;
    white-space: normal;
    width: 100%;
}

.similarGames_rating {
    align-items: center;
    display: flex;
    margin-top: 4px;
}

.similarGames_rating svg {
    fill: var(--color-gray);
    height: 10px;
    margin-left: 1px;
    width: 10px;
}

/* ===========================
   Footer Components
   =========================== */

.footerOther_gprp {
    align-items: center;
    color: var(--color-gray);
    display: flex;
    font-size: 1.37rem;
    font-weight: 500;
    height: 48px;
    line-height: 0;
    margin: 12px 12px 0;
}

.footerOther_icon {
    margin-right: 12px;
}

.footerOther_icon img,
.footerOther_icon svg {
    fill: var(--color-gray);
    height: 24px;
    width: 24px;
}

.footerOther_price {
    color: var(--color-gray);
    font-size: 1.37rem;
    line-height: 2rem;
    margin: 12px;
}

/* ===========================
   Mobile Menu Components
   =========================== */

.mooterMenu_pWrap {
    display: block;
    height: 76px;
}

.mooterMenu_wrap {
    background-color: var(--color-bk-menu);
    bottom: 0;
    color: var(--color-gray);
    display: block;
    font-size: 1.2rem;
    font-weight: 500;
    height: 64px;
    left: 0;
    position: fixed;
    width: 100%;
}

.mooterMenu_list {
    align-items: center;
    display: flex;
    height: 64px;
    justify-content: space-around;
}

.mooterMenu_item {
    align-items: center;
    display: flex;
    flex-direction: column;
    width: 25%;
}

.mooterMenu_icon img,
.mooterMenu_icon svg {
    height: 24px;
    width: 24px;
}

.mooterMenu_icon svg {
    fill: var(--color-gray);
}

/* ===========================
   Standalone Preloader
   =========================== */

#preloader_standalone {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: var(--color-base-bk);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 9999;
}

.preloader_content {
    text-align: center;
    color: var(--color-base);
}

.preloader_icon {
    margin-bottom: 2rem;
}

.preloader_icon img {
    width: 80px;
    height: 80px;
    border-radius: 20px;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.1);
}

.preloader_text h2 {
    font-size: 2.4rem;
    font-weight: 500;
    margin: 0 0 0.5rem 0;
    color: var(--color-base);
}

.preloader_text p {
    font-size: 1.6rem;
    margin: 0 0 2rem 0;
    color: var(--color-gray);
}

.preloader_spinner {
    display: flex;
    justify-content: center;
}

.spinner {
    width: 40px;
    height: 40px;
    border: 3px solid var(--color-gray-border);
    border-top: 3px solid var(--color-blue);
    border-radius: 50%;
    animation: spin 1s linear infinite;
}

@keyframes spin {
    0% {
        transform: rotate(0deg);
    }
    100% {
        transform: rotate(360deg);
    }
}

/* ===========================
   iOS Add to Home Screen
   =========================== */

:root {
    --ios-color: #000000;
    --ios-back: #fbfbfb;
}

@media (prefers-color-scheme: dark) {
    :root {
        --ios-color: #ffffff;
        --ios-back: #2b2c2b;
    }
}

.iphoneAddScreen_back {
    background-color: rgba(0, 0, 0, 0.7);
    display: block;
    height: 100%;
    left: 0;
    position: fixed;
    top: 0;
    width: 100%;
    z-index: 1000;
}

.iphoneAddScreen_wrap {
    bottom: 0;
    color: var(--ios-color);
    display: block;
    font-family: 'SF Pro Text', 'SF Pro Icons', 'Helvetica Neue', 'Helvetica', 'Arial', sans-serif;
    font-size: 17px;
    font-style: normal;
    font-weight: 400;
    left: 0;
    letter-spacing: -0.021em;
    line-height: 1.52947;
    padding: 15px;
    position: fixed;
    width: 100vw;
    z-index: 1000;
}

.iphoneAddScreen_wrapInfo {
    background-color: var(--ios-back);
    border-radius: 8px;
    display: block;
    width: 100%;
}

.iphoneAddScreen_title {
    font-weight: 700;
    margin: 10px;
    padding-top: 10px;
}

.iphoneAddScreen_line {
    background-color: #afafaf;
    height: 1px;
    margin: 10px 0;
    width: 100%;
}

.iphoneAddScreen_info {
    margin: 10px;
    padding-bottom: 10px;
}

.iphoneAddScreen_info ol {
    margin-bottom: 0;
    margin-top: 0;
    padding-left: 30px;
}

.iphoneAddScreen_info li {
    margin-top: 12.75px;
}

.iphoneAddScreen_info li img {
    height: 1em !important;
    pointer-events: none;
    position: relative;
    top: -0.1em;
    vertical-align: text-bottom;
    width: auto !important;
}

.iphoneAddScreen_wIcon {
    margin-bottom: 10px;
    text-align: center;
    width: 100%;
}

.iphoneAddScreen_wIcon > div {
    background-color: #f3f3f3;
    border-radius: 8px;
    height: 120px;
    margin: 0 auto;
    padding: 10px;
    width: 120px;
}

.iphoneAddScreen_wIcon > div img {
    height: 100px;
    width: 100px;
}

/* Theme-aware images */
img.iphoneAddScreen_light {
    display: inline;
}

img.iphoneAddScreen_dark {
    display: none;
}

@media (prefers-color-scheme: dark) {
    img.iphoneAddScreen_light {
        display: none;
    }

    img.iphoneAddScreen_dark {
        display: inline;
    }
}

:root.iphoneAddScreen_dark img.iphoneAddScreen_light {
    display: none;
}

:root.iphoneAddScreen_dark img.iphoneAddScreen_dark {
    display: inline;
}

/* ===========================
   NoScript Styles
   =========================== */

.noscript-warning {
    background-color: var(--color-base-bk);
    color: var(--color-base);
    padding: 20px;
    text-align: center;
    font-family: 'Google Sans Text', 'Google Sans', 'Roboto', 'Arial', sans-serif;
}

.noscript-warning h2 {
    margin-bottom: 10px;
    color: var(--color-blue);
}

.noscript-warning p {
    margin: 0;
    font-size: 1.6rem;
}

/* ===========================
   Preloader Styles
   =========================== */

#preloader_standalone {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}