/* Lucky roulette — skin-owned, live-DOM implementation of the approved neutral mockup. */
@media screen and (min-width: 981px) {
    html:not(#_roulette_fortune_) body.gundam-skin .w_roulette {
        position: relative !important;
        box-sizing: border-box !important;
        width: 1382px !important;
        height: 948px !important;
        min-height: 948px !important;
        margin: 0 !important;
        padding: 0 !important;
        overflow: hidden !important;
        border: 1px solid #243950 !important;
        border-radius: 9px !important;
        background: #020a19 url('/skin/gundam_main/images/roulette/roulette-fortune-stage-v2.webp') center / cover no-repeat !important;
        box-shadow: inset 0 0 0 1px rgb(94 190 237 / 5%) !important;
        color: #f3f7ff !important;
    }

    html:not(#_roulette_fortune_) body.gundam-skin .w_roulette > .page_ttl.roulette-hero-title {
        position: relative !important;
        z-index: 4 !important;
        display: flex !important;
        width: 100% !important;
        height: 156px !important;
        min-height: 156px !important;
        margin: 0 !important;
        padding: 34px 0 5px !important;
        align-items: center !important;
        flex-direction: column !important;
        justify-content: flex-start !important;
        border: 0 !important;
        border-bottom: 1px solid rgb(51 133 176 / 35%) !important;
        border-radius: 0 !important;
        background: linear-gradient(180deg, rgb(2 10 25 / 20%), rgb(3 16 38 / 58%)) !important;
        box-shadow: none !important;
        text-align: center !important;
    }

    html:not(#_roulette_fortune_) body.gundam-skin .w_roulette > .page_ttl::before,
    html:not(#_roulette_fortune_) body.gundam-skin .w_roulette > .page_ttl::after {
        display: none !important;
        content: none !important;
    }

    html:not(#_roulette_fortune_) body.gundam-skin .w_roulette .roulette-hero-title .gundam-page-title-copy {
        position: relative !important;
        inset: auto !important;
        z-index: 10 !important;
        display: block !important;
        visibility: visible !important;
        width: auto !important;
        margin: 0 !important;
        padding: 0 !important;
        transform: none !important;
        opacity: 1 !important;
        color: #f6f8fd !important;
        -webkit-text-fill-color: #f6f8fd !important;
        font-family: "Pretendard", "Noto Sans KR", "Malgun Gothic", sans-serif !important;
        font-size: 43px !important;
        font-weight: 800 !important;
        line-height: 1.08 !important;
        letter-spacing: .12em !important;
        text-indent: .12em !important;
        text-shadow: 0 3px 13px rgb(33 167 234 / 30%) !important;
    }

    html:not(#_roulette_fortune_) body.gundam-skin .w_roulette .roulette-title-en {
        position: relative !important;
        inset: auto !important;
        z-index: 10 !important;
        display: block !important;
        visibility: visible !important;
        transform: none !important;
        opacity: 1 !important;
        margin-top: 7px !important;
        color: #40dcff !important;
        -webkit-text-fill-color: #40dcff !important;
        font-family: Arial, sans-serif !important;
        font-size: 17px !important;
        font-weight: 500 !important;
        line-height: 1 !important;
        letter-spacing: .48em !important;
        text-indent: .48em !important;
        text-shadow: 0 0 12px rgb(0 210 255 / 38%) !important;
    }

    html:not(#_roulette_fortune_) body.gundam-skin .w_roulette .roulette-title-caption {
        position: relative !important;
        inset: auto !important;
        z-index: 10 !important;
        display: block !important;
        visibility: visible !important;
        transform: none !important;
        opacity: 1 !important;
        margin-top: 10px !important;
        color: #e4eaf3 !important;
        -webkit-text-fill-color: #e4eaf3 !important;
        font-size: 16px !important;
        font-weight: 500 !important;
        line-height: 1 !important;
        letter-spacing: .06em !important;
    }

    html:not(#_roulette_fortune_) body.gundam-skin .w_roulette .roulette_tab {
        position: absolute !important;
        z-index: 8 !important;
        top: 160px !important;
        left: 40px !important;
        display: grid !important;
        width: calc(100% - 80px) !important;
        height: 84px !important;
        margin: 0 !important;
        padding: 0 !important;
        grid-template-columns: 1fr 1fr !important;
        gap: 24px !important;
        border: 0 !important;
        background: transparent !important;
        box-shadow: none !important;
    }

    html:not(#_roulette_fortune_) body.gundam-skin .w_roulette .roulette_tab .roulette-tab-button {
        position: relative !important;
        display: flex !important;
        box-sizing: border-box !important;
        width: 100% !important;
        max-width: none !important;
        height: 84px !important;
        padding: 0 28px !important;
        align-items: center !important;
        justify-content: center !important;
        gap: 16px !important;
        overflow: visible !important;
        border-radius: 2px !important;
        text-decoration: none !important;
    }

    html:not(#_roulette_fortune_) body.gundam-skin .w_roulette .roulette_tab .roulette-tab-button--general {
        border: 2px solid #91a9bd !important;
        background: linear-gradient(180deg, #516273 0%, #263746 49%, #1a2936 100%) !important;
        box-shadow: inset 0 0 0 2px rgb(210 231 245 / 14%), 0 4px 10px rgb(0 0 0 / 35%) !important;
        color: #31e3ff !important;
    }

    html:not(#_roulette_fortune_) body.gundam-skin .w_roulette .roulette_tab .roulette-tab-button--general.active::after {
        position: absolute;
        right: 4px;
        bottom: -5px;
        left: 4px;
        height: 4px;
        background: #00eaff;
        box-shadow: 0 0 10px #00cbea;
        content: "";
    }

    html:not(#_roulette_fortune_) body.gundam-skin .w_roulette .roulette_tab .roulette-tab-button--premium {
        border: 2px solid #dfae3d !important;
        outline: 1px solid rgb(255 224 131 / 46%) !important;
        outline-offset: -6px !important;
        background: linear-gradient(105deg, #090b25 0%, #171142 54%, #090a21 100%) !important;
        box-shadow: inset 0 0 20px rgb(92 44 168 / 25%), 0 4px 12px rgb(0 0 0 / 42%), 0 0 12px rgb(232 178 58 / 12%) !important;
        color: #ffd65f !important;
    }

    html:not(#_roulette_fortune_) body.gundam-skin .w_roulette .roulette-tab-label {
        font-size: 25px !important;
        font-weight: 800 !important;
        line-height: 1 !important;
        letter-spacing: -.02em !important;
        text-shadow: 0 1px 3px #000 !important;
    }

    html:not(#_roulette_fortune_) body.gundam-skin .w_roulette .roulette-tab-icon {
        position: relative;
        display: inline-block;
        flex: 0 0 48px;
        width: 48px;
        height: 38px;
    }

    html:not(#_roulette_fortune_) body.gundam-skin .w_roulette .roulette-tab-icon--ticket {
        box-sizing: border-box;
        width: 48px;
        height: 27px;
        transform: rotate(-13deg);
        border: 3px solid #54e8ff;
        border-radius: 5px;
        box-shadow: inset 0 0 0 2px rgb(28 78 103 / 55%), 0 0 7px rgb(0 215 255 / 25%);
    }

    html:not(#_roulette_fortune_) body.gundam-skin .w_roulette .roulette-tab-icon--ticket::after {
        position: absolute;
        top: 4px;
        bottom: 4px;
        left: 50%;
        border-left: 2px dashed #54e8ff;
        content: "";
    }

    html:not(#_roulette_fortune_) body.gundam-skin .w_roulette .roulette-tab-icon--premium::before {
        display: block;
        color: #ffd354;
        font-size: 44px;
        line-height: 36px;
        text-align: center;
        text-shadow: 0 0 9px rgb(255 196 49 / 48%);
        content: "♦";
    }

    html:not(#_roulette_fortune_) body.gundam-skin .w_roulette .roulette-tab-icon--premium::after {
        position: absolute;
        top: -11px;
        left: 9px;
        color: #ffdf72;
        font-size: 22px;
        line-height: 1;
        content: "♛";
    }

    html:not(#_roulette_fortune_) body.gundam-skin .w_roulette .roulette-tab-count {
        position: static !important;
        display: inline-flex !important;
        margin-left: 2px !important;
        padding: 7px 14px !important;
        align-items: center !important;
        border: 1px solid currentcolor !important;
        border-radius: 8px !important;
        background: rgb(3 12 28 / 65%) !important;
        color: inherit !important;
        font-size: 14px !important;
        font-weight: 600 !important;
        line-height: 1 !important;
        text-shadow: none !important;
    }

    html:not(#_roulette_fortune_) body.gundam-skin .w_roulette .roulette-tab-count strong {
        color: inherit !important;
        font: inherit !important;
    }

    html:not(#_roulette_fortune_) body.gundam-skin .w_roulette .roulette_wrap {
        position: absolute !important;
        z-index: 3 !important;
        top: 243px !important;
        right: 4px !important;
        bottom: 2px !important;
        left: 4px !important;
        width: auto !important;
        height: auto !important;
        min-height: 0 !important;
        margin: 0 !important;
        padding: 0 !important;
        overflow: visible !important;
        border: 1px solid rgb(45 76 108 / 80%) !important;
        border-radius: 5px !important;
        background: transparent !important;
        box-shadow: none !important;
    }

    html:not(#_roulette_fortune_) body.gundam-skin .w_roulette .roulette_character {
        display: none !important;
    }

    html:not(#_roulette_fortune_) body.gundam-skin .w_roulette .roulette_circle {
        position: absolute !important;
        z-index: 2 !important;
        top: 8px !important;
        left: 50% !important;
        display: block !important;
        width: 456px !important;
        height: 474px !important;
        margin: 0 !important;
        transform: translateX(-50%) !important;
        object-fit: fill !important;
        clip-path: inset(0 0 50px 0) !important;
        filter: saturate(.76) hue-rotate(175deg) brightness(.92) contrast(1.08) !important;
    }

    html:not(#_roulette_fortune_) body.gundam-skin .w_roulette .roulette_canvas {
        position: absolute !important;
        z-index: 3 !important;
        top: 1px !important;
        left: 50% !important;
        width: 462px !important;
        height: 462px !important;
        margin: 0 !important;
        transform: translateX(-50%) !important;
    }

    html:not(#_roulette_fortune_) body.gundam-skin .w_roulette .roulette_canvas canvas {
        display: block !important;
        width: 462px !important;
        height: 462px !important;
        margin: 0 !important;
    }

    html:not(#_roulette_fortune_) body.gundam-skin .w_roulette .roulette_pin {
        position: absolute !important;
        z-index: 5 !important;
        top: -3px !important;
        right: auto !important;
        left: 50% !important;
        display: block !important;
        width: 58px !important;
        height: 72px !important;
        margin: 0 !important;
        transform: translateX(-50%) !important;
    }

    html:not(#_roulette_fortune_) body.gundam-skin .w_roulette .roulette_pin img {
        display: block !important;
        width: 58px !important;
        height: 72px !important;
        object-fit: contain !important;
    }

    html:not(#_roulette_fortune_) body.gundam-skin .w_roulette .roulette_btn {
        position: absolute !important;
        z-index: 6 !important;
        top: 160px !important;
        left: 50% !important;
        width: 142px !important;
        height: 142px !important;
        margin: 0 !important;
        transform: translateX(-50%) !important;
    }

    html:not(#_roulette_fortune_) body.gundam-skin .w_roulette .roulette_btn img {
        display: block !important;
        width: 142px !important;
        height: 142px !important;
        filter: hue-rotate(165deg) saturate(.8) brightness(.75) contrast(1.2) !important;
    }

    html:not(#_roulette_fortune_) body.gundam-skin .w_roulette .roulette_btn .roulette-spin-control {
        display: flex !important;
        box-sizing: border-box !important;
        width: 142px !important;
        height: 142px !important;
        margin: 0 !important;
        padding: 0 !important;
        align-items: center !important;
        flex-direction: column !important;
        justify-content: center !important;
        gap: 4px !important;
        border: 8px solid #aab7c1 !important;
        border-radius: 50% !important;
        outline: 3px solid #02cce4 !important;
        outline-offset: -12px !important;
        background: radial-gradient(circle at 45% 35%, #32495c 0%, #101e2b 46%, #020812 78%) !important;
        box-shadow: inset 0 0 18px rgb(0 0 0 / 72%), 0 4px 12px rgb(0 0 0 / 60%), 0 0 10px rgb(0 215 239 / 30%) !important;
        color: #f9fbff !important;
        cursor: pointer !important;
    }

    html:not(#_roulette_fortune_) body.gundam-skin .w_roulette .roulette-spin-control > span {
        color: #f8faff !important;
        -webkit-text-fill-color: #f8faff !important;
        font-family: Arial, sans-serif !important;
        font-size: 31px !important;
        font-weight: 900 !important;
        line-height: .9 !important;
        letter-spacing: -.04em !important;
        text-shadow: 0 2px 3px #000 !important;
    }

    html:not(#_roulette_fortune_) body.gundam-skin .w_roulette .roulette-spin-control > small {
        display: block !important;
        color: #16dcef !important;
        -webkit-text-fill-color: #16dcef !important;
        font-family: Arial, sans-serif !important;
        font-size: 14px !important;
        font-weight: 800 !important;
        line-height: 1 !important;
        letter-spacing: .05em !important;
    }

    html:not(#_roulette_fortune_) body.gundam-skin .w_roulette .rulette_table {
        position: absolute !important;
        z-index: 8 !important;
        right: 4px !important;
        bottom: 4px !important;
        left: 4px !important;
        box-sizing: border-box !important;
        width: auto !important;
        height: 251px !important;
        margin: 0 !important;
        padding: 13px 16px 14px !important;
        overflow: hidden !important;
        border: 1px solid #203957 !important;
        border-radius: 8px !important;
        background: rgb(2 11 27 / 89%) !important;
        box-shadow: inset 0 1px 0 rgb(104 184 231 / 7%) !important;
        color: #eaf1fb !important;
    }

    html:not(#_roulette_fortune_) body.gundam-skin .w_roulette .roulette-results-head {
        display: flex !important;
        height: 42px !important;
        padding: 0 2px 9px !important;
        align-items: center !important;
        justify-content: space-between !important;
    }

    html:not(#_roulette_fortune_) body.gundam-skin .w_roulette .roulette-results-head h3 {
        margin: 0 !important;
        color: #f4f7fc !important;
        font-size: 20px !important;
        font-weight: 800 !important;
        line-height: 1 !important;
    }

    html:not(#_roulette_fortune_) body.gundam-skin .w_roulette .roulette-results-head h3 i {
        display: none !important;
    }

    html:not(#_roulette_fortune_) body.gundam-skin .w_roulette #roulette_results_toggle {
        width: 165px !important;
        height: 36px !important;
        margin: 0 !important;
        padding: 0 !important;
        border: 1px solid #00d9ee !important;
        border-radius: 3px !important;
        background: rgb(2 17 35 / 88%) !important;
        color: #2ee8f5 !important;
        font-size: 14px !important;
        font-weight: 700 !important;
    }

    html:not(#_roulette_fortune_) body.gundam-skin .w_roulette .rulette_table table {
        width: 100% !important;
        table-layout: fixed !important;
        border-collapse: collapse !important;
        background: rgb(1 9 22 / 72%) !important;
    }

    html:not(#_roulette_fortune_) body.gundam-skin .w_roulette .rulette_table :is(th, td) {
        height: 44px !important;
        padding: 0 10px !important;
        border: 1px solid #203a5a !important;
        color: #e8edf5 !important;
        font-size: 14px !important;
        line-height: 1.2 !important;
        text-align: center !important;
    }

    html:not(#_roulette_fortune_) body.gundam-skin .w_roulette .rulette_table th {
        background: linear-gradient(180deg, #172a46, #11233d) !important;
        color: #d5ddea !important;
        font-weight: 700 !important;
    }

    html:not(#_roulette_fortune_) body.gundam-skin .w_roulette .rulette_table td {
        background: rgb(2 12 28 / 86%) !important;
        font-weight: 500 !important;
    }

    html:not(#_roulette_fortune_) body.gundam-skin .w_roulette .roulette-result-round {
        color: #eef3fb !important;
    }

    html:not(#_roulette_fortune_) body.gundam-skin .w_roulette .roulette-result-prize {
        color: #20e0f4 !important;
        font-weight: 800 !important;
    }

    html:not(#_roulette_fortune_) body.gundam-skin .w_roulette .rulette_table td.roulette-result-status {
        position: relative !important;
        isolation: isolate !important;
        background: rgb(2 12 28 / 86%) !important;
        color: #fff !important;
        font-weight: 800 !important;
    }

    html:not(#_roulette_fortune_) body.gundam-skin .w_roulette .rulette_table td.roulette-result-status::before {
        position: absolute;
        z-index: -1;
        top: 50%;
        left: 50%;
        width: 70px;
        height: 30px;
        transform: translate(-50%, -50%);
        border-radius: 7px;
        background: linear-gradient(180deg, #0878dd, #0752b7);
        box-shadow: inset 0 1px 0 rgb(255 255 255 / 18%);
        content: "";
    }

    html:not(#_roulette_fortune_) body.gundam-skin .w_roulette .rulette_table td.roulette-result-status.is-loss::before {
        background: linear-gradient(180deg, #ee3345, #bd1728);
    }

    html:not(#_roulette_fortune_) body.gundam-skin .w_roulette .rulette_table td.roulette-result-status i {
        display: none !important;
    }
}
