:root{
    --gold-1:#f5d77a;
    --gold-2:#d6b45c;
    --gold-3:#b9963f;
    --gold-glow:rgba(214,180,92,0.45);
    --op-red-1:#ef4444;
    --op-red-2:#dc2626;
    --op-blue-1:#3b82f6;
    --op-blue-2:#2563eb;
    --op-yellow-1:#facc15;
    --op-yellow-2:#eab308;
    --op-dark-text:#0f172a;
    --bg-card:#161616;
    --bg-soft:#1f1f1f;
    --bg-hover:#262626;
    --text-main:#fff;
    --text-sub:#a1a1a1;
    --text-dim:#6b7280;
    --border-soft:hsla(0,0%,100%,0.06);
    --accent-imdb:#f5c518;
    --accent-tmdb:#01b4e4
}
*,:after,:before{
    box-sizing:border-box;
    border:0 solid #e5e7eb
}
:after,:before{
    --tw-content:""
}

html {
    line-height: 1.6;
    -webkit-text-size-adjust: 100%;
    tab-size: 4;
    font-family:
        "Quicksand",
        -apple-system,
        BlinkMacSystemFont,
        "Segoe UI",
        Roboto,
        Arial,
        sans-serif;

    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    text-rendering: optimizeLegibility;
    font-size: 100%;
}

h1, h2, h3, h4, h5, h6,
.actor-name,
.movie-title,
.movie-meta,
strong,
b {
    font-family:
        "Quicksand",
        -apple-system,
        BlinkMacSystemFont,
        "Segoe UI",
        Roboto,
        Arial,
        sans-serif;

    letter-spacing: -0.01em;
}
body{
    margin:0;
    line-height:inherit
}
hr{
    height:0;
    color:inherit;
    border-top-width:1px
}
abbr:where([title]){
    -webkit-text-decoration:underline dotted;
    text-decoration:underline dotted
}
/*h1,h2,h3,h4,h5,h6{
    font-size:inherit;
    font-weight:inherit
}*/
a{
    color:inherit;
    text-decoration:inherit
}
b,strong{
    font-weight:bolder
}
code,kbd,pre,samp{
    font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace;
    font-size:1em
}
small{
    font-size:80%
}
sub,sup{
    font-size:75%;
    line-height:0;
    position:relative;
    vertical-align:baseline
}
sub{
    bottom:-.25em
}
sup{
    top:-.5em
}
table{
    text-indent:0;
    border-color:inherit;
    border-collapse:collapse
}
button,input,optgroup,select,textarea{
    font-family:inherit;
    font-feature-settings:inherit;
    font-variation-settings:inherit;
    font-size:100%;
    font-weight:inherit;
    line-height:inherit;
    color:inherit;
    margin:0;
    padding:0
}
button,select{
    text-transform:none
}
[type=button],[type=reset],[type=submit],button{
    -webkit-appearance:button;
    background-color:transparent;
    background-image:none
}
:-moz-focusring{
    outline:auto
}
:-moz-ui-invalid{
    box-shadow:none
}
progress{
    vertical-align:baseline
}
::-webkit-inner-spin-button,::-webkit-outer-spin-button{
    height:auto
}
[type=search]{
    -webkit-appearance:textfield;
    outline-offset:-2px
}
::-webkit-search-decoration{
    -webkit-appearance:none
}
::-webkit-file-upload-button{
    -webkit-appearance:button;
    font:inherit
}
summary{
    display:list-item
}
blockquote,dd,dl,figure,h1,h2,h3,h4,h5,h6,hr,p,pre{
    margin:0
}
fieldset{
    margin:0
}
fieldset,legend{
    padding:0
}
menu,ol,ul{
    list-style:none;
    margin:0;
    padding:0
}
dialog{
    padding:0
}
textarea{
    resize:vertical
}
input::-moz-placeholder,textarea::-moz-placeholder{
    opacity:1;
    color:#9ca3af
}
input::placeholder,textarea::placeholder{
    opacity:1;
    color:#9ca3af
}
[role=button],button{
    cursor:pointer
}
:disabled{
    cursor:default
}
audio,canvas,embed,iframe,img,object,svg,video{
    display:block;
    vertical-align:middle
}
img,video{
    max-width:100%;
    height:auto
}
[hidden]{
    display:none
}
*,:after,:before{
    --tw-border-spacing-x:0;
    --tw-border-spacing-y:0;
    --tw-translate-x:0;
    --tw-translate-y:0;
    --tw-rotate:0;
    --tw-skew-x:0;
    --tw-skew-y:0;
    --tw-scale-x:1;
    --tw-scale-y:1;
    --tw-scroll-snap-strictness:proximity;
    --tw-ring-offset-width:0px;
    --tw-ring-offset-color:#fff;
    --tw-ring-color:rgb(59 130 246/0.5);
    --tw-ring-offset-shadow:0 0 transparent;
    --tw-ring-shadow:0 0 transparent;
    --tw-shadow:0 0 transparent;
    --tw-shadow-colored:0 0 transparent
}
::backdrop{
    --tw-border-spacing-x:0;
    --tw-border-spacing-y:0;
    --tw-translate-x:0;
    --tw-translate-y:0;
    --tw-rotate:0;
    --tw-skew-x:0;
    --tw-skew-y:0;
    --tw-scale-x:1;
    --tw-scale-y:1;
    --tw-scroll-snap-strictness:proximity;
    --tw-ring-offset-width:0px;
    --tw-ring-offset-color:#fff;
    --tw-ring-color:rgb(59 130 246/0.5);
    --tw-ring-offset-shadow:0 0 transparent;
    --tw-ring-shadow:0 0 transparent;
    --tw-shadow:0 0 transparent;
    --tw-shadow-colored:0 0 transparent
}
.container{
    width:100%
}
@media (min-width:640px){
    .container{
        max-width:640px
    }
}
@media (min-width:768px){
    .container{
        max-width:768px
    }
}
@media (min-width:1024px){
    .container{
        max-width:1024px
    }
}
@media (min-width:1280px){
    .container{
        max-width:1280px
    }
}
@media (min-width:1536px){
    .container{
        max-width:1536px
    }
}
.movie-card-item{
    position:relative;
    display:block;
    height:100%;
    flex-shrink:0;
    scroll-snap-align:start
}
.movie-hero-width{
    width:100%
}
@media (min-width:768px){
    .movie-hero-width{
        width:calc((100% - .5rem)/2)
    }
}
@media (min-width:1024px){
    .movie-hero-width{
        width:calc((100% - 1rem)/3)
    }
}
.movie-card{
    position:relative;
    display:block;
    height:100%;
    width:calc((100% - .5rem)/2);
    flex-shrink:0;
    scroll-snap-align:start
}
@media (min-width:640px){
    .movie-card{
        width:calc((100% - .5rem)/2)
    }
}
@media (min-width:768px){
    .movie-card{
        width:calc((100% - 1rem)/3)
    }
}
@media (min-width:1024px){
    .movie-card{
        width:calc((100% - 1.5rem)/4)
    }
}
@media (min-width:1280px){
    .movie-card{
        width:calc((100% - 1.5rem)/4)
    }
}
.sr-only{
    position:absolute;
    width:1px;
    height:1px;
    padding:0;
    margin:-1px;
    overflow:hidden;
    clip:rect(0,0,0,0);
    white-space:nowrap;
    border-width:0
}
.pointer-events-none{
    pointer-events:none
}
.fixed{
    position:fixed
}
.absolute{
    position:absolute
}
.relative{
    position:relative
}
.inset-0{
    inset:0
}
.bottom-0{
    bottom:0
}
.bottom-2{
    bottom:.5rem
}
.bottom-3{
    bottom:.75rem
}
.bottom-4{
    bottom:1rem
}
.bottom-5{
    bottom:1.25rem
}
.bottom-7{
    bottom:1.75rem
}
.left-0{
    left:0
}
.left-1\/2{
    left:50%
}
.left-2{
    left:.5rem
}
.left-4{
    left:1rem
}
.right-0{
    right:0
}
.right-1{
    right:.25rem
}
.right-2{
    right:.5rem
}
.right-3{
    right:.75rem
}
.right-4{
    right:1rem
}
.top-0{
    top:0
}
.top-1\/2{
    top:50%
}
.top-16{
    top:4rem
}
.top-4{
    top:1rem
}
.top-\[1\/2\]{
    top:50%
}
.top-\[11\.2rem\]{
    top:11.2rem
}
.top-\[8\.5rem\]{
    top:8.5rem
}
.top-\[8rem\]{
    top:8rem
}
.top-full{
    top:100%
}
.-z-10{
    z-index:-10
}
.z-0{
    z-index:0
}
.z-10{
    z-index:10
}
.z-20{
    z-index:20
}
.z-40{
    z-index:40
}
.z-50{
    z-index:50
}
.z-\[100\]{
    z-index:100
}
.z-\[51\]{
    z-index:51
}
.col-span-1{
    grid-column:span 1/span 1
}
.col-span-2{
    grid-column:span 2/span 2
}
.m-0{
    margin:0
}
.-mx-4{
    margin-left:-1rem;
    margin-right:-1rem
}
.mx-2{
    margin-left:.5rem;
    margin-right:.5rem
}
.mx-4{
    margin-left:1rem;
    margin-right:1rem
}
.mx-auto{
    margin-left:auto;
    margin-right:auto;
    display:contents
}
.my-1{
    margin-top:.25rem;
    margin-bottom:.25rem
}
.my-1\.5{
    margin-top:.375rem;
    margin-bottom:.375rem
}
.mb-0{
    margin-bottom:0
}
.mb-1{
    margin-bottom:.25rem
}
.mb-2{
    margin-bottom:.5rem
}
.mb-4{
    margin-bottom:1rem
}
.mb-5{
    margin-bottom:1.25rem
}
.mb-6{
    margin-bottom:1.5rem
}
.mb-8{
    margin-bottom:2rem
}
.ml-2{
    margin-left:.5rem
}
.mr-2{
    margin-right:.5rem
}
.mt-1{
    margin-top:.25rem
}
.mt-2{
    margin-top:.5rem
}
.mt-3{
    margin-top:.75rem
}
.mt-4{
    margin-top:1rem
}
.mt-6{
    margin-top:1.5rem
}
.mt-8{
    margin-top:2rem
}
.line-clamp-1{
    -webkit-line-clamp:1
}
.line-clamp-1,.line-clamp-2{
    overflow:hidden;
    display:-webkit-box;
    -webkit-box-orient:vertical
}
.line-clamp-2{
    -webkit-line-clamp:2
}
.line-clamp-3{
    overflow:hidden;
    display:-webkit-box;
    -webkit-box-orient:vertical;
    -webkit-line-clamp:3
}
.block{
    display:block
}
.inline-block{
    display:inline-block
}
.inline{
    display:inline
}
.flex{
    display:flex
}
.grid{
    display:grid
}
.hidden{
    display:none
}
.aspect-\[16\/11\]{
    aspect-ratio:16/11
}
.aspect-\[16\/8\]{
    aspect-ratio:16/8
}
.aspect-\[16\/9\]{
    aspect-ratio:16/9
}
.aspect-\[2\/3\]{
    aspect-ratio:2/3
}
.h-1{
    height:.25rem
}
.h-10{
    height:2.5rem
}
.h-12{
    height:3rem
}
.h-16{
    height:4rem
}
.h-2{
    height:.5rem
}
.h-3{
    height:.75rem
}
.h-32{
    height:8rem
}
.h-4{
    height:1rem
}
.h-5{
    height:1.25rem
}
.h-6{
    height:1.5rem
}
.h-8{
    height:2rem
}
.h-\[100\%\]{
    height:100%
}
.h-\[12px\]{
    height:12px
}
.h-\[25px\]{
    height:25px
}
.h-\[380px\]{
    height:380px
}
.h-\[40\%\]{
    height:40%
}
.h-\[60\%\]{
    height:60%
}
.h-\[70\%\]{
    height:70%
}
.h-\[75px\]{
    height:75px
}
.h-auto{
    height:auto
}
.h-fit{
    height:-moz-fit-content;
    height:fit-content
}
.h-full{
    height:100%
}
.max-h-\[60vh\]{
    max-height:60vh
}
.max-h-\[80vh\]{
    max-height:80vh
}
.min-h-\[200px\]{
    min-height:200px
}
.min-h-\[300px\]{
    min-height:300px
}
.min-h-screen{
    min-height:100vh
}
.w-1{
    width:.25rem
}
.w-1\.5{
    width:.375rem
}
.w-1\/2{
    width:50%
}
.w-10{
    width:2.5rem
}
.w-12{
    width:3rem
}
.w-16{
    width:4rem
}
.w-2{
    width:.5rem
}
.w-2\/3{
    width:66.666667%
}
.w-20{
    width:5rem
}
.w-24{
    width:6rem
}
.w-3{
    width:.75rem
}
.w-3\/4{
    width:75%
}
.w-3\/5{
    width:60%
}
.w-32{
    width:8rem
}
.w-4{
    width:1rem
}
.w-4\/5{
    width:80%
}
.w-48{
    width:12rem
}
.w-5{
    width:1.25rem
}
.w-6{
    width:1.5rem
}
.w-8{
    width:2rem
}
.w-80{
    width:20rem
}
.w-96{
    width:24rem
}
.w-\[1px\]{
    width:1px
}
.w-\[20rem\]{
    width:20rem
}
.w-\[25px\]{
    width:25px
}
.w-\[50px\]{
    width:50px
}
.w-\[70\%\]{
    width:70%
}
.w-\[calc\(\(100\%-0\.5rem\*3\)\/4\)\]{
    width:calc((100% - 1.5rem)/4)
}
.w-\[calc\(\(100\%-8px\*1\)\/2\)\]{
    width:calc((100% - 8px)/2)
}
.w-\[calc\(\(100\%-theme\(gap\.2\)\*2\)\/3\)\]{
    width:calc((100% - 1rem)/3)
}
.w-auto{
    width:auto
}
.w-fit{
    width:-moz-fit-content;
    width:fit-content
}
.w-full{
    width:100%
}
.min-w-0{
    min-width:0
}
.max-w-4xl{
    max-width:56rem
}
.max-w-\[130px\]{
    max-width:130px
}
.max-w-\[250px\]{
    max-width:250px
}
.max-w-full{
    max-width:100%
}
.max-w-lg{
    max-width:32rem
}
.max-w-md{
    max-width:28rem
}
.max-w-screen-xl{
    max-width:1280px
}
.max-w-sm{
    max-width:24rem
}
.flex-1{
    flex:1 1 0%
}
.flex-\[2\]{
    flex:2
}
.flex-\[8\]{
    flex:8
}
.flex-shrink-0,.shrink-0{
    flex-shrink:0
}
.flex-grow{
    flex-grow:1
}
.basis-full{
    flex-basis:100%
}
.-translate-x-0{
    --tw-translate-x:-0px
}
.-translate-x-0,.-translate-x-1\/2{
    transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))
}
.-translate-x-1\/2{
    --tw-translate-x:-50%
}
.-translate-y-1\/2{
    --tw-translate-y:-50%
}
.-translate-y-1\/2,.-translate-y-4{
    transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))
}
.-translate-y-4{
    --tw-translate-y:-1rem
}
.rotate-0{
    --tw-rotate:0deg
}
.rotate-0,.rotate-180{
    transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))
}
.rotate-180{
    --tw-rotate:180deg
}
.scale-100{
    --tw-scale-x:1;
    --tw-scale-y:1
}
.scale-100,.scale-105{
    transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))
}
.scale-105{
    --tw-scale-x:1.05;
    --tw-scale-y:1.05
}
.transform{
    transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))
}
@keyframes pulse{
    50%{
        opacity:.5
    }
}
.animate-pulse{
    animation:pulse 2s cubic-bezier(.4,0,.6,1) infinite
}
.cursor-pointer{
    cursor:pointer
}
.resize{
    resize:both
}
.snap-x{
    scroll-snap-type:x var(--tw-scroll-snap-strictness)
}
.snap-mandatory{
    --tw-scroll-snap-strictness:mandatory
}
.snap-start{
    scroll-snap-align:start
}
.grid-cols-1{
    grid-template-columns:repeat(1,minmax(0,1fr))
}
.grid-cols-12{
    grid-template-columns:repeat(12,minmax(0,1fr))
}
.grid-cols-2{
    grid-template-columns:repeat(2,minmax(0,1fr))
}
.grid-cols-3{
    grid-template-columns:repeat(3,minmax(0,1fr))
}
.grid-cols-4{
    grid-template-columns:repeat(4,minmax(0,1fr))
}
.grid-cols-5{
    grid-template-columns:repeat(5,minmax(0,1fr))
}
.flex-row{
    flex-direction:row
}
.flex-col{
    flex-direction:column
}
.flex-wrap{
    flex-wrap:wrap
}
.items-start{
    align-items:flex-start
}
.items-end{
    align-items:flex-end
}
.items-center{
    align-items:center
}
.items-stretch{
    align-items:stretch
}
.justify-start{
    justify-content:flex-start
}
.justify-end{
    justify-content:flex-end
}
.justify-center{
    justify-content:center
}
.justify-between{
    justify-content:space-between
}
.gap-1{
    gap:.25rem
}
.gap-1\.5{
    gap:.375rem
}
.gap-10{
    gap:2.5rem
}
.gap-11{
    gap:2.75rem
}
.gap-2{
    gap:.5rem
}
.gap-2\.5{
    gap:.625rem
}
.gap-3{
    gap:.75rem
}
.gap-4{
    gap:1rem
}
.gap-5{
    gap:1.25rem
}
.gap-6{
    gap:1.5rem
}
.gap-8{
    gap:2rem
}
.gap-x-6{
    -moz-column-gap:1.5rem;
    column-gap:1.5rem
}
.gap-y-2{
    row-gap:.5rem
}
.space-x-2>:not([hidden])~:not([hidden]){
    --tw-space-x-reverse:0;
    margin-right:calc(0.5rem*var(--tw-space-x-reverse));
    margin-left:calc(0.5rem*(1 - var(--tw-space-x-reverse)))
}
.space-x-3>:not([hidden])~:not([hidden]){
    --tw-space-x-reverse:0;
    margin-right:calc(0.75rem*var(--tw-space-x-reverse));
    margin-left:calc(0.75rem*(1 - var(--tw-space-x-reverse)))
}
.space-x-8>:not([hidden])~:not([hidden]){
    --tw-space-x-reverse:0;
    margin-right:calc(2rem*var(--tw-space-x-reverse));
    margin-left:calc(2rem*(1 - var(--tw-space-x-reverse)))
}
.space-y-1>:not([hidden])~:not([hidden]){
    --tw-space-y-reverse:0;
    margin-top:calc(0.25rem*(1 - var(--tw-space-y-reverse)));
    margin-bottom:calc(0.25rem*var(--tw-space-y-reverse))
}
.space-y-1\.5>:not([hidden])~:not([hidden]){
    --tw-space-y-reverse:0;
    margin-top:calc(0.375rem*(1 - var(--tw-space-y-reverse)));
    margin-bottom:calc(0.375rem*var(--tw-space-y-reverse))
}
.space-y-2>:not([hidden])~:not([hidden]){
    --tw-space-y-reverse:0;
    margin-top:calc(0.5rem*(1 - var(--tw-space-y-reverse)));
    margin-bottom:calc(0.5rem*var(--tw-space-y-reverse))
}
.space-y-4>:not([hidden])~:not([hidden]){
    --tw-space-y-reverse:0;
    margin-top:calc(1rem*(1 - var(--tw-space-y-reverse)));
    margin-bottom:calc(1rem*var(--tw-space-y-reverse))
}
.space-y-6>:not([hidden])~:not([hidden]){
    --tw-space-y-reverse:0;
    margin-top:calc(1.5rem*(1 - var(--tw-space-y-reverse)));
    margin-bottom:calc(1.5rem*var(--tw-space-y-reverse))
}
.overflow-hidden{
    overflow:hidden
}
.overflow-x-auto{
    overflow-x:auto
}
.overflow-y-auto{
    overflow-y:auto
}
.scroll-smooth{
    scroll-behavior:smooth
}
.truncate{
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap
}
.whitespace-normal{
    white-space:normal
}
.whitespace-nowrap{
    white-space:nowrap
}
.rounded{
    border-radius:.25rem
}
.rounded-\[4px\]{
    border-radius:4px
}
.rounded-\[6px\]{
    border-radius:6px
}
.rounded-\[8px\]{
    border-radius:8px
}
.rounded-full{
    border-radius:9999px
}
.rounded-lg{
    border-radius:.5rem
}
.rounded-md{
    border-radius:.375rem
}
.rounded-none{
    border-radius:0
}
.rounded-sm{
    border-radius:.125rem
}
.rounded-xl{
    border-radius:.75rem
}
.rounded-b-\[4px\]{
    border-bottom-right-radius:4px;
    border-bottom-left-radius:4px
}
.rounded-b-\[6px\]{
    border-bottom-right-radius:6px;
    border-bottom-left-radius:6px
}
.rounded-b-md{
    border-bottom-right-radius:.375rem;
    border-bottom-left-radius:.375rem
}
.rounded-t-sm{
    border-top-left-radius:.125rem;
    border-top-right-radius:.125rem
}
.rounded-bl-sm{
    border-bottom-left-radius:.125rem
}
.rounded-br-sm{
    border-bottom-right-radius:.125rem
}
.rounded-tl-sm{
    border-top-left-radius:.125rem
}
.rounded-tr-sm{
    border-top-right-radius:.125rem
}
.border{
    border-width:1px
}
.border-2{
    border-width:2px
}
.border-4{
    border-width:4px
}
.border-b{
    border-bottom-width:1px
}
.border-b-4{
    border-bottom-width:4px
}
.border-l{
    border-left-width:1px
}
.border-t{
    border-top-width:1px
}
.border-1px{
    border:1px solid #111
}
.border-\[\#1cc730\]{
    --tw-border-opacity:1;
    border-color:rgb(28 199 48/var(--tw-border-opacity))
}
.border-\[\#1cc749\]{
    --tw-border-opacity:1;
    border-color:rgb(28 199 73/var(--tw-border-opacity))
}
.border-gray-200{
    --tw-border-opacity:1;
    border-color:rgb(229 231 235/var(--tw-border-opacity))
}
.border-gray-200\/20{
    border-color:rgba(229,231,235,.2)
}
.border-gray-600{
    --tw-border-opacity:1;
    border-color:rgb(75 85 99/var(--tw-border-opacity))
}
.border-gray-700{
    --tw-border-opacity:1;
    border-color:rgb(55 65 81/var(--tw-border-opacity))
}
.border-green-400{
    --tw-border-opacity:1;
    border-color:rgb(74 222 128/var(--tw-border-opacity))
}
.border-orange-400{
    --tw-border-opacity:1;
    border-color:rgb(251 146 60/var(--tw-border-opacity))
}
.border-transparent{
    border-color:transparent
}
.border-white{
    --tw-border-opacity:1;
    border-color:rgb(255 255 255/var(--tw-border-opacity))
}
.border-white\/10{
    border-color:hsla(0,0%,100%,.1)
}
.border-white\/20{
    border-color:hsla(0,0%,100%,.2)
}
.border-white\/30{
    border-color:hsla(0,0%,100%,.3)
}
.border-white\/50{
    border-color:hsla(0,0%,100%,.5)
}
.bg-\[\#00000033\]{
    background-color:rgba(0,0,0,.2)
}
.bg-\[\#020202\]{
    --tw-bg-opacity:1;
    background-color:rgb(2 2 2/var(--tw-bg-opacity))
}
.bg-\[\#080808\]\/20{
    background-color:rgba(8,8,8,.2)
}
.bg-\[\#111319\]{
    --tw-bg-opacity:1;
    background-color:rgb(17 19 25/var(--tw-bg-opacity))
}
.bg-\[\#1a1c22\]{
    --tw-bg-opacity:1;
    background-color:rgb(26 28 34/var(--tw-bg-opacity))
}
.bg-\[\#1cc730\]{
    --tw-bg-opacity:1;
    background-color:rgb(28 199 48/var(--tw-bg-opacity))
}
.bg-\[\#1cc749\]{
    --tw-bg-opacity:1;
    background-color:rgb(28 199 73/var(--tw-bg-opacity));
    color:#222
}
.bg-\[\#1f1f29\]{
    --tw-bg-opacity:1;
    background-color:rgb(31 31 41/var(--tw-bg-opacity))
}
.bg-\[\#23252b\]{
    --tw-bg-opacity:1;
    background-color:rgb(35 37 43/var(--tw-bg-opacity))
}
.bg-\[\#2c2c2c\]{
    --tw-bg-opacity:1;
    background-color:rgb(44 44 44/var(--tw-bg-opacity))
}
.bg-\[\#2c2c3e\]{
    --tw-bg-opacity:1;
    background-color:rgb(44 44 62/var(--tw-bg-opacity))
}
.bg-\[\#303030\]{
    --tw-bg-opacity:1;
    background-color:rgb(48 48 48/var(--tw-bg-opacity))
}
.bg-\[\#303033\]{
    --tw-bg-opacity:1;
    background-color:rgb(48 48 51/var(--tw-bg-opacity))
}
.bg-\[\#333333\]{
    --tw-bg-opacity:1;
    background-color:#1e2225
}
.bg-\[\#383838\]{
    --tw-bg-opacity:1;
    background-color:rgb(56 56 56/var(--tw-bg-opacity))
}
.bg-\[\#454852\]{
    --tw-bg-opacity:1;
    background-color:rgb(69 72 82/var(--tw-bg-opacity))
}
.bg-\[\#5e6070\]{
    --tw-bg-opacity:1;
    background-color:rgb(15 23 42/var(--tw-bg-opacity))
}
.bg-\[\#78140f\]{
    --tw-bg-opacity:1;
    background-color:rgb(120 20 15/var(--tw-bg-opacity))
}
.bg-\[\#FFFFFF14\]{
    background-color:hsla(0,0%,100%,.08)
}
.bg-ophim-player{
    border:3px solid #333130;
    border-radius:8px;
    width:100%;
    max-width:1400px;
    margin:20px auto;
    padding:0 16px!important;
    box-sizing:border-box
}
.bg-black,.bg-ophim-player{
    --tw-bg-opacity:1;
    background-color:rgb(0 0 0/var(--tw-bg-opacity))
}
.bg-black\/20{
    background-color:rgba(0,0,0,.2)
}
.bg-black\/50{
    background-color:rgba(0,0,0,.5)
}
.bg-black\/60{
    background-color:rgba(0,0,0,.6)
}
.bg-blue-600{
    --tw-bg-opacity:1;
    background-color:rgb(37 99 235/var(--tw-bg-opacity))
}
.bg-gray-400{
    --tw-bg-opacity:1;
    background-color:rgb(156 163 175/var(--tw-bg-opacity))
}
.bg-gray-600{
    --tw-bg-opacity:1;
    background-color:rgb(75 85 99/var(--tw-bg-opacity))
}
.bg-gray-600\/70{
    background-color:rgba(75,85,99,.7)
}
.bg-gray-700{
    --tw-bg-opacity:1;
    background-color:rgb(55 65 81/var(--tw-bg-opacity))
}
.bg-gray-800{
    --tw-bg-opacity:1;
    background-color:rgb(31 41 55/var(--tw-bg-opacity))
}
.bg-gray-900{
    --tw-bg-opacity:1;
    background-color:rgb(17 24 39/var(--tw-bg-opacity))
}
.bg-green-500{
    --tw-bg-opacity:1;
    background-color:rgb(34 197 94/var(--tw-bg-opacity))
}
.bg-indigo-600{
    --tw-bg-opacity:1;
    background-color:rgb(79 70 229/var(--tw-bg-opacity))
}
.bg-orange-500{
    --tw-bg-opacity:1;
    background-color:rgb(249 115 22/var(--tw-bg-opacity))
}
.bg-red-600{
    --tw-bg-opacity:1;
    background-color:rgb(220 38 38/var(--tw-bg-opacity))
}
.bg-transparent{
    background-color:transparent
}
.bg-white{
    --tw-bg-opacity:1;
    background-color:rgb(255 255 255/var(--tw-bg-opacity))
}
.bg-white\/10{
    background-color:hsla(0,0%,100%,.1)
}
.bg-white\/20{
    background-color:hsla(0,0%,100%,.2)
}
.bg-yellow-400{
    --tw-bg-opacity:1;
    background-color:rgb(250 204 21/var(--tw-bg-opacity))
}
.bg-opacity-30{
    --tw-bg-opacity:0.3
}
.bg-opacity-70{
    --tw-bg-opacity:0.7
}
.bg-opacity-75{
    --tw-bg-opacity:0.75
}
.bg-gradient-to-t{
    background-image:linear-gradient(0deg,var(--tw-gradient-stops))
}
.bg-none{
    background-image:none
}
.from-\[\#191B24\]\/100{
    --tw-gradient-from:rgb(25 27 36/1) var(--tw-gradient-from-position);
    --tw-gradient-stops:var(--tw-gradient-from),var(--tw-gradient-to)
}
.from-\[\#191B24\]\/100,.via-\[\#191B24\]\/80{
    --tw-gradient-to:rgb(25 27 36/0) var(--tw-gradient-to-position)
}
.via-\[\#191B24\]\/80{
    --tw-gradient-stops:var(--tw-gradient-from),rgb(25 27 36/0.8) var(--tw-gradient-via-position),var(--tw-gradient-to)
}
.to-transparent{
    --tw-gradient-to:transparent var(--tw-gradient-to-position)
}
.bg-cover{
    background-size:cover
}
.bg-center{
    background-position:50%
}
.fill-\[\#1cc749\]{
    fill:#1cc749
}
.fill-orange-500{
    fill:#f97316
}
.object-cover{
    -o-object-fit:cover;
    object-fit:cover;
    border:1px solid #6d6969
}
.object-fill{
    -o-object-fit:fill;
    object-fit:fill
}
.p-0{
    padding:0
}
.p-1{
    padding:.25rem
}
.p-10{
    padding:2.5rem
}
.p-2{
    padding:.5rem
}
.p-4{
    padding:1rem
}
.p-6{
    padding:1.5rem
}
.p-8{
    padding:2rem
}
.px-0{
    padding-left:0;
    padding-right:0
}
.px-0\.5{
    padding-left:.125rem;
    padding-right:.125rem
}
.px-1{
    padding-left:.25rem;
    padding-right:.25rem
}
.px-10{
    padding-left:2.5rem;
    padding-right:2.5rem
}
.px-2{
    padding-left:.5rem;
    padding-right:.5rem
}
.px-3{
    padding-left:.75rem;
    padding-right:.75rem
}
.px-4{
    padding-left:1rem;
    padding-right:1rem
}
.px-6{
    padding-left:1.5rem;
    padding-right:1.5rem
}
.py-0{
    padding-top:0;
    padding-bottom:0
}
.py-0\.5{
    padding-top:.125rem;
    padding-bottom:.125rem
}
.py-1{
    padding-top:.25rem;
    padding-bottom:.25rem
}
.py-1\.5{
    padding-top:.375rem;
    padding-bottom:.375rem
}
.py-10{
    padding-top:2.5rem;
    padding-bottom:2.5rem
}
.py-16{
    padding-top:4rem;
    padding-bottom:4rem
}
.py-2{
    padding-top:.5rem;
    padding-bottom:.5rem
}
.py-3{
    padding-top:.75rem;
    padding-bottom:.75rem
}
.py-4{
    padding-top:1rem;
    padding-bottom:1rem
}
.py-6{
    padding-top:1.5rem;
    padding-bottom:1.5rem
}
.py-8{
    padding-top:2rem;
    padding-bottom:2rem
}
.pb-24{
    padding-bottom:6rem
}
.pb-4{
    padding-bottom:1rem
}
.pl-3{
    padding-left:.75rem
}
.pr-10{
    padding-right:2.5rem
}
.pr-12{
    padding-right:3rem
}
.pr-2{
    padding-right:.5rem
}
.pt-0{
    padding-top:0
}
.pt-1{
    padding-top:.25rem
}
.pt-2{
    padding-top:.5rem
}
.pt-24{
    padding-top:6rem
}
.text-left{
    text-align:left
}
.text-center{
    text-align:center
}
.font-mono{
    font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace
}
.font-quicksand{
    font-family:Quicksand,sans-serif
}
.text-2xl{
    font-size:1.5rem;
    line-height:2rem
}
.text-3xl{
    font-size:1.875rem;
    line-height:2.25rem
}
.text-4xl{
    font-size:2.25rem;
    line-height:2.5rem
}
.text-5xl{
    font-size:3rem;
    line-height:1
}
.text-\[10px\]{
    font-size:10px
}
.text-\[11px\]{
    font-size:11px
}
.text-\[12px\]{
    font-size:12px
}
.text-\[13px\]{
    font-size:13px
}
.text-\[14px\]{
    font-size:14px
}
.text-\[16px\]{
    font-size:16px
}
.text-base{
    font-size:1rem;
    line-height:1.5rem
}
.text-lg{
    font-size:1.125rem;
    line-height:1.75rem
}
.text-sm{
    font-size:.8rem;
    line-height:1.25rem
}
.text-xl{
    font-size:1.25rem;
    line-height:1.75rem
}
.text-xs{
    font-size:.75rem;
    line-height:1rem
}
.font-black{
    font-weight:900
}
.font-bold{
    font-weight:700
}
.font-extrabold{
    font-weight:800
}
.font-medium{
    font-weight:500
}
.font-normal{
    font-weight:400
}
.font-semibold{
    font-weight:600
}
.italic{
    font-style:italic
}
.leading-none{
    line-height:1
}
.leading-relaxed{
    line-height:1.625
}
.leading-tight{
    line-height:1.25
}
.tracking-tight{
    letter-spacing:-.025em
}
.text-\[\#1cc749\]{
    --tw-text-opacity:1;
    color:rgb(28 199 73/var(--tw-text-opacity))
}
.text-\[\#ECECEC\]{
    --tw-text-opacity:1;
    color:rgb(236 236 236/var(--tw-text-opacity))
}
.text-\[\#a9a9ac\]{
    --tw-text-opacity:1;
    color:rgb(169 169 172/var(--tw-text-opacity))
}
.text-\[\#ececec\]{
    --tw-text-opacity:1;
    color:rgb(236 236 236/var(--tw-text-opacity))
}
.text-black{
    --tw-text-opacity:1;
    color:rgb(0 0 0/var(--tw-text-opacity))
}
.text-gray-100{
    --tw-text-opacity:1;
    color:rgb(243 244 246/var(--tw-text-opacity))
}
.text-gray-200{
    --tw-text-opacity:1;
    color:rgb(229 231 235/var(--tw-text-opacity))
}
.text-gray-300{
    --tw-text-opacity:1;
    color:rgb(209 213 219/var(--tw-text-opacity))
}
.text-gray-400{
    --tw-text-opacity:1;
    color:rgb(156 163 175/var(--tw-text-opacity))
}
.text-gray-500{
    --tw-text-opacity:1;
    color:rgb(107 114 128/var(--tw-text-opacity))
}
.text-gray-600{
    --tw-text-opacity:1;
    color:rgb(75 85 99/var(--tw-text-opacity))
}
.text-green-400{
    --tw-text-opacity:1;
    color:rgb(74 222 128/var(--tw-text-opacity))
}
.text-indigo-400{
    --tw-text-opacity:1;
    color:rgb(129 140 248/var(--tw-text-opacity))
}
.text-orange-400{
    --tw-text-opacity:1;
    color:rgb(251 146 60/var(--tw-text-opacity))
}
.text-orange-500{
    --tw-text-opacity:1;
    color:rgb(249 115 22/var(--tw-text-opacity))
}
.text-red-400{
    --tw-text-opacity:1;
    color:rgb(248 113 113/var(--tw-text-opacity))
}
.text-red-500{
    --tw-text-opacity:1;
    color:rgb(239 68 68/var(--tw-text-opacity))
}
.text-transparent{
    color:transparent
}
.text-white{
    --tw-text-opacity:1;
    color:rgb(255 255 255/var(--tw-text-opacity))
}
.text-white\/60{
    color:hsla(0,0%,100%,.6)
}
.text-white\/70{
    color:hsla(0,0%,100%,.7)
}
.text-white\/80{
    color:hsla(0,0%,100%,.8)
}
.text-white\/90{
    color:hsla(0,0%,100%,.9)
}
.text-yellow-300{
    --tw-text-opacity:1;
    color:rgb(253 224 71/var(--tw-text-opacity))
}
.underline{
    text-decoration-line:underline
}
.decoration-\[\#24e256\]{
    text-decoration-color:#e2d624
}
.decoration-\[3px\]{
    text-decoration-thickness:3px
}
.underline-offset-8{
    text-underline-offset:8px
}
.placeholder-white\/60::-moz-placeholder{
    color:hsla(0,0%,100%,.6)
}
.placeholder-white\/60::placeholder{
    color:hsla(0,0%,100%,.6)
}
.opacity-0{
    opacity:0
}
.shadow-2xl{
    --tw-shadow:0 25px 50px -12px rgb(0 0 0/0.25);
    --tw-shadow-colored:0 25px 50px -12px var(--tw-shadow-color)
}
.shadow-2xl,.shadow-lg{
    box-shadow:var(--tw-ring-offset-shadow,0 0 transparent),var(--tw-ring-shadow,0 0 transparent),var(--tw-shadow)
}
.shadow-lg{
    --tw-shadow:0 10px 15px -3px rgb(0 0 0/0.1),0 4px 6px -4px rgb(0 0 0/0.1);
    --tw-shadow-colored:0 10px 15px -3px var(--tw-shadow-color),0 4px 6px -4px var(--tw-shadow-color)
}
.shadow-md{
    --tw-shadow:0 4px 6px -1px rgb(0 0 0/0.1),0 2px 4px -2px rgb(0 0 0/0.1);
    --tw-shadow-colored:0 4px 6px -1px var(--tw-shadow-color),0 2px 4px -2px var(--tw-shadow-color)
}
.shadow-md,.shadow-xl{
    box-shadow:var(--tw-ring-offset-shadow,0 0 transparent),var(--tw-ring-shadow,0 0 transparent),var(--tw-shadow)
}
.shadow-xl{
    --tw-shadow:0 20px 25px -5px rgb(0 0 0/0.1),0 8px 10px -6px rgb(0 0 0/0.1);
    --tw-shadow-colored:0 20px 25px -5px var(--tw-shadow-color),0 8px 10px -6px var(--tw-shadow-color)
}
.ring-2{
    --tw-ring-offset-shadow:var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
    --tw-ring-shadow:var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);
    box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow,0 0 transparent)
}
.ring-\[\#1cc749\]{
    --tw-ring-opacity:1;
    --tw-ring-color:rgb(28 199 73/var(--tw-ring-opacity))
}
.brightness-110{
    --tw-brightness:brightness(1.1)
}
.brightness-110,.drop-shadow-\[0_0_10px_rgba\(255\,255\,255\,0\.3\)\]{
    filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)
}
.drop-shadow-\[0_0_10px_rgba\(255\,255\,255\,0\.3\)\]{
    --tw-drop-shadow:drop-shadow(0 0 10px hsla(0,0%,100%,0.3))
}
.drop-shadow-\[0_2px_2px_rgba\(0\,0\,0\,0\.5\)\]{
    --tw-drop-shadow:drop-shadow(0 2px 2px rgba(0,0,0,0.5))
}
.drop-shadow-\[0_2px_2px_rgba\(0\,0\,0\,0\.5\)\],.drop-shadow-\[0_3px_3px_rgba\(0\,0\,0\,0\.7\)\]{
    filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)
}
.drop-shadow-\[0_3px_3px_rgba\(0\,0\,0\,0\.7\)\]{
    --tw-drop-shadow:drop-shadow(0 3px 3px rgba(0,0,0,0.7))
}
.drop-shadow-\[0_4px_4px_rgba\(0\,0\,0\,1\)\]{
    --tw-drop-shadow:drop-shadow(0 4px 4px #000)
}
.drop-shadow-\[0_4px_4px_rgba\(0\,0\,0\,1\)\],.filter{
    filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)
}
.backdrop-blur-sm{
    --tw-backdrop-blur:blur(4px)
}
.backdrop-blur-sm,.backdrop-blur-xl{
    -webkit-backdrop-filter:var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia);
    backdrop-filter:var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia)
}
.backdrop-blur-xl{
    --tw-backdrop-blur:blur(24px)
}
.transition{
    transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,-webkit-backdrop-filter;
    transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,backdrop-filter;
    transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,backdrop-filter,-webkit-backdrop-filter;
    transition-timing-function:cubic-bezier(.4,0,.2,1);
    transition-duration:.15s
}
.transition-all{
    transition-property:all;
    transition-timing-function:cubic-bezier(.4,0,.2,1);
    transition-duration:.15s
}
.transition-colors{
    transition-property:color,background-color,border-color,text-decoration-color,fill,stroke;
    transition-timing-function:cubic-bezier(.4,0,.2,1);
    transition-duration:.15s
}
.transition-opacity{
    transition-property:opacity;
    transition-timing-function:cubic-bezier(.4,0,.2,1);
    transition-duration:.15s
}
.transition-transform{
    transition-property:transform;
    transition-timing-function:cubic-bezier(.4,0,.2,1)
}
.duration-150,.transition-transform{
    transition-duration:.15s
}
.duration-200{
    transition-duration:.2s
}
.duration-300{
    transition-duration:.3s
}
.duration-500{
    transition-duration:.5s
}
.ease-in-out{
    transition-timing-function:cubic-bezier(.4,0,.2,1)
}
.ease-out{
    transition-timing-function:cubic-bezier(0,0,.2,1)
}
.hide-scrollbar,.no-scrollbar{
    -ms-overflow-style:none;
    scrollbar-width:none
}
.hide-scrollbar::-webkit-scrollbar{
    display:none
}
.font-roboto{
    font-family:Roboto,Arial,sans-serif
}
.fade-in-section{
    opacity:0;
    transform:translateY(20px);
    transition:all .6s ease-out
}
.fade-in-section.is-visible{
    opacity:1;
    transform:translateY(0)
}
.clip-path-rank{
    clip-path:polygon(0 0,100%0,75% 100%,0 100%)
}
.no-scrollbar{
    -ms-overflow-style:none;
    scrollbar-width:none
}
.no-scrollbar::-webkit-scrollbar{
    display:none
}
.custom-scrollbar::-webkit-scrollbar{
    width:6px!important;
    height:2px
}
.custom-scrollbar::-webkit-scrollbar-track{
    background:0 0
}
.custom-scrollbar::-webkit-scrollbar-thumb{
    background-color:#222;
    border-radius:2px;
    border:0;
    cursor:pointer
}
.custom-scrollbar::-webkit-scrollbar-thumb:hover{
    background-color:#222
}
.hover\:scale-105:hover{
    --tw-scale-x:1.05;
    --tw-scale-y:1.05
}
.hover\:scale-105:hover,.hover\:scale-110:hover{
    transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))
}
.hover\:scale-110:hover{
    --tw-scale-x:1.1;
    --tw-scale-y:1.1
}
.hover\:border:hover{
    border-width:1px
}
.hover\:border-\[\#1cc749\]:hover{
    --tw-border-opacity:1;
    border-color:rgb(28 199 73/var(--tw-border-opacity))
}
.hover\:bg-\[\#1cc749\]:hover{
    --tw-bg-opacity:1;
    background-color:rgb(28 199 73/var(--tw-bg-opacity))
}
.hover\:bg-\[\#404040\]:hover{
    --tw-bg-opacity:1;
    background-color:rgb(64 64 64/var(--tw-bg-opacity))
}
.hover\:bg-black\/40:hover{
    background-color:rgba(0,0,0,.4)
}
.hover\:bg-blue-700:hover{
    --tw-bg-opacity:1;
    background-color:rgb(29 78 216/var(--tw-bg-opacity))
}
.hover\:bg-gray-600:hover{
    --tw-bg-opacity:1;
    background-color:rgb(75 85 99/var(--tw-bg-opacity))
}
.hover\:bg-gray-700:hover{
    --tw-bg-opacity:1;
    background-color:rgb(55 65 81/var(--tw-bg-opacity))
}
.hover\:bg-indigo-700:hover{
    --tw-bg-opacity:1;
    background-color:rgb(67 56 202/var(--tw-bg-opacity))
}
.hover\:bg-orange-600:hover{
    --tw-bg-opacity:1;
    background-color:rgb(234 88 12/var(--tw-bg-opacity))
}
.hover\:bg-red-700:hover{
    --tw-bg-opacity:1;
    background-color:rgb(185 28 28/var(--tw-bg-opacity))
}
.hover\:bg-white:hover{
    --tw-bg-opacity:1;
    background-color:rgb(255 255 255/var(--tw-bg-opacity))
}
.hover\:bg-white\/10:hover{
    background-color:hsla(0,0%,100%,.1)
}
.hover\:bg-white\/5:hover{
    background-color:hsla(0,0%,100%,.05)
}
.hover\:text-\[\#1cc749\]:hover{
    --tw-text-opacity:1;
    color:rgb(28 199 73/var(--tw-text-opacity))
}
.hover\:text-green-400:hover{
    --tw-text-opacity:1;
    color:rgb(74 222 128/var(--tw-text-opacity))
}
.hover\:text-indigo-300:hover{
    --tw-text-opacity:1;
    color:rgb(165 180 252/var(--tw-text-opacity))
}
.hover\:text-orange-300:hover{
    --tw-text-opacity:1;
    color:rgb(253 186 116/var(--tw-text-opacity))
}
.hover\:text-red-500:hover{
    --tw-text-opacity:1;
    color:rgb(239 68 68/var(--tw-text-opacity))
}
.hover\:text-white:hover{
    --tw-text-opacity:1;
    color:rgb(255 255 255/var(--tw-text-opacity))
}
.hover\:underline:hover{
    text-decoration-line:underline
}
.hover\:shadow-yellow-400\/30:hover{
    --tw-shadow-color:rgb(250 204 21/0.3);
    --tw-shadow:var(--tw-shadow-colored)
}
.focus\:bg-white\/10:focus{
    background-color:hsla(0,0%,100%,.1)
}
.focus\:text-white:focus{
    --tw-text-opacity:1;
    color:rgb(255 255 255/var(--tw-text-opacity))
}
.focus\:outline-none:focus{
    outline:2px solid transparent;
    outline-offset:2px
}
.disabled\:cursor-not-allowed:disabled{
    cursor:not-allowed
}
.disabled\:opacity-50:disabled{
    opacity:.5
}
.group:hover .group-hover\:scale-105{
    --tw-scale-x:1.05;
    --tw-scale-y:1.05;
    transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))
}
.group:hover .group-hover\:fill-orange-400{
    fill:#fb923c
}
.group:hover .group-hover\:text-\[\#1cc749\]{
    --tw-text-opacity:1;
    color:rgb(28 199 73/var(--tw-text-opacity))
}
.group:hover .group-hover\:opacity-100{
    opacity:1
}
.group:hover .group-hover\:opacity-60{
    opacity:.6
}
@media (min-width:640px){
    .sm\:fixed{
        position:fixed
    }
    .sm\:left-0{
        left:0
    }
    .sm\:right-0{
        right:0
    }
    .sm\:top-0{
        top:0
    }
    .sm\:mx-0{
        margin-left:0;
        margin-right:0
    }
    .sm\:mb-0{
        margin-bottom:0
    }
    .sm\:h-\[35px\]{
        height:35px
    }
    .sm\:w-28{
        width:7rem
    }
    .sm\:w-\[35px\]{
        width:35px
    }
    .sm\:w-\[40\%\]{
        width:40%
    }
    .sm\:w-\[calc\(\(100\%-0\.5rem\*4\)\/5\)\]{
        width:calc((100% - 2rem)/5)
    }
    .sm\:w-\[calc\(\(100\%-8px\*2\)\/3\)\]{
        width:calc((100% - 16px)/3)
    }
    .sm\:w-\[calc\(\(100\%-theme\(gap\.2\)\*3\)\/4\)\]{
        width:calc((100% - 1.5rem)/4)
    }
    .sm\:w-auto{
        width:auto
    }
    .sm\:flex-grow{
        flex-grow:1
    }
    .sm\:grid-cols-3{
        grid-template-columns:repeat(3,minmax(0,1fr))
    }
    .sm\:grid-cols-6{
        grid-template-columns:repeat(6,minmax(0,1fr))
    }
    .sm\:flex-row{
        flex-direction:row
    }
    .sm\:items-center{
        align-items:center
    }
    .sm\:justify-center{
        justify-content:center
    }
    .sm\:gap-6{
        gap:1.5rem
    }
    .sm\:pl-6{
        padding-left:1.5rem
    }
    .sm\:pt-16{
        padding-top:4rem
    }
    .sm\:text-left{
        text-align:left
    }
}
@media (min-width:768px){
    .md\:mb-0{
        margin-bottom:0
    }
    .md\:block{
        display:block
    }
    .md\:flex{
        display:flex
    }
    .md\:hidden{
        display:none
    }
    .md\:w-1\/2{
        width:50%
    }
    .md\:w-\[40\%\]{
        width:40%
    }
    .md\:w-\[calc\(\(100\%-0\.5rem\*7\)\/8\)\]{
        width:calc((100% - 3.5rem)/8)
    }
    .md\:w-\[calc\(\(100\%-8px\*3\)\/4\)\]{
        width:calc((100% - 24px)/4)
    }
    .md\:w-\[calc\(\(100\%-theme\(gap\.2\)\*4\)\/5\)\]{
        width:calc((100% - 2rem)/5)
    }
    .md\:grid-cols-2{
        grid-template-columns:repeat(2,minmax(0,1fr))
    }
    .md\:grid-cols-3{
        grid-template-columns:repeat(3,minmax(0,1fr))
    }
    .md\:grid-cols-4{
        grid-template-columns:repeat(4,minmax(0,1fr))
    }
    .md\:flex-row{
        flex-direction:row
    }
    .md\:items-center{
        align-items:center
    }
    .md\:space-y-2>:not([hidden])~:not([hidden]){
        --tw-space-y-reverse:0;
        margin-top:calc(0.5rem*(1 - var(--tw-space-y-reverse)));
        margin-bottom:calc(0.5rem*var(--tw-space-y-reverse))
    }
    .md\:whitespace-nowrap{
        white-space:nowrap
    }
    .md\:p-12{
        padding:3rem
    }
    .md\:px-6{
        padding-left:1.5rem;
        padding-right:1.5rem
    }
    .md\:pt-16{
        padding-top:4rem
    }
    .md\:text-left{
        text-align:left
    }
    .md\:text-2xl{
        font-size:1.5rem;
        line-height:2rem
    }
}
@media (min-width:1024px){
    .lg\:left-1\/2{
        left:50%
    }
    .lg\:left-4{
        left:1rem
    }
    .lg\:col-span-12{
        grid-column:span 12/span 12
    }
    .lg\:mx-auto{
        margin-left:auto;
        margin-right:auto
    }
    .lg\:mb-16{
        margin-bottom:4rem
    }
    .lg\:mt-3{
        margin-top:.75rem
    }
    .lg\:block{
        display:block
    }
    .lg\:flex{
        display:flex
    }
    .lg\:grid{
        display:grid
    }
    .lg\:hidden{
        display:none
    }
    .lg\:aspect-\[16\/8\]{
        aspect-ratio:16/8
    }
    .lg\:aspect-\[2\/3\]{
        aspect-ratio:2/3
    }
    .lg\:h-\[400px\]{
        height:400px
    }
    .lg\:w-\[15\%\]{
        width:15%
    }
    .lg\:w-\[30\%\]{
        width:30%
    }
    .lg\:w-\[60\%\]{
        width:60%
    }
    .lg\:w-\[85\%\]{
        width:85%
    }
    .lg\:w-\[calc\(\(100\%-8px\*2\)\/3\)\]{
        width:calc((100% - 16px)/3)
    }
    .lg\:w-\[calc\(\(100\%-theme\(gap\.2\)\*5\)\/6\)\]{
        width:calc((100% - 2.5rem)/6)
    }
    .lg\:max-w-\[500px\]{
        max-width:500px
    }
    .lg\:max-w-screen-xl{
        max-width:1280px
    }
    .lg\:flex-1{
        flex:1 1 0%
    }
    .lg\:flex-\[3\]{
        flex:3
    }
    .lg\:flex-\[7\]{
        flex:7
    }
    .lg\:basis-\[30\%\]{
        flex-basis:30%
    }
    .lg\:basis-\[70\%\]{
        flex-basis:70%
    }
    .lg\:-translate-x-1\/2{
        --tw-translate-x:-50%
    }
    .lg\:-translate-x-1\/2,.lg\:translate-y-10{
        transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))
    }
    .lg\:translate-y-10{
        --tw-translate-y:2.5rem
    }
    .lg\:grid-cols-2{
        grid-template-columns:repeat(2,minmax(0,1fr))
    }
    .lg\:grid-cols-3{
        grid-template-columns:repeat(3,minmax(0,1fr))
    }
    .lg\:grid-cols-4{
        grid-template-columns:repeat(4,minmax(0,1fr))
    }
    .lg\:grid-cols-5{
        grid-template-columns:repeat(5,minmax(0,1fr))
    }
    .lg\:grid-cols-6{
        grid-template-columns:repeat(6,minmax(0,1fr))
    }
    .lg\:grid-cols-8{
        grid-template-columns:repeat(8,minmax(0,1fr))
    }
    .lg\:flex-row{
        flex-direction:row
    }
    .lg\:flex-row-reverse{
        flex-direction:row-reverse
    }
    .lg\:flex-col{
        flex-direction:column
    }
    .lg\:items-start{
        align-items:flex-start
    }
    .lg\:items-center{
        align-items:center
    }
    .lg\:justify-start{
        justify-content:flex-start
    }
    .lg\:gap-0{
        gap:0
    }
    .lg\:gap-10{
        gap:2.5rem
    }
    .lg\:gap-16{
        gap:4rem
    }
    .lg\:gap-2{
        gap:.5rem
    }
    .lg\:gap-2\.5{
        gap:.625rem
    }
    .lg\:gap-20{
        gap:5rem
    }
    .lg\:gap-4{
        gap:1rem
    }
    .lg\:rounded-none{
        border-radius:0
    }
    .lg\:rounded-bl-sm{
        border-bottom-left-radius:.125rem
    }
    .lg\:rounded-br-sm{
        border-bottom-right-radius:.125rem
    }
    .lg\:rounded-tl-sm{
        border-top-left-radius:.125rem
    }
    .lg\:rounded-tr-sm{
        border-top-right-radius:.125rem
    }
    .lg\:bg-\[\#1c1e24\]{
        --tw-bg-opacity:1;
        background-color:#191b24
    }
    .lg\:bg-gradient-to-r{
        background-image:linear-gradient(90deg,var(--tw-gradient-stops))
    }
    .lg\:p-4{
        padding:1rem
    }
    .lg\:px-0{
        padding-left:0;
        padding-right:0
    }
    .lg\:px-1{
        padding-left:.25rem;
        padding-right:.25rem
    }
    .lg\:px-10{
        padding-left:2.5rem;
        padding-right:2.5rem
    }
    .lg\:px-2{
        padding-left:.5rem;
        padding-right:.5rem
    }
    .lg\:px-4{
        padding-left:1rem;
        padding-right:1rem
    }
    .lg\:px-5{
        padding-left:1.25rem;
        padding-right:1.25rem
    }
    .lg\:px-6{
        padding-left:1.5rem;
        padding-right:1.5rem
    }
    .lg\:py-1{
        padding-top:.25rem;
        padding-bottom:.25rem
    }
    .lg\:py-20{
        padding-top:5rem;
        padding-bottom:5rem
    }
    .lg\:py-4{
        padding-top:1rem;
        padding-bottom:1rem
    }
    .lg\:py-8{
        padding-top:2rem;
        padding-bottom:2rem
    }
    .lg\:pt-20{
        padding-top:5rem
    }
    .lg\:text-2xl{
        font-size:1.5rem;
        line-height:2rem
    }
    .lg\:text-\[10px\]{
        font-size:10px
    }
    .lg\:text-sm{
        font-size:.875rem;
        line-height:1.25rem
    }
    .lg\:text-xl{
        font-size:1.25rem;
        line-height:1.75rem
    }
    .lg\:text-xs{
        font-size:.75rem;
        line-height:1rem
    }
}
@media (min-width:1280px){
    .xl\:flex{
        display:flex
    }
    .xl\:w-\[40\%\]{
        width:40%
    }
    .xl\:w-\[calc\(\(100\%-8px\*3\)\/4\)\]{
        width:calc((100% - 24px)/4)
    }
    .xl\:w-\[calc\(\(100\%-theme\(gap\.2\)\*6\)\/7\)\]{
        width:calc((100% - 3rem)/7)
    }
    .xl\:grid-cols-10{
        grid-template-columns:repeat(10,minmax(0,1fr))
    }
    .xl\:grid-cols-3{
        grid-template-columns:repeat(3,minmax(0,1fr))
    }
    .xl\:grid-cols-5{
        grid-template-columns:repeat(5,minmax(0,1fr))
    }
    .xl\:grid-cols-6{
        grid-template-columns:repeat(6,minmax(0,1fr))
    }
    .xl\:text-sm{
        font-size:.875rem;
        line-height:1.25rem
    }
}
@media (min-width:1536px){
    .\32xl\:h-\[80px\]{
        height:80px
    }
    .\32xl\:w-\[55px\]{
        width:55px
    }
}
.page-title{
    position:relative;
    margin:28px 0 22px;
    padding:14px 18px;
    font-size:28px;
    font-weight:800;
    line-height:1.35;
    letter-spacing:.4px;
    color:#fff!important;
    background:linear-gradient(90deg,rgba(56,189,248,.18),rgba(56,189,248,.04));
    border-left:4px solid #38bdf8;
    border-radius:10px;
    text-shadow:0 2px 10px rgba(0,0,0,.6);
    box-shadow:inset 0 0 0 1px hsla(0,0%,100%,.05),0 12px 30px rgba(0,0,0,.45)
}
.page-title:after{
    content:"";
    position:absolute;
    left:18px;
    bottom:-10px;
    width:80px;
    height:3px;
    background:linear-gradient(90deg,#38bdf8,transparent);
    border-radius:3px
}
.noidung{
    color:#e5e7eb!important;
    font-size:15.5px;
    line-height:1.9;
    letter-spacing:.2px;
    background:linear-gradient(180deg,rgba(20,22,28,.9),rgba(12,14,18,.95));
    padding:26px 22px;
    border-radius:14px;
    box-shadow:inset 0 0 0 1px hsla(0,0%,100%,.05),0 20px 40px rgba(0,0,0,.45);
    backdrop-filter:blur(6px)
}
.noidung *{
    box-sizing:border-box;
    max-width:100%
}
.noidung h1,.noidung h2,.noidung h3,.noidung h4{
    color:#fff;
    font-weight:700;
    margin:26px 0 14px;
    line-height:1.4
}
.noidung h1{
    font-size:26px
}
.noidung h2{
    font-size:22px
}
.noidung h3{
    font-size:18px
}
.noidung p{
    margin-bottom:14px;
    color:#d1d5db
}
.noidung ol,.noidung ul{
    margin:12px 0 18px 22px
}
.noidung li{
    margin-bottom:8px;
    color:#cbd5e1
}
.noidung ul li::marker{
    color:#38bdf8
}
.noidung a{
    color:#38bdf8;
    text-decoration:none
}
.noidung a:hover{
    color:#7dd3fc;
    text-decoration:underline
}
.noidung strong{
    color:#fff;
    font-weight:600
}
@media (max-width:768px){
    .page-title{
        margin:20px 0 16px;
        padding:12px 14px;
        font-size:20px;
        line-height:1.3;
        letter-spacing:.2px;
        border-left-width:3px;
        text-shadow:0 1px 6px rgba(0,0,0,.45);
        box-shadow:inset 0 0 0 1px hsla(0,0%,100%,.04),0 8px 20px rgba(0,0,0,.35)
    }
    .page-title:after{
        left:14px;
        bottom:-8px;
        width:56px;
        height:2.5px
    }
    .noidung{
        padding:18px 14px;
        font-size:14.8px;
        line-height:1.75;
        letter-spacing:.15px;
        box-shadow:inset 0 0 0 1px hsla(0,0%,100%,.04),0 12px 24px rgba(0,0,0,.35);
        backdrop-filter:blur(4px)
    }
    .noidung h1{
        font-size:22px;
        margin:22px 0 12px
    }
    .noidung h2{
        font-size:19px;
        margin:20px 0 10px
    }
    .noidung h3{
        font-size:16.5px;
        margin:18px 0 8px
    }
    .noidung p{
        margin-bottom:12px
    }
    .noidung ol,.noidung ul{
        margin:10px 0 16px 18px
    }
    .noidung li{
        margin-bottom:6px
    }
}
.section-heading{
    position:relative;
    margin-bottom:14px
}
.section-title{
    display:inline-block;
    font-size:1.4rem;
    font-weight:800;
    text-transform:uppercase;
    letter-spacing:.8px;
    color:#fff;
    line-height:1.2;
    padding-bottom:6px
}
.section-title:after{
    content:"";
    display:block;
    margin-top:6px;
    width:72%;
    height:3px;
    background:linear-gradient(90deg,#f59e0b,#f97316);
    border-radius:2px
}
@media (min-width:1024px){
    .section-title{
        font-size:1.55rem
    }
}
.page-404-xemphim{
    min-height:100vh;
    padding:80px 15px 60px;
    background:radial-gradient(1200px 600px at 50% -200px,rgba(250,204,21,.12),transparent 60%),linear-gradient(180deg,#020617,#020617);
    color:#e5e7eb
}
.error-box-xemphim{
    max-width:760px;
    margin:0 auto 60px;
    padding:48px 40px;
    text-align:center;
    background:linear-gradient(180deg,rgba(15,23,42,.9),rgba(2,6,23,.95));
    border-radius:22px;
    box-shadow:0 30px 60px rgba(0,0,0,.6),inset 0 1px 0 hsla(0,0%,100%,.05);
    position:relative;
    overflow:hidden
}
.error-box-xemphim:before{
    content:"";
    position:absolute;
    inset:0;
    background:radial-gradient(600px 300px at 50% 0,rgba(250,204,21,.18),transparent 60%);
    pointer-events:none
}
.error-code{
    font-size:104px;
    font-weight:900;
    letter-spacing:2px;
    line-height:1;
    margin-bottom:12px;
    background:linear-gradient(180deg,#fde047,#f59e0b);
    -webkit-background-clip:text;
    -webkit-text-fill-color:transparent
}
.error-title{
    font-size:28px;
    font-weight:700;
    margin-bottom:14px;
    color:#f8fafc
}
.error-desc{
    font-size:15px;
    line-height:1.7;
    color:#94a3b8;
    max-width:520px;
    margin:0 auto 28px
}
.xemphim-badge{
    position:absolute;
    top:10px;
    padding:4px 10px;
    font-size:12px;
    font-weight:700;
    line-height:1.2;
    border-radius:999px;
    color:#020617;
    z-index:3;
    backdrop-filter:blur(6px);
    box-shadow:0 4px 12px rgba(0,0,0,.35);
    white-space:nowrap
}
.xemphim-quality{
    left:10px;
    background:linear-gradient(135deg,#facc15,#ca8a04);
    color:#111
}
.xemphim-lang{
    right:10px;
    background:linear-gradient(135deg,#2563eb,#1e40af);
    color:#fff
}
.error-btn{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:8px;
    padding:14px 34px;
    font-size:14px;
    font-weight:600;
    color:#020617;
    background:linear-gradient(180deg,#38bdf8,#0284c7);
    border-radius:999px;
    text-decoration:none;
    transition:all .3s ease;
    box-shadow:0 12px 30px rgba(56,189,248,.35)
}
.error-btn:hover{
    transform:translateY(-2px);
    box-shadow:0 18px 40px rgba(56,189,248,.45)
}
.suggest-404{
    max-width:1240px;
    margin:0 auto
}
.suggest-title{
    font-size:22px;
    font-weight:700;
    margin-bottom:28px;
    color:#f8fafc;
    text-align:left
}
.suggest-grid{
    display:grid;
    grid-template-columns:repeat(4,1fr);
    gap:26px
}
.suggest-item{
    background:linear-gradient(180deg,rgba(15,23,42,.9),rgba(2,6,23,.95));
    border-radius:16px;
    overflow:hidden;
    transition:transform .35s ease,box-shadow .35s ease;
    box-shadow:0 12px 30px rgba(0,0,0,.55),inset 0 1px 0 hsla(0,0%,100%,.04)
}
.suggest-item:hover{
    transform:translateY(-10px);
    box-shadow:0 22px 50px rgba(0,0,0,.75)
}
.suggest-thumb{
    position:relative;
    display:block;
    aspect-ratio:2/3;
    overflow:hidden
}
.suggest-thumb img{
    width:100%;
    height:100%;
    object-fit:cover;
    transition:transform .5s ease
}
.suggest-item:hover .suggest-thumb img{
    transform:scale(1.08)
}
.suggest-thumb:after{
    content:"";
    position:absolute;
    inset:0;
    background:linear-gradient(180deg,transparent 55%,rgba(2,6,23,.85))
}
.suggest-name{
    padding:14px 14px 16px;
    font-size:14px;
    font-weight:600;
    line-height:1.4;
    text-align:center;
    background:#31394f
}
.suggest-name a{
    color:#e5e7eb;
    text-decoration:none;
    transition:color .25s ease
}
.suggest-name a:hover{
    color:#fde047
}
@media (max-width:1200px){
    .suggest-grid{
        grid-template-columns:repeat(3,1fr)
    }
}
@media (max-width:768px){
    .page-404-xemphim{
        padding-top:60px
    }
    .error-box-xemphim{
        padding:36px 26px
    }
    .error-code{
        font-size:78px
    }
    .suggest-grid{
        grid-template-columns:repeat(2,1fr);
        gap:18px
    }
}
@media (max-width:480px){
    .suggest-title{
        text-align:center
    }
    .error-title{
        font-size:22px
    }
}
.contact-page-inner{
    width:100%;
    padding:24px 0;
    box-sizing:border-box
}
.contact-two-col{
    display:flex;
    gap:32px;
    align-items:flex-start
}
.contact-left{
    flex:1.4
}
.contact-title{
    font-size:2rem;
    margin-bottom:8px
}
.contact-desc{
    color:#b5b5b5;
    margin-bottom:24px
}
.contact-box{
    background:hsla(0,0%,100%,.04);
    border-radius:16px;
    padding:24px
}
.contact-box h2{
    margin-bottom:16px
}
.contact-list{
    list-style:none;
    padding:0;
    margin:0
}
.contact-list li{
    margin-bottom:12px
}
.contact-list .label{
    min-width:130px;
    display:inline-block;
    color:#9ca3af
}
.contact-box a{
    color:#ff7e08;
    font-weight:600
}
.contact-note{
    margin-top:20px;
    padding:16px;
    background:rgba(255,126,8,.12);
    border-left:4px solid #ff7e08;
    border-radius:10px
}
.contact-social-box{
    flex:1;
    background:hsla(0,0%,100%,.035);
    border-radius:16px;
    padding:24px
}
.contact-social-title{
    font-size:1.35rem;
    margin-bottom:6px
}
.contact-social-desc{
    font-size:.95rem;
    color:#9ca3af;
    margin-bottom:22px
}
.contact-social-list{
    display:grid;
    grid-template-columns:repeat(2,1fr);
    gap:14px
}
.contact-social-item{
    height:56px;
    border-radius:14px;
    background:linear-gradient(180deg,hsla(0,0%,100%,.08),hsla(0,0%,100%,.03));
    display:flex;
    align-items:center;
    justify-content:center;
    transition:all .25s ease;
    overflow:hidden
}
.contact-social-item img{
    width:30px;
    height:30px;
    filter:brightness(0) invert(1);
    opacity:.85;
    transition:all .25s ease
}
.contact-social-item:hover{
    transform:translateY(-3px)
}
.contact-social-item:hover img{
    opacity:1;
    filter:none
}
.contact-social-item.telegram:hover{
    background:linear-gradient(135deg,#2aabee,#229ed9)
}
.contact-social-item.discord:hover{
    background:linear-gradient(135deg,#5865f2,#4752c4)
}
.contact-social-item.x:hover{
    background:linear-gradient(135deg,#111,#000)
}
.contact-social-item.facebook:hover{
    background:linear-gradient(135deg,#1877f2,#0f5bd8)
}
.contact-social-item.tiktok:hover{
    background:linear-gradient(135deg,#000,#111)
}
.contact-social-item.youtube:hover{
    background:linear-gradient(135deg,red,#c00)
}
.contact-social-item.threads:hover{
    background:linear-gradient(135deg,#000,#222)
}
.contact-social-item.instagram:hover{
    background:linear-gradient(135deg,#f58529,#dd2a7b,#8134af,#515bd4)
}
@media (max-width:768px){
    .contact-two-col{
        flex-direction:column
    }
    .contact-social-list{
        grid-template-columns:repeat(4,1fr)
    }
}
.dmca-page-inner{
    width:100%;
    padding:24px 0;
    box-sizing:border-box
}
.dmca-two-col{
    display:flex;
    gap:32px;
    align-items:flex-start
}
.dmca-left{
    flex:1.5
}
.dmca-title{
    font-size:2rem;
    margin-bottom:8px
}
.dmca-desc{
    color:#b5b5b5;
    margin-bottom:24px
}
.dmca-box{
    background:hsla(0,0%,100%,.04);
    border-radius:16px;
    padding:24px
}
.dmca-box h2{
    margin-bottom:16px
}
.dmca-box h3{
    margin-top:20px;
    margin-bottom:10px
}
.dmca-box p{
    margin-bottom:12px;
    line-height:1.7
}
.dmca-list{
    padding-left:18px;
    margin-bottom:16px
}
.dmca-list li{
    margin-bottom:8px;
    color:#e5e5e5
}
.dmca-note{
    margin-top:20px;
    padding:16px;
    background:rgba(255,126,8,.12);
    border-left:4px solid #ff7e08;
    border-radius:10px;
    color:#d1d5db
}
.dmca-right{
    flex:1;
    background:hsla(0,0%,100%,.035);
    border-radius:16px;
    padding:24px
}
.dmca-contact-title{
    font-size:1.35rem;
    margin-bottom:6px
}
.dmca-contact-desc{
    font-size:.95rem;
    color:#9ca3af;
    margin-bottom:20px
}
.dmca-contact-box{
    background:hsla(0,0%,100%,.04);
    border-radius:12px;
    padding:18px
}
.dmca-contact-item{
    margin-bottom:12px
}
.dmca-contact-item .label{
    display:inline-block;
    min-width:130px;
    color:#9ca3af
}
.dmca-contact-box a{
    color:#ff7e08;
    font-weight:600
}
@media (max-width:768px){
    .dmca-two-col{
        flex-direction:column
    }
}
.phim-logo img{
    max-width:250px!important;
    height:40px;
    width:auto;
    object-fit:contain
}
.gx-header-links{
    display:flex;
    align-items:center;
    justify-content:center;
    gap:12px;
    padding:14px 16px;
    overflow-x:auto;
    border-radius:16px;
    scrollbar-width:none
}
.gx-header-links::-webkit-scrollbar{
    display:none
}
.gx-btn{
    position:relative;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    padding:10px 20px;
    min-height:44px;
    font-size:14px;
    font-weight:600;
    letter-spacing:.3px;
    color:#fff;
    text-decoration:none;
    white-space:nowrap;
    border-radius:999px;
    border:1px solid hsla(0,0%,100%,.06);
    transition:all .25s ease
}
.gx-btn:hover{
    transform:translateY(-2px);
    box-shadow:0 8px 24px rgba(0,0,0,.5);
    border-color:hsla(0,0%,100%,.15)
}
.gx-btn:hover:after{
    opacity:1
}
.gx-btn:active{
    transform:scale(.96)
}
.gx-style-1{
    background:linear-gradient(135deg,#ff8a00,#ff3d00)
}
.gx-style-2{
    background:linear-gradient(135deg,#00c6ff,#0072ff)
}
.gx-style-3{
    background:linear-gradient(135deg,#2b2f3a,#0f1117)
}
.gx-style-4{
    background:linear-gradient(135deg,#ff4e50,#b31217)
}
.gx-style-5{
    background:linear-gradient(135deg,#ffd200,#f7971e);
    color:#111
}
@media (max-width:768px){
    .gx-header-links{
        flex-wrap:nowrap!important;
        justify-content:flex-start!important;
        overflow-x:auto!important;
        gap:8px;
        padding:10px;
        -webkit-overflow-scrolling:touch
    }
    .gx-btn{
        flex:0 0 auto!important;
        padding:2px 4px!important;
        min-height:32px!important
    }
}
@media (max-width:768px){
    .gx-header-links .gx-btn{
        color:transparent!important;
        position:relative!important
    }
    .gx-header-links .gx-btn:before{
        content:"";
        position:absolute;
        inset:0;
        display:flex;
        align-items:center;
        justify-content:center;
        font-size:13px;
        font-weight:600;
        white-space:nowrap;
        color:#fff
    }
    .gx-header-links .gx-style-1:before{
        content:"Nhóm Kín"
    }
    .gx-header-links .gx-style-2:before{
        content:"Telegram"
    }
    .gx-header-links .gx-style-3{
        display:none
    }
    .gx-header-links .gx-style-3:before{
        content:"X"
    }
    .gx-header-links .gx-style-4:before{
        content:"Gái Gú"
    }
    .gx-header-links .gx-style-5:before{
        content:"Nhà Cái";
        color:#111
    }
}
.about-page{
    max-width:1200px;
    margin:0 auto;
    padding:60px 16px;
    color:#e5e5e5;
    line-height:1.7
}
.about-hero{
    text-align:center;
    margin-bottom:60px
}
.about-hero h1{
    font-size:2.4rem;
    font-weight:700
}
.about-hero-desc{
    max-width:760px;
    margin:16px auto 0;
    color:#b5b5b5
}
.about-cover{
    position:relative;
    border-radius:16px;
    overflow:hidden;
    margin-bottom:80px
}
.about-cover img{
    width:100%;
    height:420px;
    object-fit:cover;
    object-position:top center;
    filter:brightness(.6)
}
.about-cover-content{
    position:absolute;
    bottom:0;
    padding:32px;
    background:linear-gradient(0deg,rgba(0,0,0,.75),transparent)
}
.about-cover-content h2{
    font-size:1.8rem;
    margin-bottom:8px
}
.about-section{
    margin-bottom:80px
}
.about-section h2{
    font-size:1.8rem;
    margin-bottom:24px
}
.about-section h3{
    margin-top:32px;
    margin-bottom:12px
}
.about-box{
    background:hsla(0,0%,100%,.04);
    border-radius:14px;
    padding:28px
}
.about-box ul{
    padding-left:20px
}
.about-box li{
    margin-bottom:8px
}
.about-grid{
    display:grid;
    grid-template-columns:repeat(auto-fit,minmax(260px,1fr));
    gap:24px;
    margin-bottom:80px
}
.about-card{
    background:hsla(0,0%,100%,.04);
    border-radius:14px;
    padding:24px
}
.about-stats{
    display:grid;
    grid-template-columns:repeat(4,1fr);
    gap:20px;
    margin-bottom:80px
}
.about-stats div{
    background:hsla(0,0%,100%,.04);
    border-radius:14px;
    text-align:center;
    padding:24px
}
.about-stats strong{
    font-size:2rem;
    color:#ff7e08
}
.about-cta{
    background:rgba(255,126,8,.1);
    border-radius:20px;
    padding:48px 24px;
    text-align:center
}
.about-actions{
    margin-top:24px;
    display:flex;
    gap:16px;
    justify-content:center;
    flex-wrap:wrap
}
.about-actions a{
    background:#ff7e08;
    color:#000;
    padding:12px 26px;
    border-radius:999px;
    font-weight:600
}
.about-actions a:hover{
    opacity:.9
}
.about-link{
    color:#ff7e08;
    font-weight:600
}
@media (max-width:768px){
    .about-page{
        padding:40px 14px;
        line-height:1.65
    }
    .about-hero{
        margin-bottom:40px
    }
    .about-hero h1{
        font-size:1.9rem;
        line-height:1.3
    }
    .about-hero-desc{
        margin-top:12px;
        font-size:.95rem
    }
    .about-cover{
        margin-bottom:48px;
        border-radius:14px
    }
    .about-cover img{
        height:260px;
        object-position:center top
    }
    .about-cover-content{
        padding:20px 16px
    }
    .about-cover-content h2{
        font-size:1.4rem
    }
    .about-section{
        margin-bottom:48px
    }
    .about-section h2{
        font-size:1.4rem;
        margin-bottom:18px
    }
    .about-section h3{
        font-size:1.1rem;
        margin-top:24px;
        margin-bottom:10px
    }
    .about-box{
        padding:20px 16px;
        border-radius:12px
    }
    .about-box ul{
        padding-left:18px
    }
    .about-grid{
        grid-template-columns:1fr;
        gap:18px;
        margin-bottom:48px
    }
    .about-card{
        padding:18px;
        border-radius:12px
    }
    .about-stats{
        grid-template-columns:repeat(2,1fr);
        gap:14px;
        margin-bottom:48px
    }
    .about-stats div{
        padding:18px 14px;
        border-radius:12px
    }
    .about-stats strong{
        font-size:1.6rem
    }
    .about-cta{
        padding:32px 16px;
        border-radius:16px
    }
    .about-actions{
        margin-top:18px;
        gap:12px
    }
    .about-actions a{
        padding:10px 22px;
        font-size:.95rem
    }
}
.ophim-detail{
    color:#e5e7eb;
    font-size:13px
}
.opdp-poster{
    position:relative;
    width:100%;
    aspect-ratio:16/9;
    overflow:hidden;
    transition:all .3s ease
}
@media (min-width:1024px){
    .opdp-poster{
        aspect-ratio:2/3;
        border-radius:6px
    }
}
.opdp-poster-img{
    position:absolute;
    inset:0;
    width:100%;
    height:100%;
    object-fit:cover;
    object-position:center;
    brightness:1.1
}
.opdp-poster-img.is-mobile{
    display:block;
    -webkit-mask-image:linear-gradient(180deg,hsla(0,0%,100%,.95) 50%,rgba(17,19,25,0));
    mask-image:linear-gradient(180deg,hsla(0,0%,100%,.95) 50%,rgba(17,19,25,0))
}
.opdp-poster-img.is-desktop{
    display:none;
    border-radius:6px
}
@media (min-width:1024px){
    .opdp-poster-img.is-mobile{
        display:none
    }
    .opdp-poster-img.is-desktop{
        display:block
    }
}
.opdp-poster-overlay{
    pointer-events:none;
    position:absolute;
    inset:0;
    background:linear-gradient(0deg,rgba(30,30,30,.25),transparent 60%)
}
@media (max-width:1023px){
    .poster-mobile-full{
        position:relative;
        width:100vw;
        max-width:100vw;
        margin-left:calc(50% - 50vw);
        margin-right:calc(50% - 50vw);
        padding-left:0!important;
        padding-right:0!important
    }
    .poster-mobile-full img{
        border-radius:0 !important;
        border: 0 !important;
    }
}
.ophim-header{
    display:flex;
    flex-direction:column;
    gap:10px;
    margin-bottom:5px
}
.ophim-title{
    font-weight:600;
    color:#ddd9ce;
    text-shadow:0 1px 0 rgba(0,0,0,.6),0 0 12px rgba(230,199,106,.15)
}
#movie-title,.ophim-title{
    font-size:26px
}
.ophim-title-year{
    margin-left:10px;
    font-size:26px;
    font-weight:600;
    color:#9ca3af;
    opacity:.85;
    padding:2px 8px;
    border-radius:6px;
    background:hsla(0,0%,100%,.08)
}
.ophim-origin-title{
    font-size:16px;
    font-weight:500;
    color:#f9fafb;
    opacity:.9
}
.ophim-origin-title:before{
    content:"❝";
    font-size:16px;
    opacity:.8;
    margin-right:4px
}
.ophim-origin-title:after{
    content:"❞";
    font-size:16px;
    opacity:.8;
    margin-left:4px
}
.ophim-origin-title:after,.ophim-origin-title:before{
    color:hsla(0,0%,100%,.6);
    font-weight:600
}
.ophim-episode-bar{
    display:flex;
    align-items:center;
    gap:10px;
    flex-wrap:wrap
}
.ep-current{
    display:inline-flex;
    align-items:center;
    gap:6px;
    font-weight:600;
    font-size:13px;
    padding:6px 14px;
    border-radius:999px;
    white-space:nowrap;
    border:1px solid #200808!important
}
.ep-current:before{
    content:"▶";
    font-size:11px;
    opacity:.85
}
.ep-separator{
    width:1px;
    height:18px;
    background:linear-gradient(180deg,transparent,hsla(0,0%,100%,.25),transparent)
}
.ep-total{
    display:inline-flex;
    align-items:center;
    gap:6px;
    font-size:13px;
    font-weight:500;
    color:#e5e7eb;
    padding:6px 14px;
    border-radius:999px;
    white-space:nowrap;
    background:hsla(0,0%,100%,.04);
    border:1px solid hsla(0,0%,100%,.18);
    backdrop-filter:blur(6px)
}
.ep-total:before{
    content:"≡";
    font-size:12px;
    opacity:.7
}
.ep-current:hover{
    filter:brightness(1.05)
}
.ep-total:hover{
    background:hsla(0,0%,100%,.07)
}
@media (max-width:480px){
    .ep-current,.ep-total{
        font-size:12px;
        padding:5px 12px
    }
}
@media (max-width:768px){
    #movie-title,.ophim-title{
        font-size:21px
    }
    .ophim-title-year{
        font-size:21px;
        margin-left:3px
    }
    .ophim-origin-title{
        font-size:14px
    }
    .ep-separator{
        display:none
    }
}
.ophim-poster{
    width:300px;
    max-width:90%;
    margin:0 auto;
    height:auto;
    position:relative;
    object-fit:cover;
    border-radius:16px;
    border:1px solid #6d6969;
    filter:drop-shadow(4px 4px 0 #000000);
    will-change:transform,box-shadow,filter;
    transition:transform .4s cubic-bezier(.2,.8,.2,1),box-shadow .4s ease,filter .4s ease
}
@media (hover:hover){
    .ophim-poster:hover{
        transform:translate(-6px,6px) scale(1);
        box-shadow:6px 4px 9px hsla(0,0%,80.8%,.35);
        filter:drop-shadow(2px 2px 0 #fff)
    }
}
.ophim-poster:after{
    inset:-15%;
    border-radius:inherit;
    background:linear-gradient(135deg,hsla(0,0%,100%,.45),hsla(0,0%,100%,.18) 30%,hsla(0,0%,100%,.08) 45%,hsla(0,0%,100%,0) 60%);
    mix-blend-mode:overlay;
    opacity:.85;
    transform:skewX(-12deg) rotate(-3deg)
}
.ophim-poster:after,.ophim-poster:before{
    content:"";
    position:absolute;
    pointer-events:none
}
.ophim-poster:before{
    left:0;
    right:0;
    bottom:-55%;
    height:55%;
    background-image:inherit;
    background-size:cover;
    background-position:50%;
    transform:scaleY(-1) skewX(-8deg);
    opacity:.35;
    filter:blur(2px);
    mask-image:linear-gradient(180deg,hsla(0,0%,100%,.6),hsla(0,0%,100%,0));
    -webkit-mask-image:linear-gradient(180deg,hsla(0,0%,100%,.6),hsla(0,0%,100%,0))
}
.ophim-detail__info{
    width:100%;
    display:flex;
    flex-direction:column;
    gap:16px
}
@media (min-width:1024px){
    .ophim-detail__info{
        width:85%
    }
}
.mv2{
    color:#e5e7eb
}
.mv2-title{
    font-size:26px;
    font-weight:700;
    font-family: "Quicksand",sans-serif;
}
.mv2-origin,.mv2-year{
    color:#9ca3af
}
.mv2-origin{
    font-size:14px
}
.mv2-origin:before{
    content:"❝";
    font-size:14px;
    opacity:.8;
    margin-right:4px
}
.mv2-origin:after{
    content:"❞";
    font-size:14px;
    opacity:.8;
    margin-left:4px
}
.mv2-meta{
    margin-top:12px
}
.mv2-row{
    display:flex;
    flex-wrap:wrap;
    gap:8px;
    margin-bottom:8px
}
.mv2-item{
    display:flex;
    align-items:center;
    border-radius:8px;
    overflow:hidden;
    font-size:12px;
    background:hsla(0,0%,100%,.05);
    border:1px solid #000;
    backdrop-filter:blur(6px)
}
.mv2-label{
    background:#2a2a2a;
    color:#aaa;
    padding:6px
}
.mv2-value{
    padding:6px 8px;
    font-weight:600;
    color:#fff
}
.mv2-row--inline{
    display:flex;
    flex-wrap:nowrap;
    gap:8px;
    padding-bottom:4px
}
.mv2-row--inline .mv2-item{
    flex:0 0 auto
}
.mv2-label,.mv2-value{
    white-space:nowrap
}
.mv2-rating.is-imdb .mv2-value{
    background:#f5c518;
    color:#111
}
.mv2-rating.is-tmdb .mv2-value{
    background:#01b4e4;
    color:#001
}
.mv2-item.is-year .mv2-value{
    background:linear-gradient(135deg,#da644e,red)
}
.mv2-item.is-lang .mv2-value{
    background:linear-gradient(180deg,#8b5cf6,#6d28d9)
}
.mv2-item.is-ep .mv2-value{
    background:linear-gradient(180deg,#3b82f6,#1d4ed8)
}
.mv2-group{
    margin-top:14px
}
.mv2-group-title{
    font-size:13px;
    color:#9ca3af;
    margin-bottom:6px;
    text-transform:uppercase;
    font-weight: 700;
}
.mv2-tags{
    display:flex;
    flex-wrap:wrap;
    gap:6px
}
.mv2-tags a{
    padding:6px 12px;
    border-radius:8px;
    background:hsla(0,0%,100%,.06);
    border:1px solid hsla(0,0%,100%,.1);
    color:#e5e7eb;
    font-weight: 600;
    text-decoration:none;
    transition:.2s
}
.mv2-tags a:hover{
    background:#111;
    border-color:hsla(0,0%,100%,.2)
}
@media (max-width:768px){
    .mv2-title{
        font-size:20px
    }
    .mv2-item{
        font-size:12px
    }
}
.ophim-detail__content{
    margin-top:24px;
    max-width:720px
}
.content-header h2{
    font-size:16px;
    font-weight:600;
    margin-bottom:10px;
    color:#fff
}
.content-body{
    position:relative
}
.content-text{
    font-size:15px;
    line-height:1.7;
    color:hsla(0,0%,100%,.85);
    transition:max-height .3s ease
}
@media (max-width:768px){
    .ophim-detail__content{
        max-width:100%
    }
    .content-text{
        font-size:14px
    }
}
.opbc-wrap{
    position: relative;
    max-width: 100%;
    padding: 14px 18px;
    border-radius: 8px;
    background: linear-gradient(90deg,#2d2d2d,#1e1c1c);
    backdrop-filter: blur(14px);
    border: 1px solid #2e2f30;
    box-shadow: 0 15px 40px rgba(106, 106, 106, 0.6);
}
.opbc-wrap:after{
    content:"";
    position:absolute;
    inset:0;
    border-radius:inherit;
    pointer-events:none;
    box-shadow:0 0 0 1px hsla(0,0%,100%,.04)
}
.opbc-list{
    display:flex;
    align-items:center;
    flex-wrap:wrap;
    gap:10px;
    list-style:none;
    margin:0;
    padding:0;
    font-size:14px;
    line-height:1.4
}
.opbc-item{
    display:inline-flex;
    align-items:center;
    gap:6px;
    white-space:nowrap
}
.opbc-sep{
    width:18px;
    height:1px;
    background:linear-gradient(90deg,transparent,hsla(0,0%,100%,.35),transparent);
    opacity:.4
}
.opbc-link{
    color:hsla(0,0%,100%,.65);
    text-decoration:none;
    transition:color .2s ease
}
.opbc-link:hover{
    color:#fff
}
.opbc-home{
    display:flex;
    align-items:center;
    gap:6px
}
.opbc-icon{
    display:inline-flex;
    align-items:center
}
.opbc-home .opbc-dot{
    width:9px;
    height:9px;
    border-radius:50%;
    background:radial-gradient(circle at 30% 30%,#ffe39a,#c9a84e);
    box-shadow:0 0 8px rgba(255,216,106,.45)
}
.opbc-category .opbc-link{
    font-weight:500;
    color:hsla(0,0%,100%,.75)
}
.opbc-label{
    font-size:12.5px;
    color:hsla(0,0%,100%,.45);
    letter-spacing:.3px
}
.opbc-colon{
    color:hsla(0,0%,100%,.35);
    margin:0 2px
}
.opbc-link.is-current{
    color:#fff;
    font-weight:600;
    text-shadow:0 1px 0 rgba(0,0,0,.6)
}
.opbc-episode{
    padding-left:6px
}
.opbc-ep-badge{
    padding:4px 10px;
    border-radius:999px;
    font-size:12.5px;
    font-weight:500;
    color:hsla(0,0%,100%,.9);
    background:linear-gradient(180deg,hsla(0,0%,100%,.14),hsla(0,0%,100%,.06));
    border:1px solid hsla(0,0%,100%,.25);
    box-shadow:inset 0 1px 0 hsla(0,0%,100%,.2)
}
.opbc-icon{
    font-size:14px;
    line-height:1;
    opacity:.65;
    margin-right:4px;
    transform:translateY(1px)
}
.opbc-icon+.is-current,.opbc-item .is-current+.opbc-icon{
    opacity:.85
}
@media (max-width:768px){
    .opbc-wrap{
        padding:10px 12px;
        border-radius:10px
    }
    .opbc-list{
        font-size:13px;
        gap:6px
    }
    .opbc-ep-badge{
        font-size:12px;
        padding:3px 8px
    }
}
.op-cta-group{
    display:flex;
    gap:12px;
    width:100%
}
@media (max-width:640px){
    .op-cta-group{
        gap:10px
    }
}
.op-btn{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:8px;
    width:100%;
    max-width:320px;
    padding:14px 22px;
    border-radius:12px;
    font-size:15px;
    font-weight:700;
    letter-spacing:.2px;
    white-space:nowrap;
    text-decoration:none;
    cursor:pointer;
    user-select:none;
    transition:transform .15s ease,box-shadow .2s ease,filter .2s ease
}
.op-btn-red{
    color:#fff;
    background:linear-gradient(180deg,var(--op-red-1),var(--op-red-2));
    box-shadow:0 10px 26px rgba(239,68,68,.45),inset 0 1px 0 hsla(0,0%,100%,.25)
}
.op-btn-red:hover{
    transform:translateY(-1px);
    filter:brightness(1.05);
    box-shadow:0 14px 34px rgba(239,68,68,.6)
}
.op-btn-red:active{
    transform:translateY(0);
    box-shadow:0 6px 16px rgba(239,68,68,.45),inset 0 2px 6px rgba(0,0,0,.25)
}
.op-btn-blue{
    color:#fff;
    background:linear-gradient(180deg,var(--op-blue-1),var(--op-blue-2));
    box-shadow:0 10px 26px rgba(59,130,246,.45),inset 0 1px 0 hsla(0,0%,100%,.25)
}
.op-btn-blue:hover{
    transform:translateY(-1px);
    filter:brightness(1.05);
    box-shadow:0 14px 34px rgba(59,130,246,.6)
}
.op-btn-blue:active{
    transform:translateY(0)
}
.op-btn-yellow{
    color:#fff;
    background:#4f4a4a;
    box-shadow:0 10px 26px rgba(234,179,8,.45),inset 0 1px 0 hsla(0,0%,100%,.45)
}
.op-btn-yellow:hover{
    transform:translateY(-1px);
    filter:brightness(1.05);
    box-shadow:0 14px 34px rgba(234,179,8,.6)
}
.op-btn-yellow:active{
    transform:translateY(0)
}
.op-btn.is-disabled{
    pointer-events:none;
    cursor:default;
    filter:grayscale(60%) brightness(.85);
    box-shadow:0 4px 12px rgba(0,0,0,.4),inset 0 1px 0 hsla(0,0%,100%,.2)
}
.op-btn.is-disabled:after{
    content:"...";
    text-transform:uppercase;
    font-size:11px;
    font-weight:700;
    letter-spacing:.6px;
    margin-left:6px;
    opacity:.75
}
.op-btn svg{
    width:18px;
    height:18px;
    fill:currentColor;
    flex-shrink:0
}
@media (max-width:640px){
    .op-btn-primary,.op-btn-secondary{
        max-width:none;
        padding:11px 14px;
        font-size:14px
    }
    .op-btn-primary svg,.op-btn-secondary svg{
        width:16px;
        height:16px
    }
}
@media (min-width:1024px){
    .op-btn-primary,.op-btn-secondary{
        padding:10px 18px;
        font-size:14.5px;
        border-radius:9px
    }
    .op-btn-primary svg,.op-btn-secondary svg{
        width:17px;
        height:17px
    }
}
.op-social-wrap{
    margin-top:14px
}
.op-social-list{
    display:flex;
    align-items:center;
    flex-wrap:wrap;
    gap:10px
}
.op-social-item{
    width:36px;
    height:36px;
    display:flex;
    align-items:center;
    justify-content:center;
    border-radius:50%;
    background:hsla(0,0%,100%,.06);
    box-shadow:inset 0 0 0 1px hsla(0,0%,100%,.08);
    transition:background .2s ease,transform .15s ease,box-shadow .2s ease
}
.op-social-item img{
    width:18px;
    height:18px;
    object-fit:contain;
    opacity:.85;
    transition:opacity .2s ease
}
.op-social-item:hover{
    background:hsla(0,0%,100%,.12);
    transform:translateY(-1px);
    box-shadow:inset 0 0 0 1px hsla(0,0%,100%,.15),0 6px 16px rgba(0,0,0,.35)
}
.op-social-item:hover img{
    opacity:1
}
.op-social-item:focus-visible{
    outline:none;
    box-shadow:0 0 0 2px rgba(60,212,90,.6),inset 0 0 0 1px hsla(0,0%,100%,.2)
}
@media (max-width:640px){
    .op-social-item{
        width:34px;
        height:34px
    }
    .op-social-item img{
        width:16px;
        height:16px
    }
}
.ophim-status-completed,.ophim-status-default,.ophim-status-ongoing,.ophim-status-single,.ophim-status-trailer,.ophim-status-upcoming{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    backdrop-filter:blur(6px);
    transition:all .25s ease
}
.ophim-status-default{
    background:linear-gradient(135deg,#ff4d4d,#ff2d55);
    box-shadow:0 0 12px rgba(255,45,85,.35)
}
.ophim-status-upcoming{
    background:rgb(62 62 62);
    box-shadow:0 0 12px rgba(255,138,0,.35)
}
.ophim-status-trailer{
    background:linear-gradient(135deg,#1d3de8,#434ef9);
    box-shadow:0 0 14px rgba(255,106,0,.4)
}
.ophim-status-ongoing{
    background:linear-gradient(135deg,#ec4899,#d946ef);
    box-shadow:0 0 14px rgba(236,72,153,.4)
}
.ophim-status-completed{
    background:linear-gradient(135deg,#e50914,#b20710);
    box-shadow:0 0 14px rgba(229,9,20,.5)
}
.ophim-status-single{
    background:linear-gradient(135deg,#ea1212,#ff1616);
    box-shadow:0 0 14px rgba(99,102,241,.4)
}
.ophim-status-completed:hover,.ophim-status-default:hover,.ophim-status-ongoing:hover,.ophim-status-single:hover,.ophim-status-trailer:hover,.ophim-status-upcoming:hover{
    transform:translateY(-1px);
    filter:brightness(1.08)
}
.ophim-badge{
    display:inline-flex;
    align-items:center;
    height:18px;
    padding:0 6px;
    font-size:10px;
    font-weight:700;
    line-height:1;
    color:#fff;
    border-radius:4px;
    background:linear-gradient(135deg,#16a34a,#22c55e);
    box-shadow:0 1px 2px rgba(0,0,0,.35),inset 0 0 0 1px hsla(0,0%,100%,.08);
    backdrop-filter:blur(4px)
}
.ophim-badge-quality{
    background:linear-gradient(135deg,#facc15,#ca8a04);
    color:#111;
    font-weight:700;
    left:4px;
    top:4px
}
.ophim-badge-lang{
    background:rgba(63,59,60,.65);
    color:#fff;
    font-weight:700;
    top:4px;
    text-transform:uppercase
}
#movie-badges .ophim-badge-lang{
    background:#ba3768!important
}
.ophim-badge-episode{
    background:#111827;
    border:1px solid #374151
}
.ophim-badge-year{
    background:#312e81
}
.ophim-ads-text{
    position:relative;
    margin:12px auto 0;
    padding:12px 16px;
    font-size:12px;
    font-weight:600;
    letter-spacing:.5px;
    line-height:1.5;
    text-align:center;
    text-transform:uppercase;
    color:#f8fafc;
    background:linear-gradient(145deg,#050b1f,#0b1228 50%,#040916);
    border-radius:12px;
    border:1px solid rgba(246,211,101,.55);
    box-shadow:inset 0 0 0 1px rgba(246,211,101,.08),inset 0 8px 18px rgba(0,0,0,.45);
    overflow:hidden
}
.ophim-ads-text:before{
    content:"";
    position:absolute;
    inset:0;
    border-radius:inherit;
    background:linear-gradient(120deg,transparent 35%,rgba(246,211,101,.25),transparent 65%);
    transform:translateX(-100%);
    animation:ophim-inner-sweep 6s linear infinite
}
@keyframes ophim-inner-sweep{
    to{
        transform:translateX(100%)
    }
}
@media (max-width:640px){
    .ophim-ads-text{
        font-size:11px;
        padding:9px 12px;
        border-radius:8px;
        line-height:1.6
    }
}
.server-button.is-active{
    position:relative;
    color:#fff;
    background:#010101;
    border:1px solid rgba(250,204,21,.6);
    box-shadow:0 0 6px rgba(250,204,21,.4),0 0 16px rgba(250,204,21,.25),0 0 32px rgba(250,204,21,.15);
    transition:all .25s ease
}
.server-button.is-active:before{
    content:"";
    position:absolute;
    inset:0;
    border-radius:inherit;
    background:radial-gradient(circle at center,rgba(250,204,21,.25),transparent 70%);
    opacity:.8;
    pointer-events:none
}
.server-button.is-active:after{
    content:"";
    position:absolute;
    inset:-2px;
    border-radius:inherit;
    border:1px solid rgba(250,204,21,.4);
    opacity:.6;
    filter:blur(2px);
    pointer-events:none
}
.server-button.is-active .server-dot{
    background:#a3e635;
    box-shadow:0 0 6px #a3e635,0 0 12px #a3e635,0 0 20px rgba(163,230,53,.8)
}
.server-button.is-active .server-dot:after{
    inset:-8px;
    border:2px solid rgba(163,230,53,.5);
    animation:serverPulse 1.8s cubic-bezier(.4,0,.2,1) infinite
}
@keyframes serverPulse{
    0%{
        transform:scale(.6);
        opacity:1
    }
    70%{
        transform:scale(2);
        opacity:0
    }
    to{
        opacity:0
    }
}
.server-dot{
    width:6px;
    height:6px;
    border-radius:999px;
    background:#6b7280;
    display:inline-block;
    position:relative
}
.server-button.is-active .server-dot{
    background:#92fa15;
    box-shadow:0 0 6px #facc15,0 0 12px #facc15,0 0 18px rgba(250,204,21,.6)
}
.server-button.is-active .server-dot:after{
    content:"";
    position:absolute;
    inset:-6px;
    border-radius:999px;
    border:2px solid rgba(250,204,21,.5);
    animation:server-ripple 1.6s infinite
}
@keyframes server-ripple{
    0%{
        transform:scale(.6);
        opacity:1
    }
    70%{
        transform:scale(1.8);
        opacity:0
    }
    to{
        opacity:0
    }
}
.episode-container a.bg-\[\#1cc749\]{
    position:relative;
    box-shadow:0 0 10px rgba(34,197,94,.6),0 0 20px rgba(34,197,94,.3);
    transform:scale(1.05)
}
.episode-container a.bg-\[\#1cc749\]:after{
    content:"";
    position:absolute;
    inset:-2px;
    border-radius:inherit;
    border:1px solid rgba(34,197,94,.5);
    opacity:.6
}
@media (max-width:640px){
    #server-buttons{
        overflow-x:auto;
        padding-bottom:4px
    }
    .server-button{
        white-space:nowrap;
        flex-shrink:0;
        padding:6px 5px;
        font-size:10px
    }
    .space-y-4{
        gap:12px!important
    }
    .episode-container{
        margin-top:6px
    }
}
.topmovie-wrapper{
    background:linear-gradient(90deg,#35363a,#1e2440);
    border-radius:8px;
    padding:10px;
    margin:20px 14px
}
.topmovie-header{
    display:flex;
    justify-content:space-between;
    align-items:flex-end;
    gap:16px;
    margin-bottom:18px
}
.topmovie-header h2{
    font-size:1.35rem;
    font-weight:900;
    text-transform:uppercase;
    color:#fff;
    position:relative;
    padding-bottom:6px
}
.topmovie-header h2:after{
    content:"";
    position:absolute;
    left:0;
    bottom:0;
    width:74%;
    height:3px;
    border-radius:3px;
    background:linear-gradient(90deg,#ffb703,#fb8500)
}
.topmovie-tabs{
    align-items:center;
    gap:6px;
    overflow-x:auto;
    padding-bottom:4px;
    scrollbar-width:none;
    mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent)
}
.topmovie-tabs::-webkit-scrollbar{
    display:none
}
.topmovie-tabs button{
    flex:0 0 auto;
    border:0;
    padding:6px 12px;
    font-size:.7rem;
    font-weight:600;
    line-height:1;
    background:hsla(0,0%,100%,.06);
    color:#e5e7eb;
    white-space:nowrap;
    transition:background .25s,color .25s,box-shadow .25s,transform .15s
}
.topmovie-tabs{
    display:flex;
    gap:10px;
    flex-wrap:wrap
}
.topmovie-tabs button{
    position:relative;
    padding:8px 14px;
    border-radius:999px;
    font-size:14px;
    font-weight:500;
    border:none;
    cursor:pointer;
    color:#cbd5f5;
    background:hsla(0,0%,100%,.05);
    backdrop-filter:blur(8px);
    -webkit-backdrop-filter:blur(8px);
    transition:all .25s ease
}
.topmovie-tabs button:hover{
    color:#fff;
    background:hsla(0,0%,100%,.12)
}
.topmovie-tabs button.active{
    color:#fff;
    box-shadow:2px 6px 10px #111,inset 0 0 10px rgba(15,15,15,.08)
}
.topmovie-tabs button.active:after{
    content:"";
    position:absolute;
    inset:0;
    border-radius:inherit;
    opacity:.4;
    filter:blur(8px);
    z-index:-1
}
.topmovie-tabs .tab-recommend.active{
    background:linear-gradient(135deg,#fd8a8a,red)
}
.topmovie-tabs .tab-day.active{
    background:linear-gradient(135deg,gold,#ff8f00)
}
.topmovie-tabs .tab-day.active:after{
    background:#ff8f00
}
.topmovie-tabs .tab-week.active{
    background:linear-gradient(135deg,#38bdf8,#0284c7)
}
.topmovie-tabs .tab-week.active:after{
    background:#0284c7
}
.topmovie-tabs .tab-single.active{
    background:linear-gradient(135deg,#fb7185,#f43f5e)
}
.topmovie-tabs .tab-single.active:after{
    background:#f43f5e
}
.topmovie-tabs .tab-series.active{
    background:linear-gradient(135deg,#c4b5fd,#8b5cf6)
}
.topmovie-tabs .tab-series.active:after{
    background:#8b5cf6
}
.topmovie-tabs button:active{
    transform:scale(.94)
}
@media(min-width:769px){
    .topmovie-tabs button{
        padding:7px 14px;
        font-size:.75rem
    }
}
.topmovie-slider{
    display:none;
    position:relative
}
.topmovie-slider.active{
    display:block
}
.topmovie-list{
    display:flex;
    gap:16px;
    overflow-x:auto;
    padding-bottom:12px;
    scroll-snap-type:x mandatory
}
.topmovie-list::-webkit-scrollbar{
    display:none
}
.topmovie-item{
    flex:0 0 160px;
    scroll-snap-align:start;
    text-decoration:none
}
.topmovie-card{
    position:relative;
    border-radius:16px;
    overflow:hidden;
    filter:drop-shadow(4px 4px 0 #000000);
    background:#0b0f1a;
    border:1px solid #403738
}
.topmovie-card:hover{
    box-shadow:6px 4px 9px hsla(0,0%,80.8%,.35);
    filter:drop-shadow(2px 2px 0 #fff)
}
.topmovie-thumb{
    position:relative;
    width:100%;
    aspect-ratio:2/3;
    overflow:hidden;
    border-radius:14px
}
.topmovie-thumb img{
    width:100%;
    height:100%;
    object-fit:cover;
    display:block;
    border-radius:14px;
    filter:contrast(1.04) saturate(1.04);
    transition:transform .35s ease,filter .35s ease
}
.topmovie-item:hover .topmovie-thumb img{
    transform:scale(1.35);
    filter:contrast(1.06) saturate(1.08)
}
@media(max-width:768px){
    .topmovie-card{
        border-radius:14px
    }
    .topmovie-thumb,.topmovie-thumb img{
        border-radius:12px
    }
}
.topmovie-overlay{
    position:absolute;
    inset:0;
    background:linear-gradient(0deg,rgba(0,0,0,.75) 0,rgba(0,0,0,.35) 35%,transparent 60%);
    z-index:2
}
.topmovie-info{
    position:absolute;
    left:10px;
    right:10px;
    bottom:10px;
    z-index:4;
    text-align:right
}
.topmovie-title{
    font-size:.85rem;
    font-weight:500;
    line-height:1.3;
    color:#fff;
    margin-bottom:4px;
    display:-webkit-box;
    -webkit-line-clamp:2;
    -webkit-box-orient:vertical;
    overflow:hidden
}
.topmovie-item:hover .topmovie-title{
    color:#7fffd4
}
.topmovie-view{
    font-size:.7rem;
    font-weight:600;
    color:#e5e7eb;
    opacity:.9
}
.topmovie-rank{
    left:-6px;
    bottom:-18px;
    font-size:5.8rem;
    font-weight:900;
    line-height:1;
    letter-spacing:-.02em;
    --rank-gradient:linear-gradient(180deg,#fff,#d9d9d9 45%,#8a8a8a);
    background:var(--rank-gradient);
    background-clip:text;
    -webkit-background-clip:text;
    -webkit-text-stroke:.4px rgba(0,0,0,.18);
    z-index:3
}
.topmovie-rank,.topmovie-rank:after{
    position:absolute;
    color:transparent;
    pointer-events:none
}
.topmovie-rank:after{
    content:attr(data-rank);
    left:12px;
    top:58%;
    display:inline-block;
    font:inherit;
    letter-spacing:inherit;
    background:linear-gradient(180deg,hsla(0,0%,100%,.85),hsla(0,0%,78.4%,.55) 40%,hsla(0,0%,47.1%,.15));
    background-clip:text;
    -webkit-background-clip:text;
    transform-origin:top left;
    transform:scaleY(-1) skewX(-45deg);
    opacity:.45;
    filter:blur(.3px);
    -webkit-mask-image:linear-gradient(180deg,rgba(0,0,0,.85),rgba(0,0,0,.35),transparent);
    mask-image:linear-gradient(180deg,rgba(0,0,0,.85),rgba(0,0,0,.35),transparent);
    text-shadow:0 1px 0 hsla(0,0%,100%,.35),0 -1px 0 rgba(0,0,0,.15);
    z-index:2
}
.topmovie-rank[data-rank="1"]{
    font-size:8.8rem;
    background:linear-gradient(180deg,#7b5cff,#d81bff 40%,#ff1f5a);
    -webkit-background-clip:text;
    -webkit-text-fill-color:transparent;
    background-clip:text;
    filter:drop-shadow(0 0 6px rgba(255,0,128,.6)) drop-shadow(0 0 14px rgba(140,0,255,.45))
}
.topmovie-rank[data-rank="2"]{
    background-image:linear-gradient(180deg,#a5f3fc,#38bdf8);
    font-size:7.8rem
}
.topmovie-rank[data-rank="3"]{
    background-image:linear-gradient(180deg,#fda4af,#fb7185);
    font-size:6.8rem
}
.topmovie-rank[data-rank="4"]{
    background-image:linear-gradient(180deg,#c4b5fd,#8b5cf6)
}
.topmovie-rank[data-rank="5"]{
    background-image:linear-gradient(180deg,#86efac,#22c55e)
}
.topmovie-rank[data-rank="6"]{
    background-image:linear-gradient(180deg,#fde68a,#f59e0b)
}
.topmovie-rank[data-rank="7"]{
    background-image:linear-gradient(180deg,#cffafe,#06b6d4)
}
.topmovie-rank[data-rank="8"]{
    background-image:linear-gradient(180deg,#fce7f3,#ec4899)
}
.topmovie-rank[data-rank="9"]{
    background-image:linear-gradient(180deg,#e5e7eb,#9ca3af)
}
.topmovie-rank[data-rank="10"]{
    background-image:linear-gradient(180deg,#e5e7eb,#c7fd32)
}
.topmovie-nav{
    position:absolute;
    top:50%;
    transform:translateY(-50%);
    width:36px;
    height:36px;
    border-radius:10px;
    border:0;
    background:rgba(20,22,28,.9);
    color:#e5e7eb;
    font-size:20px;
    font-weight:700;
    cursor:pointer;
    z-index:5;
    display:flex;
    align-items:center;
    justify-content:center
}
.topmovie-nav.prev{
    left:-10px
}
.topmovie-nav.next{
    right:-10px
}
.topmovie-nav.hidden{
    display:none
}
@media(max-width:768px){
    .topmovie-header{
        flex-direction:column;
        align-items:flex-start;
        gap:12px
    }
    .topmovie-item{
        flex:0 0 128px
    }
    .topmovie-rank{
        font-size:4.5rem;
        bottom:-12px;
        left:-4px
    }
}
.home-filter-wrap{
    width:100%;
    background:#2f3237;
    border-top:1px solid hsla(0,0%,100%,.08);
    border-bottom:1px solid hsla(0,0%,100%,.08)
}
.home-filter-container{
    max-width:1400px;
    margin:auto;
    padding:24px 20px
}
.home-filter-form{
    display:grid;
    grid-template-columns:repeat(5,1fr);
    gap:16px
}
.home-filter-form .filter-item label{
    display: block;
    margin-bottom: 6px;
    font-size: 15px;
    font-weight: 700 !important;
    color: #cad0d8;
}
.home-filter-form .filter-item select{
    width:100%;
    padding:11px 12px;
    background:#1c1e26;
    color:#fff;
    border:1px solid hsla(0,0%,100%,.12);
    border-radius:12px;
    outline:none
}
.home-filter-form .filter-submit{
    display:flex;
    align-items:flex-end
}
.home-filter-form .filter-submit button{
    width:100%;
    padding:14px 18px;
    border-radius:16px;
    border:1px solid rgba(0,180,255,.25);
    cursor:pointer;
    background:linear-gradient(135deg,#00c6ff,#0072ff);
    color:#fff;
    font-weight:700;
    font-size:15px;
    letter-spacing:.4px;
    transition:all .25s ease;
    box-shadow:0 4px 16px rgba(0,114,255,.35),inset 0 1px 0 hsla(0,0%,100%,.15)
}
.home-filter-form .filter-submit button:hover{
    transform:translateY(-2px);
    box-shadow:0 8px 24px rgba(0,114,255,.55)
}
@media (max-width:1200px){
    .home-filter-form{
        grid-template-columns:repeat(4,1fr)
    }
}
@media (max-width:900px){
    .home-filter-form{
        grid-template-columns:repeat(2,1fr)
    }
}
.actor-card{
    align-items:flex-start;
    gap:24px;
    background:#141414;
    border-radius:16px;
    padding:20px;
    box-shadow:0 10px 30px rgba(0,0,0,.5)
}
.poster-wrap{
    width:180px
}
.poster-inner{
    position:relative;
    border-radius:14px;
    overflow:hidden;
    background:#0d0d0d;
    padding:10px;
    box-shadow:0 15px 40px #595151
}
.poster-inner:after{
    content:"";
    position:absolute;
    inset:0;
    background:linear-gradient(0deg,rgba(0,0,0,.65),transparent 60%)
}
.poster-img{
    width:100%;
    height:auto;
    display:block;
    object-fit:cover;
    box-shadow:0 15px 40px rgba(95,87,87,.6);
    border:2px solid #000;
    transition:transform .4s ease
}
.poster-inner:hover .poster-img{
    transform:scale(1.05)
}
.poster-reflect-wrap{
    position:absolute;
    top:100%;
    left:0;
    width:100%;
    height:55%;
    overflow:hidden
}
.poster-reflect{
    width:100%;
    transform:scaleY(-1);
    opacity:.3;
    filter:blur(2px);
    transition:opacity .3s ease
}
.poster-inner:hover .poster-reflect{
    opacity:.45
}
.poster-fade{
    position:absolute;
    inset:0;
    background:linear-gradient(180deg,rgba(13,13,13,.4) 0,rgba(13,13,13,.85) 50%,#0d0d0d)
}
.actor-card{
    display:flex;
    gap:18px;
    background:var(--bg-card);
    border-radius:18px;
    padding:16px;
    border:1px solid var(--border-soft);
    box-shadow:0 10px 25px rgba(0,0,0,.25)
}
.poster-wrap{
    width:160px;
    flex-shrink:0
}
.poster-wrap img{
    width:100%;
    border-radius:12px;
    display:block
}
.actor-info{
    flex:1;
    min-width:0
}
.actor-name{
    font-size:22px;
    font-weight:600;
    color:var(--text-main);
    margin-bottom:12px;
    line-height:1.3
}
.actor-meta{
    display:grid;
    grid-template-columns:repeat(2,1fr);
    gap:10px
}
.meta-item{
    background:var(--bg-soft);
    border-radius:12px;
    padding:10px 12px;
    font-size:13px;
    border:1px solid var(--border-soft);
    transition:all .2s ease
}
.meta-item:hover{
    background:var(--bg-hover);
    transform:translateY(-2px)
}
.meta-item span{
    display:block;
    font-size:11px;
    color:var(--text-dim);
    margin-bottom:2px
}
.meta-item strong{
    color:var(--text-main);
    font-weight:500
}
.actor-links{
    margin-top:14px;
    display:flex;
    flex-wrap:wrap;
    gap:10px
}
.badge{
    padding:6px 14px;
    border-radius:999px;
    font-size:12px;
    font-weight:600;
    text-decoration:none;
    display:inline-flex;
    align-items:center;
    gap:6px;
    transition:all .2s ease
}
.badge.imdb{
    background:var(--accent-imdb);
    color:#000
}
.badge.tmdb{
    background:var(--accent-tmdb);
    color:#fff
}
.badge:hover{
    transform:translateY(-2px);
    filter:brightness(1.05)
}
.actor-bio{
    margin-top:18px;
    background:var(--bg-soft);
    border-radius:16px;
    padding:16px;
    border:1px solid var(--border-soft)
}
.actor-bio h3{
    color:var(--text-main);
    font-size:15px;
    margin-bottom:8px;
    font-weight:700
}
.bio-content{
    color:var(--text-sub);
    font-size:14px;
    line-height:1.6
}
@media (max-width:1024px){
    .poster-wrap{
        width:140px
    }
}
@media (max-width:768px){
    .actor-card{
        flex-direction:row;
        gap:12px;
        padding:12px
    }
    .poster-wrap{
        width:110px
    }
    .actor-name{
        font-size:18px
    }
    .actor-meta{
        grid-template-columns:repeat(2,1fr);
        gap:8px
    }
}
@media (max-width:480px){
    .poster-wrap{
        width:95px
    }
    .actor-name{
        font-size:16px
    }
    .meta-item{
        padding:8px 10px;
        font-size:12px
    }
}
.xemgi-wrapper{
    background:linear-gradient(180deg,#1b1e25,#14161c);
    border-radius:8px;
    padding:16px;
    box-shadow:inset 0 0 0 1px hsla(0,0%,100%,.04),0 20px 40px rgba(0,0,0,.6);
    margin:10px 5px
}
.xemgi-title-widget{
    font-size:1.05rem;
    font-weight:700;
    color:#fff;
    letter-spacing:.3px;
    display:flex;
    align-items:center;
    gap:10px;
    margin-bottom:14px
}
.xemgi-title-widget:before{
    content:"";
    width:4px;
    height:18px;
    border-radius:4px;
    background:linear-gradient(180deg,#60a5fa,#a78bfa)
}
.xemgi-list{
    display:grid;
    grid-template-columns:1fr;
    gap:10px
}
@media (max-width:767px){
    .xemgi-list{
        grid-template-columns:repeat(2,minmax(0,1fr));
        gap:12px
    }
}
.xemgi-item{
    display:flex;
    align-items:center;
    gap:16px;
    padding:14px;
    border-radius:16px;
    position:relative;
    transition:transform .25s ease,box-shadow .25s ease
}
@media (min-width:768px){
    .xemgi-item:hover{
        transform:translateY(-3px);
        box-shadow:0 14px 35px rgba(0,0,0,.65)
    }
}
@media (max-width:767px){
    .xemgi-item{
        flex-direction:column;
        align-items:stretch;
        padding:10px
    }
}
.xemgi-thumb{
    width:80px;
    aspect-ratio:2/3;
    overflow:hidden;
    border-radius:12px;
    flex-shrink:0;
    box-shadow:0 10px 25px rgba(0,0,0,.7);
    position:relative;
    z-index:2
}
@media (max-width:767px){
    .xemgi-thumb{
        width:100%;
        border-radius:14px
    }
}
.xemgi-thumb img{
    width:100%;
    height:100%;
    object-fit:cover
}
.xemgi-info{
    flex:1;
    min-width:0
}
.xemgi-title{
    font-size:.9rem;
    font-weight:600;
    color:#fff;
    line-height:1.4;
    margin-bottom:6px
}
@media (max-width:767px){
    .xemgi-title{
        font-size:.85rem;
        margin-top:6px
    }
}
.xemgi-meta{
    display:flex;
    flex-direction:column;
    gap:2px;
    font-size:.72rem;
    color:#9ca3af
}
.xemgi-meta span{
    display:inline-flex;
    align-items:center;
    gap:6px;
    line-height:1.3;
    white-space:nowrap
}
.xemgi-badges{
    display:flex;
    flex-wrap:wrap;
    gap:6px;
    margin-bottom:4px
}
.badge-episode{
    font-size:.68rem;
    font-weight:600;
    padding:4px 8px;
    border-radius:8px;
    background:linear-gradient(135deg,#1f2937,#111827);
    border:1px solid hsla(0,0%,100%,.08);
    color:#f3f4f6;
    letter-spacing:.2px
}
.badge-lang{
    font-size:.65rem;
    font-weight:500;
    padding:3px 7px;
    border-radius:6px;
    background:#ff4aaf;
    color:#fff;
    border:1px solid #111
}
.badge-done{
    background:linear-gradient(135deg,#e50914,#b20710);
    color:#fff;
    border:1px solid #222;
    white-space:nowrap
}
@media (max-width:767px){
    .xemgi-meta{
        font-size:.65rem
    }
    .badge-episode{
        padding:3px 6px;
        font-size:.62rem
    }
    .badge-lang{
        padding:2px 6px;
        font-size:.6rem
    }
}
.xemgi-views{
    font-size:.7rem;
    color:#cbd5f5;
    opacity:.9
}
.xemgi-views svg{
    width:13px;
    height:13px;
    opacity:.85
}
.rank-number{
    font-size:3.4rem;
    font-weight:900;
    line-height:1;
    margin-left:6px;
    color:transparent;
    background-clip:text;
    -webkit-background-clip:text;
    filter:drop-shadow(0 6px 14px rgba(0,0,0,.75))
}
.rank-badge{
    display:none
}
@media (max-width:767px){
    .rank-number{
        display:none
    }
    .xemgi-thumb{
        position:relative;
        z-index:2
    }
    .rank-badge{
        display:block;
        position:absolute;
        left:-1px;
        bottom:-10px;
        z-index:1;
        pointer-events:none
    }
    .rank-badge span{
        font-size:6rem;
        font-weight:900;
        line-height:1;
        color:transparent;
        background-clip:text;
        -webkit-background-clip:text;
        -webkit-text-stroke:2px hsla(0,0%,100%,.15);
        filter:drop-shadow(0 15px 35px rgba(0,0,0,.9));
        opacity:.95
    }
    .rank-1{
        filter:drop-shadow(0 0 18px rgba(255,215,0,.35)) drop-shadow(0 10px 30px rgba(0,0,0,.9))
    }
    .rank-2{
        filter:drop-shadow(0 0 14px rgba(56,189,248,.35)) drop-shadow(0 10px 28px rgba(0,0,0,.9))
    }
    .rank-3{
        filter:drop-shadow(0 0 14px rgba(251,113,133,.35)) drop-shadow(0 10px 28px rgba(0,0,0,.9))
    }
}
.rank-1{
    background:linear-gradient(180deg,#7b5cff,#d81bff 40%,#ff1f5a);
    -webkit-background-clip:text;
    -webkit-text-fill-color:transparent;
    background-clip:text;
    filter:drop-shadow(0 0 6px rgba(255,0,128,.6)) drop-shadow(0 0 14px rgba(140,0,255,.45))
}
.rank-2{
    background-image:linear-gradient(180deg,#a5f3fc,#38bdf8)
}
.rank-3{
    background-image:linear-gradient(180deg,#fda4af,#fb7185)
}
.rank-4{
    background-image:linear-gradient(180deg,#c4b5fd,#8b5cf6)
}
.rank-5{
    background-image:linear-gradient(180deg,#86efac,#22c55e)
}
.rank-6{
    background-image:linear-gradient(180deg,#fde68a,#f59e0b)
}
.rank-7{
    background-image:linear-gradient(180deg,#67e8f9,#06b6d4)
}
.rank-8{
    background-image:linear-gradient(180deg,#f9a8d4,#ec4899)
}
.rank-9{
    background-image:linear-gradient(180deg,#d1d5db,#9ca3af)
}
.rank-10{
    background-image:linear-gradient(180deg,#e5e7eb,#c7fd32)
}
.nativeads{
    margin:10px 5px;
    padding:14px;
    border-radius:8px;
    background:radial-gradient(circle at top left,rgba(30,41,59,.5),rgba(2,6,23,.9));
    border:1px solid hsla(0,0%,100%,.06);
    box-shadow:0 10px 40px rgba(0,0,0,.5);
    position:relative;
    overflow:hidden
}
.nativeads:after{
    content:"Sponsored";
    position:absolute;
    top:10px;
    right:14px;
    font-size:11px;
    color:#9ca3af;
    opacity:.8
}
.nativeads iframe{
    display:block;
    margin:0 auto;
    max-width:100%;
    border-radius:14px
}
.nativeads ins{
    display:block;
    margin:0 auto;
    text-align:center
}
.nativeads>div{
    width:100%!important
}
.nativeads *{
    box-sizing:border-box
}
.nativeads>div:has(.ad),.nativeads>div:has(a),.nativeads>div:has(img){
    display:flex;
    flex-wrap:wrap;
    gap:12px;
    justify-content:center
}
.nativeads a{
    text-decoration:none;
    color:#fff
}
.nativeads a,.nativeads a>div{
    border-radius:14px;
    overflow:hidden
}
.nativeads img{
    max-width:100%;
    height:auto;
    display:block
}
.nativeads a:hover{
    transform:translateY(-3px);
    transition:.2s
}
@media (max-width:768px){
    .nativeads{
        padding:10px
    }
}


.movie-card-item{
    position:relative;
    display:block;
    height:100%;
    flex-shrink:0;
    scroll-snap-align:start
}
.movie-hero-width{
    width:100%
}
@media (min-width:768px){
    .movie-hero-width{
        width:calc((100% - .5rem)/2)
    }
}
@media (min-width:1024px){
    .movie-hero-width{
        width:calc((100% - 1rem)/3)
    }
}
.movie-card{
    position:relative;
    display:block;
    height:100%;
    width:calc((100% - .5rem)/2);
    flex-shrink:0;
    scroll-snap-align:start
}
@media (min-width:640px){
    .movie-card{
        width:calc((100% - .5rem)/2)
    }
}
@media (min-width:768px){
    .movie-card{
        width:calc((100% - 1rem)/3)
    }
}
@media (min-width:1024px){
    .movie-card{
        width:calc((100% - 1.5rem)/4)
    }
}
@media (min-width:1280px){
    .movie-card{
        width:calc((100% - 1.5rem)/4)
    }
}
.hide-scrollbar,.no-scrollbar{
    -ms-overflow-style:none;
    scrollbar-width:none
}
.hide-scrollbar::-webkit-scrollbar{
    display:none
}
.font-roboto{
    font-family:Roboto,Arial,sans-serif
}
.fade-in-section{
    opacity:0;
    transform:translateY(20px);
    transition:all .6s ease-out
}
.fade-in-section.is-visible{
    opacity:1;
    transform:translateY(0)
}
.clip-path-rank{
    clip-path:polygon(0 0,100%0,75% 100%,0 100%)
}
.no-scrollbar{
    -ms-overflow-style:none;
    scrollbar-width:none
}
.no-scrollbar::-webkit-scrollbar{
    display:none
}
.custom-scrollbar::-webkit-scrollbar{
    width:6px!important;
    height:2px
}
.custom-scrollbar::-webkit-scrollbar-track{
    background:0 0
}
.custom-scrollbar::-webkit-scrollbar-thumb{
    background-color:#222;
    border-radius:2px;
    border:0;
    cursor:pointer
}
.custom-scrollbar::-webkit-scrollbar-thumb:hover{
    background-color:#222
}